@luminati-io/uikit 1.7.27 → 1.7.28-beta.1

package/dist/uikit.umd.js

@@ -15554,6 +15554,67 @@ function Grid(props) {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/xychart/esm/components/series/AnimatedBarGroup.js":
+/*!******************************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/AnimatedBarGroup.js ***!
+  \******************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ AnimatedBarGroup)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _private_BaseBarGroup__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./private/BaseBarGroup */ "./node_modules/@visx/xychart/esm/components/series/private/BaseBarGroup.js");
+/* harmony import */ var _private_AnimatedBars__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./private/AnimatedBars */ "./node_modules/@visx/xychart/esm/components/series/private/AnimatedBars.js");
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+
+
+function AnimatedBarGroup(props) {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_private_BaseBarGroup__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({}, props, {
+    BarsComponent: _private_AnimatedBars__WEBPACK_IMPORTED_MODULE_2__["default"]
+  }));
+}
+
+/***/ }),
+
+/***/ "./node_modules/@visx/xychart/esm/components/series/AnimatedBarSeries.js":
+/*!*******************************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/AnimatedBarSeries.js ***!
+  \*******************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ AnimatedBarSeries)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _private_BaseBarSeries__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./private/BaseBarSeries */ "./node_modules/@visx/xychart/esm/components/series/private/BaseBarSeries.js");
+/* harmony import */ var _private_AnimatedBars__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./private/AnimatedBars */ "./node_modules/@visx/xychart/esm/components/series/private/AnimatedBars.js");
+var _excluded = ["colorAccessor"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+
+
+function AnimatedBarSeries(_ref) {
+  var colorAccessor = _ref.colorAccessor,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_private_BaseBarSeries__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({}, props, {
+    // @TODO currently generics for non-SeriesProps are not passed correctly in
+    // withRegisteredData HOC
+    colorAccessor: colorAccessor,
+    BarsComponent: _private_AnimatedBars__WEBPACK_IMPORTED_MODULE_2__["default"]
+  }));
+}
+
+/***/ }),
+
 /***/ "./node_modules/@visx/xychart/esm/components/series/AnimatedLineSeries.js":
 /*!********************************************************************************!*\
   !*** ./node_modules/@visx/xychart/esm/components/series/AnimatedLineSeries.js ***!
@@ -15581,6 +15642,68 @@ function AnimatedLineSeries(props) {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/xychart/esm/components/series/BarGroup.js":
+/*!**********************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/BarGroup.js ***!
+  \**********************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ BarGroup)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _private_BaseBarGroup__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./private/BaseBarGroup */ "./node_modules/@visx/xychart/esm/components/series/private/BaseBarGroup.js");
+/* harmony import */ var _private_Bars__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./private/Bars */ "./node_modules/@visx/xychart/esm/components/series/private/Bars.js");
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+
+
+function BarGroup(props) {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_private_BaseBarGroup__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({}, props, {
+    BarsComponent: _private_Bars__WEBPACK_IMPORTED_MODULE_2__["default"]
+  }));
+}
+
+/***/ }),
+
+/***/ "./node_modules/@visx/xychart/esm/components/series/BarSeries.js":
+/*!***********************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/BarSeries.js ***!
+  \***********************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _private_BaseBarSeries__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./private/BaseBarSeries */ "./node_modules/@visx/xychart/esm/components/series/private/BaseBarSeries.js");
+/* harmony import */ var _private_Bars__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./private/Bars */ "./node_modules/@visx/xychart/esm/components/series/private/Bars.js");
+var _excluded = ["colorAccessor"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+
+
+function BarSeries(_ref) {
+  var colorAccessor = _ref.colorAccessor,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_private_BaseBarSeries__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({}, props, {
+    // @TODO currently generics for non-SeriesProps are not passed correctly in
+    // withRegisteredData HOC
+    colorAccessor: colorAccessor,
+    BarsComponent: _private_Bars__WEBPACK_IMPORTED_MODULE_2__["default"]
+  }));
+}
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BarSeries);
+
+/***/ }),
+
 /***/ "./node_modules/@visx/xychart/esm/components/series/LineSeries.js":
 /*!************************************************************************!*\
   !*** ./node_modules/@visx/xychart/esm/components/series/LineSeries.js ***!
@@ -15603,6 +15726,178 @@ function LineSeries(props) {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/xychart/esm/components/series/private/AnimatedBars.js":
+/*!**********************************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/private/AnimatedBars.js ***!
+  \**********************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ AnimatedBars)
+/* harmony export */ });
+/* harmony import */ var _visx_shape__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @visx/shape */ "./node_modules/@visx/shape/esm/shapes/BarRounded.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _react_spring_web__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @react-spring/web */ "./node_modules/@react-spring/web/dist/esm/index.js");
+/* harmony import */ var _utils_cleanColorString__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../utils/cleanColorString */ "./node_modules/@visx/xychart/esm/utils/cleanColorString.js");
+/* harmony import */ var _utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../utils/getScaleBaseline */ "./node_modules/@visx/xychart/esm/utils/getScaleBaseline.js");
+/* harmony import */ var _AnimatedPath__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./AnimatedPath */ "./node_modules/@visx/xychart/esm/components/series/private/AnimatedPath.js");
+var _excluded = ["bars", "xScale", "yScale", "horizontal", "radius", "radiusAll", "radiusTop", "radiusRight", "radiusBottom", "radiusLeft"],
+  _excluded2 = ["bars", "xScale", "yScale", "horizontal", "radius", "radiusAll", "radiusTop", "radiusRight", "radiusBottom", "radiusLeft"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+
+
+
+
+
+function enterUpdate(_ref) {
+  var x = _ref.x,
+    y = _ref.y,
+    width = _ref.width,
+    height = _ref.height,
+    fill = _ref.fill;
+  return {
+    x: x,
+    y: y,
+    width: width,
+    height: height,
+    fill: (0,_utils_cleanColorString__WEBPACK_IMPORTED_MODULE_2__.cleanColor)(fill),
+    opacity: 1
+  };
+}
+function useBarTransitionConfig(_ref2) {
+  var scale = _ref2.scale,
+    horizontal = _ref2.horizontal;
+  var shouldAnimateX = !!horizontal;
+  return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
+    var scaleBaseline = (0,_utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_3__["default"])(scale);
+    function fromLeave(_ref3) {
+      var x = _ref3.x,
+        y = _ref3.y,
+        width = _ref3.width,
+        height = _ref3.height,
+        fill = _ref3.fill;
+      return {
+        x: shouldAnimateX ? scaleBaseline != null ? scaleBaseline : 0 : x,
+        y: shouldAnimateX ? y : scaleBaseline != null ? scaleBaseline : 0,
+        width: shouldAnimateX ? 0 : width,
+        height: shouldAnimateX ? height : 0,
+        fill: (0,_utils_cleanColorString__WEBPACK_IMPORTED_MODULE_2__.cleanColor)(fill),
+        opacity: 0
+      };
+    }
+    return {
+      unique: true,
+      from: fromLeave,
+      leave: fromLeave,
+      enter: enterUpdate,
+      update: enterUpdate,
+      keys: function keys(bar) {
+        return bar.key;
+      }
+    };
+  }, [scale, shouldAnimateX]);
+}
+function AnimatedBarsRounded(_ref4) {
+  var bars = _ref4.bars,
+    xScale = _ref4.xScale,
+    yScale = _ref4.yScale,
+    horizontal = _ref4.horizontal,
+    radius = _ref4.radius,
+    radiusAll = _ref4.radiusAll,
+    radiusTop = _ref4.radiusTop,
+    radiusRight = _ref4.radiusRight,
+    radiusBottom = _ref4.radiusBottom,
+    radiusLeft = _ref4.radiusLeft,
+    pathProps = _objectWithoutPropertiesLoose(_ref4, _excluded);
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line react/jsx-no-useless-fragment
+    react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, bars.map(function (_ref5) {
+      var key = _ref5.key,
+        fill = _ref5.fill,
+        x = _ref5.x,
+        y = _ref5.y,
+        width = _ref5.width,
+        height = _ref5.height;
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_shape__WEBPACK_IMPORTED_MODULE_4__["default"], {
+        key: key,
+        x: x,
+        y: y,
+        width: width,
+        height: height,
+        radius: radius,
+        all: radiusAll,
+        top: radiusTop,
+        right: radiusRight,
+        bottom: radiusBottom,
+        left: radiusLeft
+      }, function (_ref6) {
+        var path = _ref6.path;
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_AnimatedPath__WEBPACK_IMPORTED_MODULE_5__["default"], _extends({
+          className: "visx-bar visx-bar-rounded",
+          d: path,
+          fill: fill
+        }, pathProps));
+      });
+    }))
+  );
+}
+function AnimatedBarsUnrounded(_ref7) {
+  var bars = _ref7.bars,
+    xScale = _ref7.xScale,
+    yScale = _ref7.yScale,
+    horizontal = _ref7.horizontal,
+    radius = _ref7.radius,
+    radiusAll = _ref7.radiusAll,
+    radiusTop = _ref7.radiusTop,
+    radiusRight = _ref7.radiusRight,
+    radiusBottom = _ref7.radiusBottom,
+    radiusLeft = _ref7.radiusLeft,
+    rectProps = _objectWithoutPropertiesLoose(_ref7, _excluded2);
+  var animatedBars = (0,_react_spring_web__WEBPACK_IMPORTED_MODULE_1__.useTransition)(bars, _extends({}, useBarTransitionConfig({
+    horizontal: horizontal,
+    scale: horizontal ? xScale : yScale
+  })));
+  var isFocusable = Boolean(rectProps.onFocus || rectProps.onBlur);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, animatedBars(function ( // @ts-expect-error x/y aren't in react-spring types (which are HTML CSS properties)
+  _ref8, item, _ref9) {
+    var x = _ref8.x,
+      y = _ref8.y,
+      width = _ref8.width,
+      height = _ref8.height,
+      fill = _ref8.fill,
+      opacity = _ref8.opacity;
+    var key = _ref9.key;
+    return item == null || key == null ? null : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_react_spring_web__WEBPACK_IMPORTED_MODULE_1__.animated.rect, _extends({
+      key: key,
+      tabIndex: isFocusable ? 0 : undefined,
+      className: "visx-bar",
+      x: x,
+      y: y,
+      width: width,
+      height: height
+      // use the item's fill directly if it's not animate-able
+      ,
+      fill: (0,_utils_cleanColorString__WEBPACK_IMPORTED_MODULE_2__.colorHasUrl)(item.fill) ? item.fill : fill,
+      opacity: opacity
+    }, rectProps));
+  }));
+}
+
+/** Wrapper component which renders a Bars component depending on whether it needs rounded corners. */
+function AnimatedBars(props) {
+  return props.radius == null ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(AnimatedBarsUnrounded, props) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(AnimatedBarsRounded, _extends({}, props, {
+    radius: props.radius
+  }));
+}
+
+/***/ }),
+
 /***/ "./node_modules/@visx/xychart/esm/components/series/private/AnimatedPath.js":
 /*!**********************************************************************************!*\
   !*** ./node_modules/@visx/xychart/esm/components/series/private/AnimatedPath.js ***!
@@ -15675,6 +15970,438 @@ function AnimatedPath(_ref) {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/xychart/esm/components/series/private/Bars.js":
+/*!**************************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/private/Bars.js ***!
+  \**************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ Bars)
+/* harmony export */ });
+/* harmony import */ var _visx_shape__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @visx/shape */ "./node_modules/@visx/shape/esm/shapes/BarRounded.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+var _excluded = ["bars", "horizontal", "xScale", "yScale", "radius", "radiusAll", "radiusTop", "radiusRight", "radiusBottom", "radiusLeft"],
+  _excluded2 = ["key"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+
+function Bars(_ref) {
+  var bars = _ref.bars,
+    horizontal = _ref.horizontal,
+    xScale = _ref.xScale,
+    yScale = _ref.yScale,
+    radius = _ref.radius,
+    radiusAll = _ref.radiusAll,
+    radiusTop = _ref.radiusTop,
+    radiusRight = _ref.radiusRight,
+    radiusBottom = _ref.radiusBottom,
+    radiusLeft = _ref.radiusLeft,
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var isFocusable = Boolean(restProps.onFocus || restProps.onBlur);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, bars.map(function (_ref2) {
+    var key = _ref2.key,
+      barProps = _objectWithoutPropertiesLoose(_ref2, _excluded2);
+    return radius == null ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("rect", _extends({
+      key: key,
+      className: "visx-bar",
+      tabIndex: isFocusable ? 0 : undefined
+    }, barProps, restProps)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_shape__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({
+      key: key,
+      className: "visx-bar",
+      tabIndex: isFocusable ? 0 : undefined,
+      radius: radius,
+      all: radiusAll,
+      top: radiusTop,
+      right: radiusRight,
+      bottom: radiusBottom,
+      left: radiusLeft
+    }, barProps, restProps));
+  }));
+}
+
+/***/ }),
+
+/***/ "./node_modules/@visx/xychart/esm/components/series/private/BaseBarGroup.js":
+/*!**********************************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/private/BaseBarGroup.js ***!
+  \**********************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ BaseBarGroup)
+/* harmony export */ });
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ "prop-types");
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _visx_scale__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @visx/scale */ "./node_modules/@visx/scale/esm/scales/band.js");
+/* harmony import */ var _context_DataContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../context/DataContext */ "./node_modules/@visx/xychart/esm/context/DataContext.js");
+/* harmony import */ var _utils_getScaleBandwidth__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../utils/getScaleBandwidth */ "./node_modules/@visx/xychart/esm/utils/getScaleBandwidth.js");
+/* harmony import */ var _utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../utils/getScaleBaseline */ "./node_modules/@visx/xychart/esm/utils/getScaleBaseline.js");
+/* harmony import */ var _typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../typeguards/isValidNumber */ "./node_modules/@visx/xychart/esm/typeguards/isValidNumber.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../constants */ "./node_modules/@visx/xychart/esm/constants.js");
+/* harmony import */ var _hooks_useSeriesEvents__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../hooks/useSeriesEvents */ "./node_modules/@visx/xychart/esm/hooks/useSeriesEvents.js");
+/* harmony import */ var _utils_findNearestGroupDatum__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../utils/findNearestGroupDatum */ "./node_modules/@visx/xychart/esm/utils/findNearestGroupDatum.js");
+/* harmony import */ var _utils_getChildrenAndGrandchildrenWithProps__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../utils/getChildrenAndGrandchildrenWithProps */ "./node_modules/@visx/xychart/esm/utils/getChildrenAndGrandchildrenWithProps.js");
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+
+
+
+
+
+
+
+
+
+function BaseBarGroup(_ref) {
+  var children = _ref.children,
+    _ref$padding = _ref.padding,
+    padding = _ref$padding === void 0 ? 0.1 : _ref$padding,
+    sortBars = _ref.sortBars,
+    BarsComponent = _ref.BarsComponent,
+    onBlur = _ref.onBlur,
+    onFocus = _ref.onFocus,
+    onPointerMove = _ref.onPointerMove,
+    onPointerOut = _ref.onPointerOut,
+    onPointerUp = _ref.onPointerUp,
+    onPointerDown = _ref.onPointerDown,
+    _ref$enableEvents = _ref.enableEvents,
+    enableEvents = _ref$enableEvents === void 0 ? true : _ref$enableEvents;
+  var _ref2 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(_context_DataContext__WEBPACK_IMPORTED_MODULE_2__["default"]),
+    colorScale = _ref2.colorScale,
+    dataRegistry = _ref2.dataRegistry,
+    horizontal = _ref2.horizontal,
+    registerData = _ref2.registerData,
+    unregisterData = _ref2.unregisterData,
+    xScale = _ref2.xScale,
+    yScale = _ref2.yScale;
+  var barSeriesChildren = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return (0,_utils_getChildrenAndGrandchildrenWithProps__WEBPACK_IMPORTED_MODULE_3__["default"])(children);
+  }, [children]);
+
+  // extract data keys from child series
+  var dataKeys = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return barSeriesChildren.map(function (child) {
+      var _child$props$dataKey;
+      return (_child$props$dataKey = child.props.dataKey) != null ? _child$props$dataKey : '';
+    }).filter(function (key) {
+      return key;
+    });
+  }, [barSeriesChildren]);
+
+  // register all child data
+  (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {
+    var dataToRegister = barSeriesChildren.map(function (child) {
+      var _child$props = child.props,
+        key = _child$props.dataKey,
+        data = _child$props.data,
+        xAccessor = _child$props.xAccessor,
+        yAccessor = _child$props.yAccessor;
+      return {
+        key: key,
+        data: data,
+        xAccessor: xAccessor,
+        yAccessor: yAccessor
+      };
+    });
+    registerData(dataToRegister);
+    return function () {
+      return unregisterData(dataKeys);
+    };
+  }, [registerData, unregisterData, barSeriesChildren, dataKeys]);
+
+  // create group scale
+  var groupScale = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return (0,_visx_scale__WEBPACK_IMPORTED_MODULE_4__["default"])({
+      domain: sortBars ? [].concat(dataKeys).sort(sortBars) : dataKeys,
+      range: [0, (0,_utils_getScaleBandwidth__WEBPACK_IMPORTED_MODULE_5__["default"])(horizontal ? yScale : xScale)],
+      padding: padding
+    });
+  }, [sortBars, dataKeys, xScale, yScale, horizontal, padding]);
+  var findNearestDatum = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (params) {
+    return (0,_utils_findNearestGroupDatum__WEBPACK_IMPORTED_MODULE_6__["default"])(params, groupScale, horizontal);
+  }, [groupScale, horizontal]);
+  var ownEventSourceKey = _constants__WEBPACK_IMPORTED_MODULE_7__.BARGROUP_EVENT_SOURCE + "-" + dataKeys.join('-') + "}";
+  var eventEmitters = (0,_hooks_useSeriesEvents__WEBPACK_IMPORTED_MODULE_8__["default"])({
+    dataKey: dataKeys,
+    enableEvents: enableEvents,
+    findNearestDatum: findNearestDatum,
+    onBlur: onBlur,
+    onFocus: onFocus,
+    onPointerMove: onPointerMove,
+    onPointerOut: onPointerOut,
+    onPointerUp: onPointerUp,
+    onPointerDown: onPointerDown,
+    source: ownEventSourceKey,
+    allowedSources: [_constants__WEBPACK_IMPORTED_MODULE_7__.XYCHART_EVENT_SOURCE, ownEventSourceKey]
+  });
+  var xZeroPosition = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return xScale ? (0,_utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_9__["default"])(xScale) : 0;
+  }, [xScale]);
+  var yZeroPosition = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return yScale ? (0,_utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_9__["default"])(yScale) : 0;
+  }, [yScale]);
+  var registryEntries = dataKeys.map(function (key) {
+    return dataRegistry.get(key);
+  });
+
+  // if scales and data are not available in the registry, bail
+  if (registryEntries.some(function (entry) {
+    return entry == null;
+  }) || !xScale || !yScale || !colorScale) {
+    return null;
+  }
+  var barThickness = (0,_utils_getScaleBandwidth__WEBPACK_IMPORTED_MODULE_5__["default"])(groupScale);
+  var barSeries = registryEntries.map(function (_ref3) {
+    var _groupScale;
+    var xAccessor = _ref3.xAccessor,
+      yAccessor = _ref3.yAccessor,
+      data = _ref3.data,
+      key = _ref3.key;
+    var getLength = function getLength(d) {
+      var _xScale, _yScale;
+      return horizontal ? ((_xScale = xScale(xAccessor(d))) != null ? _xScale : NaN) - xZeroPosition : ((_yScale = yScale(yAccessor(d))) != null ? _yScale : NaN) - yZeroPosition;
+    };
+    var getGroupPosition = horizontal ? function (d) {
+      var _yScale2;
+      return (_yScale2 = yScale(yAccessor(d))) != null ? _yScale2 : NaN;
+    } : function (d) {
+      var _xScale2;
+      return (_xScale2 = xScale(xAccessor(d))) != null ? _xScale2 : NaN;
+    };
+    var withinGroupPosition = (_groupScale = groupScale(key)) != null ? _groupScale : 0;
+    var getX = horizontal ? function (d) {
+      return xZeroPosition + Math.min(0, getLength(d));
+    } : function (d) {
+      return getGroupPosition(d) + withinGroupPosition;
+    };
+    var getY = horizontal ? function (d) {
+      return getGroupPosition(d) + withinGroupPosition;
+    } : function (d) {
+      return yZeroPosition + Math.min(0, getLength(d));
+    };
+    var getWidth = horizontal ? function (d) {
+      return Math.abs(getLength(d));
+    } : function () {
+      return barThickness;
+    };
+    var getHeight = horizontal ? function () {
+      return barThickness;
+    } : function (d) {
+      return Math.abs(getLength(d));
+    };
+    // get props from child BarSeries, if available
+    var childBarSeries = barSeriesChildren.find(function (child) {
+      return child.props.dataKey === key;
+    });
+    var _ref4 = (childBarSeries == null ? void 0 : childBarSeries.props) || {},
+      colorAccessor = _ref4.colorAccessor,
+      radius = _ref4.radius,
+      radiusAll = _ref4.radiusAll,
+      radiusBottom = _ref4.radiusBottom,
+      radiusLeft = _ref4.radiusLeft,
+      radiusRight = _ref4.radiusRight,
+      radiusTop = _ref4.radiusTop;
+    return {
+      key: key,
+      radius: radius,
+      radiusAll: radiusAll,
+      radiusBottom: radiusBottom,
+      radiusLeft: radiusLeft,
+      radiusRight: radiusRight,
+      radiusTop: radiusTop,
+      bars: data.map(function (bar, index) {
+        var _colorAccessor;
+        var barX = getX(bar);
+        if (!(0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_10__["default"])(barX)) return null;
+        var barY = getY(bar);
+        if (!(0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_10__["default"])(barY)) return null;
+        var barWidth = getWidth(bar);
+        if (!(0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_10__["default"])(barWidth)) return null;
+        var barHeight = getHeight(bar);
+        if (!(0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_10__["default"])(barHeight)) return null;
+        return {
+          key: key + "-" + index,
+          x: barX,
+          y: barY,
+          width: barWidth,
+          height: barHeight,
+          fill: (_colorAccessor = colorAccessor == null ? void 0 : colorAccessor(bar, index)) != null ? _colorAccessor : colorScale(key)
+        };
+      }).filter(function (bar) {
+        return bar;
+      })
+    };
+  });
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("g", {
+    className: "visx-bar-group"
+  }, barSeries.map(function (series) {
+    return series && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(BarsComponent, _extends({
+      horizontal: horizontal,
+      xScale: xScale,
+      yScale: yScale
+    }, series, eventEmitters, {
+      key: series.key
+    }));
+  }));
+}
+BaseBarGroup.propTypes = {
+  children: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node.isRequired),
+  padding: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
+  sortBars: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func)
+};
+
+/***/ }),
+
+/***/ "./node_modules/@visx/xychart/esm/components/series/private/BaseBarSeries.js":
+/*!***********************************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/components/series/private/BaseBarSeries.js ***!
+  \***********************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ "prop-types");
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _context_DataContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../context/DataContext */ "./node_modules/@visx/xychart/esm/context/DataContext.js");
+/* harmony import */ var _enhancers_withRegisteredData__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../enhancers/withRegisteredData */ "./node_modules/@visx/xychart/esm/enhancers/withRegisteredData.js");
+/* harmony import */ var _utils_getScaledValueFactory__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../utils/getScaledValueFactory */ "./node_modules/@visx/xychart/esm/utils/getScaledValueFactory.js");
+/* harmony import */ var _utils_getScaleBandwidth__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../utils/getScaleBandwidth */ "./node_modules/@visx/xychart/esm/utils/getScaleBandwidth.js");
+/* harmony import */ var _utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../utils/getScaleBaseline */ "./node_modules/@visx/xychart/esm/utils/getScaleBaseline.js");
+/* harmony import */ var _typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../typeguards/isValidNumber */ "./node_modules/@visx/xychart/esm/typeguards/isValidNumber.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../constants */ "./node_modules/@visx/xychart/esm/constants.js");
+/* harmony import */ var _hooks_useSeriesEvents__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../hooks/useSeriesEvents */ "./node_modules/@visx/xychart/esm/hooks/useSeriesEvents.js");
+
+var _excluded = ["BarsComponent", "barPadding", "colorAccessor", "data", "dataKey", "onBlur", "onFocus", "onPointerMove", "onPointerOut", "onPointerUp", "onPointerDown", "enableEvents", "xAccessor", "xScale", "yAccessor", "yScale"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+
+
+
+
+
+
+
+
+// Fallback bandwidth estimate assumes no missing data values (divides chart space by # datum)
+var getFallbackBandwidth = function getFallbackBandwidth(fullBarWidth, barPadding) {
+  return (
+    // clamp padding to [0, 1], bar thickness = (1-padding) * availableSpace
+    fullBarWidth * (1 - Math.min(1, Math.max(0, barPadding)))
+  );
+};
+function BaseBarSeries(_ref) {
+  var _ref2, _colorScale, _theme$colors;
+  var BarsComponent = _ref.BarsComponent,
+    _ref$barPadding = _ref.barPadding,
+    barPadding = _ref$barPadding === void 0 ? 0.1 : _ref$barPadding,
+    colorAccessor = _ref.colorAccessor,
+    data = _ref.data,
+    dataKey = _ref.dataKey,
+    onBlur = _ref.onBlur,
+    onFocus = _ref.onFocus,
+    onPointerMove = _ref.onPointerMove,
+    onPointerOut = _ref.onPointerOut,
+    onPointerUp = _ref.onPointerUp,
+    onPointerDown = _ref.onPointerDown,
+    _ref$enableEvents = _ref.enableEvents,
+    enableEvents = _ref$enableEvents === void 0 ? true : _ref$enableEvents,
+    xAccessor = _ref.xAccessor,
+    xScale = _ref.xScale,
+    yAccessor = _ref.yAccessor,
+    yScale = _ref.yScale,
+    barComponentProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _useContext = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(_context_DataContext__WEBPACK_IMPORTED_MODULE_2__["default"]),
+    colorScale = _useContext.colorScale,
+    horizontal = _useContext.horizontal,
+    theme = _useContext.theme,
+    _useContext$innerWidt = _useContext.innerWidth,
+    innerWidth = _useContext$innerWidt === void 0 ? 0 : _useContext$innerWidt,
+    _useContext$innerHeig = _useContext.innerHeight,
+    innerHeight = _useContext$innerHeig === void 0 ? 0 : _useContext$innerHeig;
+  var getScaledX = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return (0,_utils_getScaledValueFactory__WEBPACK_IMPORTED_MODULE_3__["default"])(xScale, xAccessor);
+  }, [xScale, xAccessor]);
+  var getScaledY = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return (0,_utils_getScaledValueFactory__WEBPACK_IMPORTED_MODULE_3__["default"])(yScale, yAccessor);
+  }, [yScale, yAccessor]);
+  var scaleBandwidth = (0,_utils_getScaleBandwidth__WEBPACK_IMPORTED_MODULE_4__["default"])(horizontal ? yScale : xScale);
+  var barThickness = scaleBandwidth || getFallbackBandwidth((horizontal ? innerHeight : innerWidth) / data.length, barPadding);
+  var xZeroPosition = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return xScale ? (0,_utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_5__["default"])(xScale) : 0;
+  }, [xScale]);
+  var yZeroPosition = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    return yScale ? (0,_utils_getScaleBaseline__WEBPACK_IMPORTED_MODULE_5__["default"])(yScale) : 0;
+  }, [yScale]);
+  var color = (_ref2 = (_colorScale = colorScale == null ? void 0 : colorScale(dataKey)) != null ? _colorScale : theme == null ? void 0 : (_theme$colors = theme.colors) == null ? void 0 : _theme$colors[0]) != null ? _ref2 : '#222';
+  var bars = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(function () {
+    var xOffset = horizontal ? 0 : -barThickness / 2;
+    var yOffset = horizontal ? -barThickness / 2 : 0;
+    return data.map(function (datum, index) {
+      var _colorAccessor;
+      var x = getScaledX(datum) + xOffset;
+      if (!(0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_6__["default"])(x)) return null;
+      var y = getScaledY(datum) + yOffset;
+      if (!(0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_6__["default"])(y)) return null;
+      var barLength = horizontal ? x - xZeroPosition : y - yZeroPosition;
+      if (!(0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_6__["default"])(barLength)) return null;
+      return {
+        key: "" + index,
+        x: horizontal ? xZeroPosition + Math.min(0, barLength) : x,
+        y: horizontal ? y : yZeroPosition + Math.min(0, barLength),
+        width: horizontal ? Math.abs(barLength) : barThickness,
+        height: horizontal ? barThickness : Math.abs(barLength),
+        fill: (_colorAccessor = colorAccessor == null ? void 0 : colorAccessor(datum, index)) != null ? _colorAccessor : color
+      };
+    }).filter(function (bar) {
+      return bar;
+    });
+  }, [barThickness, color, colorAccessor, data, getScaledX, getScaledY, horizontal, xZeroPosition, yZeroPosition]);
+  var ownEventSourceKey = _constants__WEBPACK_IMPORTED_MODULE_7__.BARSERIES_EVENT_SOURCE + "-" + dataKey;
+  var eventEmitters = (0,_hooks_useSeriesEvents__WEBPACK_IMPORTED_MODULE_8__["default"])({
+    dataKey: dataKey,
+    enableEvents: enableEvents,
+    onBlur: onBlur,
+    onFocus: onFocus,
+    onPointerMove: onPointerMove,
+    onPointerOut: onPointerOut,
+    onPointerUp: onPointerUp,
+    onPointerDown: onPointerDown,
+    source: ownEventSourceKey,
+    allowedSources: [_constants__WEBPACK_IMPORTED_MODULE_7__.XYCHART_EVENT_SOURCE, ownEventSourceKey]
+  });
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("g", {
+    className: "vx-bar-series"
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(BarsComponent, _extends({
+    bars: bars,
+    horizontal: horizontal,
+    xScale: xScale,
+    yScale: yScale
+  }, eventEmitters, barComponentProps)));
+}
+BaseBarSeries.propTypes = {
+  barPadding: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
+  colorAccessor: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func)
+};
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,_enhancers_withRegisteredData__WEBPACK_IMPORTED_MODULE_9__["default"])(BaseBarSeries));
+
+/***/ }),
+
 /***/ "./node_modules/@visx/xychart/esm/components/series/private/BaseGlyphSeries.js":
 /*!*************************************************************************************!*\
   !*** ./node_modules/@visx/xychart/esm/components/series/private/BaseGlyphSeries.js ***!
@@ -17182,6 +17909,29 @@ function isValidNumber(_) {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/xychart/esm/utils/cleanColorString.js":
+/*!******************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/utils/cleanColorString.js ***!
+  \******************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "cleanColor": () => (/* binding */ cleanColor),
+/* harmony export */   "colorHasUrl": () => (/* binding */ colorHasUrl)
+/* harmony export */ });
+/* react-spring cannot tween colors with url ids (patterns, gradients), these helpers detect and clean them. */
+var neutralCleanColor = 'rgba(0,0,0,0.1)';
+var colorHasUrl = function colorHasUrl(color) {
+  return Boolean(color == null ? void 0 : color.includes('url('));
+};
+var cleanColor = function cleanColor(color) {
+  return colorHasUrl(color) ? neutralCleanColor : color;
+};
+
+/***/ }),
+
 /***/ "./node_modules/@visx/xychart/esm/utils/findNearestDatumSingleDimension.js":
 /*!*********************************************************************************!*\
   !*** ./node_modules/@visx/xychart/esm/utils/findNearestDatumSingleDimension.js ***!
@@ -17299,30 +18049,125 @@ function findNearestDatumX(_ref) {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (/* binding */ findNearestDatumY)
+/* harmony export */   "default": () => (/* binding */ findNearestDatumY)
+/* harmony export */ });
+/* harmony import */ var _findNearestDatumSingleDimension__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./findNearestDatumSingleDimension */ "./node_modules/@visx/xychart/esm/utils/findNearestDatumSingleDimension.js");
+
+function findNearestDatumY(_ref) {
+  var scale = _ref.yScale,
+    accessor = _ref.yAccessor,
+    xScale = _ref.xScale,
+    xAccessor = _ref.xAccessor,
+    point = _ref.point,
+    data = _ref.data;
+  if (!point) return null;
+  var nearestDatum = (0,_findNearestDatumSingleDimension__WEBPACK_IMPORTED_MODULE_0__["default"])({
+    scale: scale,
+    accessor: accessor,
+    scaledValue: point.y,
+    data: data
+  });
+  return nearestDatum ? {
+    datum: nearestDatum.datum,
+    index: nearestDatum.index,
+    distanceY: nearestDatum.distance,
+    distanceX: Math.abs(Number(xScale(xAccessor(nearestDatum.datum))) - point.x)
+  } : null;
+}
+
+/***/ }),
+
+/***/ "./node_modules/@visx/xychart/esm/utils/findNearestGroupDatum.js":
+/*!***********************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/utils/findNearestGroupDatum.js ***!
+  \***********************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ findNearestGroupDatum)
+/* harmony export */ });
+/* harmony import */ var _findNearestDatumX__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./findNearestDatumX */ "./node_modules/@visx/xychart/esm/utils/findNearestDatumX.js");
+/* harmony import */ var _findNearestDatumY__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./findNearestDatumY */ "./node_modules/@visx/xychart/esm/utils/findNearestDatumY.js");
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+
+
+/**
+ * This is a wrapper around findNearestDatumX/Y for BarGroup, accounting for a
+ * Bar's group scale offset (which findNearestDatum does not).
+ */
+function findNearestGroupDatum(nearestDatumArgs, groupScale, horizontal) {
+  var dataKey = nearestDatumArgs.dataKey,
+    xAccessor = nearestDatumArgs.xAccessor,
+    yAccessor = nearestDatumArgs.yAccessor,
+    xScale = nearestDatumArgs.xScale,
+    yScale = nearestDatumArgs.yScale,
+    point = nearestDatumArgs.point;
+  var datum = (horizontal ? _findNearestDatumY__WEBPACK_IMPORTED_MODULE_0__["default"] : _findNearestDatumX__WEBPACK_IMPORTED_MODULE_1__["default"])(nearestDatumArgs);
+  if (!datum || !point) return null;
+  var barGroupOffset = groupScale(dataKey);
+  var barWidth = groupScale.step();
+  if (horizontal) {
+    var _groupPosition = yScale(yAccessor(datum.datum));
+    var _barStart = (_groupPosition != null ? _groupPosition : Infinity) + (barGroupOffset != null ? barGroupOffset : Infinity);
+    var _barEnd = _barStart + barWidth;
+    var _barMiddle = (_barStart + _barEnd) / 2;
+    var _cursorIsOnBar = point.y >= _barStart && point.y <= _barEnd;
+    return _extends({}, datum, {
+      distanceX: 0,
+      // we want all group bars to have same X distance so only Y distance matters
+      distanceY: _cursorIsOnBar ? 0 : Math.abs(point.y - _barMiddle)
+    });
+  }
+  var groupPosition = xScale(xAccessor(datum.datum));
+  var barStart = (groupPosition != null ? groupPosition : Infinity) + (barGroupOffset != null ? barGroupOffset : Infinity);
+  var barEnd = barStart + barWidth;
+  var barMiddle = (barStart + barEnd) / 2;
+  var cursorIsOnBar = point.x >= barStart && point.x <= barEnd;
+  return _extends({}, datum, {
+    distanceY: 0,
+    // we want all group bars to have same Y distance so only X distance matters
+    distanceX: cursorIsOnBar ? 0 : Math.abs(point.x - barMiddle)
+  });
+}
+
+/***/ }),
+
+/***/ "./node_modules/@visx/xychart/esm/utils/getChildrenAndGrandchildrenWithProps.js":
+/*!**************************************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/utils/getChildrenAndGrandchildrenWithProps.js ***!
+  \**************************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ getChildrenAndGrandchildrenWithProps)
 /* harmony export */ });
