@luminati-io/uikit 3.6.7 → 3.6.9

package/dist/umd/uikit.development.js

@@ -8154,6 +8154,197 @@ var PatternOrientation = {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/pattern/esm/index.js":
+/*!*************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/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 */   Pattern: () => (/* reexport safe */ _patterns_Pattern__WEBPACK_IMPORTED_MODULE_0__["default"]),
+/* harmony export */   PatternCircles: () => (/* reexport safe */ _patterns_Circles__WEBPACK_IMPORTED_MODULE_2__["default"]),
+/* harmony export */   PatternHexagons: () => (/* reexport safe */ _patterns_Hexagons__WEBPACK_IMPORTED_MODULE_4__["default"]),
+/* harmony export */   PatternLines: () => (/* reexport safe */ _patterns_Lines__WEBPACK_IMPORTED_MODULE_1__["default"]),
+/* harmony export */   PatternOrientation: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_6__.PatternOrientation),
+/* harmony export */   PatternPath: () => (/* reexport safe */ _patterns_Path__WEBPACK_IMPORTED_MODULE_5__["default"]),
+/* harmony export */   PatternWaves: () => (/* reexport safe */ _patterns_Waves__WEBPACK_IMPORTED_MODULE_3__["default"])
+/* harmony export */ });
+/* harmony import */ var _patterns_Pattern__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./patterns/Pattern */ "./node_modules/@visx/pattern/esm/patterns/Pattern.js");
+/* harmony import */ var _patterns_Lines__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./patterns/Lines */ "./node_modules/@visx/pattern/esm/patterns/Lines.js");
+/* harmony import */ var _patterns_Circles__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./patterns/Circles */ "./node_modules/@visx/pattern/esm/patterns/Circles.js");
+/* harmony import */ var _patterns_Waves__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./patterns/Waves */ "./node_modules/@visx/pattern/esm/patterns/Waves.js");
+/* harmony import */ var _patterns_Hexagons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./patterns/Hexagons */ "./node_modules/@visx/pattern/esm/patterns/Hexagons.js");
+/* harmony import */ var _patterns_Path__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./patterns/Path */ "./node_modules/@visx/pattern/esm/patterns/Path.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./constants */ "./node_modules/@visx/pattern/esm/constants/index.js");
+
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ "./node_modules/@visx/pattern/esm/patterns/Circles.js":
+/*!************************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/patterns/Circles.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 */ Circles)
+/* 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 classnames__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
+/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _Pattern__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Pattern */ "./node_modules/@visx/pattern/esm/patterns/Pattern.js");
+
+
+
+
+function Circles(_ref) {
+  var _corners;
+  var id = _ref.id,
+    width = _ref.width,
+    height = _ref.height,
+    _ref$radius = _ref.radius,
+    radius = _ref$radius === void 0 ? 2 : _ref$radius,
+    fill = _ref.fill,
+    stroke = _ref.stroke,
+    strokeWidth = _ref.strokeWidth,
+    strokeDasharray = _ref.strokeDasharray,
+    background = _ref.background,
+    _ref$complement = _ref.complement,
+    complement = _ref$complement === void 0 ? false : _ref$complement,
+    className = _ref.className;
+  var corners;
+  if (complement) {
+    corners = [[0, 0], [0, height], [width, 0], [width, height]];
+  }
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_Pattern__WEBPACK_IMPORTED_MODULE_3__["default"], {
+    id: id,
+    width: width,
+    height: height
+  }, !!background && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("rect", {
+    width: width,
+    height: height,
+    fill: background
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("circle", {
+    className: classnames__WEBPACK_IMPORTED_MODULE_2___default()('visx-pattern-circle', className),
+    cx: width / 2,
+    cy: height / 2,
+    r: radius,
+    fill: fill,
+    stroke: stroke,
+    strokeWidth: strokeWidth,
+    strokeDasharray: strokeDasharray
+  }), (_corners = corners) == null ? void 0 : _corners.map(function (_ref2) {
+    var cornerX = _ref2[0],
+      cornerY = _ref2[1];
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("circle", {
+      key: id + "-complement-" + cornerX + "-" + cornerY,
+      className: classnames__WEBPACK_IMPORTED_MODULE_2___default()('visx-pattern-circle visx-pattern-circle-complement', className),
+      cx: cornerX,
+      cy: cornerY,
+      r: radius,
+      fill: fill,
+      stroke: stroke,
+      strokeWidth: strokeWidth,
+      strokeDasharray: strokeDasharray
+    });
+  }));
+}
+Circles.propTypes = {
+  id: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string).isRequired,
+  width: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number).isRequired,
+  height: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number).isRequired,
+  radius: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
+  fill: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  className: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  stroke: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  strokeWidth: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().number), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)]),
+  strokeDasharray: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().number), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)]),
+  complement: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
+  background: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)
+};
+
+/***/ }),
+
+/***/ "./node_modules/@visx/pattern/esm/patterns/Hexagons.js":
+/*!*************************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/patterns/Hexagons.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 */ Hexagons)
+/* 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 classnames__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
+/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _Path__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Path */ "./node_modules/@visx/pattern/esm/patterns/Path.js");
+
+
+
+
+function Hexagons(_ref) {
+  var id = _ref.id,
+    height = _ref.height,
+    fill = _ref.fill,
+    stroke = _ref.stroke,
+    strokeWidth = _ref.strokeWidth,
+    strokeDasharray = _ref.strokeDasharray,
+    strokeLinecap = _ref.strokeLinecap,
+    shapeRendering = _ref.shapeRendering,
+    background = _ref.background,
+    className = _ref.className,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 3 : _ref$size;
+  var sqrtSize = Math.sqrt(size);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_Path__WEBPACK_IMPORTED_MODULE_3__["default"], {
+    className: classnames__WEBPACK_IMPORTED_MODULE_2___default()('visx-pattern-hexagon', className),
+    path: "M " + height + ",0 l " + height + ",0 l " + height / 2 + "," + height * sqrtSize / 2 + " l " + -height / 2 + "," + height * sqrtSize / 2 + " l " + -height + ",0 l " + -height / 2 + "," + -height * sqrtSize / 2 + " Z M 0," + height * sqrtSize / 2 + " l " + height / 2 + ",0 M " + 3 * height + "," + height * sqrtSize / 2 + " l " + -height / 2 + ",0",
+    id: id,
+    width: size,
+    height: sqrtSize,
+    fill: fill,
+    stroke: stroke,
+    strokeWidth: strokeWidth,
+    strokeDasharray: strokeDasharray,
+    strokeLinecap: strokeLinecap,
+    shapeRendering: shapeRendering,
+    background: background
+  });
+}
+Hexagons.propTypes = {
+  id: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string).isRequired,
+  height: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number).isRequired,
+  size: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
+  fill: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  className: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  background: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  stroke: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  strokeWidth: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().number), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)]),
+  strokeDasharray: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number)]),
+  strokeLinecap: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['square', 'butt', 'round', 'inherit']),
+  shapeRendering: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number)])
+};
+
+/***/ }),
+
 /***/ "./node_modules/@visx/pattern/esm/patterns/Lines.js":
 /*!**********************************************************!*\
   !*** ./node_modules/@visx/pattern/esm/patterns/Lines.js ***!
@@ -8251,6 +8442,80 @@ Lines.propTypes = {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/pattern/esm/patterns/Path.js":
+/*!*********************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/patterns/Path.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 */ Path)
+/* 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 classnames__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
+/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _Pattern__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Pattern */ "./node_modules/@visx/pattern/esm/patterns/Pattern.js");
+
+
+
+
+function Path(_ref) {
+  var id = _ref.id,
+    width = _ref.width,
+    height = _ref.height,
+    path = _ref.path,
+    _ref$fill = _ref.fill,
+    fill = _ref$fill === void 0 ? 'transparent' : _ref$fill,
+    stroke = _ref.stroke,
+    strokeWidth = _ref.strokeWidth,
+    strokeDasharray = _ref.strokeDasharray,
+    _ref$strokeLinecap = _ref.strokeLinecap,
+    strokeLinecap = _ref$strokeLinecap === void 0 ? 'square' : _ref$strokeLinecap,
+    _ref$shapeRendering = _ref.shapeRendering,
+    shapeRendering = _ref$shapeRendering === void 0 ? 'auto' : _ref$shapeRendering,
+    background = _ref.background,
+    className = _ref.className;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_Pattern__WEBPACK_IMPORTED_MODULE_3__["default"], {
+    id: id,
+    width: width,
+    height: height
+  }, !!background && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("rect", {
+    width: width,
+    height: height,
+    fill: background
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("path", {
+    className: classnames__WEBPACK_IMPORTED_MODULE_2___default()('visx-pattern-path', className),
+    d: path,
+    fill: fill,
+    stroke: stroke,
+    strokeWidth: strokeWidth,
+    strokeDasharray: strokeDasharray,
+    strokeLinecap: strokeLinecap,
+    shapeRendering: shapeRendering
+  }));
+}
+Path.propTypes = {
+  id: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string).isRequired,
+  width: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number).isRequired,
+  height: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number).isRequired,
+  path: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  fill: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  className: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  background: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  stroke: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  strokeWidth: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().number), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)]),
+  strokeDasharray: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number)]),
+  strokeLinecap: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['square', 'butt', 'round', 'inherit']),
+  shapeRendering: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number)])
+};
+
+/***/ }),
+
 /***/ "./node_modules/@visx/pattern/esm/patterns/Pattern.js":
 /*!************************************************************!*\
   !*** ./node_modules/@visx/pattern/esm/patterns/Pattern.js ***!
@@ -8289,6 +8554,71 @@ Pattern.propTypes = {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/pattern/esm/patterns/Waves.js":
+/*!**********************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/patterns/Waves.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 */ Waves)
+/* 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 classnames__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
+/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _Path__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Path */ "./node_modules/@visx/pattern/esm/patterns/Path.js");
+
+
+
+
+function Waves(_ref) {
+  var id = _ref.id,
+    width = _ref.width,
+    height = _ref.height,
+    fill = _ref.fill,
+    stroke = _ref.stroke,
+    strokeWidth = _ref.strokeWidth,
+    strokeDasharray = _ref.strokeDasharray,
+    strokeLinecap = _ref.strokeLinecap,
+    shapeRendering = _ref.shapeRendering,
+    background = _ref.background,
+    className = _ref.className;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_Path__WEBPACK_IMPORTED_MODULE_3__["default"], {
+    className: classnames__WEBPACK_IMPORTED_MODULE_2___default()('visx-pattern-wave', className),
+    path: "M 0 " + height / 2 + " c " + height / 8 + " " + -height / 4 + " , " + height * 3 / 8 + " " + -height / 4 + " , " + height / 2 + " 0\n             c " + height / 8 + " " + height / 4 + " , " + height * 3 / 8 + " " + height / 4 + " , " + height / 2 + " 0 M " + -height / 2 + " " + height / 2 + "\n             c " + height / 8 + " " + height / 4 + " , " + height * 3 / 8 + " " + height / 4 + " , " + height / 2 + " 0 M " + height + " " + height / 2 + "\n             c " + height / 8 + " " + -height / 4 + " , " + height * 3 / 8 + " " + -height / 4 + " , " + height / 2 + " 0",
+    id: id,
+    width: width,
+    height: height,
+    fill: fill,
+    stroke: stroke,
+    strokeWidth: strokeWidth,
+    strokeDasharray: strokeDasharray,
+    strokeLinecap: strokeLinecap,
+    shapeRendering: shapeRendering,
+    background: background
+  });
+}
+Waves.propTypes = {
+  id: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string).isRequired,
+  width: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number).isRequired,
+  height: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number).isRequired,
+  fill: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  className: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  background: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  stroke: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  strokeWidth: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().number), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)]),
+  strokeDasharray: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number)]),
+  strokeLinecap: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['square', 'butt', 'round', 'inherit']),
+  shapeRendering: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number)])
+};
+
+/***/ }),
+
 /***/ "./node_modules/@visx/point/esm/Point.js":
 /*!***********************************************!*\
   !*** ./node_modules/@visx/point/esm/Point.js ***!
@@ -29043,7 +29373,8 @@ Area.defaultProps = {
   animated: true,
   showGridRows: false,
   showGridColumns: false,
-  stacked: false
+  stacked: false,
+  className: 'area-class'
 };
 Area.propTypes = {
   animated: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
@@ -29057,7 +29388,7 @@ Area.propTypes = {
       yAccessor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func).isRequired,
       colorAccessor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
     }).isRequired,
-    datapoints: prop_types__WEBPACK_IMPORTED_MODULE_1___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_1___default().object)).isRequired,
+    datapoints: prop_types__WEBPACK_IMPORTED_MODULE_1___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_1___default().any)).isRequired,
     areaProps: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().object)
   })).isRequired,
   xAxis: prop_types__WEBPACK_IMPORTED_MODULE_1___default().shape({
@@ -29087,7 +29418,8 @@ Area.propTypes = {
   onPointerOut: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   onPointerUp: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   onPointerDown: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
-  pointerEventsDataKey: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['all', 'nearest'])
+  pointerEventsDataKey: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['all', 'nearest']),
+  classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
 };
 
 /***/ }),
