@myunisoft/design-system 0.19.0-beta.2 → 0.19.0-beta.4

package/dist/index.js

@@ -37,9 +37,9 @@ var $gXNCa$babelruntimeregenerator = require("@babel/runtime/regenerator");
 var $gXNCa$babelruntimehelpersasyncToGenerator = require("@babel/runtime/helpers/asyncToGenerator");
 var $gXNCa$lodashfind = require("lodash/find");
 var $gXNCa$exceljs = require("exceljs");
+var $gXNCa$jspdf = require("jspdf");
 var $gXNCa$printjs = require("print-js");
 var $gXNCa$html2canvas = require("html2canvas");
-var $gXNCa$jspdf = require("jspdf");
 var $gXNCa$muistyleswithStyles = require("@mui/styles/withStyles");
 var $gXNCa$reactdropzone = require("react-dropzone");
 var $gXNCa$muimaterialIconButton = require("@mui/material/IconButton");
@@ -959,7 +959,7 @@ function $33a6c9c6ce93d958$var$_interopRequireWildcard(obj, nodeInterop) {
 }
 var $33a6c9c6ce93d958$var$Body = /*#__PURE__*/ $33a6c9c6ce93d958$var$_react["default"].forwardRef(function Body(props, ref) {
     var cache = props.cache, displayableRows = props.displayableRows, height = props.height, onScrollbarPresenceChange = props.onScrollbarPresenceChange, domRef = props.domRef, scrollLeft = props.scrollLeft, totalWidth = props.totalWidth, onScroll = props.onScroll, horizontalPadding = props.horizontalPadding, rest = (0, $33a6c9c6ce93d958$var$_objectWithoutProperties2["default"])(props, $33a6c9c6ce93d958$var$_excluded);
-    var _useConfig = (0, $ckVq7.useConfig)(), _useConfig$config = _useConfig.config, _useConfig$config$alw = _useConfig$config.alwaysInEdition, alwaysInEdition = _useConfig$config$alw === void 0 ? false : _useConfig$config$alw, columns = _useConfig$config.columns, _useConfig$config$wit = _useConfig$config.withBorders, withBorders = _useConfig$config$wit === void 0 ? false : _useConfig$config$wit, selectableRowKey = _useConfig$config.selectableRowKey, _useConfig$config$has = _useConfig$config.hasSecureSociety, hasSecureSociety = _useConfig$config$has === void 0 ? false : _useConfig$config$has, _useConfig$config$ope = _useConfig$config.openSocieties, openSocieties = _useConfig$config$ope === void 0 ? [] : _useConfig$config$ope;
+    var _useConfig = (0, $ckVq7.useConfig)(), _useConfig$config = _useConfig.config, _useConfig$config$alw = _useConfig$config.alwaysInEdition, alwaysInEdition = _useConfig$config$alw === void 0 ? false : _useConfig$config$alw, columns = _useConfig$config.columns, _useConfig$config$wit = _useConfig$config.withBorders, withBorders = _useConfig$config$wit === void 0 ? false : _useConfig$config$wit, selectableRowKey = _useConfig$config.selectableRowKey, _useConfig$config$has = _useConfig$config.hasSecureSociety, hasSecureSociety = _useConfig$config$has === void 0 ? false : _useConfig$config$has, _useConfig$config$ope = _useConfig$config.openSocieties, openSocieties = _useConfig$config$ope === void 0 ? [] : _useConfig$config$ope, stylesProp = _useConfig$config.styles;
     var styles = (0, $33a6c9c6ce93d958$var$_styles["default"])({
         horizontalPadding: horizontalPadding,
         rowHeight: props.rowHeight
@@ -967,6 +967,14 @@ var $33a6c9c6ce93d958$var$Body = /*#__PURE__*/ $33a6c9c6ce93d958$var$_react["def
     var openSocietiesIds = openSocieties.map(function(society) {
         return society === null || society === void 0 ? void 0 : society.id;
     });
+    var containerCustomStyling = (0, $33a6c9c6ce93d958$var$_react.useMemo)(function() {
+        var _stylesProp$body, _stylesProp$body$cont;
+        return stylesProp === null || stylesProp === void 0 ? void 0 : (_stylesProp$body = stylesProp.body) === null || _stylesProp$body === void 0 ? void 0 : (_stylesProp$body$cont = _stylesProp$body.container) === null || _stylesProp$body$cont === void 0 ? void 0 : _stylesProp$body$cont.call(_stylesProp$body, {
+            rowCount: displayableRows.length
+        });
+    }, [
+        displayableRows.length
+    ]);
     var _renderBodyRow = (0, $33a6c9c6ce93d958$var$_react.useCallback)(function(rowProps) {
         var row = displayableRows[rowProps.rowIndex];
         if (!row) return null;
@@ -983,7 +991,8 @@ var $33a6c9c6ce93d958$var$Body = /*#__PURE__*/ $33a6c9c6ce93d958$var$_react["def
             cache: cache,
             hasSecureSociety: hasSecureSociety,
             openSocietiesIds: openSocietiesIds,
-            alwaysInEdition: alwaysInEdition
+            alwaysInEdition: alwaysInEdition,
+            bodyStylesProp: stylesProp === null || stylesProp === void 0 ? void 0 : stylesProp.body
         }, rest));
     }, [
         displayableRows,
@@ -995,9 +1004,10 @@ var $33a6c9c6ce93d958$var$Body = /*#__PURE__*/ $33a6c9c6ce93d958$var$_react["def
         alwaysInEdition
     ]);
     return /*#__PURE__*/ $33a6c9c6ce93d958$var$_react["default"].createElement("div", {
-        className: styles.gridContainer,
+        className: (0, $33a6c9c6ce93d958$var$_classnames["default"])(containerCustomStyling === null || containerCustomStyling === void 0 ? void 0 : containerCustomStyling.classes, styles.gridContainer),
         ref: domRef,
-        "data-role": "body"
+        "data-role": "body",
+        style: containerCustomStyling === null || containerCustomStyling === void 0 ? void 0 : containerCustomStyling.style
     }, /*#__PURE__*/ $33a6c9c6ce93d958$var$_react["default"].createElement($33a6c9c6ce93d958$var$_VirtualGrid["default"], (0, $33a6c9c6ce93d958$var$_extends2["default"])({
         ref: ref,
         className: (0, $33a6c9c6ce93d958$var$_classnames["default"])("vtBody", styles.BodyGrid, styles.defaultStyle, (0, $33a6c9c6ce93d958$var$_defineProperty2["default"])({}, styles.BodyGrid_withBorders, withBorders)),
@@ -1671,10 +1681,10 @@ Object.defineProperty(module.exports, "__esModule", {
 module.exports["default"] = void 0;
 
 
-var $c5260278287da19e$var$_react = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$react);
-
 var $c5260278287da19e$var$_classnames = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$classnames);
 
+var $c5260278287da19e$var$_react = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$react);
+
 var $ckVq7 = parcelRequire("ckVq7");
 
 var $igQNT = parcelRequire("igQNT");
@@ -1944,6 +1954,7 @@ module.exports["default"] = $874862337ffd9628$var$_default;
 parcelRequire.register("7Gceh", function(module, exports) {
 "use strict";
 
+
 Object.defineProperty(module.exports, "__esModule", {
     value: true
 });
@@ -1955,7 +1966,7 @@ var $5975f126da112a16$var$_extends2 = $gXNCa$babelruntimehelpersinteropRequireDe
 
 var $5975f126da112a16$var$_objectWithoutProperties2 = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$babelruntimehelpersobjectWithoutProperties);
 
-var $5975f126da112a16$var$_react = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$react);
+var $5975f126da112a16$var$_react = $5975f126da112a16$var$_interopRequireWildcard($gXNCa$react);
 
 var $5975f126da112a16$var$_classnames = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$classnames);
 
@@ -1982,10 +1993,37 @@ var $5975f126da112a16$var$_excluded = [
     "isVisible",
     "hasSecureSociety",
     "openSocietiesIds",
-    "alwaysInEdition"
+    "alwaysInEdition",
+    "bodyStylesProp"
 ], $5975f126da112a16$var$_excluded2 = [
     "key"
 ];
+function $5975f126da112a16$var$_getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return ($5975f126da112a16$var$_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function $5975f126da112a16$var$_interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) return obj;
+    if (obj === null || $gXNCa$babelruntimehelperstypeof(obj) !== "object" && typeof obj !== "function") return {
+        "default": obj
+    };
+    var cache = $5975f126da112a16$var$_getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) return cache.get(obj);
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj)if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+        if (desc && (desc.get || desc.set)) Object.defineProperty(newObj, key, desc);
+        else newObj[key] = obj[key];
+    }
+    newObj["default"] = obj;
+    if (cache) cache.set(obj, newObj);
+    return newObj;
+}
 function $5975f126da112a16$var$ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
     if (Object.getOwnPropertySymbols) {
@@ -2009,10 +2047,20 @@ function $5975f126da112a16$var$_objectSpread(target) {
 }
 var $5975f126da112a16$var$BodyRow = function BodyRow(props) {
     var _row$parentRowIndex;
-    var cache = props.cache, columns = props.columns, columnWidth = props.columnWidth, displayableRows = props.displayableRows, fixedColumnCount = props.fixedColumnCount, hasCheckBoxHidden = props.hasCheckBoxHidden, rowIndex = props.rowIndex, _props$row = props.row, row = _props$row === void 0 ? {} : _props$row, scrollLeft = props.scrollLeft, selectableRowKey = props.selectableRowKey, style = props.style, classes = props.classes, isVisible = props.isVisible, _props$hasSecureSocie = props.hasSecureSociety, hasSecureSociety = _props$hasSecureSocie === void 0 ? false : _props$hasSecureSocie, _props$openSocietiesI = props.openSocietiesIds, openSocietiesIds = _props$openSocietiesI === void 0 ? [] : _props$openSocietiesI, _props$alwaysInEditio = props.alwaysInEdition, alwaysInEdition = _props$alwaysInEditio === void 0 ? false : _props$alwaysInEditio, rest = (0, $5975f126da112a16$var$_objectWithoutProperties2["default"])(props, $5975f126da112a16$var$_excluded);
+    var cache = props.cache, columns = props.columns, columnWidth = props.columnWidth, displayableRows = props.displayableRows, fixedColumnCount = props.fixedColumnCount, hasCheckBoxHidden = props.hasCheckBoxHidden, rowIndex = props.rowIndex, _props$row = props.row, row = _props$row === void 0 ? {} : _props$row, scrollLeft = props.scrollLeft, selectableRowKey = props.selectableRowKey, style = props.style, classes = props.classes, isVisible = props.isVisible, _props$hasSecureSocie = props.hasSecureSociety, hasSecureSociety = _props$hasSecureSocie === void 0 ? false : _props$hasSecureSocie, _props$openSocietiesI = props.openSocietiesIds, openSocietiesIds = _props$openSocietiesI === void 0 ? [] : _props$openSocietiesI, _props$alwaysInEditio = props.alwaysInEdition, alwaysInEdition = _props$alwaysInEditio === void 0 ? false : _props$alwaysInEditio, bodyStylesProp = props.bodyStylesProp, rest = (0, $5975f126da112a16$var$_objectWithoutProperties2["default"])(props, $5975f126da112a16$var$_excluded);
     var apiRef = (0, $4IFzq.useApiRef)();
     var selectedRows = (0, $9E7Hm.useSelector)(apiRef, $lRxmh.selectedRowsSelector);
     var isSelected = selectedRows.includes(row[selectableRowKey]);
+    var customStyling = (0, $5975f126da112a16$var$_react.useMemo)(function() {
+        var _bodyStylesProp$row;
+        return bodyStylesProp === null || bodyStylesProp === void 0 ? void 0 : (_bodyStylesProp$row = bodyStylesProp.row) === null || _bodyStylesProp$row === void 0 ? void 0 : _bodyStylesProp$row.call(bodyStylesProp, {
+            rowData: row,
+            rowIndex: rowIndex
+        });
+    }, [
+        row,
+        rowIndex
+    ]);
     var keyId = row[selectableRowKey];
     var isOdd = ((_row$parentRowIndex = row.parentRowIndex) !== null && _row$parentRowIndex !== void 0 ? _row$parentRowIndex : rowIndex) % 2;
     var checkIfSocietyIsOpen = !openSocietiesIds.includes(row === null || row === void 0 ? void 0 : row.company_id);
@@ -2030,19 +2078,20 @@ var $5975f126da112a16$var$BodyRow = function BodyRow(props) {
             fixedColumnCount: fixedColumnCount,
             isSecuredRow: isSecuredRow,
             row: row,
-            isSelected: isSelected
+            isSelected: isSelected,
+            bodyCellStylesProp: bodyStylesProp === null || bodyStylesProp === void 0 ? void 0 : bodyStylesProp.cell
         }, cellProps, rest));
     };
     return /*#__PURE__*/ $5975f126da112a16$var$_react["default"].createElement("div", {
         key: rowIndex,
         "data-role": "row",
         "data-key": keyId,
-        className: (0, $5975f126da112a16$var$_classnames["default"])("bodyRow", isOdd ? "odd" : "even", {
+        className: (0, $5975f126da112a16$var$_classnames["default"])("bodyRow", customStyling === null || customStyling === void 0 ? void 0 : customStyling.classes, isOdd ? "odd" : "even", {
             selectedRow: isSelected && !alwaysInEdition
         }),
-        style: {
+        style: $5975f126da112a16$var$_objectSpread($5975f126da112a16$var$_objectSpread({}, customStyling === null || customStyling === void 0 ? void 0 : customStyling.style), {}, {
             top: style.top
-        }
+        })
     }, isVisible && columns.map(function(column, index) {
         return _renderBodyCell($5975f126da112a16$var$_objectSpread($5975f126da112a16$var$_objectSpread({
             rowIndex: rowIndex,
@@ -2228,7 +2277,7 @@ function $207fc0463a0bd15d$var$_objectSpread(target) {
 }
 var $207fc0463a0bd15d$var$BodyCell = function BodyCell(_ref) {
     var _cx3, _displayableRows$rowI;
-    var columnIndex = _ref.columnIndex, key = _ref.keyName, parent = _ref.parent, rowIndex = _ref.rowIndex, style = _ref.style, _ref$displayableRows = _ref.displayableRows, displayableRows = _ref$displayableRows === void 0 ? [] : _ref$displayableRows, _ref$hasCheckBoxHidde = _ref.hasCheckBoxHidden, hasCheckBoxHidden = _ref$hasCheckBoxHidde === void 0 ? false : _ref$hasCheckBoxHidde, tableKeyName = _ref.tableKeyName, onCellFocus = _ref.onCellFocus, onCellBlur = _ref.onCellBlur, onClick = _ref.onClick, onDoubleClick = _ref.onDoubleClick, focusedCell = _ref.focusedCell, onKeyDown = _ref.onKeyDown, isSecuredRow = _ref.isSecuredRow, _ref$row = _ref.row, row = _ref$row === void 0 ? {} : _ref$row, isSelected = _ref.isSelected;
+    var columnIndex = _ref.columnIndex, key = _ref.keyName, parent = _ref.parent, rowIndex = _ref.rowIndex, style = _ref.style, _ref$displayableRows = _ref.displayableRows, displayableRows = _ref$displayableRows === void 0 ? [] : _ref$displayableRows, _ref$hasCheckBoxHidde = _ref.hasCheckBoxHidden, hasCheckBoxHidden = _ref$hasCheckBoxHidde === void 0 ? false : _ref$hasCheckBoxHidde, tableKeyName = _ref.tableKeyName, onCellFocus = _ref.onCellFocus, onCellBlur = _ref.onCellBlur, onClick = _ref.onClick, onDoubleClick = _ref.onDoubleClick, focusedCell = _ref.focusedCell, onKeyDown = _ref.onKeyDown, isSecuredRow = _ref.isSecuredRow, _ref$row = _ref.row, row = _ref$row === void 0 ? {} : _ref$row, isSelected = _ref.isSelected, bodyCellStylesProp = _ref.bodyCellStylesProp;
     var styles = (0, $207fc0463a0bd15d$var$_styles["default"])();
     var CHECKBOX_COLUMN = "checkboxColumn";
     var VTContext = (0, $207fc0463a0bd15d$var$_react.useContext)($207fc0463a0bd15d$var$_context["default"]);
@@ -2251,6 +2300,18 @@ var $207fc0463a0bd15d$var$BodyCell = function BodyCell(_ref) {
     }, [
         isFocused
     ]);
+    var customStyling = (0, $207fc0463a0bd15d$var$_react.useMemo)(function() {
+        return bodyCellStylesProp === null || bodyCellStylesProp === void 0 ? void 0 : bodyCellStylesProp({
+            rowData: row,
+            key: keyColumn,
+            rowIndex: rowIndex,
+            columnIndex: columnIndex
+        });
+    }, [
+        row,
+        columnIndex,
+        rowIndex
+    ]);
     var rowStyle = (0, $207fc0463a0bd15d$var$_classnames["default"])(styles.cell, (0, $207fc0463a0bd15d$var$_defineProperty2["default"])({}, styles.lockRow, isSecuredRow));
     var _renderCheckBoxCell = (0, $207fc0463a0bd15d$var$_react.useCallback)(function(_ref3) {
         var key = _ref3.key, rowIndex = _ref3.rowIndex, style = _ref3.style;
@@ -2377,7 +2438,7 @@ var $207fc0463a0bd15d$var$BodyCell = function BodyCell(_ref) {
         "data-role": "cell",
         "data-column-key": keyColumn,
         key: key,
-        style: $207fc0463a0bd15d$var$_objectSpread($207fc0463a0bd15d$var$_objectSpread({}, style), (_displayableRows$rowI = displayableRows[rowIndex]) === null || _displayableRows$rowI === void 0 ? void 0 : _displayableRows$rowI.style),
+        style: $207fc0463a0bd15d$var$_objectSpread($207fc0463a0bd15d$var$_objectSpread($207fc0463a0bd15d$var$_objectSpread({}, style), (_displayableRows$rowI = displayableRows[rowIndex]) === null || _displayableRows$rowI === void 0 ? void 0 : _displayableRows$rowI.style), customStyling === null || customStyling === void 0 ? void 0 : customStyling.style),
         onDoubleClick: dbClick,
         onClick: simpleClick === null || simpleClick === void 0 ? void 0 : simpleClick.bind(null, displayableRows[rowIndex])
     }, hasContextMenu ? /*#__PURE__*/ $207fc0463a0bd15d$var$_react["default"].createElement($207fc0463a0bd15d$var$_ContextMenu["default"], {
@@ -6237,7 +6298,7 @@ var $c28dcb2ecc31f940$var$downloadFile = function downloadFile(data, filename) {
 var $c28dcb2ecc31f940$var$exportData = function exportData(rows, columns, format, fileName, tableRefs) {
     var options = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
     var _columns = columns.filter($e902G.isExportable);
-    var _rows = (0, $jlN5T.parseDataRows)(rows, _columns);
+    var _rows = (0, $jlN5T.parseDataRows)(rows, _columns, options);
     if (format === "csv") {
         var csvData = [
             _columns.map(function(_ref) {
@@ -6277,8 +6338,6 @@ var $e1660f894c3a788a$var$_regenerator = $gXNCa$babelruntimehelpersinteropRequir
 
 var $e1660f894c3a788a$var$_asyncToGenerator2 = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$babelruntimehelpersasyncToGenerator);
 
-var $e1660f894c3a788a$var$_toConsumableArray2 = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$babelruntimehelperstoConsumableArray);
-
 var $e1660f894c3a788a$var$_typeof2 = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$babelruntimehelperstypeof);
 
 var $e1660f894c3a788a$var$_objectWithoutProperties2 = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$babelruntimehelpersobjectWithoutProperties);
@@ -6312,6 +6371,68 @@ var $e1660f894c3a788a$var$_excluded = [
     "key",
     "typeCell"
 ];
+function $e1660f894c3a788a$var$_createForOfIteratorHelper(o, allowArrayLike) {
+    var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
+    if (!it) {
+        if (Array.isArray(o) || (it = $e1660f894c3a788a$var$_unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
+            if (it) o = it;
+            var i = 0;
+            var F = function F() {};
+            return {
+                s: F,
+                n: function n() {
+                    if (i >= o.length) return {
+                        done: true
+                    };
+                    return {
+                        done: false,
+                        value: o[i++]
+                    };
+                },
+                e: function e(_e) {
+                    throw _e;
+                },
+                f: F
+            };
+        }
+        throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+    }
+    var normalCompletion = true, didErr = false, err;
+    return {
+        s: function s() {
+            it = it.call(o);
+        },
+        n: function n() {
+            var step = it.next();
+            normalCompletion = step.done;
+            return step;
+        },
+        e: function e(_e2) {
+            didErr = true;
+            err = _e2;
+        },
+        f: function f() {
+            try {
+                if (!normalCompletion && it["return"] != null) it["return"]();
+            } finally{
+                if (didErr) throw err;
+            }
+        }
+    };
+}
+function $e1660f894c3a788a$var$_unsupportedIterableToArray(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return $e1660f894c3a788a$var$_arrayLikeToArray(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(o);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return $e1660f894c3a788a$var$_arrayLikeToArray(o, minLen);
+}
+function $e1660f894c3a788a$var$_arrayLikeToArray(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
 var $e1660f894c3a788a$var$CSV_FILE = {
     type: "text/csv;charset=utf-8",
     extension: ".csv"
@@ -6388,14 +6509,28 @@ var $e1660f894c3a788a$var$formatDataToCSV = function formatDataToCSV(row, column
     ].includes((0, $e1660f894c3a788a$var$_typeof2["default"])(result)) ? result : "";
 };
 module.exports.formatDataToCSV = $e1660f894c3a788a$var$formatDataToCSV;
+var $e1660f894c3a788a$var$defaultRowsFilter = function defaultRowsFilter(row) {
+    return !row.secured;
+};
 var $e1660f894c3a788a$var$parseDataRows = function parseDataRows(rows, columns) {
-    return rows.reduce(function(prev, row) {
-        return row.secured ? prev : [].concat((0, $e1660f894c3a788a$var$_toConsumableArray2["default"])(prev), [
-            columns.map(function(column) {
+    var exportOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    var _exportOptions$rowsFi = exportOptions.rowsFilter, rowsFilter = _exportOptions$rowsFi === void 0 ? $e1660f894c3a788a$var$defaultRowsFilter : _exportOptions$rowsFi;
+    var res = [];
+    var _iterator = $e1660f894c3a788a$var$_createForOfIteratorHelper(rows), _step;
+    try {
+        var _loop = function _loop() {
+            var row = _step.value;
+            if (rowsFilter(row)) res.push(columns.map(function(column) {
                 return $e1660f894c3a788a$var$formatDataToCSV(row, column);
-            })
-        ]);
-    }, []);
+            }));
+        };
+        for(_iterator.s(); !(_step = _iterator.n()).done;)_loop();
+    } catch (err) {
+        _iterator.e(err);
+    } finally{
+        _iterator.f();
+    }
+    return res;
 };
 module.exports.parseDataRows = $e1660f894c3a788a$var$parseDataRows;
 var $e1660f894c3a788a$var$exportToCSV = function exportToCSV(csvData, fileName) {
@@ -9630,10 +9765,10 @@ function $62231dc23eb5e423$var$_interopRequireWildcard(obj, nodeInterop) {
     if (cache) cache.set(obj, newObj);
     return newObj;
 }
-var $62231dc23eb5e423$var$Footer = /*#__PURE__*/ $62231dc23eb5e423$var$_react["default"].forwardRef(function(_ref, ref) {
+var $62231dc23eb5e423$var$Footer = /*#__PURE__*/ $62231dc23eb5e423$var$_react["default"].forwardRef(function Footer(_ref, ref) {
     var _ref$current;
     var modeEdit = _ref.modeEdit, displayableRows = _ref.displayableRows, domRef = _ref.domRef, rest = (0, $62231dc23eb5e423$var$_objectWithoutProperties2["default"])(_ref, $62231dc23eb5e423$var$_excluded);
-    var _useConfig = (0, $ckVq7.useConfig)(), _useConfig$config = _useConfig.config, columns = _useConfig$config.columns, _useConfig$config$foo = _useConfig$config.footerStyle, footerStyle = _useConfig$config$foo === void 0 ? {} : _useConfig$config$foo;
+    var _useConfig = (0, $ckVq7.useConfig)(), _useConfig$config = _useConfig.config, columns = _useConfig$config.columns, _useConfig$config$foo = _useConfig$config.footerStyle, footerStyle = _useConfig$config$foo === void 0 ? {} : _useConfig$config$foo, stylesProp = _useConfig$config.styles;
     var _columns = (0, $62231dc23eb5e423$var$_react.useMemo)(function() {
         var list = [];
         for(var i = 0; i < columns.length; i++){
@@ -9642,7 +9777,7 @@ var $62231dc23eb5e423$var$Footer = /*#__PURE__*/ $62231dc23eb5e423$var$_react["d
             });
             var column = columns[i];
             var _ref2 = column.footerProps || {}, colspan = _ref2.colspan;
-            if (colspan && typeof colspan === "number" && colspan > 0 && i + colspan < columns.length) {
+            if (colspan && typeof colspan === "number" && colspan > 0 && i + colspan <= columns.length) {
                 for(var j = 1; j < colspan; j++)width += rest.columnWidth({
                     index: i + j
                 });
@@ -9660,26 +9795,35 @@ var $62231dc23eb5e423$var$Footer = /*#__PURE__*/ $62231dc23eb5e423$var$_react["d
         }
         return list;
     }, [
-        columns
+        columns,
+        rest.columnWidth
     ]);
+    var containerCustomStyling = (0, $62231dc23eb5e423$var$_react.useMemo)(function() {
+        var _stylesProp$footer, _stylesProp$footer$co;
+        return stylesProp === null || stylesProp === void 0 ? void 0 : (_stylesProp$footer = stylesProp.footer) === null || _stylesProp$footer === void 0 ? void 0 : (_stylesProp$footer$co = _stylesProp$footer.container) === null || _stylesProp$footer$co === void 0 ? void 0 : _stylesProp$footer$co.call(_stylesProp$footer);
+    }, []);
     var styles = (0, $62231dc23eb5e423$var$_styles["default"])(footerStyle);
     var _renderFooterCell = (0, $62231dc23eb5e423$var$_react.useCallback)(function(_ref3) {
-        var column = _ref3.column, key = _ref3.key, style = _ref3.style, classes = _ref3.classes;
+        var _stylesProp$footer2;
+        var column = _ref3.column, key = _ref3.key, style = _ref3.style, classes = _ref3.classes, columnIndex = _ref3.columnIndex;
         return /*#__PURE__*/ $62231dc23eb5e423$var$_react["default"].createElement($62231dc23eb5e423$var$_Cell["default"], {
             column: column,
             style: style,
             key: key,
             displayableRows: displayableRows,
-            classes: classes
+            columnIndex: columnIndex,
+            classes: classes,
+            footerCellStylesProp: stylesProp === null || stylesProp === void 0 ? void 0 : (_stylesProp$footer2 = stylesProp.footer) === null || _stylesProp$footer2 === void 0 ? void 0 : _stylesProp$footer2.cell
         });
     }, [
         columns,
         displayableRows
     ]);
     return /*#__PURE__*/ $62231dc23eb5e423$var$_react["default"].createElement("div", {
-        className: (0, $62231dc23eb5e423$var$_classnames["default"])(styles.gridContainer, styles.defaultStyle),
+        className: (0, $62231dc23eb5e423$var$_classnames["default"])(styles.gridContainer, styles.defaultStyle, containerCustomStyling === null || containerCustomStyling === void 0 ? void 0 : containerCustomStyling.classes),
         ref: domRef,
-        "data-role": "footer"
+        "data-role": "footer",
+        style: containerCustomStyling === null || containerCustomStyling === void 0 ? void 0 : containerCustomStyling.style
     }, modeEdit && /*#__PURE__*/ $62231dc23eb5e423$var$_react["default"].createElement("div", {
         className: styles.footer_fakeCheckboxCell
     }), /*#__PURE__*/ $62231dc23eb5e423$var$_react["default"].createElement("div", {
@@ -9762,6 +9906,7 @@ module.exports["default"] = $1b8a9f45f1071ae2$var$_default;
 parcelRequire.register("k2N64", function(module, exports) {
 "use strict";
 
+
 Object.defineProperty(module.exports, "__esModule", {
     value: true
 });
@@ -9769,7 +9914,7 @@ module.exports["default"] = void 0;
 
 var $e97a142935cec5f5$var$_defineProperty2 = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$babelruntimehelpersdefineProperty);
 
-var $e97a142935cec5f5$var$_react = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$react);
+var $e97a142935cec5f5$var$_react = $e97a142935cec5f5$var$_interopRequireWildcard($gXNCa$react);
 
 var $e97a142935cec5f5$var$_classnames = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$classnames);
 
@@ -9784,6 +9929,32 @@ var $e97a142935cec5f5$var$_styles = $gXNCa$babelruntimehelpersinteropRequireDefa
 var $gD8z6 = parcelRequire("gD8z6");
 
 var $lDpO0 = parcelRequire("lDpO0");
+function $e97a142935cec5f5$var$_getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return ($e97a142935cec5f5$var$_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function $e97a142935cec5f5$var$_interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) return obj;
+    if (obj === null || $gXNCa$babelruntimehelperstypeof(obj) !== "object" && typeof obj !== "function") return {
+        "default": obj
+    };
+    var cache = $e97a142935cec5f5$var$_getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) return cache.get(obj);
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj)if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+        if (desc && (desc.get || desc.set)) Object.defineProperty(newObj, key, desc);
+        else newObj[key] = obj[key];
+    }
+    newObj["default"] = obj;
+    if (cache) cache.set(obj, newObj);
+    return newObj;
+}
 function $e97a142935cec5f5$var$ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
     if (Object.getOwnPropertySymbols) {
@@ -9806,7 +9977,7 @@ function $e97a142935cec5f5$var$_objectSpread(target) {
     return target;
 }
 var $e97a142935cec5f5$var$FooterCell = function FooterCell(_ref) {
-    var column = _ref.column, style = _ref.style, displayableRows = _ref.displayableRows, classes = _ref.classes;
+    var column = _ref.column, style = _ref.style, displayableRows = _ref.displayableRows, classes = _ref.classes, columnIndex = _ref.columnIndex, footerCellStylesProp = _ref.footerCellStylesProp;
     var styles = (0, $e97a142935cec5f5$var$_styles["default"])();
     var typeFooter = column.typeFooter, tooltipFooter = column.tooltipFooter, typeCell = column.typeCell, footerValue = column.footerValue, footerStyle = column.footerStyle, keyColumn = column.key, alignText = column.alignText, noFooter = column.noFooter;
     var renderCustom = function renderCustom() {
@@ -9826,13 +9997,22 @@ var $e97a142935cec5f5$var$FooterCell = function FooterCell(_ref) {
         }
     };
     var alignCell = (0, $gD8z6.defineCellAlign)(typeCell, alignText);
+    var customStyling = (0, $e97a142935cec5f5$var$_react.useMemo)(function() {
+        return footerCellStylesProp === null || footerCellStylesProp === void 0 ? void 0 : footerCellStylesProp({
+            key: keyColumn,
+            columnIndex: columnIndex
+        });
+    }, [
+        keyColumn,
+        columnIndex
+    ]);
     var _render = function _render() {
         return /*#__PURE__*/ $e97a142935cec5f5$var$_react["default"].createElement("div", {
-            className: (0, $e97a142935cec5f5$var$_classnames["default"])(styles.cell, styles.footer, classes, (0, $e97a142935cec5f5$var$_defineProperty2["default"])({}, styles["align".concat((0, $e97a142935cec5f5$var$_upperFirst2["default"])(alignCell))], alignCell)),
+            className: (0, $e97a142935cec5f5$var$_classnames["default"])(customStyling === null || customStyling === void 0 ? void 0 : customStyling.classes, styles.cell, styles.footer, classes, (0, $e97a142935cec5f5$var$_defineProperty2["default"])({}, styles["align".concat((0, $e97a142935cec5f5$var$_upperFirst2["default"])(alignCell))], alignCell)),
             "data-role": "cell",
             "data-column-key": keyColumn,
             key: keyColumn,
-            style: $e97a142935cec5f5$var$_objectSpread($e97a142935cec5f5$var$_objectSpread({}, footerStyle), style)
+            style: $e97a142935cec5f5$var$_objectSpread($e97a142935cec5f5$var$_objectSpread($e97a142935cec5f5$var$_objectSpread({}, footerStyle), style), customStyling === null || customStyling === void 0 ? void 0 : customStyling.style)
         }, /*#__PURE__*/ $e97a142935cec5f5$var$_react["default"].createElement("div", {
             className: (0, $e97a142935cec5f5$var$_classnames["default"])(styles.footerCell)
         }, footerValue ? renderCustom() : _getValue()));
@@ -10069,7 +10249,7 @@ var $e7517de803644e56$var$Header = /*#__PURE__*/ $e7517de803644e56$var$_react["d
     var displayableRows = _ref.displayableRows, wrapHeaderText = _ref.wrapHeaderText, _tableKeyName = _ref.tableKeyName, order = _ref.order, orderDirection = _ref.orderDirection, onOrderChange = _ref.onOrderChange, domRef = _ref.domRef, rest = (0, $e7517de803644e56$var$_objectWithoutProperties2["default"])(_ref, $e7517de803644e56$var$_excluded);
     var CHECKBOX_COLUMN = "checkboxColumn";
     var styles = (0, $e7517de803644e56$var$_styles["default"])();
-    var _useConfig = (0, $ckVq7.useConfig)(), _useConfig$config = _useConfig.config, columns = _useConfig$config.columns, _useConfig$config$has = _useConfig$config.hasCheckBoxHidden, hasCheckBoxHidden = _useConfig$config$has === void 0 ? false : _useConfig$config$has, _useConfig$config$has2 = _useConfig$config.hasSecureSociety, hasSecureSociety = _useConfig$config$has2 === void 0 ? false : _useConfig$config$has2, openSocieties = _useConfig$config.openSocieties, _useConfig$config$sel = _useConfig$config.selectableOnlyOneRow, selectableOnlyOneRow = _useConfig$config$sel === void 0 ? false : _useConfig$config$sel, _useConfig$config$sel2 = _useConfig$config.selectableRowKey, selectableRowKey = _useConfig$config$sel2 === void 0 ? "id" : _useConfig$config$sel2, _useConfig$config$wit = _useConfig$config.withBorders, withBorders = _useConfig$config$wit === void 0 ? false : _useConfig$config$wit;
+    var _useConfig = (0, $ckVq7.useConfig)(), _useConfig$config = _useConfig.config, columns = _useConfig$config.columns, _useConfig$config$has = _useConfig$config.hasCheckBoxHidden, hasCheckBoxHidden = _useConfig$config$has === void 0 ? false : _useConfig$config$has, _useConfig$config$has2 = _useConfig$config.hasSecureSociety, hasSecureSociety = _useConfig$config$has2 === void 0 ? false : _useConfig$config$has2, openSocieties = _useConfig$config.openSocieties, _useConfig$config$sel = _useConfig$config.selectableOnlyOneRow, selectableOnlyOneRow = _useConfig$config$sel === void 0 ? false : _useConfig$config$sel, _useConfig$config$sel2 = _useConfig$config.selectableRowKey, selectableRowKey = _useConfig$config$sel2 === void 0 ? "id" : _useConfig$config$sel2, _useConfig$config$wit = _useConfig$config.withBorders, withBorders = _useConfig$config$wit === void 0 ? false : _useConfig$config$wit, stylesProp = _useConfig$config.styles;
     var isAllCheckedColumn = function isAllCheckedColumn(key, rows) {
         var _iterator = $e7517de803644e56$var$_createForOfIteratorHelper(rows), _step;
         try {
@@ -10086,6 +10266,10 @@ var $e7517de803644e56$var$Header = /*#__PURE__*/ $e7517de803644e56$var$_react["d
     };
     var apiRef = (0, $4IFzq.useApiRef)();
     var selectedRows = (0, $9E7Hm.useSelector)(apiRef, $lRxmh.selectedRowsSelector);
+    var containerCustomStyling = (0, $e7517de803644e56$var$_react.useMemo)(function() {
+        var _stylesProp$header, _stylesProp$header$co;
+        return stylesProp === null || stylesProp === void 0 ? void 0 : (_stylesProp$header = stylesProp.header) === null || _stylesProp$header === void 0 ? void 0 : (_stylesProp$header$co = _stylesProp$header.container) === null || _stylesProp$header$co === void 0 ? void 0 : _stylesProp$header$co.call(_stylesProp$header);
+    }, []);
     var allSelectableKey = (0, $e7517de803644e56$var$_react.useMemo)(function() {
         return (0, $idhBf.getSelectableRows)({
             displayableRows: displayableRows,
@@ -10131,6 +10315,7 @@ var $e7517de803644e56$var$Header = /*#__PURE__*/ $e7517de803644e56$var$_react["d
         withBorders
     ]);
     var _renderHeaderCellDispatch = function _renderHeaderCellDispatch(params) {
+        var _stylesProp$header2;
         var columnIndex = params.columnIndex;
         var keyColumn = columns[columnIndex].key;
         if (keyColumn === CHECKBOX_COLUMN) return _renderHeaderCheckBoxCell(params);
@@ -10140,7 +10325,8 @@ var $e7517de803644e56$var$Header = /*#__PURE__*/ $e7517de803644e56$var$_react["d
             onOrderChange: onOrderChange,
             isAllCheckedColumn: isAllCheckedColumn,
             displayableRows: displayableRows,
-            allSelectableKey: allSelectableKey
+            allSelectableKey: allSelectableKey,
+            headerCellStylesProp: stylesProp === null || stylesProp === void 0 ? void 0 : (_stylesProp$header2 = stylesProp.header) === null || _stylesProp$header2 === void 0 ? void 0 : _stylesProp$header2.cell
         };
         return /*#__PURE__*/ $e7517de803644e56$var$_react["default"].createElement($e7517de803644e56$var$_Cell["default"], (0, $e7517de803644e56$var$_extends2["default"])({
             column: columns[columnIndex],
@@ -10148,9 +10334,10 @@ var $e7517de803644e56$var$Header = /*#__PURE__*/ $e7517de803644e56$var$_react["d
         }, params, otherProps));
     };
     return /*#__PURE__*/ $e7517de803644e56$var$_react["default"].createElement("div", {
-        className: styles.gridContainer,
+        className: (0, $e7517de803644e56$var$_classnames["default"])(containerCustomStyling === null || containerCustomStyling === void 0 ? void 0 : containerCustomStyling.classes, styles.gridContainer),
         ref: domRef,
-        "data-role": "header"
+        "data-role": "header",
+        style: containerCustomStyling === null || containerCustomStyling === void 0 ? void 0 : containerCustomStyling.style
     }, /*#__PURE__*/ $e7517de803644e56$var$_react["default"].createElement("div", {
         ref: ref,
         "data-role": "row",
@@ -10180,6 +10367,7 @@ module.exports["default"] = $e7517de803644e56$var$_default;
 parcelRequire.register("a1X1i", function(module, exports) {
 "use strict";
 
+
 Object.defineProperty(module.exports, "__esModule", {
     value: true
 });
@@ -10192,7 +10380,7 @@ var $74d7c783859244b3$var$_classnames = $gXNCa$babelruntimehelpersinteropRequire
 
 var $74d7c783859244b3$var$_upperFirst2 = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$lodashupperFirst);
 
-var $74d7c783859244b3$var$_react = $gXNCa$babelruntimehelpersinteropRequireDefault($gXNCa$react);
+var $74d7c783859244b3$var$_react = $74d7c783859244b3$var$_interopRequireWildcard($gXNCa$react);
 
 var $gD8z6 = parcelRequire("gD8z6");
 
@@ -10205,18 +10393,72 @@ var $74d7c783859244b3$var$_Checkbox = $gXNCa$babelruntimehelpersinteropRequireDe
 var $74d7c783859244b3$var$_Sortable = $gXNCa$babelruntimehelpersinteropRequireDefault((parcelRequire("l4kT6")));
 
 var $74d7c783859244b3$var$_styles = $gXNCa$babelruntimehelpersinteropRequireDefault((parcelRequire("jDuSq")));
+function $74d7c783859244b3$var$_getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return ($74d7c783859244b3$var$_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function $74d7c783859244b3$var$_interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) return obj;
+    if (obj === null || $gXNCa$babelruntimehelperstypeof(obj) !== "object" && typeof obj !== "function") return {
+        "default": obj
+    };
+    var cache = $74d7c783859244b3$var$_getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) return cache.get(obj);
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj)if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+        if (desc && (desc.get || desc.set)) Object.defineProperty(newObj, key, desc);
+        else newObj[key] = obj[key];
+    }
+    newObj["default"] = obj;
+    if (cache) cache.set(obj, newObj);
+    return newObj;
+}
+function $74d7c783859244b3$var$ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        enumerableOnly && (symbols = symbols.filter(function(sym) {
+            return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+        })), keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function $74d7c783859244b3$var$_objectSpread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = null != arguments[i] ? arguments[i] : {};
+        i % 2 ? $74d7c783859244b3$var$ownKeys(Object(source), !0).forEach(function(key) {
+            (0, $74d7c783859244b3$var$_defineProperty2["default"])(target, key, source[key]);
+        }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : $74d7c783859244b3$var$ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
 var $74d7c783859244b3$var$HeaderCell = function HeaderCell(_ref) {
-    var allSelectableKey = _ref.allSelectableKey, column = _ref.column, columnIndex = _ref.columnIndex, style = _ref.style, withBorders = _ref.withBorders, wrapHeaderText = _ref.wrapHeaderText, order = _ref.order, orderDirection = _ref.orderDirection, onOrderChange = _ref.onOrderChange, isAllCheckedColumn = _ref.isAllCheckedColumn, displayableRows = _ref.displayableRows;
+    var allSelectableKey = _ref.allSelectableKey, column = _ref.column, columnIndex = _ref.columnIndex, style = _ref.style, headerCellStylesProp = _ref.headerCellStylesProp, withBorders = _ref.withBorders, wrapHeaderText = _ref.wrapHeaderText, order = _ref.order, orderDirection = _ref.orderDirection, onOrderChange = _ref.onOrderChange, isAllCheckedColumn = _ref.isAllCheckedColumn, displayableRows = _ref.displayableRows;
     var header = column.header, keyColumn = column.key, tooltipHeader = column.tooltipHeader, typeCell = column.typeCell, _column$headerOnClick = column.headerOnClick, headerOnClick = _column$headerOnClick === void 0 ? function() {} : _column$headerOnClick, _column$selectAll = column.selectAll, selectAll = _column$selectAll === void 0 ? false : _column$selectAll, _column$variant = column.variant, variant = _column$variant === void 0 ? "primary" : _column$variant, changeOtherColumnOnClick = column.changeOtherColumnOnClick, alignText = column.alignText, sortable = column.sortable;
     var _useConfig = (0, $ckVq7.useConfig)(), send = _useConfig.send, _useConfig$config$sel = _useConfig.config.selectableRowKey, selectableRowKey = _useConfig$config$sel === void 0 ? "id" : _useConfig$config$sel;
     var styles = (0, $74d7c783859244b3$var$_styles["default"])();
     var alignCell = (0, $gD8z6.defineCellAlign)(typeCell, alignText);
+    var customStyling = (0, $74d7c783859244b3$var$_react.useMemo)(function() {
+        return headerCellStylesProp === null || headerCellStylesProp === void 0 ? void 0 : headerCellStylesProp({
+            columnIndex: columnIndex
+        });
+    }, [
+        columnIndex
+    ]);
     var render = function render() {
         var _cx;
         return /*#__PURE__*/ $74d7c783859244b3$var$_react["default"].createElement("div", {
-            className: (0, $74d7c783859244b3$var$_classnames["default"])(styles.cell, (_cx = {}, (0, $74d7c783859244b3$var$_defineProperty2["default"])(_cx, styles["align".concat((0, $74d7c783859244b3$var$_upperFirst2["default"])(alignCell))], alignCell), (0, $74d7c783859244b3$var$_defineProperty2["default"])(_cx, styles.hasSelectAll, selectAll), (0, $74d7c783859244b3$var$_defineProperty2["default"])(_cx, styles.withGrid, withBorders), _cx)),
+            className: (0, $74d7c783859244b3$var$_classnames["default"])(customStyling === null || customStyling === void 0 ? void 0 : customStyling.classes, styles.cell, (_cx = {}, (0, $74d7c783859244b3$var$_defineProperty2["default"])(_cx, styles["align".concat((0, $74d7c783859244b3$var$_upperFirst2["default"])(alignCell))], alignCell), (0, $74d7c783859244b3$var$_defineProperty2["default"])(_cx, styles.hasSelectAll, selectAll), (0, $74d7c783859244b3$var$_defineProperty2["default"])(_cx, styles.withGrid, withBorders), _cx)),
             key: keyColumn,
-            style: style,
+            style: $74d7c783859244b3$var$_objectSpread($74d7c783859244b3$var$_objectSpread({}, style), customStyling === null || customStyling === void 0 ? void 0 : customStyling.style),
             onClick: headerOnClick,
             "data-role": "cell",
             "data-column-key": keyColumn