@luminati-io/uikit 1.7.29 → 1.7.31

package/dist/uikit.umd.js

@@ -8546,6 +8546,161 @@ function valueOrIdentityString(_) {
 
 /***/ }),
 
+/***/ "./node_modules/@visx/pattern/esm/constants/index.js":
+/*!***********************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/constants/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 */   "PatternOrientation": () => (/* binding */ PatternOrientation)
+/* harmony export */ });
+var PatternOrientation = {
+  horizontal: 'horizontal',
+  vertical: 'vertical',
+  diagonal: 'diagonal',
+  diagonalRightToLeft: 'diagonalRightToLeft'
+};
+
+/***/ }),
+
+/***/ "./node_modules/@visx/pattern/esm/patterns/Lines.js":
+/*!**********************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/patterns/Lines.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 */ Lines),
+/* harmony export */   "pathForOrientation": () => (/* binding */ pathForOrientation)
+/* 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_4__ = __webpack_require__(/*! ./Pattern */ "./node_modules/@visx/pattern/esm/patterns/Pattern.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../constants */ "./node_modules/@visx/pattern/esm/constants/index.js");
+
+
+
+
+
+function pathForOrientation(_ref) {
+  var height = _ref.height,
+    orientation = _ref.orientation;
+  switch (orientation) {
+    case _constants__WEBPACK_IMPORTED_MODULE_3__.PatternOrientation.horizontal:
+      return "M 0," + height / 2 + " l " + height + ",0";
+    case _constants__WEBPACK_IMPORTED_MODULE_3__.PatternOrientation.diagonal:
+      return "M 0," + height + " l " + height + "," + -height + " M " + -height / 4 + "," + height / 4 + " l " + height / 2 + "," + -height / 2 + "\n             M " + 3 / 4 * height + "," + 5 / 4 * height + " l " + height / 2 + "," + -height / 2;
+    case _constants__WEBPACK_IMPORTED_MODULE_3__.PatternOrientation.diagonalRightToLeft:
+      return "M 0,0 l " + height + "," + height + "\n        M " + -height / 4 + "," + 3 / 4 * height + " l " + height / 2 + "," + height / 2 + "\n        M " + 3 / 4 * height + "," + -height / 4 + " l " + height / 2 + "," + height / 2;
+    case _constants__WEBPACK_IMPORTED_MODULE_3__.PatternOrientation.vertical:
+    default:
+      return "M " + height / 2 + ", 0 l 0, " + height;
+  }
+}
+function Lines(_ref2) {
+  var id = _ref2.id,
+    width = _ref2.width,
+    height = _ref2.height,
+    stroke = _ref2.stroke,
+    strokeWidth = _ref2.strokeWidth,
+    strokeDasharray = _ref2.strokeDasharray,
+    _ref2$strokeLinecap = _ref2.strokeLinecap,
+    strokeLinecap = _ref2$strokeLinecap === void 0 ? 'square' : _ref2$strokeLinecap,
+    _ref2$shapeRendering = _ref2.shapeRendering,
+    shapeRendering = _ref2$shapeRendering === void 0 ? 'auto' : _ref2$shapeRendering,
+    _ref2$orientation = _ref2.orientation,
+    orientation = _ref2$orientation === void 0 ? ['vertical'] : _ref2$orientation,
+    background = _ref2.background,
+    className = _ref2.className;
+  var orientations = Array.isArray(orientation) ? orientation : [orientation];
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_Pattern__WEBPACK_IMPORTED_MODULE_4__["default"], {
+    id: id,
+    width: width,
+    height: height
+  }, !!background && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("rect", {
+    className: classnames__WEBPACK_IMPORTED_MODULE_2___default()('visx-pattern-line-background'),
+    width: width,
+    height: height,
+    fill: background
+  }), orientations.map(function (o, i) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("path", {
+      key: "visx-" + id + "-line-" + o + "-" + i,
+      className: classnames__WEBPACK_IMPORTED_MODULE_2___default()('visx-pattern-line', className),
+      d: pathForOrientation({
+        orientation: o,
+        height: height
+      }),
+      stroke: stroke,
+      strokeWidth: strokeWidth,
+      strokeDasharray: strokeDasharray,
+      strokeLinecap: strokeLinecap,
+      shapeRendering: shapeRendering
+    });
+  }));
+}
+Lines.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),
+  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)]),
+  orientation: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().array)
+};
+
+/***/ }),
+
+/***/ "./node_modules/@visx/pattern/esm/patterns/Pattern.js":
+/*!************************************************************!*\
+  !*** ./node_modules/@visx/pattern/esm/patterns/Pattern.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 */ Pattern)
+/* 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__);
+
+
+function Pattern(_ref) {
+  var id = _ref.id,
+    width = _ref.width,
+    height = _ref.height,
+    children = _ref.children;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("defs", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("pattern", {
+    id: id,
+    width: width,
+    height: height,
+    patternUnits: "userSpaceOnUse"
+  }, children));
+}
+Pattern.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),
+  children: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node.isRequired)
+};
+
+/***/ }),
+
 /***/ "./node_modules/@visx/point/esm/Point.js":
 /*!***********************************************!*\
   !*** ./node_modules/@visx/point/esm/Point.js ***!
@@ -18804,10 +18959,9 @@ __webpack_require__.r(__webpack_exports__);
 /* 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");
+/* harmony import */ var _get_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./get_components */ "./src/chart/get_components.js");
+/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./tooltip */ "./src/chart/tooltip.js");
+/* harmony import */ var _use_chart_theme__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./use_chart_theme */ "./src/chart/use_chart_theme.js");
 // LICENSE_CODE ZON
 
 