-/* harmony import */ var _findNearestDatumSingleDimension__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./findNearestDatumSingleDimension */ "./node_modules/@visx/xychart/esm/utils/findNearestDatumSingleDimension.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 
-function findNearestDatumY(_ref) {
-  var scale = _ref.yScale,
-    accessor = _ref.yAccessor,
-    xScale = _ref.xScale,
-    xAccessor = _ref.xAccessor,
-    point = _ref.point,
-    data = _ref.data;
-  if (!point) return null;
-  var nearestDatum = (0,_findNearestDatumSingleDimension__WEBPACK_IMPORTED_MODULE_0__["default"])({
-    scale: scale,
-    accessor: accessor,
-    scaledValue: point.y,
-    data: data
+
+/** Returns whether the React.ReactNode has props (and therefore is an `Element` versus primitive type) */
+function isChildWithProps(child) {
+  return !!child && typeof child === 'object' && 'props' in child && child.props != null;
+}
+
+/**
+ * Returns children and grandchildren of type React.ReactNode.
+ * Flattens children one level to support React.Fragments and Array type children.
+ */
+function getChildrenAndGrandchildrenWithProps(children) {
+  return react__WEBPACK_IMPORTED_MODULE_0___default().Children.toArray(children).flatMap(function (child) {
+    if (typeof child === 'object' && 'props' in child && child.props.children) {
+      return child.props.children;
+    }
+    return child;
+  }).filter(function (child) {
+    return isChildWithProps(child);
   });
-  return nearestDatum ? {
-    datum: nearestDatum.datum,
-    index: nearestDatum.index,
-    distanceY: nearestDatum.distance,
-    distanceX: Math.abs(Number(xScale(xAccessor(nearestDatum.datum))) - point.x)
-  } : null;
 }
 
 /***/ }),
@@ -17347,6 +18192,46 @@ function getScaleBandwidth(scale) {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/xychart/esm/utils/getScaleBaseline.js":
+/*!******************************************************************!*\
+  !*** ./node_modules/@visx/xychart/esm/utils/getScaleBaseline.js ***!
+  \******************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ getScaleBaseline)
+/* harmony export */ });
+/* harmony import */ var _visx_scale__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @visx/scale */ "./node_modules/@visx/scale/esm/utils/coerceNumber.js");
+/* harmony import */ var _typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../typeguards/isValidNumber */ "./node_modules/@visx/xychart/esm/typeguards/isValidNumber.js");
+
+
+
+/**
+ * Returns the output value of a scale's baseline value, which is either zero
+ * or the minimum scale value if its domain doesn't include zero.
+ */
+function getScaleBaseline(scale) {
+  var _scale$range$map = scale.range().map(function (rangeBoundary) {
+      var _coerceNumber;
+      return (_coerceNumber = (0,_visx_scale__WEBPACK_IMPORTED_MODULE_0__["default"])(rangeBoundary)) != null ? _coerceNumber : 0;
+    }),
+    a = _scale$range$map[0],
+    b = _scale$range$map[1];
+  var isDescending = a != null && b != null && b < a;
+  var maybeScaleZero = scale(0);
+  var _ref = isDescending ? [b, a] : [a, b],
+    minOutput = _ref[0],
+    maxOutput = _ref[1];
+
+  // if maybeScaleZero _is_ a number, but the scale is not clamped and it's outside the domain
+  // fallback to the scale's minimum
+  return isDescending ? (0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_1__["default"])(maybeScaleZero) ? Math.min(Math.max(minOutput, maybeScaleZero), maxOutput) : maxOutput : (0,_typeguards_isValidNumber__WEBPACK_IMPORTED_MODULE_1__["default"])(maybeScaleZero) ? Math.max(maybeScaleZero, minOutput) : minOutput;
+}
+
+/***/ }),
+
 /***/ "./node_modules/@visx/xychart/esm/utils/getScaledValueFactory.js":
 /*!***********************************************************************!*\
   !*** ./node_modules/@visx/xychart/esm/utils/getScaledValueFactory.js ***!
@@ -17801,105 +18686,310 @@ Button.defaultProps = {
   iconPlacement: 'left',
   loadingText: 'Loading...'
 };
-Button.propTypes = {
-  text: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string.isRequired),
-  variant: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['primary', 'secondary', 'negative', 'negative_secondary', 'positive', 'white']),
-  size: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['xs', 'sm', 'md', 'lg']),
-  icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_5__.iconNames),
-  iconPlacement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['left', 'right']),
-  disabled: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
-  loading: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
-  loadingText: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)
+Button.propTypes = {
+  text: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string.isRequired),
+  variant: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['primary', 'secondary', 'negative', 'negative_secondary', 'positive', 'white']),
+  size: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['xs', 'sm', 'md', 'lg']),
+  icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_5__.iconNames),
+  iconPlacement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['left', 'right']),
+  disabled: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
+  loading: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
+  loadingText: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)
+};
+var StyledButton = styled_components__WEBPACK_IMPORTED_MODULE_2___default().button.withConfig({
+  displayName: "StyledButton",
+  componentId: "sc-ckjtjy-0"
+})(["display:inline-flex;align-items:center;justify-content:center;border-radius:4px;cursor:pointer;&:disabled{cursor:not-allowed;}text-decoration:none;&:hover,&:visited,:focus{text-decoration:none;}", " ", " ", ""], function (props) {
+  var gap = 4;
+  var paddingLeft = 16;
+  var paddingRight = 16;
+  if (props.iconPlacement == 'left') paddingLeft = 12;else if (props.iconPlacement == 'right') paddingRight = 12;
+  if (props.size == 'xs') {
+    gap = 2;
+    paddingLeft = paddingRight = 8;
+  }
+  return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["gap:", ";padding-left:", ";padding-right:", ";"], (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(gap), (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(paddingLeft), (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(paddingRight));
+}, function (props) {
+  var colors = (0,_utils__WEBPACK_IMPORTED_MODULE_5__.getButtonColors)(props);
+  return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["background-color:", ";border:", ";[data-label]{color:", ";}[data-icon]{color:", ";}", " ", ""], colors.backColor, colors.border || '0 none', colors.color, colors.iconColor || colors.color, colors.hover && "&:hover {\n                background-color: ".concat(colors.hover.backColor, ";\n            }"), colors.active && "&:active {\n                background-color: ".concat(colors.active.backColor, ";\n                border: ").concat(colors.active.border, ";\n                box-shadow: ").concat(colors.active.boxShadow, ";\n                ").concat(colors.active.iconColor && "[data-icon] {\n                    color: ".concat(colors.active.iconColor, ";\n                }"), "\n            }"));
+}, function (props) {
+  return (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toButtonSize)(props.size);
+});
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Button);
+
+/***/ }),
+
+/***/ "./src/button/index.js":
+/*!*****************************!*\
+  !*** ./src/button/index.js ***!
+  \*****************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./src/button/button.js");
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_button__WEBPACK_IMPORTED_MODULE_0__["default"]);
+
+/***/ }),
+
+/***/ "./src/button/loading_icon.js":
+/*!************************************!*\
+  !*** ./src/button/loading_icon.js ***!
+  \************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+
+
+var LoadingIcon = function LoadingIcon(props) {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Spinner, _extends({
+    stroke: "rgba(0,106,220,1)",
+    viewBox: "0 0 24 24"
+  }, props), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("g", {
+    className: "spinner_V8m1"
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("circle", {
+    cx: "12",
+    cy: "12",
+    r: "9.5",
+    fill: "none",
+    strokeWidth: "3"
+  })));
+};
+var Spinner = styled_components__WEBPACK_IMPORTED_MODULE_1___default().svg.withConfig({
+  displayName: "Spinner",
+  componentId: "sc-1nhtjn2-0"
+})(["", " .spinner_V8m1{transform-origin:center;animation:spinner_zKoa 2s linear infinite}.spinner_V8m1 circle{stroke-linecap:round;animation:spinner_YpZS 1.5s ease-in-out infinite}@keyframes spinner_zKoa{100%{transform:rotate(360deg)}}@keyframes spinner_YpZS{0%{stroke-dasharray:0 150;stroke-dashoffset:0}47.5%{stroke-dasharray:42 150;stroke-dashoffset:-16}95%,100%{stroke-dasharray:42 150;stroke-dashoffset:-59}}"], function (props) {
+  return (0,_utils__WEBPACK_IMPORTED_MODULE_2__.toIconSize)(props.size);
+});
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LoadingIcon);
+
+/***/ }),
+
+/***/ "./src/chart/bar.js":
+/*!**************************!*\
+  !*** ./src/chart/bar.js ***!
+  \**************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! prop-types */ "prop-types");
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _chart_container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./chart_container */ "./src/chart/chart_container.js");
+/* harmony import */ var _data_util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./data_util */ "./src/chart/data_util.js");
+/* harmony import */ var _get_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./get_components */ "./src/chart/get_components.js");
+/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./tooltip */ "./src/chart/tooltip.js");
+/* harmony import */ var _use_chart_theme__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./use_chart_theme */ "./src/chart/use_chart_theme.js");
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+var _excluded = ["animated", "showGridRows", "showGridColumns", "numberOfTicks", "xAxisLabel", "yAxisLabel", "xTickFormat", "yTickFormat", "valueFormat", "xLabelOffset", "yLabelOffset", "margin", "orientation"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+
+
+
+
+
+
+var animationTrajectory = 'outside';
+var BarChart = function BarChart(props) {
+  var animated = props.animated,
+    showGridRows = props.showGridRows,
+    showGridColumns = props.showGridColumns,
+    numberOfTicks = props.numberOfTicks,
+    xAxisLabel = props.xAxisLabel,
+    yAxisLabel = props.yAxisLabel,
+    xTickFormat = props.xTickFormat,
+    yTickFormat = props.yTickFormat,
+    valueFormat = props.valueFormat,
+    xLabelOffset = props.xLabelOffset,
+    yLabelOffset = props.yLabelOffset,
+    data = props.data,
+    palette = props.palette,
+    width = props.width,
+    height = props.height,
+    margin = props.margin,
+    orientation = props.orientation;
+  var _getAnimatedOrUnanima = (0,_get_components__WEBPACK_IMPORTED_MODULE_4__.getAnimatedOrUnanimatedComponents)(animated),
+    XYChart = _getAnimatedOrUnanima.XYChart,
+    Grid = _getAnimatedOrUnanima.Grid,
+    Axis = _getAnimatedOrUnanima.Axis,
+    BarGroup = _getAnimatedOrUnanima.BarGroup,
+    BarSeries = _getAnimatedOrUnanima.BarSeries,
+    Tooltip = _getAnimatedOrUnanima.Tooltip;
+  var config = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
+    return {
+      x: orientation == 'vertical' ? {
+        type: 'band'
+      } : {
+        type: 'linear'
+      },
+      y: orientation == 'vertical' ? {
+        type: 'linear'
+      } : {
+        type: 'band'
+      }
+    };
+  }, [orientation]);
+  var chartTheme = (0,_use_chart_theme__WEBPACK_IMPORTED_MODULE_6__["default"])(palette);
+  if (!data || !data.length) return null;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(XYChart, {
+    theme: chartTheme,
+    xScale: config.x,
+    yScale: config.y,
+    width: width,
+    height: height,
+    margin: margin
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Grid, {
+    key: "grid-".concat(animationTrajectory) // force animate on update
+    ,
+    rows: showGridRows,
+    columns: showGridColumns,
+    animationTrajectory: animationTrajectory,
+    numTicks: numberOfTicks
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(BarGroup, null, data.map(function (lineData) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(BarSeries, {
+      key: lineData.name,
+      dataKey: lineData.name,
+      data: lineData.datapoints,
+      xAccessor: (0,_data_util__WEBPACK_IMPORTED_MODULE_3__.getAccessor)(orientation == 'vertical' ? lineData.accessors.x : lineData.accessors.y),
+      yAccessor: (0,_data_util__WEBPACK_IMPORTED_MODULE_3__.getAccessor)(orientation == 'vertical' ? lineData.accessors.y : lineData.accessors.x)
+    });
+  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Axis, {
+    key: "x-axis-".concat(animationTrajectory, "-").concat(orientation),
+    label: xAxisLabel,
+    orientation: orientation == 'vertical' ? 'bottom' : 'left',
+    numTicks: numberOfTicks,
+    animationTrajectory: animationTrajectory,
+    tickFormat: xTickFormat,
+    labelOffset: xLabelOffset
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Axis, {
+    key: "y-axis-".concat(animationTrajectory, "-").concat(orientation),
+    label: yAxisLabel,
+    orientation: orientation == 'vertical' ? 'left' : 'bottom',
+    numTicks: numberOfTicks,
+    animationTrajectory: animationTrajectory,
+    tickFormat: yTickFormat,
+    labelOffset: yLabelOffset
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Tooltip, {
+    showHorizontalCrosshair: orientation == 'vertical',
+    showVerticalCrosshair: orientation != 'vertical',
+    snapTooltipToDatumX: orientation != 'vertical',
+    snapTooltipToDatumY: orientation == 'vertical',
+    unstyled: true,
+    applyPositionStyle: true,
+    renderTooltip: function renderTooltip(params) {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_5__["default"], _extends({
+        data: data,
+        xTickFormat: xTickFormat,
+        yTickFormat: yTickFormat,
+        valueFormat: valueFormat
+      }, params));
+    }
+  }));
+};
+BarChart.displayName = 'BarChart';
+var Bar = function Bar(props) {
+  var animated = props.animated,
+    showGridRows = props.showGridRows,
+    showGridColumns = props.showGridColumns,
+    numberOfTicks = props.numberOfTicks,
+    xAxisLabel = props.xAxisLabel,
+    yAxisLabel = props.yAxisLabel,
+    xTickFormat = props.xTickFormat,
+    yTickFormat = props.yTickFormat,
+    valueFormat = props.valueFormat,
+    xLabelOffset = props.xLabelOffset,
+    yLabelOffset = props.yLabelOffset,
+    margin = props.margin,
+    orientation = props.orientation,
+    rest = _objectWithoutProperties(props, _excluded);
+  var chartProps = {
+    animated: animated,
+    showGridRows: showGridRows,
+    showGridColumns: showGridColumns,
+    numberOfTicks: numberOfTicks,
+    xAxisLabel: xAxisLabel,
+    yAxisLabel: yAxisLabel,
+    xTickFormat: xTickFormat,
+    yTickFormat: yTickFormat,
+    valueFormat: valueFormat,
+    xLabelOffset: xLabelOffset,
+    yLabelOffset: yLabelOffset,
+    margin: margin,
+    orientation: orientation
+  };
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chart_container__WEBPACK_IMPORTED_MODULE_2__["default"], _extends({}, rest, {
+    Chart: BarChart,
+    chartProps: chartProps
+  }));
+};
+Bar.displayName = 'Chart.Bar';
+Bar.defaultProps = {
+  animated: true,
+  orientation: 'vertical'
 };
-var StyledButton = styled_components__WEBPACK_IMPORTED_MODULE_2___default().button.withConfig({
-  displayName: "StyledButton",
-  componentId: "sc-ckjtjy-0"
-})(["display:inline-flex;align-items:center;justify-content:center;border-radius:4px;cursor:pointer;&:disabled{cursor:not-allowed;}text-decoration:none;&:hover,&:visited,:focus{text-decoration:none;}", " ", " ", ""], function (props) {
-  var gap = 4;
-  var paddingLeft = 16;
-  var paddingRight = 16;
-  if (props.iconPlacement == 'left') paddingLeft = 12;else if (props.iconPlacement == 'right') paddingRight = 12;
-  if (props.size == 'xs') {
-    gap = 2;
-    paddingLeft = paddingRight = 8;
-  }
-  return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["gap:", ";padding-left:", ";padding-right:", ";"], (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(gap), (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(paddingLeft), (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(paddingRight));
-}, function (props) {
-  var colors = (0,_utils__WEBPACK_IMPORTED_MODULE_5__.getButtonColors)(props);
-  return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["background-color:", ";border:", ";[data-label]{color:", ";}[data-icon]{color:", ";}", " ", ""], colors.backColor, colors.border || '0 none', colors.color, colors.iconColor || colors.color, colors.hover && "&:hover {\n                background-color: ".concat(colors.hover.backColor, ";\n            }"), colors.active && "&:active {\n                background-color: ".concat(colors.active.backColor, ";\n                border: ").concat(colors.active.border, ";\n                box-shadow: ").concat(colors.active.boxShadow, ";\n                ").concat(colors.active.iconColor && "[data-icon] {\n                    color: ".concat(colors.active.iconColor, ";\n                }"), "\n            }"));
-}, function (props) {
-  return (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toButtonSize)(props.size);
-});
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Button);
-
-/***/ }),
-
-/***/ "./src/button/index.js":
-/*!*****************************!*\
-  !*** ./src/button/index.js ***!
-  \*****************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./src/button/button.js");
-// LICENSE_CODE ZON
-
-
-/*jslint react:true*/
-
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_button__WEBPACK_IMPORTED_MODULE_0__["default"]);
-
-/***/ }),
-
-/***/ "./src/button/loading_icon.js":
-/*!************************************!*\
-  !*** ./src/button/loading_icon.js ***!
-  \************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
-// LICENSE_CODE ZON
-
-
-/*jslint react:true*/
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-
-
-var LoadingIcon = function LoadingIcon(props) {
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Spinner, _extends({
-    stroke: "rgba(0,106,220,1)",
-    viewBox: "0 0 24 24"
-  }, props), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("g", {
-    className: "spinner_V8m1"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("circle", {
-    cx: "12",
-    cy: "12",
-    r: "9.5",
-    fill: "none",
-    strokeWidth: "3"
-  })));
+Bar.propTypes = {
+  animated: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
+  showGridRows: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
+  showGridColumns: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
+  numberOfTicks: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
+  data: prop_types__WEBPACK_IMPORTED_MODULE_1___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_1___default().shape({
+    name: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string.isRequired),
+    accessors: prop_types__WEBPACK_IMPORTED_MODULE_1___default().shape({
+      x: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_1___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)]).isRequired,
+      y: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_1___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)]).isRequired
+    }).isRequired,
+    datapoints: prop_types__WEBPACK_IMPORTED_MODULE_1___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_1___default().object)).isRequired
+  })).isRequired,
+  xAxisLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
+  yAxisLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
+  xTickFormat: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
+  yTickFormat: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
+  valueFormat: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
+  margin: prop_types__WEBPACK_IMPORTED_MODULE_1___default().shape({
+    top: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
+    right: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
+    bottom: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
+    left: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number)
+  }),
+  xLabelOffset: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
+  yLabelOffset: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
+  orientation: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['vertical', 'horizontal'])
 };