@@ -29107,6 +29439,8 @@ __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_pattern__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @visx/pattern */ "./node_modules/@visx/pattern/esm/index.js");
+/* harmony import */ var _visx_pattern__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @visx/pattern */ "./node_modules/@visx/pattern/esm/patterns/Lines.js");
 /* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
 /* harmony import */ var _bar_annotation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./bar_annotation */ "./src/chart/bar_annotation.js");
 /* harmony import */ var _chart_container__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./chart_container */ "./src/chart/chart_container.js");
@@ -29118,6 +29452,8 @@ __webpack_require__.r(__webpack_exports__);
 
 
 /*jslint react:true*/
+var _excluded = ["id", "type"],
+  _excluded2 = ["pattern"];
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -29125,12 +29461,15 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+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 _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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-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); }
+
 
 
 
@@ -29193,6 +29532,12 @@ var BarChart = function BarChart(props) {
   var Group = stacked ? BarStack : BarGroup;
   var chartTheme = (0,_use_chart_theme__WEBPACK_IMPORTED_MODULE_8__.useChartTheme)(palette);
   if (!data || !data.length) return null;
+  var barPatterns = data.map(function (_ref, i) {
+    var barProps = _ref.barProps;
+    if (barProps !== null && barProps !== void 0 && barProps.pattern) return _objectSpread({
+      id: "pattern_".concat(i)
+    }, barProps.pattern);
+  }).filter(Boolean);
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(XYChart, {
     theme: chartTheme,
     xScale: config.x,
@@ -29212,15 +29557,34 @@ var BarChart = function BarChart(props) {
     columns: showGridColumns,
     animationTrajectory: animationTrajectory,
     numTicks: numTicks
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Group, null, data.map(function (lineData) {
+  }), barPatterns.map(function (_ref2) {
+    var id = _ref2.id,
+      type = _ref2.type,
+      patternProps = _objectWithoutProperties(_ref2, _excluded);
+    var Pattern = _visx_pattern__WEBPACK_IMPORTED_MODULE_9__[type] || _visx_pattern__WEBPACK_IMPORTED_MODULE_10__["default"];
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Pattern, _extends({
+      key: id,
+      id: id
+    }, patternProps));
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Group, null, data.map(function (_ref3, i) {
+    var name = _ref3.name,
+      datapoints = _ref3.datapoints,
+      accessors = _ref3.accessors,
+      barProps = _ref3.barProps;
+    var _ref4 = barProps || {},
+      pattern = _ref4.pattern,
+      restProps = _objectWithoutProperties(_ref4, _excluded2);
+    var colorAccessor = pattern ? function () {
+      return "url(#pattern_".concat(i, ")");
+    } : accessors.colorAccessor;
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(BarSeries, _extends({
-      key: lineData.name,
-      dataKey: lineData.name,
-      data: lineData.datapoints,
-      xAccessor: lineData.accessors[horizontal ? 'yAccessor' : 'xAccessor'],
-      yAccessor: lineData.accessors[horizontal ? 'xAccessor' : 'yAccessor'],
-      colorAccessor: lineData.accessors.colorAccessor
-    }, lineData.barProps));
+      key: name,
+      dataKey: name,
+      data: datapoints,
+      xAccessor: accessors[horizontal ? 'yAccessor' : 'xAccessor'],
+      yAccessor: accessors[horizontal ? 'xAccessor' : 'yAccessor'],
+      colorAccessor: colorAccessor
+    }, restProps));
   })), !!showAnnotations && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_bar_annotation__WEBPACK_IMPORTED_MODULE_3__.AnnotationGroup, null, data.map(function (lineData) {
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_bar_annotation__WEBPACK_IMPORTED_MODULE_3__.Annotation, {
       key: lineData.name,
@@ -29294,7 +29658,7 @@ Bar.propTypes = {
       yAccessor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func).isRequired,
       colorAccessor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
     }).isRequired,
-    datapoints: prop_types__WEBPACK_IMPORTED_MODULE_1___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_1___default().object)).isRequired,
+    datapoints: prop_types__WEBPACK_IMPORTED_MODULE_1___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_1___default().any)).isRequired,
     barProps: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().object)
   })).isRequired,
   xAxis: prop_types__WEBPACK_IMPORTED_MODULE_1___default().shape({
@@ -29325,7 +29689,8 @@ Bar.propTypes = {
   onPointerOut: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   onPointerUp: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   onPointerDown: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
-  pointerEventsDataKey: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['all', 'nearest'])
+  pointerEventsDataKey: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['all', 'nearest']),
+  classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
 };
 
 /***/ }),