@@ -18822,7 +18976,6 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 
 
-
 var animationTrajectory = 'outside';
 var BarChart = function BarChart(props) {
   var animated = props.animated,
@@ -18842,7 +18995,7 @@ var BarChart = function BarChart(props) {
     height = props.height,
     margin = props.margin,
     orientation = props.orientation;
-  var _getAnimatedOrUnanima = (0,_get_components__WEBPACK_IMPORTED_MODULE_4__.getAnimatedOrUnanimatedComponents)(animated),
+  var _getAnimatedOrUnanima = (0,_get_components__WEBPACK_IMPORTED_MODULE_3__.getAnimatedOrUnanimatedComponents)(animated),
     XYChart = _getAnimatedOrUnanima.XYChart,
     Grid = _getAnimatedOrUnanima.Grid,
     Axis = _getAnimatedOrUnanima.Axis,
@@ -18863,7 +19016,7 @@ var BarChart = function BarChart(props) {
       }
     };
   }, [orientation]);
-  var chartTheme = (0,_use_chart_theme__WEBPACK_IMPORTED_MODULE_6__["default"])(palette);
+  var chartTheme = (0,_use_chart_theme__WEBPACK_IMPORTED_MODULE_5__["default"])(palette);
   if (!data || !data.length) return null;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(XYChart, {
     theme: chartTheme,
@@ -18880,13 +19033,14 @@ var BarChart = function BarChart(props) {
     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, {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(BarSeries, _extends({
       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)
-    });
+      xAccessor: lineData.accessors[orientation == 'vertical' ? 'xAccessor' : 'yAccessor'],
+      yAccessor: lineData.accessors[orientation == 'vertical' ? 'yAccessor' : 'xAccessor'],
+      colorAccessor: lineData.accessors.colorAccessor
+    }, lineData.barProps));
   })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Axis, {
     key: "x-axis-".concat(animationTrajectory, "-").concat(orientation),
     label: xAxisLabel,
@@ -18911,7 +19065,7 @@ var BarChart = function BarChart(props) {
     unstyled: true,
     applyPositionStyle: true,
     renderTooltip: function renderTooltip(params) {
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_5__["default"], _extends({
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_4__["default"], _extends({
         data: data,
         xTickFormat: xTickFormat,
         yTickFormat: yTickFormat,
@@ -18971,10 +19125,12 @@ Bar.propTypes = {
   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
+      xAccessor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func.isRequired),
+      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().object)).isRequired,
+    barProps: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().object)
   })).isRequired,
   xAxisLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
   yAxisLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
@@ -19061,7 +19217,7 @@ var ChartContainer = function ChartContainer(props) {
   }, header), !!description && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, {
     variant: "sm",
     color: "gray_11_75"
-  }, description)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ChartWrapper, null, !!actions && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("div", null, actions), !!loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_loading__WEBPACK_IMPORTED_MODULE_8__["default"], 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__["default"], null), !noData && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_error_boundary__WEBPACK_IMPORTED_MODULE_6__["default"], 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, null, actions), !!loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_loading__WEBPACK_IMPORTED_MODULE_8__["default"], 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__["default"], null), !noData && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_error_boundary__WEBPACK_IMPORTED_MODULE_6__["default"], 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) {
     var width = _ref.width,
       height = _ref.height;
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Chart, _extends({}, chartProps, {
@@ -19073,7 +19229,7 @@ var ChartContainer = function ChartContainer(props) {
   })), !hideLegend && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_legend__WEBPACK_IMPORTED_MODULE_7__["default"], {
     data: data,
     palette: palette
-  })))));
+  }))));
 };
 ChartContainer.displayName = 'ChartContainer';
 ChartContainer.defaultProps = {
@@ -19094,7 +19250,7 @@ ChartContainer.propTypes = {
 var ChartContainerWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "ChartContainerWrapper",
   componentId: "sc-13xkdxv-0"
-})(["display:flex;flex-direction:column;gap:", ";", " height:", ";", ""], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["06"], function (props) {
+})(["display:flex;flex-direction:column;", " height:", ";", ""], function (props) {
   return props.width ? "width: ".concat((0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(props.width), ";") : undefined;
 }, function (props) {
   return (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(props.height);
@@ -19107,10 +19263,10 @@ var HeaderWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div
   displayName: "HeaderWrapper",
   componentId: "sc-13xkdxv-1"
 })(["display:flex;flex-direction:column;gap:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["03"]);
-var ChartWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
-  displayName: "ChartWrapper",
+var ActionsWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
+  displayName: "ActionsWrapper",
   componentId: "sc-13xkdxv-2"
-})(["flex-grow:1;display:flex;flex-direction:column;gap:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["05"]);
+})(["padding-top:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["06"]);
 var SvgWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "SvgWrapper",
   componentId: "sc-13xkdxv-3"
@@ -19119,30 +19275,6 @@ var SvgWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.wi
 
 /***/ }),
 
-/***/ "./src/chart/data_util.js":
-/*!********************************!*\
-  !*** ./src/chart/data_util.js ***!
-  \********************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "getAccessor": () => (/* binding */ getAccessor)
-/* harmony export */ });
-// LICENSE_CODE ZON
-
-
-/*jslint react:true*/
-// data accessors
-var getAccessor = function getAccessor(accessor) {
-  return typeof accessor == 'function' ? accessor : function (d) {
-    return d[accessor];
-  };
-};
-
-/***/ }),
-
 /***/ "./src/chart/error_boundary.js":
 /*!*************************************!*\
   !*** ./src/chart/error_boundary.js ***!
@@ -19300,6 +19432,49 @@ var getAnimatedOrUnanimatedComponents = function getAnimatedOrUnanimatedComponen
 
 /***/ }),
 