-var Spinner = styled_components__WEBPACK_IMPORTED_MODULE_1___default().svg.withConfig({
-  displayName: "Spinner",
-  componentId: "sc-1nhtjn2-0"
-})(["", " .spinner_V8m1{transform-origin:center;animation:spinner_zKoa 2s linear infinite}.spinner_V8m1 circle{stroke-linecap:round;animation:spinner_YpZS 1.5s ease-in-out infinite}@keyframes spinner_zKoa{100%{transform:rotate(360deg)}}@keyframes spinner_YpZS{0%{stroke-dasharray:0 150;stroke-dashoffset:0}47.5%{stroke-dasharray:42 150;stroke-dashoffset:-16}95%,100%{stroke-dasharray:42 150;stroke-dashoffset:-59}}"], function (props) {
-  return (0,_utils__WEBPACK_IMPORTED_MODULE_2__.toIconSize)(props.size);
-});
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LoadingIcon);
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Bar);
 
 /***/ }),
 
@@ -17964,7 +19054,7 @@ var ChartContainer = function ChartContainer(props) {
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ChartContainerWrapper, _extends({}, rest, {
     width: outerWidth,
     height: outerHeight
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(HeaderWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Header, {
+  }), !!header && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(HeaderWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Header, {
     color: "gray_11_75"
   }, header), !!description && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, {
     variant: "sm",
@@ -17989,7 +19079,7 @@ ChartContainer.defaultProps = {
   variant: 'default'
 };
 ChartContainer.propTypes = {
-  header: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string.isRequired),
+  header: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   description: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   actions: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),
   width: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
@@ -18170,13 +19260,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "getAnimatedOrUnanimatedComponents": () => (/* binding */ getAnimatedOrUnanimatedComponents)
 /* harmony export */ });
 /* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/axis/AnimatedAxis.js");
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/grid/AnimatedGrid.js");
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/AnimatedLineSeries.js");
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/Tooltip.js");
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/XYChart.js");
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/axis/Axis.js");
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/grid/Grid.js");
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/LineSeries.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/AnimatedBarGroup.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/AnimatedBarSeries.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/grid/AnimatedGrid.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/AnimatedLineSeries.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/Tooltip.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/XYChart.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/axis/Axis.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/BarGroup.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/BarSeries.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/grid/Grid.js");
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/components/series/LineSeries.js");
 // LICENSE_CODE ZON
 
 
@@ -18185,16 +19279,20 @@ __webpack_require__.r(__webpack_exports__);
 var getAnimatedOrUnanimatedComponents = function getAnimatedOrUnanimatedComponents(animated) {
   return animated ? {
     Axis: _visx_xychart__WEBPACK_IMPORTED_MODULE_0__["default"],
-    Grid: _visx_xychart__WEBPACK_IMPORTED_MODULE_1__["default"],
-    LineSeries: _visx_xychart__WEBPACK_IMPORTED_MODULE_2__["default"],
-    Tooltip: _visx_xychart__WEBPACK_IMPORTED_MODULE_3__["default"],
-    XYChart: _visx_xychart__WEBPACK_IMPORTED_MODULE_4__["default"]
+    BarGroup: _visx_xychart__WEBPACK_IMPORTED_MODULE_1__["default"],
+    BarSeries: _visx_xychart__WEBPACK_IMPORTED_MODULE_2__["default"],
+    Grid: _visx_xychart__WEBPACK_IMPORTED_MODULE_3__["default"],
+    LineSeries: _visx_xychart__WEBPACK_IMPORTED_MODULE_4__["default"],
+    Tooltip: _visx_xychart__WEBPACK_IMPORTED_MODULE_5__["default"],
+    XYChart: _visx_xychart__WEBPACK_IMPORTED_MODULE_6__["default"]
   } : {
-    Axis: _visx_xychart__WEBPACK_IMPORTED_MODULE_5__["default"],
-    Grid: _visx_xychart__WEBPACK_IMPORTED_MODULE_6__["default"],
-    LineSeries: _visx_xychart__WEBPACK_IMPORTED_MODULE_7__["default"],
-    Tooltip: _visx_xychart__WEBPACK_IMPORTED_MODULE_3__["default"],
-    XYChart: _visx_xychart__WEBPACK_IMPORTED_MODULE_4__["default"]
+    Axis: _visx_xychart__WEBPACK_IMPORTED_MODULE_7__["default"],
+    BarGroup: _visx_xychart__WEBPACK_IMPORTED_MODULE_8__["default"],
+    BarSeries: _visx_xychart__WEBPACK_IMPORTED_MODULE_9__["default"],
+    Grid: _visx_xychart__WEBPACK_IMPORTED_MODULE_10__["default"],
+    LineSeries: _visx_xychart__WEBPACK_IMPORTED_MODULE_11__["default"],
+    Tooltip: _visx_xychart__WEBPACK_IMPORTED_MODULE_5__["default"],
+    XYChart: _visx_xychart__WEBPACK_IMPORTED_MODULE_6__["default"]
   };
 };
 
@@ -18211,14 +19309,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var _line__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./line */ "./src/chart/line.js");
+/* harmony import */ var _bar__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./bar */ "./src/chart/bar.js");
+/* harmony import */ var _line__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./line */ "./src/chart/line.js");
 // LICENSE_CODE ZON
 
 
 /*jslint react:true*/
 