@@ -29615,7 +29980,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   ChartContainer: () => (/* binding */ ChartContainer)
 /* harmony export */ });
-/* harmony import */ var _visx_responsive_lib_components_ParentSize__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @visx/responsive/lib/components/ParentSize */ "./node_modules/@visx/responsive/lib/components/ParentSize.js");
+/* harmony import */ var _visx_responsive_lib_components_ParentSize__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @visx/responsive/lib/components/ParentSize */ "./node_modules/@visx/responsive/lib/components/ParentSize.js");
 /* 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");
@@ -29624,16 +29989,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
 /* 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");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
-/* harmony import */ var _error_boundary__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./error_boundary */ "./src/chart/error_boundary.js");
-/* harmony import */ var _legend__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./legend */ "./src/chart/legend.js");
-/* harmony import */ var _loading__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./loading */ "./src/chart/loading.js");
-/* harmony import */ var _no_data__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./no_data */ "./src/chart/no_data.js");
+/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _error_boundary__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./error_boundary */ "./src/chart/error_boundary.js");
+/* harmony import */ var _legend__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./legend */ "./src/chart/legend.js");
+/* harmony import */ var _loading__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./loading */ "./src/chart/loading.js");
+/* harmony import */ var _no_data__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./no_data */ "./src/chart/no_data.js");
 // LICENSE_CODE ZON
 
 
 /*jslint react:true*/