+/***/ "./src/chart/glyph.js":
+/*!****************************!*\
+  !*** ./src/chart/glyph.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_pattern__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @visx/pattern */ "./node_modules/@visx/pattern/esm/patterns/Lines.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 Glyph = function Glyph(props) {
+  var _props$glyphSize = props.glyphSize,
+    glyphSize = _props$glyphSize === void 0 ? 10 : _props$glyphSize,
+    fill = props.fill,
+    pattern = props.pattern;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("svg", {
+    width: glyphSize,
+    height: glyphSize
+  }, !!pattern && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_pattern__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({
+    id: "pattern"
+  }, pattern)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("rect", {
+    fill: pattern ? "url(#pattern)" : fill,
+    stroke: fill,
+    width: glyphSize,
+    height: glyphSize
+  }));
+};
+Glyph.displayName = 'Glyph';
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Glyph);
+
+/***/ }),
+
 /***/ "./src/chart/index.js":
 /*!****************************!*\
   !*** ./src/chart/index.js ***!
@@ -19337,16 +19512,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var _visx_legend__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @visx/legend */ "./node_modules/@visx/legend/esm/legends/Ordinal.js");
-/* harmony import */ var _visx_legend__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @visx/legend */ "./node_modules/@visx/legend/esm/legends/Legend/LegendItem.js");
-/* harmony import */ var _visx_legend__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @visx/legend */ "./node_modules/@visx/legend/esm/legends/Legend/LegendLabel.js");
-/* harmony import */ var _visx_scale__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @visx/scale */ "./node_modules/@visx/scale/esm/scales/ordinal.js");
+/* harmony import */ var _visx_legend__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @visx/legend */ "./node_modules/@visx/legend/esm/legends/Ordinal.js");
+/* harmony import */ var _visx_legend__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @visx/legend */ "./node_modules/@visx/legend/esm/legends/Legend/LegendItem.js");
+/* harmony import */ var _visx_legend__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @visx/legend */ "./node_modules/@visx/legend/esm/legends/Legend/LegendLabel.js");
+/* harmony import */ var _visx_scale__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @visx/scale */ "./node_modules/@visx/scale/esm/scales/ordinal.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 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 _theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
 /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
