@luminati-io/uikit 1.7.28 → 1.7.30

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);
 });
@@ -22027,9 +22195,13 @@ __webpack_require__.r(__webpack_exports__);
 
 
 /*jslint react:true*/
-var _excluded = ["value", "onChange", "disabled", "options", "variant", "size", "label", "labelIcon", "helperText", "invalid", "required"],
-  _excluded2 = ["value", "checked", "onClick", "label", "disabled", "size", "tooltip", "verticalAlign"];
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["className", "classNamePrefix", "value", "onChange", "disabled", "options", "variant", "size", "label", "labelIcon", "helperText", "invalid", "required"],
+  _excluded2 = ["classNamePrefix", "value", "checked", "onClick", "label", "disabled", "size", "tooltip", "verticalAlign"];
 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 _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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 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; }
 
@@ -22043,7 +22215,9 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 var RadioGroup = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(function (props, ref) {
-  var value = props.value,
+  var className = props.className,
+    classNamePrefix = props.classNamePrefix,
+    value = props.value,
     onChange = props.onChange,
     disabled = props.disabled,
     options = props.options,
@@ -22061,9 +22235,13 @@ var RadioGroup = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwa
   };
   if (!(options !== null && options !== void 0 && options.length)) return null;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_4__.Flex, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, {
+      container: true
+    }, className),
     flex_direction: "column",
     gap: _theme__WEBPACK_IMPORTED_MODULE_5__["default"].spacing["03"]
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_shared__WEBPACK_IMPORTED_MODULE_9__.InputLabel, {
+    classNamePrefix: classNamePrefix,
     id: labelId,
     label: label,
     labelIcon: labelIcon,
@@ -22071,13 +22249,18 @@ var RadioGroup = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwa
     variant: "lg"
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_layout__WEBPACK_IMPORTED_MODULE_4__.Flex, _extends({
     ref: ref,
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, _defineProperty({
+      radioGroup: true
+    }, "radioGroup--".concat(variant), true)),
     gap: _theme__WEBPACK_IMPORTED_MODULE_5__["default"].spacing["05"],
     flex_direction: variant
   }, rest, {
     role: "radiogroup",
     "aria-labelledby": label ? labelId : undefined
   }), options.map(function (opt) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Radio, _extends({}, opt, {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Radio, _extends({
+      classNamePrefix: classNamePrefix
+    }, opt, {
       key: opt.value,
       onClick: function onClick(val, evt) {
         return handleChange(val, opt, evt);
@@ -22106,14 +22289,17 @@ RadioGroup.propTypes = {
     value: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().any),
     label: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().string), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func)]),
     disabled: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool)
-  }))
+  })),
+  classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)
 };
 RadioGroup.defaultProps = {
   variant: 'row',
   size: 'sm'
 };
 var Radio = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(function (props, ref) {
-  var value = props.value,
+  var _classNames2;
+  var classNamePrefix = props.classNamePrefix,
+    value = props.value,
     checked = props.checked,
     onClick = props.onClick,
     label = props.label,
@@ -22129,12 +22315,18 @@ var Radio = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_6__["default"], {
     tooltip: tooltip
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(RadioWrapper, _extends({
-    ref: ref
+    ref: ref,
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, (_classNames2 = {
+      radio: true
+    }, _defineProperty(_classNames2, 'radio--is-selected', checked), _defineProperty(_classNames2, 'radio--is-disabled', disabled), _classNames2))
   }, rest, {
     onClick: handleClick,
     verticalAlign: verticalAlign,
     disabled: disabled
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(RadioControl, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, {
+      radioControl: true
+    }),
     role: "radio",
     "aria-checked": !!checked,
     "aria-labelledby": label ? labelId : undefined,
@@ -22143,6 +22335,9 @@ var Radio = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef
     checked: checked,
     disabled: disabled
   }), !!label && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_7__.Label, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, {
+      radioLabel: true
+    }),
     variant: "sm",
     id: labelId,
     color: disabled ? 'gray_9' : 'gray_11_50'
@@ -22246,6 +22441,10 @@ __webpack_require__.r(__webpack_exports__);
 
 
 /*jslint react:true*/
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 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 _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."); }
@@ -22379,18 +22578,30 @@ var Field = styled_components__WEBPACK_IMPORTED_MODULE_2___default().input.withC
   componentId: "sc-r60v1b-0"
 })(["padding:0;outline:none;border:0;flex-grow:1;background:inherit;font-family:", ";font-style:normal;font-weight:", ";font-size:", ";line-height:", ";color:", ";::placeholder{color:", ";}"], _theme__WEBPACK_IMPORTED_MODULE_6__["default"].font_family.sans, _theme__WEBPACK_IMPORTED_MODULE_6__["default"].font_weight.regular, _theme__WEBPACK_IMPORTED_MODULE_6__["default"].font_size.sm, _theme__WEBPACK_IMPORTED_MODULE_6__["default"].line_height.none, _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_6__["default"].color.gray_8);
 var InputLabel = function InputLabel(props) {
-  var id = props.id,
+  var className = props.className,
+    classNamePrefix = props.classNamePrefix,
+    id = props.id,
     label = props.label,
     labelIcon = props.labelIcon,
     required = props.required,
     variant = props.variant;
   var t = (0,_translation__WEBPACK_IMPORTED_MODULE_7__.useTranslation)();
   if (!label) return null;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(LabelWrapper, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_8__.Label, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(LabelWrapper, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_9__.classNames)(classNamePrefix, {
+      label: true
+    }, className)
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_8__.Label, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_9__.classNames)(classNamePrefix, _defineProperty({
+      labelText: true
+    }, 'labelText--is-required', required)),
     id: id,
     variant: variant,
     color: "gray-11-50"
   }, t(label), required && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(RequiredAsterisk, null)), labelIcon && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_4__["default"], {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_9__.classNames)(classNamePrefix, {
+      labelIcon: true
+    }),
     name: labelIcon,
     size: "xs",
     color: "gray_9"