-var _excluded = ["header", "description", "actions", "data", "palette", "loading", "Chart", "legendItem", "chartProps", "showLegend", "variant", "width", "height"];
+var _excluded = ["header", "description", "actions", "data", "palette", "loading", "Chart", "legendItem", "chartProps", "showLegend", "variant", "width", "height", "classNamePrefix"];
 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 _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; }
@@ -29648,6 +30014,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
 var ChartContainer = function ChartContainer(props) {
   var header = props.header,
     description = props.description,
@@ -29662,6 +30029,7 @@ var ChartContainer = function ChartContainer(props) {
     variant = props.variant,
     _width = props.width,
     _height = props.height,
+    classNamePrefix = props.classNamePrefix,
     rest = _objectWithoutProperties(props, _excluded);
   var outerWidth = _width ? Math.max(410, _width) : undefined;
   var outerHeight = Math.max(176, _height || 0);
@@ -29670,12 +30038,32 @@ var ChartContainer = function ChartContainer(props) {
     $variant: variant,
     $width: outerWidth,
     $height: outerHeight
-  }), !!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, {
+  }), !!header && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(HeaderWrapper, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      header: true
+    })
+  }, /*#__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",
     color: "gray_11_75"
-  }, description)), !!actions && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ActionsWrapper, null, actions), !!loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_loading__WEBPACK_IMPORTED_MODULE_8__.Loading, null), !loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, noData && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_no_data__WEBPACK_IMPORTED_MODULE_9__.NoData, null), !noData && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_error_boundary__WEBPACK_IMPORTED_MODULE_6__.ErrorBoundary, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(SvgWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_visx_responsive_lib_components_ParentSize__WEBPACK_IMPORTED_MODULE_10__["default"], null, function (_ref) {
+  }, description)), !!actions && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ActionsWrapper, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      actions: true
+    })
+  }, actions), !!loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_loading__WEBPACK_IMPORTED_MODULE_9__.Loading, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      loader: true
+    })
+  }), !loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, noData && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_no_data__WEBPACK_IMPORTED_MODULE_10__.NoData, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      placeholder: true
+    })
+  }), !noData && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_error_boundary__WEBPACK_IMPORTED_MODULE_7__.ErrorBoundary, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(SvgWrapper, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      container: true
+    })
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_visx_responsive_lib_components_ParentSize__WEBPACK_IMPORTED_MODULE_11__["default"], null, function (_ref) {
     var width = _ref.width,
       height = _ref.height;
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Chart, _extends({}, chartProps, {
@@ -29684,7 +30072,10 @@ var ChartContainer = function ChartContainer(props) {
       width: width,
       height: height
     }));
-  })), !!showLegend && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_legend__WEBPACK_IMPORTED_MODULE_7__.Legend, {
+  })), !!showLegend && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_legend__WEBPACK_IMPORTED_MODULE_8__.Legend, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      legend: true
+    }),
     data: data,
     palette: palette,
     item: legendItem
@@ -29711,9 +30102,9 @@ var ChartContainerWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___defau
   displayName: "ChartContainerWrapper",
   componentId: "sc-13xkdxv-0"
 })(["display:flex;flex-direction:column;", " height:", ";", ""], function (props) {
-  return props.$width ? "width: ".concat((0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(props.$width), ";") : undefined;
+  return props.$width ? "width: ".concat((0,_utils__WEBPACK_IMPORTED_MODULE_6__.toPixel)(props.$width), ";") : undefined;
 }, function (props) {
-  return (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(props.$height);
+  return (0,_utils__WEBPACK_IMPORTED_MODULE_6__.toPixel)(props.$height);
 }, function (props) {
   if (props.$variant != 'ghost') {
     return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["padding:", ";border-radius:8px;border:1px solid ", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing['06'], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_5);
@@ -30116,7 +30507,8 @@ var Legend = function Legend(props) {
   var data = props.data,
     palette = props.palette,
     _props$item = props.item,
-    item = _props$item === void 0 ? DefaultItem : _props$item;
+    item = _props$item === void 0 ? DefaultItem : _props$item,
+    className = props.className;
   if (!data || !data.length) return null;
   var ordinalColorScale = (0,_visx_scale__WEBPACK_IMPORTED_MODULE_8__["default"])({
     domain: data.map(function (d) {
@@ -30124,7 +30516,9 @@ var Legend = function Legend(props) {
     }),
     range: palette
   });
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LegendWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_legend__WEBPACK_IMPORTED_MODULE_9__["default"], {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LegendWrapper, {
+    className: className
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_legend__WEBPACK_IMPORTED_MODULE_9__["default"], {
     scale: ordinalColorScale
   }, function (labels) {
     return labels.map(function (label, i) {
@@ -30374,7 +30768,8 @@ Line.propTypes = {
   onPointerOut: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   onPointerUp: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   onPointerDown: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
-  pointerEventsDataKey: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['all', 'nearest'])
+  pointerEventsDataKey: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['all', 'nearest']),
+  classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
 };
 
 /***/ }),
@@ -40627,12 +41022,16 @@ var RowMenuCell = function RowMenuCell(_ref) {
       return item && !item.hidden && item.key;
     });
   }, [rowActions, column, row]);
+  var popoverProps = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
+    return {
+      allActions: allActions,
+      row: row,
+      portalTarget: document.body
+    };
+  }, [allActions, row]);
   if (!allActions.length) return null;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(RowMenuCellPopover, {
-    popoverProps: {
-      allActions: allActions,
-      row: row
-    }
+    popoverProps: popoverProps
   });
 };
 RowMenuCell.displayName = 'RowMenuCell';