+/* harmony import */ var _glyph__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./glyph */ "./src/chart/glyph.js");
 // LICENSE_CODE ZON
 
 
@@ -19358,57 +19534,53 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 
 
+
 var Legend = function Legend(props) {
   var data = props.data,
     palette = props.palette;
   if (!data || !data.length) return null;
-  var ordinalColorScale = (0,_visx_scale__WEBPACK_IMPORTED_MODULE_4__["default"])({
+  var ordinalColorScale = (0,_visx_scale__WEBPACK_IMPORTED_MODULE_5__["default"])({
     domain: data.map(function (d) {
       return d.name;
     }),
     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_5__["default"], {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LegendWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_legend__WEBPACK_IMPORTED_MODULE_6__["default"], {
     scale: ordinalColorScale
   }, function (labels) {
     return labels.map(function (label, i) {
       return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LegendItemWrapper, _extends({
-        key: "legend-".concat(i)
+        key: "legend-".concat(i),
+        data: data
       }, label));
     });
   }));
 };
-Legend.displayName = 'Legend';
 var LegendWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
   displayName: "LegendWrapper",
   componentId: "sc-1hxjoxt-0"
 })(["display:flex;flex-wrap:wrap;column-gap:", ";row-gap:", ";"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].spacing["06"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].spacing["04"]);
 var LegendItemWrapper = function LegendItemWrapper(props) {
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_legend__WEBPACK_IMPORTED_MODULE_6__["default"], null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LegendSymbol, {
-    fill: props.value
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_legend__WEBPACK_IMPORTED_MODULE_7__["default"], {
+  var _accessors$colorAcces;
+  var data = props.data,
+    datum = props.datum,
+    index = props.index,
+    text = props.text,
+    value = props.value;
+  var _ref = data[index] || {},
+    accessors = _ref.accessors,
+    legendGlyphProps = _ref.legendGlyphProps;
+  var fill = (accessors === null || accessors === void 0 ? void 0 : (_accessors$colorAcces = accessors.colorAccessor) === null || _accessors$colorAcces === void 0 ? void 0 : _accessors$colorAcces.call(accessors, datum)) || value;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_legend__WEBPACK_IMPORTED_MODULE_7__["default"], null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_glyph__WEBPACK_IMPORTED_MODULE_4__["default"], _extends({
+    fill: fill
+  }, legendGlyphProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_visx_legend__WEBPACK_IMPORTED_MODULE_8__["default"], {
     align: "left",
     margin: "0 0 0 ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].spacing["03"])
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_3__.Label, {
     variant: "sm",
     color: "gray_11"
-  }, props.text)));
-};
-LegendItemWrapper.displayName = 'LegendItemWrapper';
-var LegendSymbol = function LegendSymbol(props) {
-  var _props$glyphSize = props.glyphSize,
-    glyphSize = _props$glyphSize === void 0 ? 10 : _props$glyphSize,
-    fill = props.fill;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("svg", {
-    width: glyphSize,
-    height: glyphSize
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("rect", {
-    fill: fill,
-    width: glyphSize,
-    height: glyphSize
-  }));
+  }, text)));
 };