+
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
-  Line: _line__WEBPACK_IMPORTED_MODULE_0__["default"]
+  Bar: _bar__WEBPACK_IMPORTED_MODULE_0__["default"],
+  Line: _line__WEBPACK_IMPORTED_MODULE_1__["default"]
 });
 
 /***/ }),
@@ -18325,13 +19426,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! prop-types */ "prop-types");
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/theme/buildChartTheme.js");
 /* harmony import */ var _visx_curve__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @visx/curve */ "./node_modules/d3-shape/src/curve/cardinal.js");
-/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
-/* harmony import */ var _chart_container__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./chart_container */ "./src/chart/chart_container.js");
-/* harmony import */ var _data_util__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./data_util */ "./src/chart/data_util.js");
-/* harmony import */ var _get_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./get_components */ "./src/chart/get_components.js");
-/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./tooltip */ "./src/chart/tooltip.js");
+/* harmony import */ var _chart_container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./chart_container */ "./src/chart/chart_container.js");
+/* harmony import */ var _data_util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./data_util */ "./src/chart/data_util.js");
+/* harmony import */ var _get_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./get_components */ "./src/chart/get_components.js");
+/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./tooltip */ "./src/chart/tooltip.js");
+/* harmony import */ var _use_chart_theme__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./use_chart_theme */ "./src/chart/use_chart_theme.js");
 // LICENSE_CODE ZON
 
 