@@ -24058,8 +24269,8 @@ __webpack_require__.r(__webpack_exports__);
 /* 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 _table_row__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./table_row */ "./src/table/table_row.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./util */ "./src/table/util.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _table_row__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./table_row */ "./src/table/table_row.js");
 // LICENSE_CODE ZON
 
 
@@ -24106,7 +24317,7 @@ var Cell = function Cell(props) {
     }
   } : undefined);
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(StyledCell, _extends({
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
       cell: true
     }, className)
   }, cellProps), props.render('Cell', {
@@ -24122,7 +24333,7 @@ var StyledCell = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.wi
   componentId: "sc-b034il-0"
 })(["padding:5px 15px;overflow-x:clip;", " background-color:", ";border:1px solid ", ";", ":hover &{background-color:", ";border-left-color:", ";border-right-color:", ";}", " ", " &[data-pinned-last]{", "}", ""], function (props) {
   return props.type == 'number' ? 'text-align: right;' : null;
-}, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _table_row__WEBPACK_IMPORTED_MODULE_3__["default"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, function (props) {
+}, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _table_row__WEBPACK_IMPORTED_MODULE_4__["default"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, function (props) {
   if (props.border == 'top') return "border-top-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3, ";");
   if (props.border == 'bottom') return "border-bottom-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3, ";");
 }, function (props) {
@@ -24704,9 +24915,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _cell__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./cell */ "./src/table/cell.js");
-/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./util */ "./src/table/util.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _cell__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./cell */ "./src/table/cell.js");
+/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
 // LICENSE_CODE ZON
 
 
@@ -24722,7 +24933,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 var TableFooter = function TableFooter(props) {
   var classNamePrefix = props.classNamePrefix,
     rowDensity = props.rowDensity;
-  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_2__.useTableContext)(),
+  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_3__.useTableContext)(),
     footerGroups = _useTableContext.footerGroups,
     allColumns = _useTableContext.allColumns,
     hideFooter = _useTableContext.hideFooter;
@@ -24733,7 +24944,7 @@ var TableFooter = function TableFooter(props) {
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     role: "rowgroup",
     "data-rowgroup-type": "footer",
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_1__.classNames)(classNamePrefix, {
       tableFooter: true
     })
   }, footerGroups.map(function (group) {
@@ -24744,7 +24955,7 @@ var TableFooter = function TableFooter(props) {
       key: key,
       role: "row"
     }, rest, {
-      className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+      className: (0,_utils__WEBPACK_IMPORTED_MODULE_1__.classNames)(classNamePrefix, {
         footerRow: true
       })
     }), group.headers.map(function (column) {
@@ -24752,7 +24963,7 @@ var TableFooter = function TableFooter(props) {
         column: column,
         key: column.getFooterProps().key,
         rowDensity: rowDensity,
-        className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+        className: (0,_utils__WEBPACK_IMPORTED_MODULE_1__.classNames)(classNamePrefix, {
           footerCell: true
         })
       });
@@ -24767,12 +24978,12 @@ var FooterCell = function FooterCell(props) {
   var _column$type = column.type,
     type = _column$type === void 0 ? 'string' : _column$type,
     classNamePrefix = column.classNamePrefix;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_cell__WEBPACK_IMPORTED_MODULE_1__.StyledCell, _extends({
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_cell__WEBPACK_IMPORTED_MODULE_2__.StyledCell, _extends({
     type: type,
     role: "cell",
     rowDensity: rowDensity,
     border: "top",
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_1__.classNames)(classNamePrefix, {
       footer: true
     }, className)
   }, column.getFooterProps()), column.render('Footer'));
@@ -24841,7 +25052,7 @@ var TableHeader = function TableHeader(props) {
     role: "rowgroup",
     style: style
   }, dataAttributes, {
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
       tableHeader: true,
       'tableHeader--is-compact': compact
     })
@@ -24852,7 +25063,7 @@ var TableHeader = function TableHeader(props) {
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", _extends({
       key: key
     }, rest, {
-      className: (0,_util__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, {
+      className: (0,_utils__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
         headerRow: true
       })
     }), group.headers.map(function (header, i, arr) {
@@ -24862,7 +25073,7 @@ var TableHeader = function TableHeader(props) {
         isLast: isLast,
         key: header.getHeaderProps().key,
         header: header,
-        className: (0,_util__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, {
+        className: (0,_utils__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
           headerCell: true,
           'headerCell--is-compact': compact,
           'headerCell--is-last': isLast
@@ -24905,7 +25116,7 @@ var HeaderCell = function HeaderCell(props) {
     setHovered = _useState2[1];
   var iconVisible = canSort && (['asc', 'desc'].includes(sort) || hovered);
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(HeaderCellContent, _extends({
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_8__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_4__.classNames)(classNamePrefix, {
       header: true
     }, className)
   }, getHeaderProps(), {
@@ -25706,9 +25917,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _cell__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./cell */ "./src/table/cell.js");
-/* harmony import */ var _table_row__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./table_row */ "./src/table/table_row.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./util */ "./src/table/util.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _cell__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./cell */ "./src/table/cell.js");
+/* harmony import */ var _table_row__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./table_row */ "./src/table/table_row.js");
 // LICENSE_CODE ZON
 
 
@@ -25734,20 +25945,20 @@ var renderRow = function renderRow(opt) {
     return onRowClick(row.original, evt);
   } : undefined;
   var cursor = onRowClick ? 'pointer' : undefined;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_table_row__WEBPACK_IMPORTED_MODULE_2__["default"], _extends({
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_table_row__WEBPACK_IMPORTED_MODULE_3__["default"], _extends({
     key: key,
     onClick: onClick,
     cursor: cursor
   }, rowProps, {
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_1__.classNames)(classNamePrefix, {
       tableRow: true,
       'tableRow--is-pinned': row.isPinned
     })
   }), row.cells.map(function (cell) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_cell__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_cell__WEBPACK_IMPORTED_MODULE_2__["default"], _extends({
       key: cell.getCellProps().key
     }, cellProps, cell, {
-      className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(classNamePrefix, {
+      className: (0,_utils__WEBPACK_IMPORTED_MODULE_1__.classNames)(classNamePrefix, {
         tableCell: true
       })
     }));
@@ -25814,7 +26025,6 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
 /* harmony import */ var _header__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./header */ "./src/table/header.js");
 /* harmony import */ var _render_row__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./render_row */ "./src/table/render_row.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./util */ "./src/table/util.js");
 // LICENSE_CODE ZON
 
 
@@ -25825,7 +26035,6 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-
 var StickyHeader = function StickyHeader(props) {
   var classNamePrefix = props.classNamePrefix,
     top = props.top,
@@ -25845,7 +26054,7 @@ var StickyHeader = function StickyHeader(props) {
   };
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(StickyHeaderWrapper, {
     style: style,
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_6__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.classNames)(classNamePrefix, {
       stickyHeader: true
     })
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_header__WEBPACK_IMPORTED_MODULE_4__["default"], {
@@ -26091,12 +26300,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_3__);
 /* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../hooks */ "./src/hooks/index.js");
 /* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
-/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
-/* harmony import */ var _footer__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./footer */ "./src/table/footer.js");
-/* harmony import */ var _header__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./header */ "./src/table/header.js");
-/* harmony import */ var _render_row__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./render_row */ "./src/table/render_row.js");
-/* harmony import */ var _sticky_header__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./sticky_header */ "./src/table/sticky_header.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./util */ "./src/table/util.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
+/* harmony import */ var _footer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./footer */ "./src/table/footer.js");
+/* harmony import */ var _header__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./header */ "./src/table/header.js");
+/* harmony import */ var _render_row__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./render_row */ "./src/table/render_row.js");
+/* harmony import */ var _sticky_header__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./sticky_header */ "./src/table/sticky_header.js");
 // LICENSE_CODE ZON
 
 
@@ -26128,7 +26337,7 @@ var Table = function Table(props) {
     scrollTarget = props.scrollTarget,
     classNamePrefix = props.classNamePrefix;
   var offsetTop = lodash_isObject__WEBPACK_IMPORTED_MODULE_0___default()(stickyHeader) && stickyHeader.offsetTop || 0;
-  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_6__.useTableContext)(),
+  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_7__.useTableContext)(),
     getTableProps = _useTableContext.getTableProps,
     getTableBodyProps = _useTableContext.getTableBodyProps,
     prepareRow = _useTableContext.prepareRow,
@@ -26174,7 +26383,7 @@ var Table = function Table(props) {
     return page.map(function (row, i, arr) {
       prepareRow(row);
       if (row.isPinned) return null;
-      return (0,_render_row__WEBPACK_IMPORTED_MODULE_9__["default"])({
+      return (0,_render_row__WEBPACK_IMPORTED_MODULE_10__["default"])({
         row: row,
         columnStartEditing: columnStartEditing,
         columnDoneEditing: columnDoneEditing,
@@ -26187,26 +26396,26 @@ var Table = function Table(props) {
   }();
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(TableWrapper, {
     ref: wrapperRef,
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_11__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_6__.classNames)(classNamePrefix, {
       container: true
     }, className)
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(StyledTable, _extends({
     ref: tableRef
   }, getTableProps(), {
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_11__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_6__.classNames)(classNamePrefix, {
       table: true
     })
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_header__WEBPACK_IMPORTED_MODULE_8__["default"], {
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_header__WEBPACK_IMPORTED_MODULE_9__["default"], {
     classNamePrefix: classNamePrefix
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement("div", _extends({
     "data-rowgroup-type": "body"
   }, getTableBodyProps(), {
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_11__.classNames)(classNamePrefix, {
+    className: (0,_utils__WEBPACK_IMPORTED_MODULE_6__.classNames)(classNamePrefix, {
       tableBody: true
     })
   }), pinnedRows.map(function (row) {
     prepareRow(row);
-    return (0,_render_row__WEBPACK_IMPORTED_MODULE_9__["default"])({
+    return (0,_render_row__WEBPACK_IMPORTED_MODULE_10__["default"])({
       row: row,
       columnStartEditing: columnStartEditing,
       columnDoneEditing: columnDoneEditing,
@@ -26214,10 +26423,10 @@ var Table = function Table(props) {
       onRowClick: onRowClick,
       classNamePrefix: classNamePrefix
     });
-  }), body), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_footer__WEBPACK_IMPORTED_MODULE_7__["default"], {
+  }), body), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_footer__WEBPACK_IMPORTED_MODULE_8__["default"], {
     rowDensity: rowDensity,
     classNamePrefix: classNamePrefix
-  }), showSticky && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_sticky_header__WEBPACK_IMPORTED_MODULE_10__["default"], {
+  }), showSticky && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2___default().createElement(_sticky_header__WEBPACK_IMPORTED_MODULE_11__["default"], {
     top: offsetTop,
     width: width,
     left: left,
@@ -26288,7 +26497,6 @@ var TableRow = styled_components__WEBPACK_IMPORTED_MODULE_0___default().div.with
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "classNames": () => (/* binding */ classNames),
 /* harmony export */   "firstDefined": () => (/* binding */ firstDefined),
 /* harmony export */   "renderCellContent": () => (/* binding */ renderCellContent)
 /* harmony export */ });
@@ -26312,27 +26520,6 @@ var firstDefined = function firstDefined() {
     if (typeof args[i] != 'undefined') return args[i];
   }
 };
-var applyPrefixToName = function applyPrefixToName(prefix, name) {
-  if (!name) return prefix;
-  if (name[0] == '-') return prefix + name;
-  return prefix + '__' + name;
-};
-var classNames = function classNames(prefix, state) {
-  for (var _len2 = arguments.length, classNameList = new Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
-    classNameList[_key2 - 2] = arguments[_key2];
-  }
-  var arr = [].concat(classNameList);
-  if (state && prefix) {
-    for (var key in state) {
-      if (state.hasOwnProperty(key) && state[key]) arr.push("".concat(applyPrefixToName(prefix, key)));
-    }
-  }
-  return arr.filter(function (i) {
-    return i;
-  }).map(function (i) {
-    return String(i).trim();
-  }).join(' ');
-};
 var renderCellContent = function renderCellContent(column, type, props) {
   var content = column[type];
   if (lodash_isString__WEBPACK_IMPORTED_MODULE_0___default()(content)) {
@@ -27454,6 +27641,7 @@ Typography.displayName = 'Typography';
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "classNames": () => (/* binding */ classNames),
 /* harmony export */   "colorNames": () => (/* binding */ colorNames),
 /* harmony export */   "fromTheme": () => (/* binding */ fromTheme),
 /* harmony export */   "getButtonColors": () => (/* binding */ getButtonColors),
@@ -27698,6 +27886,27 @@ var tooltipPlacements = function () {
     });
   });
 }();
+var applyPrefixToName = function applyPrefixToName(prefix, name) {
+  if (!name) return prefix;
+  if (name[0] == '-') return prefix + name;
+  return prefix + '__' + name;
+};
+var classNames = function classNames(prefix, state) {
+  for (var _len = arguments.length, classNameList = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    classNameList[_key - 2] = arguments[_key];
+  }
+  var arr = [].concat(classNameList);
+  if (state && prefix) {
+    for (var key in state) {
+      if (state.hasOwnProperty(key) && state[key]) arr.push("".concat(applyPrefixToName(prefix, key)));
+    }
+  }
+  return arr.filter(function (i) {
+    return i;
+  }).map(function (i) {
+    return String(i).trim();
+  }).join(' ');
+};
 
 /***/ }),