-LegendSymbol.displayName = 'LegendSymbol';
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Legend);
 
 /***/ }),
@@ -19428,12 +19600,11 @@ __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_curve__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @visx/curve */ "./node_modules/d3-shape/src/curve/cardinal.js");
+/* harmony import */ var _visx_curve__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @visx/curve */ "./node_modules/d3-shape/src/curve/cardinal.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");
+/* harmony import */ var _get_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./get_components */ "./src/chart/get_components.js");
+/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./tooltip */ "./src/chart/tooltip.js");
+/* harmony import */ var _use_chart_theme__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./use_chart_theme */ "./src/chart/use_chart_theme.js");
 // LICENSE_CODE ZON
 
 
@@ -19449,7 +19620,6 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 
 
-
 var animationTrajectory = 'outside';
 var config = {
   x: {
@@ -19476,13 +19646,13 @@ var LineChart = function LineChart(props) {
     width = props.width,
     height = props.height,
     margin = props.margin;
-  var _getAnimatedOrUnanima = (0,_get_components__WEBPACK_IMPORTED_MODULE_4__.getAnimatedOrUnanimatedComponents)(animated),
+  var _getAnimatedOrUnanima = (0,_get_components__WEBPACK_IMPORTED_MODULE_3__.getAnimatedOrUnanimatedComponents)(animated),
     XYChart = _getAnimatedOrUnanima.XYChart,
     Grid = _getAnimatedOrUnanima.Grid,
     Axis = _getAnimatedOrUnanima.Axis,
     LineSeries = _getAnimatedOrUnanima.LineSeries,
     Tooltip = _getAnimatedOrUnanima.Tooltip;
-  var chartTheme = (0,_use_chart_theme__WEBPACK_IMPORTED_MODULE_6__["default"])(palette);
+  var chartTheme = (0,_use_chart_theme__WEBPACK_IMPORTED_MODULE_5__["default"])(palette);
   if (!data || !data.length) return null;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(XYChart, {
     theme: chartTheme,
@@ -19499,14 +19669,12 @@ var LineChart = function LineChart(props) {
     animationTrajectory: animationTrajectory,
     numTicks: numberOfTicks
   }), data.map(function (lineData) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LineSeries, {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LineSeries, _extends({
       key: lineData.name,
       dataKey: lineData.name,
       data: lineData.datapoints,
-      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"]
-    });
+      curve: _visx_curve__WEBPACK_IMPORTED_MODULE_6__["default"]
+    }, lineData.accessors, lineData.lineProps));
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Axis, {
     key: "x-axis-".concat(animationTrajectory),
     label: xAxisLabel,
@@ -19531,7 +19699,7 @@ 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_5__["default"], _extends({
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_4__["default"], _extends({
         shared: true,
         data: data,
         xTickFormat: xTickFormat,
@@ -19589,10 +19757,13 @@ Line.propTypes = {
   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
+      xAccessor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func.isRequired),
+      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,
+    lineProps: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().object),
+    legendGlyphProps: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().object)
   })).isRequired,
   xAxisLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
   yAxisLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
@@ -19719,11 +19890,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
 /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
-/* harmony import */ var _data_util__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./data_util */ "./src/chart/data_util.js");
+/* harmony import */ var _glyph__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./glyph */ "./src/chart/glyph.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); }
 
 
 
@@ -19751,10 +19923,10 @@ var Tooltip = function Tooltip(props) {
   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) {
-    return datum && xTickFormat((0,_data_util__WEBPACK_IMPORTED_MODULE_4__.getAccessor)(dataByKey[key].accessors.x)(datum));
+    return datum && xTickFormat(dataByKey[key].accessors.xAccessor(datum));
   };
   var getY = function getY(key, datum) {
-    return datum && valueFormat((0,_data_util__WEBPACK_IMPORTED_MODULE_4__.getAccessor)(dataByKey[key].accessors.y)(datum));
+    return datum && valueFormat(dataByKey[key].accessors.yAccessor(datum));
   };
   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",
@@ -19762,27 +19934,29 @@ var Tooltip = function Tooltip(props) {
   }, "".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;
+    var _datumByKey$name, _accessors$colorAcces;
     var value = getY(name, (_datumByKey$name = datumByKey[name]) === null || _datumByKey$name === void 0 ? void 0 : _datumByKey$name.datum);
+    var _ref2 = dataByKey[name] || {},
+      accessors = _ref2.accessors,
+      legendGlyphProps = _ref2.legendGlyphProps;
+    var fill = (accessors === null || accessors === void 0 ? void 0 : (_accessors$colorAcces = accessors.colorAccessor) === null || _accessors$colorAcces === void 0 ? void 0 : _accessors$colorAcces.call(accessors, name)) || (colorScale === null || colorScale === void 0 ? void 0 : colorScale(name));
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TooltipItem, {
       key: name
-    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Legend, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Glyph, {
-      color: colorScale === null || colorScale === void 0 ? void 0 : colorScale(name)
-    }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_3__.Label, {
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Legend, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_glyph__WEBPACK_IMPORTED_MODULE_4__["default"], _extends({
+      fill: fill
+    }, legendGlyphProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_3__.Label, {
       variant: "sm",
-      color: "gray_11",
-      underline: (nearestDatum === null || nearestDatum === void 0 ? void 0 : nearestDatum.key) == name
+      color: "gray_11"
     }, name)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_3__.Label, {
       variant: "sm",
       color: "gray_11_25"
     }, value));
   })));
 };
