@true-engineering/true-react-common-ui-kit 3.1.1 → 3.4.0

package/dist/true-react-common-ui-kit.umd.cjs

@@ -8425,7 +8425,7 @@
     return target;
   }
   var AddButton = function(param) {
-    var text = param.text, _param_type = param.type, type = _param_type === void 0 ? "button" : _param_type, isDisabled = param.isDisabled, onClick = param.onClick, isFullWidth = param.isFullWidth, data = param.data, testId = param.testId, tweakStyles = param.tweakStyles;
+    var text = param.text, _param_type = param.type, type = _param_type === void 0 ? "button" : _param_type, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, onClick = param.onClick, _param_isFullWidth = param.isFullWidth, isFullWidth = _param_isFullWidth === void 0 ? false : _param_isFullWidth, data = param.data, testId = param.testId, tweakStyles = param.tweakStyles;
     var classes = useStyles$M({
       theme: tweakStyles
     });
@@ -9092,19 +9092,19 @@
       return _array_like_to_array$n(o, minLen);
   }
   function Checkbox(param) {
-    var children = param.children, isDisabled = param.isDisabled, isReadonly = param.isReadonly, _param_isChecked = param.isChecked, isChecked = _param_isChecked === void 0 ? false : _param_isChecked, value = param.value, data = param.data, testId = param.testId, isSemiChecked = param.isSemiChecked, _param_labelPosition = param.labelPosition, labelPosition = _param_labelPosition === void 0 ? "right" : _param_labelPosition, tweakStyles = param.tweakStyles, onSelect = param.onSelect;
+    var children = param.children, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_isReadonly = param.isReadonly, isReadonly = _param_isReadonly === void 0 ? false : _param_isReadonly, _param_isChecked = param.isChecked, isChecked = _param_isChecked === void 0 ? false : _param_isChecked, value = param.value, data = param.data, testId = param.testId, _param_isSemiChecked = param.isSemiChecked, isSemiChecked = _param_isSemiChecked === void 0 ? false : _param_isSemiChecked, _param_labelPosition = param.labelPosition, labelPosition = _param_labelPosition === void 0 ? "right" : _param_labelPosition, tweakStyles = param.tweakStyles, onSelect = param.onSelect;
     var classes = useStyles$H({
       theme: tweakStyles
     });
     var _useState = _sliced_to_array$n(React.useState(false), 2), isSelected = _useState[0], setIsSelected = _useState[1];
     var hasAction = !isDisabled && !isReadonly;
     var onToggle = function() {
-      var newValue = !isSelected;
+      var isSelectedNext = !isSelected;
       onSelect({
         value,
-        isSelected: newValue
+        isSelected: isSelectedNext
       });
-      setIsSelected(newValue);
+      setIsSelected(isSelectedNext);
     };
     React.useEffect(function() {
       setIsSelected(isChecked);
@@ -9799,6 +9799,38 @@
     }
     return target;
   }
+  function _object_without_properties$b(source, excluded) {
+    if (source == null)
+      return {};
+    var target = _object_without_properties_loose$b(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 _object_without_properties_loose$b(source, excluded) {
+    if (source == null)
+      return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for (i = 0; i < sourceKeys.length; i++) {
+      key = sourceKeys[i];
+      if (excluded.indexOf(key) >= 0)
+        continue;
+      target[key] = source[key];
+    }
+    return target;
+  }
   function _sliced_to_array$l(arr, i) {
     return _array_with_holes$l(arr) || _iterable_to_array_limit$l(arr, i) || _unsupported_iterable_to_array$l(arr, i) || _non_iterable_rest$l();
   }
@@ -9917,8 +9949,44 @@
       };
     }
   };