@@ -18348,7 +19448,6 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 
 
-
 var animationTrajectory = 'outside';
 var config = {
   x: {
@@ -18375,13 +19474,13 @@ var LineChart = function LineChart(props) {
     width = props.width,
     height = props.height,
     margin = props.margin;
-  var _getAnimatedOrUnanima = (0,_get_components__WEBPACK_IMPORTED_MODULE_5__.getAnimatedOrUnanimatedComponents)(animated),
+  var _getAnimatedOrUnanima = (0,_get_components__WEBPACK_IMPORTED_MODULE_4__.getAnimatedOrUnanimatedComponents)(animated),
     XYChart = _getAnimatedOrUnanima.XYChart,
     Grid = _getAnimatedOrUnanima.Grid,
     Axis = _getAnimatedOrUnanima.Axis,
     LineSeries = _getAnimatedOrUnanima.LineSeries,
     Tooltip = _getAnimatedOrUnanima.Tooltip;
-  var chartTheme = useChartTheme(palette);
+  var chartTheme = (0,_use_chart_theme__WEBPACK_IMPORTED_MODULE_6__["default"])(palette);
   if (!data || !data.length) return null;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(XYChart, {
     theme: chartTheme,
@@ -18402,8 +19501,8 @@ var LineChart = function LineChart(props) {
       key: lineData.name,
       dataKey: lineData.name,
       data: lineData.datapoints,
-      xAccessor: (0,_data_util__WEBPACK_IMPORTED_MODULE_4__.getAccessor)(lineData.accessors.x),
-      yAccessor: (0,_data_util__WEBPACK_IMPORTED_MODULE_4__.getAccessor)(lineData.accessors.y),
+      xAccessor: (0,_data_util__WEBPACK_IMPORTED_MODULE_3__.getAccessor)(lineData.accessors.x),
+      yAccessor: (0,_data_util__WEBPACK_IMPORTED_MODULE_3__.getAccessor)(lineData.accessors.y),
       curve: _visx_curve__WEBPACK_IMPORTED_MODULE_7__["default"]
     });
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Axis, {
@@ -18430,7 +19529,8 @@ var LineChart = function LineChart(props) {
     unstyled: true,
     applyPositionStyle: true,
     renderTooltip: function renderTooltip(params) {
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_6__["default"], _extends({
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_5__["default"], _extends({
+        shared: true,
         data: data,
         xTickFormat: xTickFormat,
         yTickFormat: yTickFormat,
@@ -18440,53 +19540,6 @@ var LineChart = function LineChart(props) {
   }));
 };
 LineChart.displayName = 'LineChart';
-var useChartTheme = function useChartTheme(palette) {
-  return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
-    var axisLineStyles = {
-      stroke: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_5,
-      strokeWidth: 2
-    };
-    var tickLineStyles = {
-      stroke: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_5,
-      strokeWidth: 1
-    };
-    var bigLabelProps = {
-      fill: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_11_25,
-      fontSize: 13,
-      // sm
-      fontFamily: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].font_family.sans,
-      fontWeight: 400 // regular,
-    };
-
-    var smallLabelProps = {
-      fill: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_11_25,
-      fontSize: 12,
-      // xs
-      fontFamily: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].font_family.sans,
-      fontWeight: 400 // regular,
-    };
-
-    return (0,_visx_xychart__WEBPACK_IMPORTED_MODULE_8__["default"])({
-      backgroundColor: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white,
-      colors: palette,
-      // /** Styles to applied to HMTL labels. */
-      // htmlLabel: HTMLTextStyles;
-      /** axis label, annotation title, etc. */
-      svgLabelBig: bigLabelProps,
-      /** tick label, annotation subtitle, etc. */
-      svgLabelSmall: smallLabelProps,
-      gridStyles: {
-        stroke: _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_5,
-        strokeDasharray: '2 2'
-      },
-      xAxisLineStyles: axisLineStyles,
-      yAxisLineStyles: axisLineStyles,
-      xTickLineStyles: tickLineStyles,
-      yTickLineStyles: tickLineStyles,
-      tickLength: 3
-    });
-  }, [palette]);
-};
 var Line = function Line(props) {
   var animated = props.animated,
     showGridRows = props.showGridRows,
@@ -18515,7 +19568,7 @@ var Line = function Line(props) {
     yLabelOffset: yLabelOffset,
     margin: margin
   };
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chart_container__WEBPACK_IMPORTED_MODULE_3__["default"], _extends({}, rest, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chart_container__WEBPACK_IMPORTED_MODULE_2__["default"], _extends({}, rest, {
     Chart: LineChart,
     chartProps: chartProps
   }));
@@ -18551,8 +19604,7 @@ Line.propTypes = {
     left: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number)
   }),
   xLabelOffset: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
-  yLabelOffset: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
-  hideLegend: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool)
+  yLabelOffset: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number)
 };
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Line);
 