-Tooltip.displayName = 'Tooltip';
 var TooltipWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
   displayName: "TooltipWrapper",
   componentId: "sc-a1je6y-0"
-})(["display:flex;flex-direction:column;padding-bottom:8px;gap:8px;border-radius:4px;background-color:", ";border:1px solid ", ";box-shadow:0px 0px 2px rgba(0,0,0,0.08),0px 8px 24px rgba(0,0,0,0.08);"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_4);
+})(["display:flex;flex-direction:column;padding-bottom:8px;gap:8px;border-radius:4px;background-color:", ";border:1px solid ", ";box-shadow:0 0 2px rgba(0,0,0,0.08),0 8px 24px rgba(0,0,0,0.08);"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_4);
 var TooltipHeader = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
   displayName: "TooltipHeader",
   componentId: "sc-a1je6y-1"
@@ -19799,12 +19973,6 @@ var Legend = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withCo
   displayName: "Legend",
   componentId: "sc-a1je6y-4"
 })(["display:flex;gap:8px;"]);
-var Glyph = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
-  displayName: "Glyph",
-  componentId: "sc-a1je6y-5"
-})(["width:10px;height:10px;border-radius:1px;background-color:", ";"], function (props) {
-  return props.color;
-});
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Tooltip);
 
 /***/ }),
@@ -21005,7 +21173,7 @@ var StyledIconButton = styled_components__WEBPACK_IMPORTED_MODULE_1___default().
   displayName: "StyledIconButton",
   componentId: "sc-114c1w5-0"
 })(["display:flex;align-items:center;justify-content:center;border-radius:4px;padding:0;cursor:pointer;", " ", ""], function (props) {
-  return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["", " &:hover:not(:disabled){background-color:", ";border:", ";[data-icon]{color:", ";}}&:active:not(:disabled){background-color:", ";border:", ";[data-icon]{color:", ";}}&:disabled{border:", ";cursor:not-allowed;[data-icon]{color:", ";}}"], props.active ? "\n        background-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4, ";\n        border: ").concat(props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4), ";\n        [data-icon] {\n          color: ").concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_11, ";\n        }\n      ") : "\n        background-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.white, ";\n        border: ").concat(props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_6), ";\n        [data-icon] {\n          color: ").concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_9, ";\n        }\n      "), props.variant == 'ghost' ? _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.white : _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_2, props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_8), props.variant == 'ghost' ? _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_11 : _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_9, props.variant == 'ghost' ? _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.white : _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4, props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4), _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_11, props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_7), _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_7);
+  return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["", " &:hover:not(:disabled){background-color:", ";border:", ";[data-icon]{color:", ";}}&:active:not(:disabled){background-color:", ";border:", ";[data-icon]{color:", ";}}&:disabled{border:", ";cursor:not-allowed;[data-icon]{color:", ";}}"], props.active ? "\n        background-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4, ";\n        border: ").concat(props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4), ";\n        [data-icon] {\n          color: ").concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_11, ";\n        }\n      ") : "\n        background-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.white, ";\n        border: ").concat(props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_6), ";\n        [data-icon] {\n          color: ").concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_9, ";\n        }\n      "), props.variant == 'ghost' ? _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.white : _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_3, props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_8), _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_11_25, props.variant == 'ghost' ? _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.white : _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4, props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_4), _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.blue_11, props.variant == 'icon' || props.variant == 'ghost' ? '0 none;' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_7), _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_7);
 }, function (props) {
   return (0,_utils__WEBPACK_IMPORTED_MODULE_3__.toSize)(props.variant == 'icon' || props.variant == 'ghost' ? 24 : 36);
 });