-  var Input = /* @__PURE__ */ React.forwardRef(function(param, ref) {
-    var _param_value = param.value, value = _param_value === void 0 ? "" : _param_value, label = param.label, placeholder = param.placeholder, _param_type = param.type, type = _param_type === void 0 ? "text" : _param_type, isDisabled = param.isDisabled, isReadonly = param.isReadonly, _param_hasFloatingLabel = param.hasFloatingLabel, hasFloatingLabel = _param_hasFloatingLabel === void 0 ? true : _param_hasFloatingLabel, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isActive = param.isActive, isActive = _param_isActive === void 0 ? false : _param_isActive, _param_isClearable = param.isClearable, isClearable = _param_isClearable === void 0 ? false : _param_isClearable, infoMessage = param.infoMessage, errorMessage = param.errorMessage, _param_errorPosition = param.errorPosition, errorPosition = _param_errorPosition === void 0 ? "bottom" : _param_errorPosition, inlineStyle = param.inlineStyle, border = param.border, isRequired = param.isRequired, isLoading = param.isLoading, isAutoSizeable = param.isAutoSizeable, _param_defaultSize = param.defaultSize, defaultSize = _param_defaultSize === void 0 ? DEFAULT_SIZE : _param_defaultSize, iconType = param.iconType, name = param.name, hasRequiredLabel = param.hasRequiredLabel, data = param.data, tweakStyles = param.tweakStyles, maxLength = param.maxLength, shouldFocusOnMount = param.shouldFocusOnMount, units = param.units, testId = param.testId, tabIndex = param.tabIndex, onChange = param.onChange, onPaste = param.onPaste, onFocus = param.onFocus, onBlur = param.onBlur, onIconClick = param.onIconClick, onKeyDown = param.onKeyDown, mask = param.mask, maskPlaceholder = param.maskPlaceholder, alwaysShowMask = param.alwaysShowMask, shouldAlwaysShowPlaceholder = param.shouldAlwaysShowPlaceholder, beforeMaskedStateChange = param.beforeMaskedStateChange;
+  var Input = /* @__PURE__ */ React.forwardRef(function(_param, ref) {
+    var _param_value = _param.value, value = _param_value === void 0 ? "" : _param_value, label = _param.label, placeholder = _param.placeholder, _param_type = _param.type, type = _param_type === void 0 ? "text" : _param_type, isDisabled = _param.isDisabled, _param_isReadonly = _param.isReadonly, isReadonly = _param_isReadonly === void 0 ? false : _param_isReadonly, _param_hasFloatingLabel = _param.hasFloatingLabel, hasFloatingLabel = _param_hasFloatingLabel === void 0 ? true : _param_hasFloatingLabel, _param_isInvalid = _param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isActive = _param.isActive, isActive = _param_isActive === void 0 ? false : _param_isActive, _param_isClearable = _param.isClearable, isClearable = _param_isClearable === void 0 ? false : _param_isClearable, infoMessage = _param.infoMessage, errorMessage = _param.errorMessage, _param_errorPosition = _param.errorPosition, errorPosition = _param_errorPosition === void 0 ? "bottom" : _param_errorPosition, inlineStyle = _param.inlineStyle, border = _param.border, _param_isRequired = _param.isRequired, isRequired = _param_isRequired === void 0 ? false : _param_isRequired, _param_isLoading = _param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, _param_isAutoSizeable = _param.isAutoSizeable, isAutoSizeable = _param_isAutoSizeable === void 0 ? false : _param_isAutoSizeable, _param_defaultSize = _param.defaultSize, defaultSize = _param_defaultSize === void 0 ? DEFAULT_SIZE : _param_defaultSize, iconType = _param.iconType, hasRequiredLabel = _param.hasRequiredLabel, data = _param.data, tweakStyles = _param.tweakStyles, _param_shouldFocusOnMount = _param.shouldFocusOnMount, shouldFocusOnMount = _param_shouldFocusOnMount === void 0 ? false : _param_shouldFocusOnMount, units = _param.units, testId = _param.testId, onChange = _param.onChange, onFocus = _param.onFocus, onBlur = _param.onBlur, onIconClick = _param.onIconClick, mask = _param.mask, maskPlaceholder = _param.maskPlaceholder, alwaysShowMask = _param.alwaysShowMask, _param_shouldAlwaysShowPlaceholder = _param.shouldAlwaysShowPlaceholder, shouldAlwaysShowPlaceholder = _param_shouldAlwaysShowPlaceholder === void 0 ? false : _param_shouldAlwaysShowPlaceholder, beforeMaskedStateChange = _param.beforeMaskedStateChange, inputProps = _object_without_properties$b(_param, [
+      "value",
+      "label",
+      "placeholder",
+      "type",
+      "isDisabled",
+      "isReadonly",
+      "hasFloatingLabel",
+      "isInvalid",
+      "isActive",
+      "isClearable",
+      "infoMessage",
+      "errorMessage",
+      "errorPosition",
+      "inlineStyle",
+      "border",
+      "isRequired",
+      "isLoading",
+      "isAutoSizeable",
+      "defaultSize",
+      "iconType",
+      "hasRequiredLabel",
+      "data",
+      "tweakStyles",
+      "shouldFocusOnMount",
+      "units",
+      "testId",
+      "onChange",
+      "onFocus",
+      "onBlur",
+      "onIconClick",
+      "mask",
+      "maskPlaceholder",
+      "alwaysShowMask",
+      "shouldAlwaysShowPlaceholder",
+      "beforeMaskedStateChange"
+    ]);
     var classes = useStyles$D({
       theme: tweakStyles
     });
@@ -9973,24 +10041,19 @@
     var hasPlaceholder = (!hasLabel || hasFocus && !isReadonly || shouldAlwaysShowPlaceholder) && trueReactPlatformHelpers.isStringNotEmpty(placeholder);
     var shouldShowUnits = (hasValue || isFocused && !hasPlaceholder) && hasUnits;
     var _obj;
-    var props = _object_spread$H({
+    var props = _object_spread_props$A(_object_spread$H({}, inputProps, trueReactPlatformHelpers.addDataTestId(testId)), {
       className: clsx(classes.input, (_obj = {}, _define_property$J(_obj, classes.withFloatingLabel, hasFloatingLabel && hasLabel), _define_property$J(_obj, classes.withIcons, hasControls), _define_property$J(_obj, classes.withControls, hasControls), _define_property$J(_obj, classes.withUnits, shouldShowUnits), _define_property$J(_obj, classes.floatingLabelWithoutPadding, hasFloatingLabel && hasLabel && border === "bottom"), _obj)),
       onFocus: handleFocus,
       onBlur: handleBlur,
       onChange: handleChange,
-      onKeyDown,
-      onPaste,
       value,
       type,
       disabled: isDisabled,
       placeholder: hasPlaceholder ? placeholder : void 0,
-      name,
-      maxLength,
       autoFocus: shouldFocusOnMount,
       readOnly: isReadonly,
-      size: isAutoSizeable ? defaultSize : void 0,
-      tabIndex
-    }, trueReactPlatformHelpers.addDataTestId(testId));
+      size: isAutoSizeable ? defaultSize : void 0
+    });
     var _obj1, _obj2;
     return /* @__PURE__ */ jsxs("div", {
       className: classes.root,
@@ -10161,7 +10224,7 @@
     return target;
   }
   var DateInput = /* @__PURE__ */ React.forwardRef(function(_param, ref) {
-    var date = _param.date, _param_startDate = _param.startDate, startDate = _param_startDate === void 0 ? "" : _param_startDate, _param_endDate = _param.endDate, endDate = _param_endDate === void 0 ? "" : _param_endDate, mask = _param.mask, className = _param.className, placeholder = _param.placeholder, data = _param.data, isRange = _param.isRange, tweakStyles = _param.tweakStyles, onClick = _param.onClick, onChange = _param.onChange, inputProps = _object_without_properties$a(_param, [
+    var date = _param.date, _param_startDate = _param.startDate, startDate = _param_startDate === void 0 ? "" : _param_startDate, _param_endDate = _param.endDate, endDate = _param_endDate === void 0 ? "" : _param_endDate, mask = _param.mask, className = _param.className, placeholder = _param.placeholder, data = _param.data, _param_isRange = _param.isRange, isRange = _param_isRange === void 0 ? false : _param_isRange, tweakStyles = _param.tweakStyles, onClick = _param.onClick, onChange = _param.onChange, inputProps = _object_without_properties$a(_param, [
       "date",
       "startDate",
       "endDate",
@@ -12143,7 +12206,7 @@
       return _array_like_to_array$j(o, minLen);
   }
   var DatePicker = /* @__PURE__ */ React.forwardRef(function(_param, ref) {
-    var data = _param.data, _param_selectedDate = _param.selectedDate, selectedDate = _param_selectedDate === void 0 ? null : _param_selectedDate, minDate = _param.minDate, maxDate = _param.maxDate, _param_endDate = _param.endDate, endDate = _param_endDate === void 0 ? null : _param_endDate, _param_startDate = _param.startDate, startDate = _param_startDate === void 0 ? null : _param_startDate, locale2 = _param.locale, months = _param.months, _param_calendarStartDay = _param.calendarStartDay, calendarStartDay = _param_calendarStartDay === void 0 ? 1 : _param_calendarStartDay, _param_dateFormat = _param.dateFormat, dateFormat = _param_dateFormat === void 0 ? DEFAULT_DATE_FORMAT$2 : _param_dateFormat, monthsShown = _param.monthsShown, placeholder = _param.placeholder, isRange = _param.isRange, isInline = _param.isInline, isDisabled = _param.isDisabled, isClearable = _param.isClearable, strictParsing = _param.strictParsing, focusSelectedMonth = _param.focusSelectedMonth, disabledKeyboardNavigation = _param.disabledKeyboardNavigation, shouldRenderPopperInBody = _param.shouldRenderPopperInBody, _param_allowSameDay = _param.allowSameDay, allowSameDay = _param_allowSameDay === void 0 ? false : _param_allowSameDay, shouldCloseOnSelect = _param.shouldCloseOnSelect, showPreviousMonths = _param.showPreviousMonths, preventOpenOnFocus = _param.preventOpenOnFocus, popperModifiers = _param.popperModifiers, popperPlacement = _param.popperPlacement, todayButton = _param.todayButton, calendarContainer = _param.calendarContainer, dayClassName = _param.dayClassName, tmp = _param.customInput, CustomInput = tmp === void 0 ? DateInput : tmp, customInputRef = _param.customInputRef, renderCustomHeader = _param.renderCustomHeader, filterDate = _param.filterDate, onYearChange = _param.onYearChange, onMonthChange = _param.onMonthChange, onCalendarOpen = _param.onCalendarOpen, onCalendarClose = _param.onCalendarClose, onChangeDate = _param.onChangeDate, onChangeRange = _param.onChangeRange, onBlur = _param.onBlur, onFocus = _param.onFocus, onKeyDown = _param.onKeyDown, tweakStyles = _param.tweakStyles, inputProps = _object_without_properties$6(_param, [
+    var data = _param.data, _param_selectedDate = _param.selectedDate, selectedDate = _param_selectedDate === void 0 ? null : _param_selectedDate, minDate = _param.minDate, maxDate = _param.maxDate, _param_endDate = _param.endDate, endDate = _param_endDate === void 0 ? null : _param_endDate, _param_startDate = _param.startDate, startDate = _param_startDate === void 0 ? null : _param_startDate, locale2 = _param.locale, months = _param.months, _param_calendarStartDay = _param.calendarStartDay, calendarStartDay = _param_calendarStartDay === void 0 ? 1 : _param_calendarStartDay, _param_dateFormat = _param.dateFormat, dateFormat = _param_dateFormat === void 0 ? DEFAULT_DATE_FORMAT$2 : _param_dateFormat, monthsShown = _param.monthsShown, placeholder = _param.placeholder, _param_isRange = _param.isRange, isRange = _param_isRange === void 0 ? false : _param_isRange, _param_isInline = _param.isInline, isInline = _param_isInline === void 0 ? false : _param_isInline, isDisabled = _param.isDisabled, isClearable = _param.isClearable, strictParsing = _param.strictParsing, focusSelectedMonth = _param.focusSelectedMonth, disabledKeyboardNavigation = _param.disabledKeyboardNavigation, _param_shouldRenderPopperInBody = _param.shouldRenderPopperInBody, shouldRenderPopperInBody = _param_shouldRenderPopperInBody === void 0 ? false : _param_shouldRenderPopperInBody, _param_allowSameDay = _param.allowSameDay, allowSameDay = _param_allowSameDay === void 0 ? false : _param_allowSameDay, shouldCloseOnSelect = _param.shouldCloseOnSelect, showPreviousMonths = _param.showPreviousMonths, preventOpenOnFocus = _param.preventOpenOnFocus, popperModifiers = _param.popperModifiers, popperPlacement = _param.popperPlacement, todayButton = _param.todayButton, calendarContainer = _param.calendarContainer, dayClassName = _param.dayClassName, tmp = _param.customInput, CustomInput = tmp === void 0 ? DateInput : tmp, customInputRef = _param.customInputRef, renderCustomHeader = _param.renderCustomHeader, filterDate = _param.filterDate, onYearChange = _param.onYearChange, onMonthChange = _param.onMonthChange, onCalendarOpen = _param.onCalendarOpen, onCalendarClose = _param.onCalendarClose, onChangeDate = _param.onChangeDate, onChangeRange = _param.onChangeRange, onBlur = _param.onBlur, onFocus = _param.onFocus, onKeyDown = _param.onKeyDown, tweakStyles = _param.tweakStyles, inputProps = _object_without_properties$6(_param, [
       "data",
       "selectedDate",
       "minDate",
@@ -24561,6 +24624,10 @@
       */
       maxHeight: "100%"
     },
+    head: {},
+    body: {},
+    loaderRow: {},
+    loaderCell: {},
     loader: {
       position: "sticky",
       left: 0,
@@ -24628,6 +24695,9 @@
     headerSecond: {
       paddingLeft: STICKY_SHADOW_PADDING
     },
+    nothingFoundRow: {},
+    nothingFound: {},
+    skeletonRow: {},
     skeleton: {
       height: 21,
       padding: [
@@ -24730,15 +24800,16 @@
     return obj;
   }
   function FlexibleTableCell(param) {
-    var item = param.item, columnName = param.columnName, config = param.config, isFocusedRow = param.isFocusedRow, isSecond = param.isSecond, isSticky = param.isSticky, isNestedComponentExpanded = param.isNestedComponentExpanded, isRowNestedComponentExpanded = param.isRowNestedComponentExpanded, tweakStyles = param.tweakStyles, onSetNestedComponent = param.onSetNestedComponent;
+    var item = param.item, columnName = param.columnName, config = param.config, _param_renderMode = param.renderMode, renderMode = _param_renderMode === void 0 ? "table" : _param_renderMode, isFocusedRow = param.isFocusedRow, isSecond = param.isSecond, isSticky = param.isSticky, isNestedComponentExpanded = param.isNestedComponentExpanded, isRowNestedComponentExpanded = param.isRowNestedComponentExpanded, tweakStyles = param.tweakStyles, onSetNestedComponent = param.onSetNestedComponent;
     var classes = useStyles$j({
       theme: tweakStyles
     });
     var _config_columnName;
     var _ref = (_config_columnName = config[columnName]) !== null && _config_columnName !== void 0 ? _config_columnName : {}, component = _ref.component, cellAlign = _ref.cellAlign, position = _ref.position, right2 = _ref.right, left2 = _ref.left, cellVerticalAlign = _ref.cellVerticalAlign;
     var value = item[columnName];
+    var TableCell = renderMode === "divs" ? "div" : "td";
     var _obj;
-    return /* @__PURE__ */ jsx("td", {
+    return /* @__PURE__ */ jsx(TableCell, {
       className: clsx(classes.root, (_obj = {}, _define_property$l(_obj, classes.sticky, isSticky), _define_property$l(_obj, classes.second, isSecond), _obj)),
       style: {
         textAlign: cellAlign,
@@ -24769,7 +24840,8 @@
     },
     clickable: {
       cursor: "pointer"
-    }
+    },
+    nestedComponent: {}
   });
   function _array_like_to_array$9(arr, len) {
     if (len == null || len > arr.length)
@@ -24882,7 +24954,7 @@
       return _array_like_to_array$9(o, minLen);
   }
   function FlexibleTableRowInner(param) {
-    var item = param.item, uniqueField = param.uniqueField, isFirstColumnSticky = param.isFirstColumnSticky, isActive = param.isActive, config = param.config, enabledColumns = param.enabledColumns, rowAttributes = param.rowAttributes, tweakStyles = param.tweakStyles, expandableRowComponent = param.expandableRowComponent, onRowHover = param.onRowHover, onRowClick = param.onRowClick;
+    var item = param.item, uniqueField = param.uniqueField, isFirstColumnSticky = param.isFirstColumnSticky, isActive = param.isActive, config = param.config, enabledColumns = param.enabledColumns, rowAttributes = param.rowAttributes, _param_renderMode = param.renderMode, renderMode = _param_renderMode === void 0 ? "table" : _param_renderMode, tweakStyles = param.tweakStyles, expandableRowComponent = param.expandableRowComponent, onRowHover = param.onRowHover, onRowClick = param.onRowClick;
     var classes = useStyles$i({
       theme: tweakStyles
     });
@@ -24940,10 +25012,12 @@
     };
     var items = enabledColumns !== null && enabledColumns !== void 0 ? enabledColumns : Object.keys(config);
     var isEditable = trueReactPlatformHelpers.isNotEmpty(onRowClick) || trueReactPlatformHelpers.isNotEmpty(onRowHover);
+    var TableRow = renderMode === "divs" ? "div" : "tr";
+    var TableCell = renderMode === "divs" ? "div" : "td";
     var _obj;
     return /* @__PURE__ */ jsxs(Fragment, {
       children: [
-        /* @__PURE__ */ jsx("tr", _object_spread_props$i(_object_spread$j({
+        /* @__PURE__ */ jsx(TableRow, _object_spread_props$i(_object_spread$j({
           className: clsx(classes.root, (_obj = {}, _define_property$k(_obj, classes.active, isActive), _define_property$k(_obj, classes.editable, isEditable), _define_property$k(_obj, classes.clickable, trueReactPlatformHelpers.isNotEmpty(onRowClick) || trueReactPlatformHelpers.isNotEmpty(expandableRowComponent)), _obj)),
           onMouseEnter: function(e) {
             if (uniqueField !== void 0 && onRowHover !== void 0) {
@@ -24967,6 +25041,7 @@
               item,
               config,
               tweakStyles: tweakTableCellStyles,
+              renderMode,
               isFocusedRow: isFocused,
               isNestedComponentExpanded: nestedComponent.isOpen && nestedComponent.cellKey === key,
               isRowNestedComponentExpanded: nestedComponent.isOpen && nestedComponent.cellKey === void 0,
@@ -24976,9 +25051,10 @@
             }, key);
           })
         })),
-        nestedComponent.isOpen && /* @__PURE__ */ jsx("tr", {
+        nestedComponent.isOpen && /* @__PURE__ */ jsx(TableRow, {
           className: classes.root,
-          children: /* @__PURE__ */ jsx("td", {
+          children: /* @__PURE__ */ jsx(TableCell, {
+            className: classes.nestedComponent,
             colSpan: items.length,
             children: nestedComponent.component
           })
@@ -25040,7 +25116,7 @@
     return target;
   }
   function FlexibleTable(param) {
-    var data = param.data, tweakStyles = param.tweakStyles, content = param.content, headerContent = param.headerContent, config = param.config, activeRows = param.activeRows, enabledColumns = param.enabledColumns, isHorizontallyScrollable = param.isHorizontallyScrollable, isFirstColumnSticky = param.isFirstColumnSticky, infinityScrollConfig = param.infinityScrollConfig, uniqueField = param.uniqueField, isLoading = param.isLoading, onHeadClick = param.onHeadClick, onRowHover = param.onRowHover, onRowClick = param.onRowClick, refForScroll = param.refForScroll, rowAttributes = param.rowAttributes, nothingFoundContent = param.nothingFoundContent, testId = param.testId, expandableRowComponent = param.expandableRowComponent;
+    var data = param.data, tweakStyles = param.tweakStyles, content = param.content, headerContent = param.headerContent, config = param.config, activeRows = param.activeRows, enabledColumns = param.enabledColumns, _param_isHorizontallyScrollable = param.isHorizontallyScrollable, isHorizontallyScrollable = _param_isHorizontallyScrollable === void 0 ? false : _param_isHorizontallyScrollable, _param_isFirstColumnSticky = param.isFirstColumnSticky, isFirstColumnSticky = _param_isFirstColumnSticky === void 0 ? false : _param_isFirstColumnSticky, infinityScrollConfig = param.infinityScrollConfig, uniqueField = param.uniqueField, _param_isLoading = param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, _param_renderMode = param.renderMode, renderMode = _param_renderMode === void 0 ? "table" : _param_renderMode, onHeadClick = param.onHeadClick, onRowHover = param.onRowHover, onRowClick = param.onRowClick, refForScroll = param.refForScroll, rowAttributes = param.rowAttributes, nothingFoundContent = param.nothingFoundContent, testId = param.testId, expandableRowComponent = param.expandableRowComponent;
     var classes = useStyles$k({
       theme: tweakStyles
     });
@@ -25076,6 +25152,7 @@
     }), [
       getDataScrollAttributeSetter
     ]);
+    var shouldShowNothingFound = !trueReactPlatformHelpers.isArrayNotEmpty(content) && nothingFoundContent !== void 0 && !(infinityScrollConfig === null || infinityScrollConfig === void 0 ? void 0 : infinityScrollConfig.isLoading) && ((infinityScrollConfig === null || infinityScrollConfig === void 0 ? void 0 : infinityScrollConfig.isLastPage) === void 0 || infinityScrollConfig.isLastPage);
     var ref = useMergedRefs([
       refForScroll,
       scrollRef,
@@ -25126,16 +25203,25 @@
       setIsScrolledAttribute,
       setHasScrollBarAttribute
     ]);
+    var Table = renderMode === "divs" ? "div" : "table";
+    var TableHead = renderMode === "divs" ? "div" : "thead";
+    var TableBody = renderMode === "divs" ? "div" : "tbody";
+    var TableRow = renderMode === "divs" ? "div" : "tr";
+    var TableHeader = renderMode === "divs" ? "div" : "th";
+    var TableCell = renderMode === "divs" ? "div" : "td";
     var _activeRows_includes;
     return /* @__PURE__ */ jsx("div", {
       ref,
       className: clsx(_define_property$j({}, classes.scroll, isHorizontallyScrollable)),
-      children: /* @__PURE__ */ jsxs("table", _object_spread_props$h(_object_spread$i({
+      children: /* @__PURE__ */ jsxs(Table, _object_spread_props$h(_object_spread$i({
         className: classes.root
-      }, trueReactPlatformHelpers.addDataTestId(testId), addDataAttributes(data)), {
+      }, trueReactPlatformHelpers.addDataTestId(testId), addDataAttributes(_object_spread_props$h(_object_spread$i({}, data), {
+        isLoading
+      }))), {
         children: [
-          /* @__PURE__ */ jsx("thead", {
-            children: /* @__PURE__ */ jsx("tr", {
+          /* @__PURE__ */ jsx(TableHead, {
+            className: classes.head,
+            children: /* @__PURE__ */ jsx(TableRow, {
               className: classes.headerRow,
               children: showedColumns.map(function(key, i) {
                 var itemConfig = config === null || config === void 0 ? void 0 : config[key];
@@ -25149,7 +25235,7 @@
                 }
                 var _itemConfig_titleAlign;
                 var _obj;
-                return /* @__PURE__ */ jsx("th", {
+                return /* @__PURE__ */ jsx(TableHeader, {
                   className: clsx(classes.header, (_obj = {}, _define_property$j(_obj, classes.headerSticky, isFirstColumnSticky && i === 0), _define_property$j(_obj, classes.headerSecond, isFirstColumnSticky && i === 1), _obj)),
                   style: {
                     minWidth: itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.minWidth,
@@ -25165,11 +25251,13 @@
               })
             })
           }),
-          /* @__PURE__ */ jsx("tbody", {
+          /* @__PURE__ */ jsx(TableBody, {
+            className: classes.body,
             children: isLoading ? trueReactPlatformHelpers.indexMap(6, function(i) {
-              return /* @__PURE__ */ jsx("tr", {
+              return /* @__PURE__ */ jsx(TableRow, {
+                className: classes.skeletonRow,
                 children: showedColumns.map(function(_, j) {
-                  return /* @__PURE__ */ jsx("td", {
+                  return /* @__PURE__ */ jsx(TableCell, {
                     className: classes.skeleton,
                     children: /* @__PURE__ */ jsx(Skeleton, {})
                   }, j);
@@ -25177,8 +25265,10 @@
               }, i);
             }) : /* @__PURE__ */ jsxs(Fragment, {
               children: [
-                !trueReactPlatformHelpers.isArrayNotEmpty(content) && nothingFoundContent !== void 0 && !(infinityScrollConfig === null || infinityScrollConfig === void 0 ? void 0 : infinityScrollConfig.isLoading) && ((infinityScrollConfig === null || infinityScrollConfig === void 0 ? void 0 : infinityScrollConfig.isLastPage) === void 0 || infinityScrollConfig.isLastPage) && /* @__PURE__ */ jsx("tr", {
-                  children: /* @__PURE__ */ jsx("td", {
+                shouldShowNothingFound && /* @__PURE__ */ jsx(TableRow, {
+                  className: classes.nothingFoundRow,
+                  children: /* @__PURE__ */ jsx(TableCell, {
+                    className: classes.nothingFound,
                     colSpan: showedColumns.length,
                     children: nothingFoundContent
                   })
@@ -25194,12 +25284,15 @@
                     enabledColumns,
                     config,
                     rowAttributes,
+                    renderMode,
                     tweakStyles: tweakTableRowStyles,
                     expandableRowComponent
                   }, trueReactPlatformHelpers.isNotEmpty(uniqueField) ? item[uniqueField] : i);
                 }),
-                infinityScrollConfig !== void 0 && !infinityScrollConfig.isLastPage && /* @__PURE__ */ jsx("tr", {
-                  children: /* @__PURE__ */ jsx("td", {
+                infinityScrollConfig !== void 0 && !infinityScrollConfig.isLastPage && /* @__PURE__ */ jsx(TableRow, {
+                  className: classes.loaderRow,
+                  children: /* @__PURE__ */ jsx(TableCell, {
+                    className: classes.loaderCell,
                     colSpan: showedColumns.length,
                     children: /* @__PURE__ */ jsx("div", {
                       ref: initIntersectionObserver,
@@ -25851,7 +25944,7 @@
       return _array_like_to_array$8(o, minLen);
   }
   var Modal = function(_param) {
-    var data = _param.data, tweakStyles = _param.tweakStyles, title = _param.title, _param_size = _param.size, size = _param_size === void 0 ? "l" : _param_size, isFooterSticky = _param.isFooterSticky, buttons = _param.buttons, _param_buttonsAlign = _param.buttonsAlign, buttonsAlign = _param_buttonsAlign === void 0 ? "right" : _param_buttonsAlign, _param_hasCloseButton = _param.hasCloseButton, hasCloseButton = _param_hasCloseButton === void 0 ? true : _param_hasCloseButton, _param_hasOverlay = _param.hasOverlay, hasOverlay = _param_hasOverlay === void 0 ? true : _param_hasOverlay, _param_isOpen = _param.isOpen, isOpen = _param_isOpen === void 0 ? false : _param_isOpen, _param_position = _param.position, position = _param_position === void 0 ? "center" : _param_position, children = _param.children, zIndex = _param.zIndex, testId = _param.testId, _param_shouldCloseOnOverlayClick = _param.shouldCloseOnOverlayClick, shouldCloseOnOverlayClick = _param_shouldCloseOnOverlayClick === void 0 ? true : _param_shouldCloseOnOverlayClick, _param_shouldCloseOnEsc = _param.shouldCloseOnEsc, shouldCloseOnEsc = _param_shouldCloseOnEsc === void 0 ? true : _param_shouldCloseOnEsc, _param_shouldBlockScroll = _param.shouldBlockScroll, shouldBlockScroll = _param_shouldBlockScroll === void 0 ? true : _param_shouldBlockScroll, _param_timeout = _param.timeout, timeout = _param_timeout === void 0 ? 150 : _param_timeout, _param_unmountOnExit = _param.unmountOnExit, unmountOnExit = _param_unmountOnExit === void 0 ? true : _param_unmountOnExit, onClose = _param.onClose, restProps = _object_without_properties$3(_param, [
+    var data = _param.data, tweakStyles = _param.tweakStyles, title = _param.title, _param_size = _param.size, size = _param_size === void 0 ? "l" : _param_size, _param_isFooterSticky = _param.isFooterSticky, isFooterSticky = _param_isFooterSticky === void 0 ? false : _param_isFooterSticky, buttons = _param.buttons, _param_buttonsAlign = _param.buttonsAlign, buttonsAlign = _param_buttonsAlign === void 0 ? "right" : _param_buttonsAlign, _param_hasCloseButton = _param.hasCloseButton, hasCloseButton = _param_hasCloseButton === void 0 ? true : _param_hasCloseButton, _param_hasOverlay = _param.hasOverlay, hasOverlay = _param_hasOverlay === void 0 ? true : _param_hasOverlay, _param_isOpen = _param.isOpen, isOpen = _param_isOpen === void 0 ? false : _param_isOpen, _param_position = _param.position, position = _param_position === void 0 ? "center" : _param_position, children = _param.children, zIndex = _param.zIndex, testId = _param.testId, _param_shouldCloseOnOverlayClick = _param.shouldCloseOnOverlayClick, shouldCloseOnOverlayClick = _param_shouldCloseOnOverlayClick === void 0 ? true : _param_shouldCloseOnOverlayClick, _param_shouldCloseOnEsc = _param.shouldCloseOnEsc, shouldCloseOnEsc = _param_shouldCloseOnEsc === void 0 ? true : _param_shouldCloseOnEsc, _param_shouldBlockScroll = _param.shouldBlockScroll, shouldBlockScroll = _param_shouldBlockScroll === void 0 ? true : _param_shouldBlockScroll, _param_timeout = _param.timeout, timeout = _param_timeout === void 0 ? 150 : _param_timeout, _param_unmountOnExit = _param.unmountOnExit, unmountOnExit = _param_unmountOnExit === void 0 ? true : _param_unmountOnExit, onClose = _param.onClose, restProps = _object_without_properties$3(_param, [
       "data",
       "tweakStyles",
       "title",
@@ -26149,7 +26242,7 @@
       return _array_like_to_array$7(o, minLen);
   }
   var MoreMenu = function(param) {
-    var items = param.items, isDisabled = param.isDisabled, _param_hasDefaultStateBackground = param.hasDefaultStateBackground, hasDefaultStateBackground = _param_hasDefaultStateBackground === void 0 ? true : _param_hasDefaultStateBackground, data = param.data, testId = param.testId, tweakStyles = param.tweakStyles, onMenuOpen = param.onMenuOpen, onMenuClose = param.onMenuClose;
+    var items = param.items, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_hasDefaultStateBackground = param.hasDefaultStateBackground, hasDefaultStateBackground = _param_hasDefaultStateBackground === void 0 ? true : _param_hasDefaultStateBackground, data = param.data, testId = param.testId, tweakStyles = param.tweakStyles, onMenuOpen = param.onMenuOpen, onMenuClose = param.onMenuClose;
     var classes = useStyles$f({
       theme: tweakStyles
     });
@@ -26474,7 +26567,7 @@
       return _array_like_to_array$6(o, minLen);
   }
   function MultiSelect(param) {
-    var value = param.value, _param_corners = param.corners, corners = _param_corners === void 0 ? "full" : _param_corners, isInvalid = param.isInvalid, isRequired = param.isRequired, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_placeholder = param.placeholder, placeholder = _param_placeholder === void 0 ? "" : _param_placeholder, localeKey = param.localeKey, locale2 = param.locale, testId = param.testId, data = param.data, onChange = param.onChange, fetchOptions = param.fetchOptions, tweakStyles = param.tweakStyles;
+    var value = param.value, _param_corners = param.corners, corners = _param_corners === void 0 ? "full" : _param_corners, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isRequired = param.isRequired, isRequired = _param_isRequired === void 0 ? false : _param_isRequired, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_placeholder = param.placeholder, placeholder = _param_placeholder === void 0 ? "" : _param_placeholder, localeKey = param.localeKey, locale2 = param.locale, testId = param.testId, data = param.data, onChange = param.onChange, fetchOptions = param.fetchOptions, tweakStyles = param.tweakStyles;
     var classes = useStyles$d({
       theme: tweakStyles
     });
@@ -27428,7 +27521,7 @@
     return target;
   }
   function RadioButton(param) {
-    var children = param.children, value = param.value, groupName = param.groupName, isChecked = param.isChecked, isDisabled = param.isDisabled, isInvalid = param.isInvalid, data = param.data, testId = param.testId, tweakStyles = param.tweakStyles, onChange = param.onChange;
+    var children = param.children, value = param.value, groupName = param.groupName, isChecked = param.isChecked, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, data = param.data, testId = param.testId, tweakStyles = param.tweakStyles, onChange = param.onChange;
     var classes = useStyles$9({
       theme: tweakStyles
     });
@@ -28022,7 +28115,7 @@
     var getUpperCaseIfNeeded = function getUpperCaseIfNeeded2(str) {
       return isUpperCase ? str.toUpperCase() : str;
     };
-    var onChange = _param.onChange, isUpperCase = _param.isUpperCase, _param_smartType = _param.smartType, smartType = _param_smartType === void 0 ? "default" : _param_smartType, regExp = _param.regExp, _param_value = _param.value, value = _param_value === void 0 ? "" : _param_value, maxLength = _param.maxLength, rest = _object_without_properties$1(_param, [
+    var onChange = _param.onChange, _param_isUpperCase = _param.isUpperCase, isUpperCase = _param_isUpperCase === void 0 ? false : _param_isUpperCase, _param_smartType = _param.smartType, smartType = _param_smartType === void 0 ? "default" : _param_smartType, regExp = _param.regExp, _param_value = _param.value, value = _param_value === void 0 ? "" : _param_value, maxLength = _param.maxLength, rest = _object_without_properties$1(_param, [
       "onChange",
       "isUpperCase",
       "smartType",
@@ -28435,7 +28528,7 @@
     return target;
   }
   var Switch = function(param) {
-    var isDisabled = param.isDisabled, _param_isChecked = param.isChecked, isChecked = _param_isChecked === void 0 ? false : _param_isChecked, isInvalid = param.isInvalid, value = param.value, children = param.children, _param_labelPosition = param.labelPosition, labelPosition = _param_labelPosition === void 0 ? "right" : _param_labelPosition, _param_color = param.color, color = _param_color === void 0 ? "primary" : _param_color, data = param.data, tweakStyles = param.tweakStyles, testId = param.testId, onChange = param.onChange;
+    var _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_isChecked = param.isChecked, isChecked = _param_isChecked === void 0 ? false : _param_isChecked, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, value = param.value, children = param.children, _param_labelPosition = param.labelPosition, labelPosition = _param_labelPosition === void 0 ? "right" : _param_labelPosition, _param_color = param.color, color = _param_color === void 0 ? "primary" : _param_color, data = param.data, tweakStyles = param.tweakStyles, testId = param.testId, onChange = param.onChange;
     var classes = useStyles$6({
       theme: tweakStyles
     });
@@ -28718,7 +28811,7 @@
   }
   var DEFAULT_VALUE = "";
   var TextArea = function(param) {
-    var _param_value = param.value, value = _param_value === void 0 ? DEFAULT_VALUE : _param_value, label = param.label, placeholder = param.placeholder, isDisabled = param.isDisabled, _param_hasFloatingLabel = param.hasFloatingLabel, hasFloatingLabel = _param_hasFloatingLabel === void 0 ? true : _param_hasFloatingLabel, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isActive = param.isActive, isActive = _param_isActive === void 0 ? false : _param_isActive, infoMessage = param.infoMessage, errorMessage = param.errorMessage, isRequired = param.isRequired, name = param.name, hasRequiredLabel = param.hasRequiredLabel, shouldFocusOnMount = param.shouldFocusOnMount, _param_hasCounter = param.hasCounter, hasCounter = _param_hasCounter === void 0 ? true : _param_hasCounter, _param_shouldTrimAfterMaxLength = param.shouldTrimAfterMaxLength, shouldTrimAfterMaxLength = _param_shouldTrimAfterMaxLength === void 0 ? false : _param_shouldTrimAfterMaxLength, maxLength = param.maxLength, rows = param.rows, testId = param.testId, data = param.data, tweakStyles = param.tweakStyles, onChange = param.onChange, onPaste = param.onPaste, onFocus = param.onFocus, onBlur = param.onBlur;
+    var _param_value = param.value, value = _param_value === void 0 ? DEFAULT_VALUE : _param_value, label = param.label, placeholder = param.placeholder, isDisabled = param.isDisabled, _param_hasFloatingLabel = param.hasFloatingLabel, hasFloatingLabel = _param_hasFloatingLabel === void 0 ? true : _param_hasFloatingLabel, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isActive = param.isActive, isActive = _param_isActive === void 0 ? false : _param_isActive, infoMessage = param.infoMessage, errorMessage = param.errorMessage, _param_isRequired = param.isRequired, isRequired = _param_isRequired === void 0 ? false : _param_isRequired, name = param.name, _param_hasRequiredLabel = param.hasRequiredLabel, hasRequiredLabel = _param_hasRequiredLabel === void 0 ? false : _param_hasRequiredLabel, _param_shouldFocusOnMount = param.shouldFocusOnMount, shouldFocusOnMount = _param_shouldFocusOnMount === void 0 ? false : _param_shouldFocusOnMount, _param_hasCounter = param.hasCounter, hasCounter = _param_hasCounter === void 0 ? true : _param_hasCounter, _param_shouldTrimAfterMaxLength = param.shouldTrimAfterMaxLength, shouldTrimAfterMaxLength = _param_shouldTrimAfterMaxLength === void 0 ? false : _param_shouldTrimAfterMaxLength, maxLength = param.maxLength, rows = param.rows, testId = param.testId, data = param.data, tweakStyles = param.tweakStyles, onChange = param.onChange, onPaste = param.onPaste, onFocus = param.onFocus, onBlur = param.onBlur;
     var classes = useStyles$5({
       theme: tweakStyles
     });
@@ -29302,7 +29395,7 @@
       return _array_like_to_array(o, minLen);
   }
   var TextWithTooltip = function(param) {
-    var children = param.children, tooltipText = param.tooltipText, _param_tooltipPosition = param.tooltipPosition, tooltipPosition = _param_tooltipPosition === void 0 ? "top" : _param_tooltipPosition, _param_tooltipView = param.tooltipView, tooltipView = _param_tooltipView === void 0 ? "tooltip" : _param_tooltipView, tooltipType = param.tooltipType, _param_tooltipModifiers = param.tooltipModifiers, tooltipModifiers = _param_tooltipModifiers === void 0 ? [] : _param_tooltipModifiers, tooltipOffsetOptions = param.tooltipOffsetOptions, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_shouldRenderInBody = param.shouldRenderInBody, shouldRenderInBody = _param_shouldRenderInBody === void 0 ? true : _param_shouldRenderInBody, _param_mouseEventType = param.mouseEventType, mouseEventType = _param_mouseEventType === void 0 ? "hover" : _param_mouseEventType, hoverDelay = param.hoverDelay, testId = param.testId, data = param.data, tweakStyles = param.tweakStyles;
+    var children = param.children, tooltipText = param.tooltipText, _param_tooltipPosition = param.tooltipPosition, tooltipPosition = _param_tooltipPosition === void 0 ? "top" : _param_tooltipPosition, _param_tooltipView = param.tooltipView, tooltipView = _param_tooltipView === void 0 ? "tooltip" : _param_tooltipView, _param_tooltipType = param.tooltipType, tooltipType = _param_tooltipType === void 0 ? "info" : _param_tooltipType, _param_tooltipModifiers = param.tooltipModifiers, tooltipModifiers = _param_tooltipModifiers === void 0 ? [] : _param_tooltipModifiers, tooltipOffsetOptions = param.tooltipOffsetOptions, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_shouldRenderInBody = param.shouldRenderInBody, shouldRenderInBody = _param_shouldRenderInBody === void 0 ? true : _param_shouldRenderInBody, _param_mouseEventType = param.mouseEventType, mouseEventType = _param_mouseEventType === void 0 ? "hover" : _param_mouseEventType, hoverDelay = param.hoverDelay, testId = param.testId, data = param.data, tweakStyles = param.tweakStyles;
     var classes = useStyles$2({
       theme: tweakStyles
     });