@@ -18571,8 +19623,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
-/* harmony import */ var _layout__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../layout */ "./src/layout/index.js");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
 /* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
 /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
 // LICENSE_CODE ZON
@@ -18585,12 +19638,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 var Loading = function Loading() {
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_2__.Flex, {
-    flex_direction: "column",
-    align_items: "center",
-    justify_content: "center",
-    gap: _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"]
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_1__["default"], {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LoadingWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_2__["default"], {
     name: "Loading",
     color: "blue_11",
     size: "md"
@@ -18599,6 +19647,10 @@ var Loading = function Loading() {
     color: "gray_11"
   }, "Loading..."));
 };
+var LoadingWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "LoadingWrapper",
+  componentId: "sc-1y1vl7k-0"
+})(["flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"]);
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Loading);
 
 /***/ }),
@@ -18616,8 +19668,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
-/* harmony import */ var _layout__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../layout */ "./src/layout/index.js");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
 /* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
 /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
 // LICENSE_CODE ZON
@@ -18630,12 +19683,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 var NoData = function NoData() {
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_2__.Flex, {
-    flex_direction: "column",
-    align_items: "center",
-    justify_content: "center",
-    gap: _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"]
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_1__["default"], {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NoDataWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_2__["default"], {
     name: "Graph",
     color: "gray_9",
     size: "md"
@@ -18644,6 +19692,10 @@ var NoData = function NoData() {
     color: "gray_11"
   }, "There is no data yet"));
 };
+var NoDataWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "NoDataWrapper",
+  componentId: "sc-wjsx2v-0"
+})(["flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"]);
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (NoData);
 
 /***/ }),