@@ -23655,19 +23823,24 @@ var General = function General(props) {
     onCancel = props.onCancel,
     okLabel = props.okLabel,
     cancelLabel = props.cancelLabel,
+    okDisabled = props.okDisabled,
+    cancelDisabled = props.cancelDisabled,
     size = props.size,
     shadow = props.shadow;
   var renderFooter = onOk || onCancel;
   var header = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_util__WEBPACK_IMPORTED_MODULE_2__.ModalHeader, {
     title: title,
     subtitle: subtitle,
-    onCancel: onCancel
+    onCancel: onCancel,
+    cancelDisabled: cancelDisabled
   });
   var footer = renderFooter ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_util__WEBPACK_IMPORTED_MODULE_2__.ModalFooter, {
     onOk: onOk,
     onCancel: onCancel,
     okLabel: okLabel,
-    cancelLabel: cancelLabel
+    cancelLabel: cancelLabel,
+    okDisabled: okDisabled,
+    cancelDisabled: cancelDisabled
   }) : null;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_base__WEBPACK_IMPORTED_MODULE_3__["default"], {
     id: id,
@@ -23688,6 +23861,8 @@ General.propTypes = {
   onCancel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   okLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
   cancelLabel: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
+  okDisabled: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
+  cancelDisabled: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
   size: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['sm', 'md', 'lg']),
   shadow: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOf(['none', 'sm', 'md', 'lg'])
 };
@@ -23764,14 +23939,15 @@ var ModalButton = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_butt
 var ModalHeader = function ModalHeader(props) {
   var title = props.title,
     subtitle = props.subtitle,
-    onCancel = props.onCancel;
+    onCancel = props.onCancel,
+    cancelDisabled = props.cancelDisabled;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_5__.Flex, {
     align_items: "center",
     justify_content: "space-between",
     width: "100%"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ModalTitle, {
     text: title
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CloseButton, {
+  }), !cancelDisabled && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CloseButton, {
     onClick: onCancel
   })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Subtitle, null, subtitle));
 };
@@ -23788,25 +23964,33 @@ var ModalFooter = function ModalFooter(props) {
   var okLabel = props.okLabel,
     cancelLabel = props.cancelLabel,
     onOk = props.onOk,
-    onCancel = props.onCancel;
+    onCancel = props.onCancel,
+    okDisabled = props.okDisabled,
+    cancelDisabled = props.cancelDisabled;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_5__.Flex, {
     width: "100%",
     justify_content: "flex-end"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ButtonsGroup, null, onCancel && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ModalButton, {
     text: cancelLabel,
     variant: "secondary",
-    onClick: onCancel
+    onClick: onCancel,
+    disabled: cancelDisabled,
+    "data-testid": "modal_footer_cancel_button"
   }), onOk && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(ModalButton, {
     text: okLabel,
     variant: "primary",
-    onClick: onOk
+    onClick: onOk,
+    disabled: okDisabled,
+    "data-testid": "modal_footer_ok_button"
   })));
 };
 ModalFooter.propTypes = {
   okLabel: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   cancelLabel: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   onOk: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),
-  onCancel: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func)
+  onCancel: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),
+  okDisabled: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
+  cancelDisabled: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool)
 };
 ModalFooter.defaultProps = {
   okLabel: 'OK',