@@ -18680,7 +19732,8 @@ var defaultFormat = function defaultFormat(v) {
 };
 var Tooltip = function Tooltip(props) {
   var _props$xTickFormat, _props$valueFormat;
-  var data = props.data,
+  var shared = props.shared,
+    data = props.data,
     tooltipData = props.tooltipData,
     colorScale = props.colorScale;
   var _ref = tooltipData || {},
@@ -18692,6 +19745,7 @@ var Tooltip = function Tooltip(props) {
       return acc;
     }, {});
   }, [data]);
+  var series = shared ? Object.keys(datumByKey !== null && datumByKey !== void 0 ? datumByKey : {}) : [nearestDatum === null || nearestDatum === void 0 ? void 0 : nearestDatum.key];
   var xTickFormat = (_props$xTickFormat = props.xTickFormat) !== null && _props$xTickFormat !== void 0 ? _props$xTickFormat : defaultFormat;
   var valueFormat = (_props$valueFormat = props.valueFormat) !== null && _props$valueFormat !== void 0 ? _props$valueFormat : defaultFormat;
   var getX = function getX(key, datum) {
@@ -18703,7 +19757,7 @@ var Tooltip = function Tooltip(props) {
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TooltipWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TooltipHeader, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_3__.Label, {
     variant: "base",
     color: "gray_11_25"
-  }, "".concat(getX(nearestDatum.key, nearestDatum === null || nearestDatum === void 0 ? void 0 : nearestDatum.datum)))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TooltipContent, null, Object.keys(datumByKey !== null && datumByKey !== void 0 ? datumByKey : {}).filter(function (name) {
+  }, "".concat(getX(nearestDatum.key, nearestDatum === null || nearestDatum === void 0 ? void 0 : nearestDatum.datum)))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TooltipContent, null, series.filter(function (name) {
     return name;
   }).map(function (name) {
     var _datumByKey$name;
@@ -18753,6 +19807,79 @@ var Glyph = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withCon
 
 /***/ }),
 
+/***/ "./src/chart/use_chart_theme.js":
+/*!**************************************!*\
+  !*** ./src/chart/use_chart_theme.js ***!
+  \**************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _visx_xychart__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @visx/xychart */ "./node_modules/@visx/xychart/esm/theme/buildChartTheme.js");
+/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+
+
+
+var useChartTheme = function useChartTheme(palette) {
+  return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
+    var axisLineStyles = {
+      stroke: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_5,
+      strokeWidth: 2
+    };
+    var tickLineStyles = {
+      stroke: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_5,
+      strokeWidth: 1
+    };
+    var bigLabelProps = {
+      fill: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_11_25,
+      fontSize: 13,
+      // sm
+      fontFamily: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].font_family.sans,
+      fontWeight: 400 // regular,
+    };
+
+    var smallLabelProps = {
+      fill: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_11_25,
+      fontSize: 12,
+      // xs
+      fontFamily: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].font_family.sans,
+      fontWeight: 400 // regular,
+    };
+
+    return (0,_visx_xychart__WEBPACK_IMPORTED_MODULE_2__["default"])({
+      backgroundColor: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.white,
+      colors: palette,
+      // /** Styles to applied to HTML labels. */
+      // htmlLabel: HTMLTextStyles;
+      /** axis label, annotation title, etc. */
+      svgLabelBig: bigLabelProps,
+      /** tick label, annotation subtitle, etc. */
+      svgLabelSmall: smallLabelProps,
+      gridStyles: {
+        stroke: _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_5,
+        strokeDasharray: '2 2'
+      },
+      xAxisLineStyles: axisLineStyles,
+      yAxisLineStyles: axisLineStyles,
+      xTickLineStyles: tickLineStyles,
+      yTickLineStyles: tickLineStyles,
+      tickLength: 3
+    });
+  }, [palette]);
+};
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useChartTheme);
+
+/***/ }),
+
 /***/ "./src/code/code.js":
 /*!**************************!*\
   !*** ./src/code/code.js ***!