primereact 8.7.2 → 8.7.3

package/datatable/datatable.js

@@ -29,20 +29,45 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     _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 _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 _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 _toPropertyKey(arg) {
+    var key = _toPrimitive(arg, "string");
+    return _typeof(key) === "symbol" ? key : String(key);
+  }
+
   function _defineProperty(obj, key, value) {
+    key = _toPropertyKey(key);
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value: value,
@@ -53,17 +78,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     } else {
       obj[key] = value;
     }
-
     return obj;
   }
 
   function _arrayLikeToArray(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
-
     for (var i = 0, arr2 = new Array(len); i < len; i++) {
       arr2[i] = arr[i];
     }
-
     return arr2;
   }
 
@@ -97,33 +119,33 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
   }
 
   function _iterableToArrayLimit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-
-    var _s, _e;
-
-    try {
-      for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
-        _arr.push(_s.value);
-
-        if (i && _arr.length === i) break;
-      }
-    } catch (err) {
-      _d = true;
-      _e = err;
-    } finally {
+    var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+    if (null != _i) {
+      var _s,
+        _e,
+        _x,
+        _r,
+        _arr = [],
+        _n = !0,
+        _d = !1;
       try {
-        if (!_n && _i["return"] != null) _i["return"]();
+        if (_x = (_i = _i.call(arr)).next, 0 === i) {
+          if (Object(_i) !== _i) return;
+          _n = !1;
+        } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {
+          ;
+        }
+      } catch (err) {
+        _d = !0, _e = err;
       } finally {
-        if (_d) throw _e;
+        try {
+          if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+        } finally {
+          if (_d) throw _e;
+        }
       }
+      return _arr;
     }
-
-    return _arr;
   }
 
   function _nonIterableRest() {
@@ -139,13 +161,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     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;
   }
 
@@ -153,10 +173,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     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;
@@ -164,38 +182,32 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         target[key] = source[key];
       }
     }
-
     return target;
   }
 
   var RowCheckbox = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState(false),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        focusedState = _React$useState2[0],
-        setFocusedState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      focusedState = _React$useState2[0],
+      setFocusedState = _React$useState2[1];
     var onFocus = function onFocus() {
       setFocusedState(true);
     };
-
     var onBlur = function onBlur() {
       setFocusedState(false);
     };
-
     var onClick = function onClick(event) {
       if (!props.disabled) {
         setFocusedState(true);
         props.onChange(event);
       }
     };
-
     var onKeyDown = function onKeyDown(event) {
       if (event.code === 'Space') {
         onClick(event);
         event.preventDefault();
       }
     };
-
     var className = utils.classNames('p-checkbox p-component', {
       'p-checkbox-focused': focusedState
     });
@@ -228,38 +240,31 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
 
   var RowRadioButton = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState(false),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        focusedState = _React$useState2[0],
-        setFocusedState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      focusedState = _React$useState2[0],
+      setFocusedState = _React$useState2[1];
     var inputRef = React__namespace.useRef(null);
-
     var onFocus = function onFocus() {
       setFocusedState(true);
     };
-
     var onBlur = function onBlur() {
       setFocusedState(false);
     };
-
     var onClick = function onClick(event) {
       if (!props.disabled) {
         props.onChange(event);
         utils.DomHandler.focus(inputRef.current);
       }
     };
-
     var onKeyDown = function onKeyDown(event) {
       if (event.code === 'Space') {
         onClick(event);
         event.preventDefault();
       }
     };
-
     var onChange = function onChange(event) {
       onClick(event);
     };
-
     var className = utils.classNames('p-radiobutton p-component', {
       'p-radiobutton-focused': focusedState
     });
@@ -295,87 +300,70 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
   RowRadioButton.displayName = 'RowRadioButton';
 
   function ownKeys$7(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 _objectSpread$7(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$7(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var BodyCell = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState(props.editing),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        editingState = _React$useState2[0],
-        setEditingState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      editingState = _React$useState2[0],
+      setEditingState = _React$useState2[1];
     var _React$useState3 = React__namespace.useState(props.rowData),
-        _React$useState4 = _slicedToArray(_React$useState3, 2),
-        editingRowDataState = _React$useState4[0],
-        setEditingRowDataState = _React$useState4[1];
-
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      editingRowDataState = _React$useState4[0],
+      setEditingRowDataState = _React$useState4[1];
     var _React$useState5 = React__namespace.useState({}),
-        _React$useState6 = _slicedToArray(_React$useState5, 2),
-        styleObjectState = _React$useState6[0],
-        setStyleObjectState = _React$useState6[1];
-
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      styleObjectState = _React$useState6[0],
+      setStyleObjectState = _React$useState6[1];
     var elementRef = React__namespace.useRef(null);
     var keyHelperRef = React__namespace.useRef(null);
     var overlayEventListener = React__namespace.useRef(null);
     var selfClick = React__namespace.useRef(false);
     var tabindexTimeout = React__namespace.useRef(null);
     var initFocusTimeout = React__namespace.useRef(null);
-
     var getColumnProp = function getColumnProp(prop) {
       return props.column ? props.column.props[prop] : null;
     };
-
     var field = getColumnProp('field') || "field_".concat(props.index);
     var editingKey = props.dataKey ? props.rowData[props.dataKey] || props.rowIndex : props.rowIndex;
-
     var _useEventListener = hooks.useEventListener({
-      type: 'click',
-      listener: function listener(e) {
-        if (!selfClick.current && isOutsideClicked(e.target)) {
-          switchCellToViewMode(e, true);
-        }
-
-        selfClick.current = false;
-      },
-      options: true
-    }),
-        _useEventListener2 = _slicedToArray(_useEventListener, 2),
-        bindDocumentClickListener = _useEventListener2[0],
-        unbindDocumentClickListener = _useEventListener2[1];
-
+        type: 'click',
+        listener: function listener(e) {
+          if (!selfClick.current && isOutsideClicked(e.target)) {
+            switchCellToViewMode(e, true);
+          }
+          selfClick.current = false;
+        },
+        options: true
+      }),
+      _useEventListener2 = _slicedToArray(_useEventListener, 2),
+      bindDocumentClickListener = _useEventListener2[0],
+      unbindDocumentClickListener = _useEventListener2[1];
     if (props.editMode === 'row' && props.editing !== editingState) {
       setEditingState(props.editing);
     }
-
     var isEditable = function isEditable() {
       return getColumnProp('editor');
     };
-
     var isSelected = function isSelected() {
       return props.selection ? props.selection instanceof Array ? findIndex(props.selection) > -1 : equals(props.selection) : false;
     };
-
     var equalsData = function equalsData(data) {
       return props.compareSelectionBy === 'equals' ? data === props.rowData : utils.ObjectUtils.equals(data, props.rowData, props.dataKey);
     };
-
     var equals = function equals(selectedCell) {
       return (selectedCell.rowIndex === props.rowIndex || equalsData(selectedCell.rowData)) && (selectedCell.field === field || selectedCell.cellIndex === props.index);
     };
-
     var isOutsideClicked = function isOutsideClicked(target) {
       return elementRef.current && !(elementRef.current.isSameNode(target) || elementRef.current.contains(target));
     };
-
     var getVirtualScrollerOption = function getVirtualScrollerOption(option) {
       return props.virtualScrollerOptions ? props.virtualScrollerOptions[option] : null;
     };
-
     var getStyle = function getStyle() {
       var bodyStyle = getColumnProp('bodyStyle');
       var columnStyle = getColumnProp('style');
       return getColumnProp('frozen') ? Object.assign({}, columnStyle, bodyStyle, styleObjectState) : Object.assign({}, columnStyle, bodyStyle);
     };
-
     var getCellParams = function getCellParams() {
       return {
         value: resolveFieldData(),
@@ -388,42 +376,34 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         props: props
       };
     };
-
     var getCellCallbackParams = function getCellCallbackParams(event) {
       var params = getCellParams();
       return _objectSpread$7({
         originalEvent: event
       }, params);
     };
-
     var resolveFieldData = function resolveFieldData(data) {
       return utils.ObjectUtils.resolveFieldData(data || props.rowData, field);
     };
-
     var getEditingRowData = function getEditingRowData() {
       return props.editingMeta && props.editingMeta[editingKey] ? props.editingMeta[editingKey].data : props.rowData;
     };
-
     var getTabIndex = function getTabIndex(cellSelected) {
       return props.allowCellSelection ? cellSelected ? 0 : props.rowIndex === 0 && props.index === 0 ? props.tabIndex : -1 : null;
     };
-
     var findIndex = function findIndex(collection) {
       return (collection || []).findIndex(function (data) {
         return equals(data);
       });
     };
-
     var closeCell = function closeCell(event) {
       var params = getCellCallbackParams(event);
       var onBeforeCellEditHide = getColumnProp('onBeforeCellEditHide');
-
       if (onBeforeCellEditHide) {
         onBeforeCellEditHide(params);
       }
-      /* When using the 'tab' key, the focus event of the next cell is not called in IE. */
-
 
+      /* When using the 'tab' key, the focus event of the next cell is not called in IE. */
       setTimeout(function () {
         setEditingState(false);
         unbindDocumentClickListener();
@@ -432,71 +412,57 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         selfClick.current = false;
       }, 1);
     };
-
     var switchCellToViewMode = function switchCellToViewMode(event, submit) {
       var callbackParams = getCellCallbackParams(event);
       var newRowData = editingRowDataState;
       var newValue = resolveFieldData(newRowData);
-
       var params = _objectSpread$7(_objectSpread$7({}, callbackParams), {}, {
         newRowData: newRowData,
         newValue: newValue
       });
-
       var onCellEditCancel = getColumnProp('onCellEditCancel');
       var cellEditValidator = getColumnProp('cellEditValidator');
       var onCellEditComplete = getColumnProp('onCellEditComplete');
-
       if (!submit && onCellEditCancel) {
         onCellEditCancel(params);
       }
-
       var valid = true;
-
       if (cellEditValidator) {
         valid = cellEditValidator(params);
       }
-
       if (valid) {
         if (submit && onCellEditComplete) {
           onCellEditComplete(params);
         }
-
         closeCell(event);
       } else {
         event.preventDefault();
       }
     };
-
     var findNextSelectableCell = function findNextSelectableCell(cell) {
       var nextCell = cell.nextElementSibling;
       return nextCell ? utils.DomHandler.hasClass(nextCell, 'p-selectable-cell') ? nextCell : findNextSelectableCell(nextCell) : null;
     };
-
     var findPrevSelectableCell = function findPrevSelectableCell(cell) {
       var prevCell = cell.previousElementSibling;
       return prevCell ? utils.DomHandler.hasClass(prevCell, 'p-selectable-cell') ? prevCell : findPrevSelectableCell(prevCell) : null;
     };
-
     var findDownSelectableCell = function findDownSelectableCell(cell) {
       var downRow = cell.parentElement.nextElementSibling;
       var downCell = downRow ? downRow.children[props.index] : null;
       return downRow && downCell ? utils.DomHandler.hasClass(downRow, 'p-selectable-row') && utils.DomHandler.hasClass(downCell, 'p-selectable-cell') ? downCell : findDownSelectableCell(downCell) : null;
     };
-
     var findUpSelectableCell = function findUpSelectableCell(cell) {
       var upRow = cell.parentElement.previousElementSibling;
       var upCell = upRow ? upRow.children[props.index] : null;
       return upRow && upCell ? utils.DomHandler.hasClass(upRow, 'p-selectable-row') && utils.DomHandler.hasClass(upCell, 'p-selectable-cell') ? upCell : findUpSelectableCell(upCell) : null;
     };
-
     var changeTabIndex = function changeTabIndex(currentCell, nextCell) {
       if (currentCell && nextCell) {
         currentCell.tabIndex = -1;
         nextCell.tabIndex = props.tabIndex;
       }
     };
-
     var focusOnElement = function focusOnElement() {
       clearTimeout(tabindexTimeout.current);
       tabindexTimeout.current = setTimeout(function () {
@@ -504,11 +470,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           var focusableEl = props.editMode === 'cell' ? utils.DomHandler.getFirstFocusableElement(elementRef.current, ':not(.p-cell-editor-key-helper)') : utils.DomHandler.findSingle(elementRef.current, '.p-row-editor-save');
           focusableEl && focusableEl.focus();
         }
-
         keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
       }, 1);
     };
-
     var focusOnInit = function focusOnInit() {
       clearTimeout(initFocusTimeout.current);
       initFocusTimeout.current = setTimeout(function () {
@@ -516,197 +480,160 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         focusableEl && focusableEl.focus();
       }, 1);
     };
-
     var updateStickyPosition = function updateStickyPosition() {
       if (getColumnProp('frozen')) {
         var styleObject = _objectSpread$7({}, styleObjectState);
-
         var align = getColumnProp('alignFrozen');
-
         if (align === 'right') {
           var right = 0;
           var next = elementRef.current.nextElementSibling;
-
           if (next) {
             right = utils.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
           }
-
           styleObject['right'] = right + 'px';
         } else {
           var left = 0;
           var prev = elementRef.current.previousElementSibling;
-
           if (prev) {
             left = utils.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
           }
-
           styleObject['left'] = left + 'px';
         }
-
         var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];
         !isSameStyle && setStyleObjectState(styleObject);
       }
     };
-
     var editorCallback = function editorCallback(val) {
       var editingRowData = _objectSpread$7({}, editingRowDataState);
-
       editingRowData[field] = val;
-      setEditingRowDataState(editingRowData); // update editing meta for complete methods on row mode
+      setEditingRowDataState(editingRowData);
 
+      // update editing meta for complete methods on row mode
       props.editingMeta[editingKey].data[field] = val;
     };
-
     var onClick = function onClick(event) {
       var params = getCellCallbackParams(event);
-
       if (props.editMode !== 'row' && isEditable() && !editingState && (props.selectOnEdit || !props.selectOnEdit && props.selected)) {
         selfClick.current = true;
         var onBeforeCellEditShow = getColumnProp('onBeforeCellEditShow');
         var onCellEditInit = getColumnProp('onCellEditInit');
         var cellEditValidatorEvent = getColumnProp('cellEditValidatorEvent');
-
         if (onBeforeCellEditShow) {
           onBeforeCellEditShow(params);
-        } // If the data is sorted using sort icon, it has been added to wait for the sort operation when any cell is wanted to be opened.
-
+        }
 
+        // If the data is sorted using sort icon, it has been added to wait for the sort operation when any cell is wanted to be opened.
         setTimeout(function () {
           setEditingState(true);
-
           if (onCellEditInit) {
             onCellEditInit(params);
           }
-
           if (cellEditValidatorEvent === 'click') {
             bindDocumentClickListener();
-
             overlayEventListener.current = function (e) {
               if (!isOutsideClicked(e.target)) {
                 selfClick.current = true;
               }
             };
-
             overlayservice.OverlayService.on('overlay-click', overlayEventListener.current);
           }
         }, 1);
       }
-
       if (props.allowCellSelection && props.onClick) {
         props.onClick(params);
       }
     };
-
     var onMouseDown = function onMouseDown(event) {
       var params = getCellCallbackParams(event);
       props.onMouseDown && props.onMouseDown(params);
     };
-
     var onMouseUp = function onMouseUp(event) {
       var params = getCellCallbackParams(event);
       props.onMouseUp && props.onMouseUp(params);
     };
-
     var onKeyDown = function onKeyDown(event) {
       if (props.editMode !== 'row') {
         if (event.which === 13 || event.which === 9) {
           // tab || enter
           switchCellToViewMode(event, true);
         }
-
         if (event.which === 27) {
           // escape
           switchCellToViewMode(event, false);
         }
       }
-
       if (props.allowCellSelection) {
         var target = event.target,
-            cell = event.currentTarget;
-
+          cell = event.currentTarget;
         switch (event.which) {
           //left arrow
           case 37:
             var prevCell = findPrevSelectableCell(cell);
-
             if (prevCell) {
               changeTabIndex(cell, prevCell);
               prevCell.focus();
             }
-
             event.preventDefault();
             break;
-          //right arrow
 
+          //right arrow
           case 39:
             var nextCell = findNextSelectableCell(cell);
-
             if (nextCell) {
               changeTabIndex(cell, nextCell);
               nextCell.focus();
             }
-
             event.preventDefault();
             break;
-          //up arrow
 
+          //up arrow
           case 38:
             var upCell = findUpSelectableCell(cell);
-
             if (upCell) {
               changeTabIndex(cell, upCell);
               upCell.focus();
             }
-
             event.preventDefault();
             break;
-          //down arrow
 
+          //down arrow
           case 40:
             var downCell = findDownSelectableCell(cell);
-
             if (downCell) {
               changeTabIndex(cell, downCell);
               downCell.focus();
             }
-
             event.preventDefault();
             break;
-          //enter
 
+          //enter
           case 13:
             // @deprecated
             if (!utils.DomHandler.isClickable(target)) {
               onClick(event);
               event.preventDefault();
             }
-
             break;
-          //space
 
+          //space
           case 32:
             if (!utils.DomHandler.isClickable(target) && !target.readOnly) {
               onClick(event);
               event.preventDefault();
             }
-
             break;
         }
       }
     };
-
     var onBlur = function onBlur(event) {
       selfClick.current = false;
-
       if (props.editMode !== 'row' && editingState && getColumnProp('cellEditValidatorEvent') === 'blur') {
         switchCellToViewMode(event, true);
       }
     };
-
     var onEditorFocus = function onEditorFocus(event) {
       onClick(event);
     };
-
     var onRadioChange = function onRadioChange(event) {
       props.onRadioChange({
         originalEvent: event,
@@ -714,7 +641,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.rowIndex
       });
     };
-
     var onCheckboxChange = function onCheckboxChange(event) {
       props.onCheckboxChange({
         originalEvent: event,
@@ -722,7 +648,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.rowIndex
       });
     };
-
     var onRowToggle = function onRowToggle(event) {
       props.onRowToggle({
         originalEvent: event,
@@ -730,7 +655,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       });
       event.preventDefault();
     };
-
     var onRowEditInit = function onRowEditInit(event) {
       props.onRowEditInit({
         originalEvent: event,
@@ -740,7 +664,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.rowIndex
       });
     };
-
     var onRowEditSave = function onRowEditSave(event) {
       props.onRowEditSave({
         originalEvent: event,
@@ -751,7 +674,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       });
       focusOnInit();
     };
-
     var onRowEditCancel = function onRowEditCancel(event) {
       props.onRowEditCancel({
         originalEvent: event,
@@ -762,12 +684,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       });
       focusOnInit();
     };
-
     React__namespace.useEffect(function () {
       if (getColumnProp('frozen')) {
         updateStickyPosition();
       }
-
       if (props.editMode === 'cell' || props.editMode === 'row') {
         focusOnElement();
       }
@@ -777,17 +697,16 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         setEditingRowDataState(getEditingRowData());
       }
     }, [props.editingMeta]);
-    hooks.useUpdateEffect(function () {
+    React__namespace.useEffect(function () {
       if (props.editMode === 'cell' || props.editMode === 'row') {
         var callbackParams = getCellCallbackParams();
-
         var params = _objectSpread$7(_objectSpread$7({}, callbackParams), {}, {
           editing: editingState,
           editingKey: editingKey
         });
-
         props.onEditingMetaChange(params);
       }
+      // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [editingState]);
     hooks.useUnmountEffect(function () {
       if (overlayEventListener.current) {
@@ -795,7 +714,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         overlayEventListener.current = null;
       }
     });
-
     var createLoading = function createLoading() {
       var options = getVirtualScrollerOption('getLoaderOptions')(props.rowIndex, {
         cellIndex: props.index,
@@ -809,7 +727,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       var content = utils.ObjectUtils.getJSXElement(getVirtualScrollerOption('loadingTemplate'), options);
       return /*#__PURE__*/React__namespace.createElement("td", null, content);
     };
-
     var createElement = function createElement() {
       var content, editorKeyHelper;
       var cellSelected = props.allowCellSelection && isSelected();
@@ -851,20 +768,17 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       }, utils.ObjectUtils.getJSXElement(header, {
         props: props.tableProps
       }));
-
       if (selectionMode) {
         var showSelection = props.showSelectionElement ? props.showSelectionElement(props.rowData, {
           rowIndex: props.rowIndex,
           props: props.tableProps
         }) : true;
         var label;
-
         if (showSelection) {
           var ariaLabelField = props.selectionAriaLabel || props.tableProps.dataKey;
           var ariaLabelText = utils.ObjectUtils.resolveFieldData(props.rowData, ariaLabelField);
           label = "".concat(props.selected ? PrimeReact.ariaLabel('unselectLabel') : PrimeReact.ariaLabel('selectLabel'), " ").concat(ariaLabelText);
         }
-
         content = showSelection && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, selectionMode === 'single' && /*#__PURE__*/React__namespace.createElement(RowRadioButton, {
           checked: props.selected,
           onChange: onRadioChange,
@@ -888,13 +802,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       } else if (expander) {
         var iconClassName = utils.classNames('p-row-toggler-icon', props.expanded ? props.expandedRowIcon : props.collapsedRowIcon);
         var ariaControls = "".concat(props.tableSelector, "_content_").concat(props.rowIndex, "_expanded");
-
         var _ariaLabelField = props.selectionAriaLabel || props.tableProps.dataKey;
-
         var _ariaLabelText = utils.ObjectUtils.resolveFieldData(props.rowData, _ariaLabelField);
-
         var _label = "".concat(props.expanded ? PrimeReact.ariaLabel('collapseLabel') : PrimeReact.ariaLabel('expandLabel'), " ").concat(_ariaLabelText);
-
         var expanderProps = {
           onClick: onRowToggle,
           className: 'p-row-toggler p-link',
@@ -912,7 +822,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           className: expanderProps.iconClassName,
           "aria-hidden": "true"
         }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
-
         if (body) {
           expanderProps['element'] = content;
           content = utils.ObjectUtils.getJSXElement(body, props.rowData, {
@@ -926,7 +835,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       } else if (isRowEditor && rowEditor) {
         var rowEditorProps = {};
-
         if (editingState) {
           rowEditorProps = {
             editing: true,
@@ -971,7 +879,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             className: rowEditorProps.initIconClassName
           }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
         }
-
         if (body) {
           rowEditorProps['element'] = content;
           content = utils.ObjectUtils.getJSXElement(body, props.rowData, {
@@ -1005,9 +912,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       } else {
         content = value;
       }
-
       content = typeof content == 'boolean' ? content.toString() : content;
-
       if (!isRowEditor && editor) {
         /* eslint-disable */
         editorKeyHelper = /*#__PURE__*/React__namespace.createElement("a", {
@@ -1033,108 +938,87 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         onMouseUp: onMouseUp
       }, editorKeyHelper, title, content);
     };
-
     return getVirtualScrollerOption('loading') ? createLoading() : createElement();
   });
   BodyCell.displayName = 'BodyCell';
 
   function ownKeys$6(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 _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var BodyRow = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState(false),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        editingState = _React$useState2[0],
-        setEditingState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      editingState = _React$useState2[0],
+      setEditingState = _React$useState2[1];
     var editing = props.onRowEditChange ? props.editing : editingState;
-
     var isFocusable = function isFocusable() {
       return props.selectionMode && props.selectionModeInColumn !== 'single' && props.selectionModeInColumn !== 'multiple';
     };
-
     var isGrouped = function isGrouped(column) {
       if (props.groupRowsBy && getColumnProp(column, 'field')) {
         return Array.isArray(props.groupRowsBy) ? props.groupRowsBy.indexOf(column.props.field) > -1 : props.groupRowsBy === column.props.field;
       }
-
       return false;
     };
-
     var equals = function equals(data1, data2) {
       return props.compareSelectionBy === 'equals' ? data1 === data2 : utils.ObjectUtils.equals(data1, data2, props.dataKey);
     };
-
     var getColumnProp = function getColumnProp(col, prop) {
       return col ? col.props[prop] : null;
     };
-
     var getTabIndex = function getTabIndex() {
       return isFocusable() && !props.allowCellSelection ? props.index === 0 ? props.tabIndex : -1 : null;
     };
-
     var findIndex = function findIndex(collection, rowData) {
       return (collection || []).findIndex(function (data) {
         return equals(rowData, data);
       });
     };
-
     var changeTabIndex = function changeTabIndex(currentRow, nextRow) {
       if (currentRow && nextRow) {
         currentRow.tabIndex = -1;
         nextRow.tabIndex = props.tabIndex;
       }
     };
-
     var findNextSelectableRow = function findNextSelectableRow(row) {
       var nextRow = row.nextElementSibling;
       return nextRow ? utils.DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : findNextSelectableRow(nextRow) : null;
     };
-
     var findPrevSelectableRow = function findPrevSelectableRow(row) {
       var prevRow = row.previousElementSibling;
       return prevRow ? utils.DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : findPrevSelectableRow(prevRow) : null;
     };
-
     var shouldRenderBodyCell = function shouldRenderBodyCell(value, column, i) {
       if (getColumnProp(column, 'hidden')) {
         return false;
       } else if (props.rowGroupMode && props.rowGroupMode === 'rowspan' && isGrouped(column)) {
         var prevRowData = value[i - 1];
-
         if (prevRowData) {
           var currentRowFieldData = utils.ObjectUtils.resolveFieldData(value[i], getColumnProp(column, 'field'));
           var previousRowFieldData = utils.ObjectUtils.resolveFieldData(prevRowData, getColumnProp(column, 'field'));
           return currentRowFieldData !== previousRowFieldData;
         }
       }
-
       return true;
     };
-
     var calculateRowGroupSize = function calculateRowGroupSize(value, column, index) {
       if (isGrouped(column)) {
         var currentRowFieldData = utils.ObjectUtils.resolveFieldData(value[index], getColumnProp(column, 'field'));
         var nextRowFieldData = currentRowFieldData;
         var groupRowSpan = 0;
-
         while (currentRowFieldData === nextRowFieldData) {
           groupRowSpan++;
           var nextRowData = value[++index];
-
           if (nextRowData) {
             nextRowFieldData = utils.ObjectUtils.resolveFieldData(nextRowData, getColumnProp(column, 'field'));
           } else {
             break;
           }
         }
-
         return groupRowSpan === 1 ? null : groupRowSpan;
       } else {
         return null;
       }
     };
-
     var onClick = function onClick(event) {
       props.onRowClick({
         originalEvent: event,
@@ -1142,7 +1026,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onDoubleClick = function onDoubleClick(event) {
       props.onRowDoubleClick({
         originalEvent: event,
@@ -1150,7 +1033,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onRightClick = function onRightClick(event) {
       props.onRowRightClick({
         originalEvent: event,
@@ -1158,63 +1040,67 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
+    var onMouseEnter = function onMouseEnter(event) {
+      props.onRowMouseEnter({
+        originalEvent: event,
+        data: props.rowData,
+        index: props.index
+      });
+    };
+    var onMouseLeave = function onMouseLeave(event) {
+      props.onRowMouseLeave({
+        originalEvent: event,
+        data: props.rowData,
+        index: props.index
+      });
+    };
     var onTouchEnd = function onTouchEnd(event) {
       props.onRowTouchEnd(event);
     };
-
     var onKeyDown = function onKeyDown(event) {
       if (isFocusable() && !props.allowCellSelection) {
         var target = event.target,
-            row = event.currentTarget;
-
+          row = event.currentTarget;
         switch (event.which) {
           //down arrow
           case 40:
             var nextRow = findNextSelectableRow(row);
-
             if (nextRow) {
               changeTabIndex(row, nextRow);
               nextRow.focus();
             }
-
             event.preventDefault();
             break;
-          //up arrow
 
+          //up arrow
           case 38:
             var prevRow = findPrevSelectableRow(row);
-
             if (prevRow) {
               changeTabIndex(row, prevRow);
               prevRow.focus();
             }
-
             event.preventDefault();
             break;
-          //enter
 
+          //enter
           case 13:
             // @deprecated
             if (!utils.DomHandler.isClickable(target)) {
               onClick(event);
               event.preventDefault();
             }
-
             break;
-          //space
 
+          //space
           case 32:
             if (!utils.DomHandler.isClickable(target) && !target.readOnly) {
               onClick(event);
               event.preventDefault();
             }
-
             break;
         }
       }
     };
-
     var onMouseDown = function onMouseDown(event) {
       props.onRowMouseDown({
         originalEvent: event,
@@ -1222,7 +1108,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onMouseUp = function onMouseUp(event) {
       props.onRowMouseUp({
         originalEvent: event,
@@ -1230,7 +1115,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onDragStart = function onDragStart(event) {
       props.onRowDragStart({
         originalEvent: event,
@@ -1238,7 +1122,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onDragOver = function onDragOver(event) {
       props.onRowDragOver({
         originalEvent: event,
@@ -1246,7 +1129,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onDragLeave = function onDragLeave(event) {
       props.onRowDragLeave({
         originalEvent: event,
@@ -1254,7 +1136,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onDragEnd = function onDragEnd(event) {
       props.onRowDragEnd({
         originalEvent: event,
@@ -1262,7 +1143,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onDrop = function onDrop(event) {
       props.onRowDrop({
         originalEvent: event,
@@ -1270,23 +1150,20 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         index: props.index
       });
     };
-
     var onEditChange = function onEditChange(e, isEditing) {
       if (props.onRowEditChange) {
         var editingRows;
         var dataKey = props.dataKey;
         var originalEvent = e.originalEvent,
-            data = e.data,
-            index = e.index,
-            newData = e.newData;
-
+          data = e.data,
+          index = e.index,
+          newData = e.newData;
         if (dataKey) {
           var dataKeyValue = String(utils.ObjectUtils.resolveFieldData(data, dataKey));
           editingRows = props.editingRows ? _objectSpread$6({}, props.editingRows) : {};
-
           if (!isEditing) {
-            delete editingRows[dataKeyValue]; // if the key value was changed, stop editing for the new key value too
-
+            delete editingRows[dataKeyValue];
+            // if the key value was changed, stop editing for the new key value too
             var newDataKeyValue = String(utils.ObjectUtils.resolveFieldData(newData, dataKey));
             delete editingRows[newDataKeyValue];
           } else {
@@ -1299,7 +1176,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             return i !== editingRowIndex;
           });else editingRows.push(data);
         }
-
         props.onRowEditChange({
           originalEvent: originalEvent,
           data: editingRows,
@@ -1309,10 +1185,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         setEditingState(isEditing);
       }
     };
-
     var onEditInit = function onEditInit(e) {
       var event = e.originalEvent;
-
       if (props.onRowEditInit) {
         props.onRowEditInit({
           originalEvent: event,
@@ -1320,18 +1194,15 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           index: props.index
         });
       }
-
       onEditChange(e, true);
       event.preventDefault();
     };
-
     var onEditSave = function onEditSave(e) {
       var event = e.originalEvent,
-          newData = e.newData;
+        newData = e.newData;
       var valid = props.rowEditValidator ? props.rowEditValidator(newData, {
         props: props.tableProps
       }) : true;
-
       if (props.onRowEditSave) {
         props.onRowEditSave({
           originalEvent: event,
@@ -1340,21 +1211,16 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           valid: valid
         });
       }
-
       if (valid) {
         if (props.onRowEditComplete) {
           props.onRowEditComplete(e);
         }
-
         onEditChange(e, false);
       }
-
       event.preventDefault();
     };
-
     var onEditCancel = function onEditCancel(e) {
       var event = e.originalEvent;
-
       if (props.onRowEditCancel) {
         props.onRowEditCancel({
           originalEvent: event,
@@ -1362,11 +1228,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           index: props.index
         });
       }
-
       onEditChange(e, false);
       event.preventDefault();
     };
-
     var createContent = function createContent() {
       return props.columns.map(function (col, i) {
         if (shouldRenderBodyCell(props.value, col, props.index)) {
@@ -1415,16 +1279,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             virtualScrollerOptions: props.virtualScrollerOptions
           });
         }
-
         return null;
       });
     };
-
     var rowClassName = utils.ObjectUtils.getPropValue(props.rowClassName, props.rowData, {
       props: props.tableProps
     });
     var className = utils.classNames(rowClassName, {
-      'p-highlight': !props.allowCellSelection && props.selected,
+      'p-highlight': !props.allowCellSelection && props.selected || props.contextMenuSelected,
       'p-highlight-contextmenu': props.contextMenuSelected,
       'p-selectable-row': props.allowRowSelection && props.isSelectable({
         data: props.rowData,
@@ -1444,6 +1306,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       style: style,
       onMouseDown: onMouseDown,
       onMouseUp: onMouseUp,
+      onMouseEnter: onMouseEnter,
+      onMouseLeave: onMouseLeave,
       onClick: onClick,
       onDoubleClick: onDoubleClick,
       onContextMenu: onRightClick,
@@ -1465,7 +1329,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         data: props.rowData
       });
     };
-
     var iconClassName = utils.classNames('p-row-toggler-icon', props.expanded ? props.expandedRowIcon : props.collapsedRowIcon);
     var label = props.expanded ? PrimeReact.ariaLabel('collapseLabel') : PrimeReact.ariaLabel('expandLabel');
     return /*#__PURE__*/React__namespace.createElement("button", {
@@ -1482,16 +1345,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
   RowTogglerButton.displayName = 'RowTogglerButton';
 
   var _excluded = ["originalEvent"];
-
   function ownKeys$5(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 _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var TableBody = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     var _React$useState = React__namespace.useState({}),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        rowGroupHeaderStyleObjectState = _React$useState2[0],
-        setRowGroupHeaderStyleObjectState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      rowGroupHeaderStyleObjectState = _React$useState2[0],
+      setRowGroupHeaderStyleObjectState = _React$useState2[1];
     var elementRef = React__namespace.useRef(null);
     var refCallback = React__namespace.useCallback(function (el) {
       elementRef.current = el;
@@ -1513,53 +1373,41 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     var isCheckboxSelectionMode = props.selectionMode === 'checkbox';
     var isRadioSelectionModeInColumn = props.selectionModeInColumn === 'single';
     var isCheckboxSelectionModeInColumn = props.selectionModeInColumn === 'multiple';
-
     var equals = function equals(data1, data2) {
       if (allowCellSelection()) return (data1.rowIndex === data2.rowIndex || data1.rowData === data2.rowData) && (data1.field === data2.field || data1.cellIndex === data2.cellIndex);else return props.compareSelectionBy === 'equals' ? data1 === data2 : utils.ObjectUtils.equals(data1, data2, props.dataKey);
     };
-
     var isSelectionEnabled = function isSelectionEnabled() {
       return props.selectionMode || props.selectionModeInColumn !== null || props.columns && props.columns.some(function (col) {
         return col && !!col.props.selectionMode;
       });
     };
-
     var isSingleSelection = function isSingleSelection() {
       return props.selectionMode === 'single' && !isCheckboxSelectionModeInColumn || !isRadioSelectionMode && isRadioSelectionModeInColumn;
     };
-
     var isMultipleSelection = function isMultipleSelection() {
       return props.selectionMode === 'multiple' && !isRadioSelectionModeInColumn || isCheckboxSelectionModeInColumn;
     };
-
     var isRadioOnlySelection = function isRadioOnlySelection() {
       return isRadioSelectionMode && isRadioSelectionModeInColumn;
     };
-
     var isCheckboxOnlySelection = function isCheckboxOnlySelection() {
       return isCheckboxSelectionMode && isCheckboxSelectionModeInColumn;
     };
-
     var isSelected = function isSelected(rowData) {
       if (rowData && props.selection) {
         return props.selection instanceof Array ? findIndex(props.selection, rowData) > -1 : equals(rowData, props.selection);
       }
-
       return false;
     };
-
     var isContextMenuSelected = function isContextMenuSelected(rowData) {
       if (rowData && props.contextMenuSelection) {
         return equals(rowData, props.contextMenuSelection);
       }
-
       return false;
     };
-
     var isSelectable = function isSelectable(options) {
       return props.isDataSelectable ? props.isDataSelectable(options) : true;
     };
-
     var isRowExpanded = function isRowExpanded(rowData) {
       if (rowData && props.expandedRows) {
         if (isSubheaderGrouping && props.expandableRowGroups) {
@@ -1568,10 +1416,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           if (props.dataKey) return props.expandedRows ? props.expandedRows[utils.ObjectUtils.resolveFieldData(rowData, props.dataKey)] !== undefined : false;else return findIndex(props.expandedRows, rowData) !== -1;
         }
       }
-
       return false;
     };
-
     var isRowGroupExpanded = function isRowGroupExpanded(rowData) {
       if (props.dataKey === props.groupRowsBy) return Object.keys(props.expandedRows).some(function (data) {
         return utils.ObjectUtils.equals(data, utils.ObjectUtils.resolveFieldData(rowData, props.dataKey));
@@ -1579,80 +1425,62 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         return utils.ObjectUtils.equals(data, rowData, props.groupRowsBy);
       });
     };
-
     var isRowEditing = function isRowEditing(rowData) {
       if (props.editMode === 'row' && rowData && props.editingRows) {
         if (props.dataKey) return props.editingRows ? props.editingRows[utils.ObjectUtils.resolveFieldData(rowData, props.dataKey)] !== undefined : false;else return findIndex(props.editingRows, rowData) !== -1;
       }
-
       return false;
     };
-
     var allowDrag = function allowDrag(event) {
       return props.dragSelection && isMultipleSelection() && !event.originalEvent.shiftKey;
     };
-
     var allowRowDrag = function allowRowDrag(event) {
       return !allowCellSelection() && allowDrag(event) || props.reorderableRows;
     };
-
     var allowCellDrag = function allowCellDrag(event) {
       return allowCellSelection() && allowDrag(event);
     };
-
     var allowSelection = function allowSelection(event) {
       return !utils.DomHandler.isClickable(event.originalEvent.target);
     };
-
     var allowMetaKeySelection = function allowMetaKeySelection(event) {
       return !rowTouched.current && (!props.metaKeySelection || props.metaKeySelection && (event.originalEvent.metaKey || event.originalEvent.ctrlKey));
     };
-
     var allowRangeSelection = function allowRangeSelection(event) {
       return isMultipleSelection() && event.originalEvent.shiftKey && anchorRowIndex.current !== null;
     };
-
     var allowRowSelection = function allowRowSelection() {
       return (props.selectionMode || props.selectionModeInColumn) && !isRadioOnlySelection() && !isCheckboxOnlySelection();
     };
-
     var allowCellSelection = function allowCellSelection() {
       return props.cellSelection && !isRadioSelectionModeInColumn && !isCheckboxSelectionModeInColumn;
     };
-
     var getColumnsLength = function getColumnsLength() {
       return props.columns ? props.columns.length : 0;
     };
-
     var getVirtualScrollerOption = function getVirtualScrollerOption(option, options) {
       options = options || props.virtualScrollerOptions;
       return options ? options[option] : null;
     };
-
     var findIndex = function findIndex(collection, rowData) {
       return (collection || []).findIndex(function (data) {
         return equals(rowData, data);
       });
     };
-
     var rowGroupHeaderStyle = function rowGroupHeaderStyle() {
       if (props.scrollable) {
         return {
           top: rowGroupHeaderStyleObjectState['top']
         };
       }
-
       return null;
     };
-
     var getRowKey = function getRowKey(rowData, index) {
       return props.dataKey ? utils.ObjectUtils.resolveFieldData(rowData, props.dataKey) + '_' + index : index;
     };
-
     var shouldRenderRowGroupHeader = function shouldRenderRowGroupHeader(value, rowData, i) {
       var currentRowFieldData = utils.ObjectUtils.resolveFieldData(rowData, props.groupRowsBy);
       var prevRowData = value[i - 1];
-
       if (prevRowData) {
         var previousRowFieldData = utils.ObjectUtils.resolveFieldData(prevRowData, props.groupRowsBy);
         return currentRowFieldData !== previousRowFieldData;
@@ -1660,14 +1488,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         return true;
       }
     };
-
     var shouldRenderRowGroupFooter = function shouldRenderRowGroupFooter(value, rowData, i, expanded) {
       if (props.expandableRowGroups && !expanded) {
         return false;
       } else {
         var currentRowFieldData = utils.ObjectUtils.resolveFieldData(rowData, props.groupRowsBy);
         var nextRowData = value[i + 1];
-
         if (nextRowData) {
           var nextRowFieldData = utils.ObjectUtils.resolveFieldData(nextRowData, props.groupRowsBy);
           return currentRowFieldData !== nextRowFieldData;
@@ -1676,44 +1502,36 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       }
     };
-
     var updateFrozenRowStickyPosition = function updateFrozenRowStickyPosition() {
       elementRef.current.style.top = utils.DomHandler.getOuterHeight(elementRef.current.previousElementSibling) + 'px';
     };
-
     var updateFrozenRowGroupHeaderStickyPosition = function updateFrozenRowGroupHeaderStickyPosition() {
       var tableHeaderHeight = utils.DomHandler.getOuterHeight(elementRef.current.previousElementSibling);
       var top = tableHeaderHeight + 'px';
-
       if (rowGroupHeaderStyleObjectState.top !== top) {
         setRowGroupHeaderStyleObjectState({
           top: top
         });
       }
     };
-
     var updateVirtualScrollerPosition = function updateVirtualScrollerPosition() {
       var tableHeaderHeight = utils.DomHandler.getOuterHeight(elementRef.current.previousElementSibling);
       elementRef.current.style.top = (elementRef.current.style.top || 0) + tableHeaderHeight + 'px';
     };
-
     var onSingleSelection = function onSingleSelection(_ref) {
       var originalEvent = _ref.originalEvent,
-          data = _ref.data,
-          index = _ref.index,
-          toggleable = _ref.toggleable,
-          type = _ref.type;
-
+        data = _ref.data,
+        index = _ref.index,
+        toggleable = _ref.toggleable,
+        type = _ref.type;
       if (!isSelectable({
         data: data,
         index: index
       })) {
         return;
       }
-
       var selected = isSelected(data);
       var selection = props.selection;
-
       if (selected) {
         if (toggleable) {
           selection = null;
@@ -1731,9 +1549,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           type: type
         });
       }
-
       focusOnElement(originalEvent, true);
-
       if (props.onSelectionChange && selection !== props.selection) {
         props.onSelectionChange({
           originalEvent: originalEvent,
@@ -1742,24 +1558,20 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       }
     };
-
     var onMultipleSelection = function onMultipleSelection(_ref2) {
       var originalEvent = _ref2.originalEvent,
-          data = _ref2.data,
-          index = _ref2.index,
-          toggleable = _ref2.toggleable,
-          type = _ref2.type;
-
+        data = _ref2.data,
+        index = _ref2.index,
+        toggleable = _ref2.toggleable,
+        type = _ref2.type;
       if (!isSelectable({
         data: data,
         index: index
       })) {
         return;
       }
-
       var selected = isSelected(data);
       var selection = props.selection || [];
-
       if (selected) {
         if (toggleable) {
           var selectionIndex = findIndex(selection, data);
@@ -1794,9 +1606,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           type: type
         });
       }
-
       focusOnElement(originalEvent, true);
-
       if (props.onSelectionChange && selection !== props.selection) {
         props.onSelectionChange({
           originalEvent: originalEvent,
@@ -1805,12 +1615,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       }
     };
-
     var onRangeSelection = function onRangeSelection(event, type) {
       utils.DomHandler.clearSelection();
       rangeRowIndex.current = allowCellSelection() ? event.rowIndex : event.index;
       var selection = selectRange(event);
-
       if (props.onSelectionChange && selection !== props.selection) {
         props.onSelectionChange({
           originalEvent: event.originalEvent,
@@ -1818,15 +1626,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           type: type
         });
       }
-
       anchorRowIndex.current = rangeRowIndex.current;
       anchorCellIndex.current = event.cellIndex;
       focusOnElement(event.originalEvent, false);
     };
-
     var selectRange = function selectRange(event) {
       var rangeStart, rangeEnd;
-
       if (rangeRowIndex.current > anchorRowIndex.current) {
         rangeStart = anchorRowIndex.current;
         rangeEnd = rangeRowIndex.current;
@@ -1836,29 +1641,23 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       } else {
         rangeStart = rangeEnd = rangeRowIndex.current;
       }
-
       if (props.paginator) {
         rangeStart = Math.max(rangeStart - props.first, 0);
         rangeEnd -= props.first;
       }
-
       return allowCellSelection() ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
     };
-
     var selectRangeOnRow = function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {
       var value = props.value;
       var selection = [];
-
       for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
         var rangeRowData = value[i];
-
         if (!isSelectable({
           data: rangeRowData,
           index: i
         })) {
           continue;
         }
-
         selection.push(rangeRowData);
         onSelect({
           originalEvent: event.originalEvent,
@@ -1866,15 +1665,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           type: 'row'
         });
       }
-
       return selection;
     };
-
     var selectRangeOnCell = function selectRangeOnCell(event, rowRangeStart, rowRangeEnd) {
       var cellRangeStart,
-          cellRangeEnd,
-          cellIndex = event.cellIndex;
-
+        cellRangeEnd,
+        cellIndex = event.cellIndex;
       if (cellIndex > anchorCellIndex.current) {
         cellRangeStart = anchorCellIndex.current;
         cellRangeEnd = cellIndex;
@@ -1884,20 +1680,15 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       } else {
         cellRangeStart = cellRangeEnd = cellIndex;
       }
-
       var value = props.value;
       var selection = [];
-
       for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
         var rowData = value[i];
         var columns = props.columns;
         var rowIndex = props.paginator ? i + props.first : i;
-
         for (var j = cellRangeStart; j <= cellRangeEnd; j++) {
           var field = columns[j].props.field;
-
           var _value = utils.ObjectUtils.resolveFieldData(rowData, field);
-
           var rangeRowData = {
             value: _value,
             field: field,
@@ -1906,14 +1697,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             cellIndex: j,
             selected: true
           };
-
           if (!isSelectable({
             data: rangeRowData,
             index: i
           })) {
             continue;
           }
-
           selection.push(rangeRowData);
           onSelect({
             originalEvent: event.originalEvent,
@@ -1922,10 +1711,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           });
         }
       }
-
       return selection;
     };
-
     var onSelect = function onSelect(event) {
       if (allowCellSelection()) props.onCellSelect && props.onCellSelect(_objectSpread$5(_objectSpread$5({
         originalEvent: event.originalEvent
@@ -1933,7 +1720,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         type: event.type
       }));else props.onRowSelect && props.onRowSelect(event);
     };
-
     var onUnselect = function onUnselect(event) {
       if (allowCellSelection()) props.onCellUnselect && props.onCellUnselect(_objectSpread$5(_objectSpread$5({
         originalEvent: event.originalEvent
@@ -1941,7 +1727,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         type: event.type
       }));else props.onRowUnselect && props.onRowUnselect(event);
     };
-
     var enableDragSelection = function enableDragSelection(event) {
       if (props.dragSelection && !dragSelectionHelper.current) {
         dragSelectionHelper.current = document.createElement('div');
@@ -1955,10 +1740,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         bindDragSelectionEvents();
       }
     };
-
     var focusOnElement = function focusOnElement(event, isFocused) {
       var target = event.currentTarget;
-
       if (!allowCellSelection() && props.selectionAutoFocus) {
         if (isCheckboxSelectionModeInColumn) {
           var checkbox = utils.DomHandler.findSingle(target, 'td.p-selection-column .p-checkbox-box');
@@ -1968,32 +1751,25 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           radio && radio.focus();
         }
       }
-
       !isFocused && target && target.focus();
     };
-
     var changeTabIndex = function changeTabIndex(event, type) {
       var target = event.currentTarget;
       var isSelectable = utils.DomHandler.hasClass(target, type === 'cell' ? 'p-selectable-cell' : 'p-selectable-row');
-
       if (isSelectable) {
         var selector = type === 'cell' ? 'tr > td' : 'tr';
         var tabbableEl = utils.DomHandler.findSingle(elementRef.current, "".concat(selector, "[tabindex=\"").concat(props.tabIndex, "\"]"));
-
         if (tabbableEl && target) {
           tabbableEl.tabIndex = -1;
           target.tabIndex = props.tabIndex;
         }
       }
     };
-
     var onRowClick = function onRowClick(event) {
       if (allowCellSelection() || !allowSelection(event)) {
         return;
       }
-
       props.onRowClick && props.onRowClick(event);
-
       if (allowRowSelection()) {
         if (allowRangeSelection(event)) {
           onRangeSelection(event, 'row');
@@ -2002,7 +1778,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           anchorRowIndex.current = event.index;
           rangeRowIndex.current = event.index;
           anchorRowFirst.current = props.first;
-
           if (isSingleSelection()) {
             onSingleSelection(_objectSpread$5(_objectSpread$5({}, event), {}, {
               toggleable: toggleable,
@@ -2015,57 +1790,51 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             }));
           }
         }
-
         changeTabIndex(event.originalEvent, 'row');
       } else {
         focusOnElement(event.originalEvent);
       }
-
       rowTouched.current = false;
     };
-
     var onRowDoubleClick = function onRowDoubleClick(e) {
       var event = e.originalEvent;
-
       if (utils.DomHandler.isClickable(event.target)) {
         return;
       }
-
       if (props.onRowDoubleClick) {
         props.onRowDoubleClick(e);
       }
     };
-
     var onRowRightClick = function onRowRightClick(event) {
       if (props.onContextMenu || props.onContextMenuSelectionChange) {
         utils.DomHandler.clearSelection();
-
         if (props.onContextMenuSelectionChange) {
           props.onContextMenuSelectionChange({
             originalEvent: event.originalEvent,
             value: event.data
           });
         }
-
         if (props.onContextMenu) {
           props.onContextMenu({
             originalEvent: event.originalEvent,
             data: event.data
           });
         }
-
         event.originalEvent.preventDefault();
       }
     };
-
+    var onRowMouseEnter = function onRowMouseEnter(event) {
+      props.onRowMouseEnter && props.onRowMouseEnter(event);
+    };
+    var onRowMouseLeave = function onRowMouseLeave(event) {
+      props.onRowMouseLeave && props.onRowMouseLeave(event);
+    };
     var onRowTouchEnd = function onRowTouchEnd() {
       rowTouched.current = true;
     };
-
     var onRowMouseDown = function onRowMouseDown(e) {
       var event = e.originalEvent;
       if (utils.DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) event.currentTarget.draggable = true;else event.currentTarget.draggable = false;
-
       if (allowRowDrag(e)) {
         enableDragSelection(event);
         anchorRowIndex.current = e.index;
@@ -2073,27 +1842,21 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         anchorRowFirst.current = props.first;
       }
     };
-
     var onRowMouseUp = function onRowMouseUp(event) {
       var isSameRow = event.index === anchorRowIndex.current;
-
       if (allowRowDrag(event) && !isSameRow) {
         onRangeSelection(event, 'row');
       }
     };
-
     var onRowToggle = function onRowToggle(event) {
       var expandedRows;
       var dataKey = props.dataKey;
       var hasDataKey = props.groupRowsBy ? dataKey === props.groupRowsBy : !!dataKey;
-
       if (hasDataKey) {
         var dataKeyValue = String(utils.ObjectUtils.resolveFieldData(event.data, dataKey));
         expandedRows = props.expandedRows ? _objectSpread$5({}, props.expandedRows) : {};
-
         if (expandedRows[dataKeyValue] != null) {
           delete expandedRows[dataKeyValue];
-
           if (props.onRowCollapse) {
             props.onRowCollapse({
               originalEvent: event,
@@ -2102,7 +1865,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           }
         } else {
           expandedRows[dataKeyValue] = true;
-
           if (props.onRowExpand) {
             props.onRowExpand({
               originalEvent: event,
@@ -2113,12 +1875,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       } else {
         var expandedRowIndex = findIndex(props.expandedRows, event.data);
         expandedRows = props.expandedRows ? _toConsumableArray(props.expandedRows) : [];
-
         if (expandedRowIndex !== -1) {
           expandedRows = expandedRows.filter(function (_, i) {
             return i !== expandedRowIndex;
           });
-
           if (props.onRowCollapse) {
             props.onRowCollapse({
               originalEvent: event,
@@ -2127,7 +1887,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           }
         } else {
           expandedRows.push(event.data);
-
           if (props.onRowExpand) {
             props.onRowExpand({
               originalEvent: event,
@@ -2136,18 +1895,15 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           }
         }
       }
-
       if (props.onRowToggle) {
         props.onRowToggle({
           data: expandedRows
         });
       }
     };
-
     var onRowDragStart = function onRowDragStart(e) {
       var event = e.originalEvent,
-          index = e.index;
-
+        index = e.index;
       if (allowRowDrag(event)) {
         rowDragging.current = true;
         draggedRowIndex.current = index;
@@ -2157,15 +1913,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
 
     var onRowDragOver = function onRowDragOver(e) {
       var event = e.originalEvent,
-          index = e.index;
-
+        index = e.index;
       if (rowDragging.current && draggedRowIndex.current !== index) {
         var rowElement = event.currentTarget;
         var rowY = utils.DomHandler.getOffset(rowElement).top + utils.DomHandler.getWindowScrollTop();
         var pageY = event.pageY + window.scrollY;
         var rowMidY = rowY + utils.DomHandler.getOuterHeight(rowElement) / 2;
         var prevRowElement = rowElement.previousElementSibling;
-
         if (pageY < rowMidY) {
           utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
           droppedRowIndex.current = index;
@@ -2176,23 +1930,18 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
         }
       }
-
       event.preventDefault();
     };
-
     var onRowDragLeave = function onRowDragLeave(e) {
       var event = e.originalEvent;
       var rowElement = event.currentTarget;
       var prevRowElement = rowElement.previousElementSibling;
-
       if (prevRowElement) {
         utils.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
       }
-
       utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
       utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-top');
     };
-
     var onRowDragEnd = function onRowDragEnd(e) {
       var event = e.originalEvent;
       rowDragging.current = false;
@@ -2200,17 +1949,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       droppedRowIndex.current = null;
       event.currentTarget.draggable = false;
     };
-
     var onRowDrop = function onRowDrop(e) {
       var event = e.originalEvent;
-
       if (droppedRowIndex.current != null) {
         var dropIndex = draggedRowIndex.current > droppedRowIndex.current ? droppedRowIndex.current : droppedRowIndex.current === 0 ? 0 : droppedRowIndex.current - 1;
-
         var val = _toConsumableArray(props.value);
-
         utils.ObjectUtils.reorderArray(val, draggedRowIndex.current, dropIndex);
-
         if (props.onRowReorder) {
           props.onRowReorder({
             originalEvent: event,
@@ -2219,32 +1963,29 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             dropIndex: droppedRowIndex.current
           });
         }
-      } //cleanup
-
+      }
 
+      //cleanup
       onRowDragLeave(e);
       onRowDragEnd(e);
       event.preventDefault();
     };
-
     var onRadioChange = function onRadioChange(event) {
       onSingleSelection(_objectSpread$5(_objectSpread$5({}, event), {}, {
         toggleable: true,
         type: 'radio'
       }));
     };
-
     var onCheckboxChange = function onCheckboxChange(event) {
       onMultipleSelection(_objectSpread$5(_objectSpread$5({}, event), {}, {
         toggleable: true,
         type: 'checkbox'
       }));
     };
-
     var onDragSelectionMouseMove = function onDragSelectionMouseMove(event) {
       var _initialDragPosition$ = initialDragPosition.current,
-          x = _initialDragPosition$.x,
-          y = _initialDragPosition$.y;
+        x = _initialDragPosition$.x,
+        y = _initialDragPosition$.y;
       var dx = event.clientX - x;
       var dy = event.clientY - y;
       if (dy < 0) dragSelectionHelper.current.style.top = "".concat(event.pageY + 5, "px");
@@ -2253,38 +1994,30 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       dragSelectionHelper.current.style.width = "".concat(Math.abs(dx), "px");
       event.preventDefault();
     };
-
     var onDragSelectionMouseUp = function onDragSelectionMouseUp() {
       if (dragSelectionHelper.current) {
         dragSelectionHelper.current.remove();
         dragSelectionHelper.current = null;
       }
-
       document.removeEventListener('mousemove', onDragSelectionMouseMove);
       document.removeEventListener('mouseup', onDragSelectionMouseUp);
     };
-
     var onCellClick = function onCellClick(event) {
       if (!allowSelection(event)) {
         return;
       }
-
       props.onCellClick && props.onCellClick(event);
-
       if (allowCellSelection()) {
         if (allowRangeSelection(event)) {
           onRangeSelection(event, 'cell');
         } else {
           var toggleable = allowMetaKeySelection(event);
-
           var originalEvent = event.originalEvent,
-              data = _objectWithoutProperties(event, _excluded);
-
+            data = _objectWithoutProperties(event, _excluded);
           anchorRowIndex.current = event.rowIndex;
           rangeRowIndex.current = event.rowIndex;
           anchorRowFirst.current = props.first;
           anchorCellIndex.current = event.cellIndex;
-
           if (isSingleSelection()) {
             onSingleSelection({
               originalEvent: originalEvent,
@@ -2303,13 +2036,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             });
           }
         }
-
         changeTabIndex(event.originalEvent, 'cell');
       }
-
       rowTouched.current = false;
     };
-
     var onCellMouseDown = function onCellMouseDown(event) {
       if (allowCellDrag(event)) {
         enableDragSelection(event.originalEvent);
@@ -2319,30 +2049,24 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         anchorCellIndex.current = event.cellIndex;
       }
     };
-
     var onCellMouseUp = function onCellMouseUp(event) {
       var isSameCell = event.rowIndex === anchorRowIndex.current && event.cellIndex === anchorCellIndex.current;
-
       if (allowCellDrag(event) && !isSameCell) {
         onRangeSelection(event, 'cell');
       }
     };
-
     var bindDragSelectionEvents = function bindDragSelectionEvents() {
       document.addEventListener('mousemove', onDragSelectionMouseMove);
       document.addEventListener('mouseup', onDragSelectionMouseUp);
       document.body.appendChild(dragSelectionHelper.current);
     };
-
     var unbindDragSelectionEvents = function unbindDragSelectionEvents() {
       onDragSelectionMouseUp();
     };
-
     React__namespace.useEffect(function () {
       if (props.frozenRow) {
         updateFrozenRowStickyPosition();
       }
-
       if (props.scrollable && props.rowGroupMode === 'subheader') {
         updateFrozenRowGroupHeaderStickyPosition();
       }
@@ -2367,16 +2091,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         unbindDragSelectionEvents();
       }
     });
-
     var createEmptyContent = function createEmptyContent() {
       if (!props.loading) {
         var colSpan = getColumnsLength();
-
         var _content = utils.ObjectUtils.getJSXElement(props.emptyMessage, {
           props: props.tableProps,
           frozen: props.frozenRow
         }) || PrimeReact.localeOption('emptyMessage');
-
         return /*#__PURE__*/React__namespace.createElement("tr", {
           className: "p-datatable-emptymessage",
           role: "row"
@@ -2385,12 +2106,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           role: "cell"
         }, _content));
       }
-
       return null;
     };
-
     var createGroupHeader = function createGroupHeader(rowData, index, expanded, colSpan) {
       if (isSubheaderGrouping && shouldRenderRowGroupHeader(props.value, rowData, index - props.first)) {
+        var _options;
         var style = rowGroupHeaderStyle();
         var toggler = props.expandableRowGroups && /*#__PURE__*/React__namespace.createElement(RowTogglerButton, {
           onClick: onRowToggle,
@@ -2399,35 +2119,33 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           expandedRowIcon: props.expandedRowIcon,
           collapsedRowIcon: props.collapsedRowIcon
         });
+        var options = (_options = {
+          index: index
+        }, _defineProperty(_options, "index", index), _defineProperty(_options, "props", props.tableProps), _defineProperty(_options, "customRendering", false), _options);
+        var _content2 = utils.ObjectUtils.getJSXElement(props.rowGroupHeaderTemplate, rowData, options);
 
-        var _content2 = utils.ObjectUtils.getJSXElement(props.rowGroupHeaderTemplate, rowData, {
-          index: index,
-          props: props.tableProps
-        });
-
+        // check if the user wants complete control of the rendering
+        if (!options.customRendering) {
+          _content2 = /*#__PURE__*/React__namespace.createElement("td", {
+            colSpan: colSpan
+          }, toggler, /*#__PURE__*/React__namespace.createElement("span", {
+            className: "p-rowgroup-header-name"
+          }, _content2));
+        }
         return /*#__PURE__*/React__namespace.createElement("tr", {
           className: "p-rowgroup-header",
           style: style,
           role: "row"
-        }, /*#__PURE__*/React__namespace.createElement("td", {
-          colSpan: colSpan
-        }, toggler, /*#__PURE__*/React__namespace.createElement("span", {
-          className: "p-rowgroup-header-name"
-        }, _content2)));
+        }, _content2);
       }
-
       return null;
     };
-
     var createRow = function createRow(rowData, index, expanded) {
       if (!props.expandableRowGroups || expanded) {
         var selected = isSelectionEnabled() ? isSelected(rowData) : false;
         var contextMenuSelected = isContextMenuSelected(rowData);
-
         var _allowRowSelection = allowRowSelection();
-
         var _allowCellSelection = allowCellSelection();
-
         var editing = isRowEditing(rowData);
         return /*#__PURE__*/React__namespace.createElement(BodyRow, {
           tableProps: props.tableProps,
@@ -2441,6 +2159,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           onRowClick: onRowClick,
           onRowDoubleClick: onRowDoubleClick,
           onRowRightClick: onRowRightClick,
+          onRowMouseEnter: onRowMouseEnter,
+          onRowMouseLeave: onRowMouseLeave,
           tabIndex: props.tabIndex,
           isSelectable: isSelectable,
           onRowTouchEnd: onRowTouchEnd,
@@ -2491,7 +2211,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       }
     };
-
     var createExpansion = function createExpansion(rowData, index, expanded, colSpan) {
       if (expanded && !(isSubheaderGrouping && props.expandableRowGroups)) {
         var id = "".concat(props.tableSelector, "_content_").concat(index, "_expanded");
@@ -2499,27 +2218,23 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           index: index,
           customRendering: false
         };
+        var _content3 = utils.ObjectUtils.getJSXElement(props.rowExpansionTemplate, rowData, options);
 
-        var _content3 = utils.ObjectUtils.getJSXElement(props.rowExpansionTemplate, rowData, options); // check if the user wants complete control of the rendering
-
-
+        // check if the user wants complete control of the rendering
         if (!options.customRendering) {
           _content3 = /*#__PURE__*/React__namespace.createElement("td", {
             role: "cell",
             colSpan: colSpan
           }, _content3);
         }
-
         return /*#__PURE__*/React__namespace.createElement("tr", {
           id: id,
           className: "p-datatable-row-expansion",
           role: "row"
         }, _content3);
       }
-
       return null;
     };
-
     var createGroupFooter = function createGroupFooter(rowData, index, expanded, colSpan) {
       if (isSubheaderGrouping && shouldRenderRowGroupFooter(props.value, rowData, index - props.first, expanded)) {
         var _content4 = utils.ObjectUtils.getJSXElement(props.rowGroupFooterTemplate, rowData, {
@@ -2527,16 +2242,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           colSpan: colSpan,
           props: props.tableProps
         });
-
         return /*#__PURE__*/React__namespace.createElement("tr", {
           className: "p-rowgroup-footer",
           role: "row"
         }, _content4);
       }
-
       return null;
     };
-
     var createContent = function createContent() {
       return props.value.map(function (rowData, i) {
         var index = getVirtualScrollerOption('getItemOptions') ? getVirtualScrollerOption('getItemOptions')(i).index : props.first + i;
@@ -2552,7 +2264,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }, groupHeader, row, expansion, groupFooter);
       });
     };
-
     var className = utils.classNames('p-datatable-tbody', props.className);
     var content = props.empty ? createEmptyContent() : createContent();
     return /*#__PURE__*/React__namespace.createElement("tbody", {
@@ -2563,57 +2274,44 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
   TableBody.displayName = 'TableBody';
 
   function ownKeys$4(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 _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var FooterCell = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState({}),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        styleObjectState = _React$useState2[0],
-        setStyleObjectState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      styleObjectState = _React$useState2[0],
+      setStyleObjectState = _React$useState2[1];
     var elementRef = React__namespace.useRef(null);
-
     var getColumnProp = function getColumnProp(prop) {
       return props.column.props[prop];
     };
-
     var getStyle = function getStyle() {
       var footerStyle = getColumnProp('footerStyle');
       var columnStyle = getColumnProp('style');
       return getColumnProp('frozen') ? Object.assign({}, columnStyle, footerStyle, styleObjectState) : Object.assign({}, columnStyle, footerStyle);
     };
-
     var updateStickyPosition = function updateStickyPosition() {
       if (getColumnProp('frozen')) {
         var styleObject = _objectSpread$4({}, styleObjectState);
-
         var _align = getColumnProp('alignFrozen');
-
         if (_align === 'right') {
           var right = 0;
           var next = elementRef.current.nextElementSibling;
-
           if (next) {
             right = utils.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
           }
-
           styleObject['right'] = right + 'px';
         } else {
           var left = 0;
           var prev = elementRef.current.previousElementSibling;
-
           if (prev) {
             left = utils.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
           }
-
           styleObject['left'] = left + 'px';
         }
-
         var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];
         !isSameStyle && setStyleObjectState(styleObject);
       }
     };
-
     React__namespace.useEffect(function () {
       if (getColumnProp('frozen')) {
         updateStickyPosition();
@@ -2646,12 +2344,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         return col && col.props.footer;
       }) : false;
     };
-
     var createGroupFooterCells = function createGroupFooterCells(row) {
       var columns = React__namespace.Children.toArray(row.props.children);
       return createFooterCells(columns);
     };
-
     var createFooterCells = function createFooterCells(columns) {
       return React__namespace.Children.map(columns, function (col, i) {
         var isVisible = col ? !col.props.hidden : true;
@@ -2663,7 +2359,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       });
     };
-
     var createContent = function createContent() {
       if (props.footerColumnGroup) {
         var rows = React__namespace.Children.toArray(props.footerColumnGroup.props.children);
@@ -2674,85 +2369,69 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           }, createGroupFooterCells(row));
         });
       }
-
       return /*#__PURE__*/React__namespace.createElement("tr", {
         role: "row"
       }, createFooterCells(props.columns));
     };
-
     if (hasFooter()) {
       var content = createContent();
       return /*#__PURE__*/React__namespace.createElement("tfoot", {
         className: "p-datatable-tfoot"
       }, content);
     }
-
     return null;
   });
   TableFooter.displayName = 'TableFooter';
 
   function ownKeys$3(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 _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var ColumnFilter = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState(false),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        overlayVisibleState = _React$useState2[0],
-        setOverlayVisibleState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      overlayVisibleState = _React$useState2[0],
+      setOverlayVisibleState = _React$useState2[1];
     var overlayRef = React__namespace.useRef(null);
     var iconRef = React__namespace.useRef(null);
     var selfClick = React__namespace.useRef(false);
     var overlayEventListener = React__namespace.useRef(null);
-
     var getColumnProp = function getColumnProp(prop) {
       return props.column.props[prop];
     };
-
     var field = getColumnProp('filterField') || getColumnProp('field');
     var filterModel = props.filters[field];
     var filterStoreModel = props.filtersStore && props.filtersStore[field];
-
     var _useOverlayListener = hooks.useOverlayListener({
-      target: iconRef,
-      overlay: overlayRef,
-      listener: function listener(event, _ref) {
-        var type = _ref.type,
+        target: iconRef,
+        overlay: overlayRef,
+        listener: function listener(event, _ref) {
+          var type = _ref.type,
             valid = _ref.valid;
-
-        if (valid) {
-          type === 'outside' ? !selfClick.current && !isTargetClicked(event.target) && hide() : hide();
-        }
-
-        selfClick.current = false;
-      },
-      when: overlayVisibleState
-    }),
-        _useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
-        bindOverlayListener = _useOverlayListener2[0],
-        unbindOverlayListener = _useOverlayListener2[1];
-
+          if (valid) {
+            type === 'outside' ? !selfClick.current && !isTargetClicked(event.target) && hide() : hide();
+          }
+          selfClick.current = false;
+        },
+        when: overlayVisibleState
+      }),
+      _useOverlayListener2 = _slicedToArray(_useOverlayListener, 2),
+      bindOverlayListener = _useOverlayListener2[0],
+      unbindOverlayListener = _useOverlayListener2[1];
     var hasFilter = function hasFilter() {
       if (!filterStoreModel || !filterModel) return false;
       return filterStoreModel.operator ? !isFilterBlank(filterModel.constraints[0].value) : !isFilterBlank(filterModel.value);
     };
-
     var hasRowFilter = function hasRowFilter() {
       return filterModel && !isFilterBlank(filterModel.value);
     };
-
     var isFilterBlank = function isFilterBlank(filter) {
       return utils.ObjectUtils.isEmpty(filter);
     };
-
     var isRowMatchModeSelected = function isRowMatchModeSelected(matchMode) {
       return filterModel && filterModel.matchMode === matchMode;
     };
-
     var showMenuButton = function showMenuButton() {
       return getColumnProp('showFilterMenu') && (props.display === 'row' ? getColumnProp('dataType') !== 'boolean' : true);
     };
-
     var matchModes = function matchModes() {
       return getColumnProp('filterMatchModeOptions') || PrimeReact__default["default"].filterMatchModeOptions[findDataType()].map(function (key) {
         return {
@@ -2761,31 +2440,24 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         };
       });
     };
-
     var isShowMatchModes = function isShowMatchModes() {
       return getColumnProp('dataType') !== 'boolean' && getColumnProp('showFilterMatchModes') && matchModes() && getColumnProp('showFilterMenuOptions');
     };
-
     var isShowOperator = function isShowOperator() {
       return getColumnProp('showFilterOperator') && filterModel && filterModel.operator && getColumnProp('showFilterMenuOptions');
     };
-
     var showRemoveIcon = function showRemoveIcon() {
       return fieldConstraints().length > 1;
     };
-
     var isShowAddConstraint = function isShowAddConstraint() {
       return getColumnProp('showAddButton') && filterModel && filterModel.operator && fieldConstraints() && fieldConstraints().length < getColumnProp('maxConstraints') && getColumnProp('showFilterMenuOptions');
     };
-
     var isOutsideClicked = function isOutsideClicked(target) {
       return !isTargetClicked(target) && overlayRef.current && !(overlayRef.current.isSameNode(target) || overlayRef.current.contains(target));
     };
-
     var isTargetClicked = function isTargetClicked(target) {
       return iconRef.current && (iconRef.current.isSameNode(target) || iconRef.current.contains(target));
     };
-
     var getDefaultConstraint = function getDefaultConstraint() {
       if (filterStoreModel) {
         if (filterStoreModel.operator) {
@@ -2800,17 +2472,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       }
     };
-
     var findDataType = function findDataType() {
       var dataType = getColumnProp('dataType');
       var matchMode = getColumnProp('filterMatchMode');
-
       var hasMatchMode = function hasMatchMode(key) {
         return PrimeReact__default["default"].filterMatchModeOptions[key].some(function (mode) {
           return mode === matchMode;
         });
       };
-
       if (matchMode === 'custom' && !hasMatchMode(dataType)) {
         PrimeReact__default["default"].filterMatchModeOptions[dataType].push(PrimeReact.FilterMatchMode.CUSTOM);
         return dataType;
@@ -2819,16 +2488,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           return hasMatchMode(key);
         }) || dataType;
       }
-
       return dataType;
     };
-
     var clearFilter = function clearFilter() {
       var filterClearCallback = getColumnProp('onFilterClear');
       var defaultConstraint = getDefaultConstraint();
-
       var filters = _objectSpread$3({}, props.filters);
-
       if (filters[field].operator) {
         filters[field].constraints.splice(1);
         filters[field].operator = defaultConstraint.operator;
@@ -2840,13 +2505,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         filters[field].value = null;
         filters[field].matchMode = defaultConstraint.matchMode;
       }
-
       filterClearCallback && filterClearCallback();
       props.onFilterChange(filters);
       props.onFilterApply();
       hide();
     };
-
     var applyFilter = function applyFilter() {
       var filterApplyClickCallback = getColumnProp('onFilterApplyClick');
       filterApplyClickCallback && filterApplyClickCallback({
@@ -2856,20 +2519,17 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       props.onFilterApply();
       hide();
     };
-
     var toggleMenu = function toggleMenu() {
       setOverlayVisibleState(function (prevVisible) {
         return !prevVisible;
       });
     };
-
     var onToggleButtonKeyDown = function onToggleButtonKeyDown(event) {
       switch (event.key) {
         case 'Escape':
         case 'Tab':
           hide();
           break;
-
         case 'ArrowDown':
           if (overlayVisibleState) {
             var focusable = utils.DomHandler.getFirstFocusableElement(overlayRef.current);
@@ -2879,41 +2539,38 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             setOverlayVisibleState(true);
             event.preventDefault();
           }
-
           break;
       }
     };
-
     var onContentKeyDown = function onContentKeyDown(event) {
       if (event.key === 'Escape') {
         hide();
         iconRef.current && iconRef.current.focus();
       }
     };
-
     var onInputChange = function onInputChange(event, index) {
       var filters = _objectSpread$3({}, props.filters);
-
       var value = event.target.value;
-
       if (props.display === 'menu') {
         filters[field].constraints[index].value = value;
       } else {
         filters[field].value = value;
       }
-
       props.onFilterChange(filters);
-
       if (!getColumnProp('showApplyButton') || props.display === 'row') {
         props.onFilterApply();
       }
     };
-
+    var onInputKeydown = function onInputKeydown(event, _index) {
+      if (event.key === 'Enter') {
+        if (!getColumnProp('showApplyButton') || props.display === 'menu') {
+          applyFilter();
+        }
+      }
+    };
     var onRowMatchModeChange = function onRowMatchModeChange(matchMode) {
       var filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange');
-
       var filters = _objectSpread$3({}, props.filters);
-
       filters[field].matchMode = matchMode;
       filterMatchModeChangeCallback && filterMatchModeChangeCallback({
         field: field,
@@ -2923,65 +2580,50 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       props.onFilterApply();
       hide();
     };
-
     var onRowMatchModeKeyDown = function onRowMatchModeKeyDown(event, matchMode, clear) {
       var item = event.target;
-
       switch (event.key) {
         case 'ArrowDown':
           var nextItem = findNextItem(item);
-
           if (nextItem) {
             item.removeAttribute('tabindex');
             nextItem.tabIndex = 0;
             nextItem.focus();
           }
-
           event.preventDefault();
           break;
-
         case 'ArrowUp':
           var prevItem = findPrevItem(item);
-
           if (prevItem) {
             item.removeAttribute('tabindex');
             prevItem.tabIndex = 0;
             prevItem.focus();
           }
-
           event.preventDefault();
           break;
-
         case 'Enter':
           clear ? clearFilter() : onRowMatchModeChange(matchMode.value);
           event.preventDefault();
           break;
       }
     };
-
     var onOperatorChange = function onOperatorChange(e) {
       var filterOperationChangeCallback = getColumnProp('onFilterOperatorChange');
       var value = e.value;
-
       var filters = _objectSpread$3({}, props.filters);
-
       filters[field].operator = value;
       props.onFilterChange(filters);
       filterOperationChangeCallback && filterOperationChangeCallback({
         field: field,
         operator: value
       });
-
       if (!getColumnProp('showApplyButton')) {
         props.onFilterApply();
       }
     };
-
     var onMenuMatchModeChange = function onMenuMatchModeChange(value, index) {
       var filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange');
-
       var filters = _objectSpread$3({}, props.filters);
-
       filters[field].constraints[index].matchMode = value;
       props.onFilterChange(filters);
       filterMatchModeChangeCallback && filterMatchModeChangeCallback({
@@ -2989,18 +2631,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         matchMode: value,
         index: index
       });
-
       if (!getColumnProp('showApplyButton')) {
         props.onFilterApply();
       }
     };
-
     var addConstraint = function addConstraint() {
       var filterConstraintAddCallback = getColumnProp('onFilterConstraintAdd');
       var defaultConstraint = getDefaultConstraint();
-
       var filters = _objectSpread$3({}, props.filters);
-
       var newConstraint = {
         value: null,
         matchMode: defaultConstraint.matchMode
@@ -3011,43 +2649,34 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         constraint: newConstraint
       });
       props.onFilterChange(filters);
-
       if (!getColumnProp('showApplyButton')) {
         props.onFilterApply();
       }
     };
-
     var removeConstraint = function removeConstraint(index) {
       var filterConstraintRemoveCallback = getColumnProp('onFilterConstraintRemove');
-
       var filters = _objectSpread$3({}, props.filters);
-
       var removedConstraint = filters[field].constraints.splice(index, 1);
       filterConstraintRemoveCallback && filterConstraintRemoveCallback({
         field: field,
         constraint: removedConstraint
       });
       props.onFilterChange(filters);
-
       if (!getColumnProp('showApplyButton')) {
         props.onFilterApply();
       }
     };
-
     var findNextItem = function findNextItem(item) {
       var nextItem = item.nextElementSibling;
       return nextItem ? utils.DomHandler.hasClass(nextItem, 'p-column-filter-separator') ? findNextItem(nextItem) : nextItem : item.parentElement.firstElementChild;
     };
-
     var findPrevItem = function findPrevItem(item) {
       var prevItem = item.previousElementSibling;
       return prevItem ? utils.DomHandler.hasClass(prevItem, 'p-column-filter-separator') ? findPrevItem(prevItem) : prevItem : item.parentElement.lastElementChild;
     };
-
     var hide = function hide() {
       setOverlayVisibleState(false);
     };
-
     var onContentClick = function onContentClick(event) {
       selfClick.current = true;
       overlayservice.OverlayService.emit('overlay-click', {
@@ -3055,51 +2684,40 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         target: overlayRef.current
       });
     };
-
     var onContentMouseDown = function onContentMouseDown() {
       selfClick.current = true;
     };
-
     var onOverlayEnter = function onOverlayEnter() {
       utils.ZIndexUtils.set('overlay', overlayRef.current, PrimeReact__default["default"].autoZIndex, PrimeReact__default["default"].zIndex['overlay']);
       utils.DomHandler.alignOverlay(overlayRef.current, iconRef.current, PrimeReact__default["default"].appendTo, false);
-
       overlayEventListener.current = function (e) {
         if (!isOutsideClicked(e.target)) {
           selfClick.current = true;
         }
       };
-
       overlayservice.OverlayService.on('overlay-click', overlayEventListener.current);
     };
-
     var onOverlayEntered = function onOverlayEntered() {
       bindOverlayListener();
     };
-
     var onOverlayExit = function onOverlayExit() {
       onOverlayHide();
     };
-
     var onOverlayExited = function onOverlayExited() {
       utils.ZIndexUtils.clear(overlayRef.current);
     };
-
     var onOverlayHide = function onOverlayHide() {
       unbindOverlayListener();
       overlayservice.OverlayService.off('overlay-click', overlayEventListener.current);
       overlayEventListener.current = null;
       selfClick.current = false;
     };
-
     var fieldConstraints = function fieldConstraints() {
       return filterModel ? filterModel.constraints || [filterModel] : [];
     };
-
     var operator = function operator() {
       return filterModel.operator;
     };
-
     var operatorOptions = function operatorOptions() {
       return [{
         label: PrimeReact.localeOption('matchAll'),
@@ -3109,50 +2727,38 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         value: PrimeReact.FilterOperator.OR
       }];
     };
-
     var filterLabel = function filterLabel() {
       return PrimeReact.localeOption('filter');
     };
-
     var noFilterLabel = function noFilterLabel() {
       return PrimeReact.localeOption('noFilter');
     };
-
     var removeRuleButtonLabel = function removeRuleButtonLabel() {
       return PrimeReact.localeOption('removeRule');
     };
-
     var addRuleButtonLabel = function addRuleButtonLabel() {
       return PrimeReact.localeOption('addRule');
     };
-
     var clearButtonLabel = function clearButtonLabel() {
       return PrimeReact.localeOption('clear');
     };
-
     var applyButtonLabel = function applyButtonLabel() {
       return PrimeReact.localeOption('apply');
     };
-
     var filterCallback = function filterCallback(value) {
       var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-
       var filters = _objectSpread$3({}, props.filters);
-
       var meta = filters[field];
       props.display === 'menu' && meta && meta.operator ? filters[field].constraints[index].value = value : filters[field].value = value;
       props.onFilterChange(filters);
     };
-
     var filterApplyCallback = function filterApplyCallback() {
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
-
       args && filterCallback(args[0], args[1]);
       props.onFilterApply();
     };
-
     hooks.useUpdateEffect(function () {
       if (props.display === 'menu' && overlayVisibleState) {
         utils.DomHandler.alignOverlay(overlayRef.current, iconRef.current, PrimeReact__default["default"].appendTo, false);
@@ -3163,13 +2769,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         overlayservice.OverlayService.off('overlay-click', overlayEventListener.current);
         overlayEventListener.current = null;
       }
-
       if (overlayRef.current) {
         utils.ZIndexUtils.clear(overlayRef.current);
         onOverlayHide();
       }
     });
-
     var createFilterElement = function createFilterElement(model, index) {
       var value = model ? model.value : null;
       return getColumnProp('filterElement') ? utils.ObjectUtils.getJSXElement(getColumnProp('filterElement'), {
@@ -3185,12 +2789,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         onChange: function onChange(e) {
           return onInputChange(e, index);
         },
+        onKeyDown: function onKeyDown(e) {
+          return onInputKeydown(e);
+        },
         className: "p-column-filter",
         placeholder: getColumnProp('filterPlaceholder'),
         maxLength: getColumnProp('filterMaxLength')
       });
     };
-
     var createRowFilterElement = function createRowFilterElement() {
       if (props.display === 'row') {
         var content = createFilterElement(filterModel, 0);
@@ -3198,21 +2804,17 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           className: "p-fluid p-column-filter-element"
         }, content);
       }
-
       return null;
     };
-
     var createMenuFilterElement = function createMenuFilterElement(fieldConstraint, index) {
       return props.display === 'menu' ? createFilterElement(fieldConstraint, index) : null;
     };
-
     var createMenuButton = function createMenuButton() {
       if (showMenuButton()) {
         var _className = utils.classNames('p-column-filter-menu-button p-link', {
           'p-column-filter-menu-button-open': overlayVisibleState,
           'p-column-filter-menu-button-active': hasFilter()
         });
-
         var label = filterLabel();
         return /*#__PURE__*/React__namespace.createElement("button", {
           ref: iconRef,
@@ -3228,16 +2830,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           "aria-hidden": "true"
         }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
       }
-
       return null;
     };
-
     var createClearButton = function createClearButton() {
       if (getColumnProp('showClearButton') && props.display === 'row') {
         var _className2 = utils.classNames('p-column-filter-clear-button p-link', {
           'p-hidden-space': !hasRowFilter()
         });
-
         var clearLabel = clearButtonLabel();
         return /*#__PURE__*/React__namespace.createElement("button", {
           className: _className2,
@@ -3249,21 +2848,17 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           "aria-hidden": "true"
         }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
       }
-
       return null;
     };
-
     var createRowItems = function createRowItems() {
       if (isShowMatchModes()) {
         var _matchModes = matchModes();
-
         var _noFilterLabel = noFilterLabel();
-
         return /*#__PURE__*/React__namespace.createElement("ul", {
           className: "p-column-filter-row-items"
         }, _matchModes.map(function (matchMode, i) {
           var value = matchMode.value,
-              label = matchMode.label;
+            label = matchMode.label;
           var className = utils.classNames('p-column-filter-row-item', {
             'p-highlight': isRowMatchModeSelected(value)
           });
@@ -3289,10 +2884,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           }
         }, _noFilterLabel));
       }
-
       return null;
     };
-
     var createOperator = function createOperator() {
       if (isShowOperator()) {
         var options = operatorOptions();
@@ -3306,10 +2899,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           className: "p-column-filter-operator-dropdown"
         }));
       }
-
       return null;
     };
-
     var createMatchModeDropdown = function createMatchModeDropdown(constraint, index) {
       if (isShowMatchModes()) {
         var options = matchModes();
@@ -3322,10 +2913,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           className: "p-column-filter-matchmode-dropdown"
         });
       }
-
       return null;
     };
-
     var createRemoveButton = function createRemoveButton(index) {
       if (showRemoveIcon()) {
         var removeRuleLabel = removeRuleButtonLabel();
@@ -3339,13 +2928,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           label: removeRuleLabel
         });
       }
-
       return null;
     };
-
     var createConstraints = function createConstraints() {
       var _fieldConstraints = fieldConstraints();
-
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: "p-column-filter-constraints"
       }, _fieldConstraints.map(function (fieldConstraint, i) {
@@ -3358,7 +2944,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }, matchModeDropdown, menuFilterElement, /*#__PURE__*/React__namespace.createElement("div", null, removeButton));
       }));
     };
-
     var createAddRule = function createAddRule() {
       if (isShowAddConstraint()) {
         var addRuleLabel = addRuleButtonLabel();
@@ -3372,10 +2957,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           onClick: addConstraint
         }));
       }
-
       return null;
     };
-
     var createFilterClearButton = function createFilterClearButton() {
       if (getColumnProp('showClearButton')) {
         if (!getColumnProp('filterClear')) {
@@ -3387,17 +2970,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             label: clearLabel
           });
         }
-
         return utils.ObjectUtils.getJSXElement(getColumnProp('filterClear'), {
           field: field,
           filterModel: filterModel,
           filterClearCallback: clearFilter
         });
       }
-
       return null;
     };
-
     var createFilterApplyButton = function createFilterApplyButton() {
       if (getColumnProp('showApplyButton')) {
         if (!getColumnProp('filterApply')) {
@@ -3409,17 +2989,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             label: applyLabel
           });
         }
-
         return utils.ObjectUtils.getJSXElement(getColumnProp('filterApply'), {
           field: field,
           filterModel: filterModel,
           filterApplyCallback: applyFilter
         });
       }
-
       return null;
     };
-
     var createButtonBar = function createButtonBar() {
       var clearButton = createFilterClearButton();
       var applyButton = createFilterApplyButton();
@@ -3427,7 +3004,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         className: "p-column-filter-buttonbar"
       }, clearButton, applyButton);
     };
-
     var createItems = function createItems() {
       var operator = createOperator();
       var constraints = createConstraints();
@@ -3435,7 +3011,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       var buttonBar = createButtonBar();
       return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, operator, constraints, addRule, buttonBar);
     };
-
     var createOverlay = function createOverlay() {
       var style = getColumnProp('filterMenuStyle');
       var className = utils.classNames('p-column-filter-overlay p-component p-fluid', getColumnProp('filterMenuClassName'), {
@@ -3476,7 +3051,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         onMouseDown: onContentMouseDown
       }, filterHeader, items, filterFooter)));
     };
-
     var className = utils.classNames('p-column-filter p-fluid', {
       'p-column-filter-row': props.display === 'row',
       'p-column-filter-menu': props.display === 'menu'
@@ -3493,18 +3067,15 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
 
   var HeaderCheckbox = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState(false),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        focusedState = _React$useState2[0],
-        setFocusedState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      focusedState = _React$useState2[0],
+      setFocusedState = _React$useState2[1];
     var onFocus = function onFocus() {
       setFocusedState(true);
     };
-
     var onBlur = function onBlur() {
       setFocusedState(false);
     };
-
     var onClick = function onClick(event) {
       if (!props.disabled) {
         setFocusedState(true);
@@ -3514,14 +3085,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       }
     };
-
     var onKeyDown = function onKeyDown(event) {
       if (event.code === 'Space') {
         onClick(event);
         event.preventDefault();
       }
     };
-
     var boxClassName = utils.classNames('p-checkbox-box p-component', {
       'p-highlight': props.checked,
       'p-disabled': props.disabled,
@@ -3549,130 +3118,102 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
   HeaderCheckbox.displayName = 'HeaderCheckbox';
 
   function ownKeys$2(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 _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var HeaderCell = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState({}),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        styleObjectState = _React$useState2[0],
-        setStyleObjectState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      styleObjectState = _React$useState2[0],
+      setStyleObjectState = _React$useState2[1];
     var elementRef = React__namespace.useRef(null);
     var prevColumn = hooks.usePrevious(props.column);
-
     var isBadgeVisible = function isBadgeVisible() {
       return props.multiSortMeta && props.multiSortMeta.length > 1;
     };
-
     var isSortableDisabled = function isSortableDisabled() {
       return !getColumnProp('sortable') || getColumnProp('sortable') && (props.allSortableDisabled || getColumnProp('sortableDisabled'));
     };
-
     var getColumnProp = function getColumnProp() {
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
-
       return props.column ? typeof args[0] === 'string' ? props.column.props[args[0]] : (args[0] || props.column).props[args[1]] : null;
     };
-
     var getStyle = function getStyle() {
       var headerStyle = getColumnProp('headerStyle');
       var columnStyle = getColumnProp('style');
       return getColumnProp('frozen') ? Object.assign({}, columnStyle, headerStyle, styleObjectState) : Object.assign({}, columnStyle, headerStyle);
     };
-
     var getMultiSortMetaIndex = function getMultiSortMetaIndex() {
       return props.multiSortMeta.findIndex(function (meta) {
         return meta.field === getColumnProp('field') || meta.field === getColumnProp('sortField');
       });
     };
-
     var getSortMeta = function getSortMeta() {
       var sorted = false;
       var sortOrder = 0;
       var metaIndex = -1;
-
       if (props.sortMode === 'single') {
         sorted = props.sortField && (props.sortField === getColumnProp('field') || props.sortField === getColumnProp('sortField'));
         sortOrder = sorted ? props.sortOrder : 0;
       } else if (props.sortMode === 'multiple') {
         metaIndex = getMultiSortMetaIndex();
-
         if (metaIndex > -1) {
           sorted = true;
           sortOrder = props.multiSortMeta[metaIndex].order;
         }
       }
-
       return {
         sorted: sorted,
         sortOrder: sortOrder,
         metaIndex: metaIndex
       };
     };
-
     var getAriaSort = function getAriaSort(_ref) {
       var sorted = _ref.sorted,
-          sortOrder = _ref.sortOrder;
-
+        sortOrder = _ref.sortOrder;
       if (getColumnProp('sortable')) {
         var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
         if (sortIcon === 'pi-sort-amount-down') return 'descending';else if (sortIcon === 'pi-sort-amount-up-alt') return 'ascending';else return 'none';
       }
-
       return null;
     };
-
     var updateStickyPosition = function updateStickyPosition() {
       if (getColumnProp('frozen')) {
         var styleObject = _objectSpread$2({}, styleObjectState);
-
         var align = getColumnProp('alignFrozen');
-
         if (align === 'right') {
           var right = 0;
           var next = elementRef.current.nextElementSibling;
-
           if (next) {
             right = utils.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
           }
-
           styleObject['right'] = right + 'px';
         } else {
           var left = 0;
           var prev = elementRef.current.previousElementSibling;
-
           if (prev) {
             left = utils.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
           }
-
           styleObject['left'] = left + 'px';
         }
-
         var filterRow = elementRef.current.parentElement.nextElementSibling;
-
         if (filterRow) {
           var index = utils.DomHandler.index(elementRef.current);
           filterRow.children[index].style.left = styleObject['left'];
           filterRow.children[index].style.right = styleObject['right'];
         }
-
         var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];
         !isSameStyle && setStyleObjectState(styleObject);
       }
     };
-
     var updateSortableDisabled = function updateSortableDisabled(prevColumn) {
       if (getColumnProp(prevColumn, 'sortableDisabled') !== getColumnProp('sortableDisabled') || getColumnProp(prevColumn, 'sortable') !== getColumnProp('sortable')) {
         props.onSortableChange();
       }
     };
-
     var onClick = function onClick(event) {
       if (!isSortableDisabled()) {
         var targetNode = event.target;
-
         if (utils.DomHandler.hasClass(targetNode, 'p-sortable-column') || utils.DomHandler.hasClass(targetNode, 'p-column-title') || utils.DomHandler.hasClass(targetNode, 'p-column-header-content') || utils.DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || utils.DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
           utils.DomHandler.clearSelection();
           props.onSortChange({
@@ -3683,56 +3224,48 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       }
     };
-
     var onMouseDown = function onMouseDown(event) {
       props.onColumnMouseDown({
         originalEvent: event,
         column: props.column
       });
     };
-
     var onKeyDown = function onKeyDown(event) {
       if (event.key === 'Enter' && event.currentTarget === elementRef.current && utils.DomHandler.hasClass(event.currentTarget, 'p-sortable-column')) {
         onClick(event);
         event.preventDefault();
       }
     };
-
     var onDragStart = function onDragStart(event) {
       props.onColumnDragStart({
         originalEvent: event,
         column: props.column
       });
     };
-
     var onDragOver = function onDragOver(event) {
       props.onColumnDragOver({
         originalEvent: event,
         column: props.column
       });
     };
-
     var onDragLeave = function onDragLeave(event) {
       props.onColumnDragLeave({
         originalEvent: event,
         column: props.column
       });
     };
-
     var onDrop = function onDrop(event) {
       props.onColumnDrop({
         originalEvent: event,
         column: props.column
       });
     };
-
     var onResizerMouseDown = function onResizerMouseDown(event) {
       props.onColumnResizeStart({
         originalEvent: event,
         column: props.column
       });
     };
-
     var onResizerClick = function onResizerClick(event) {
       if (props.onColumnResizerClick) {
         props.onColumnResizerClick({
@@ -3743,7 +3276,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         event.preventDefault();
       }
     };
-
     var onResizerDoubleClick = function onResizerDoubleClick(event) {
       if (props.onColumnResizerDoubleClick) {
         props.onColumnResizerDoubleClick({
@@ -3754,15 +3286,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         event.preventDefault();
       }
     };
-
     React__namespace.useEffect(function () {
       if (getColumnProp('frozen')) {
         updateStickyPosition();
       }
-
       updateSortableDisabled(prevColumn);
     });
-
     var createResizer = function createResizer() {
       if (props.resizableColumns && !getColumnProp('frozen')) {
         return /*#__PURE__*/React__namespace.createElement("span", {
@@ -3772,10 +3301,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           onDoubleClick: onResizerDoubleClick
         });
       }
-
       return null;
     };
-
     var createTitle = function createTitle() {
       var title = utils.ObjectUtils.getJSXElement(getColumnProp('header'), {
         props: props.tableProps
@@ -3784,11 +3311,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         className: "p-column-title"
       }, title);
     };
-
     var createSortIcon = function createSortIcon(_ref2) {
       var sorted = _ref2.sorted,
-          sortOrder = _ref2.sortOrder;
-
+        sortOrder = _ref2.sortOrder;
       if (getColumnProp('sortable')) {
         var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
         var className = utils.classNames('p-sortable-column-icon pi pi-fw', sortIcon);
@@ -3796,23 +3321,18 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           className: className
         });
       }
-
       return null;
     };
-
     var createBadge = function createBadge(_ref3) {
       var metaIndex = _ref3.metaIndex;
-
       if (metaIndex !== -1 && isBadgeVisible()) {
         var value = props.groupRowsBy && props.groupRowsBy === props.groupRowSortField ? metaIndex : metaIndex + 1;
         return /*#__PURE__*/React__namespace.createElement("span", {
           className: "p-sortable-column-badge"
         }, value);
       }
-
       return null;
     };
-
     var createCheckbox = function createCheckbox() {
       if (props.showSelectAll && getColumnProp('selectionMode') === 'multiple' && props.filterDisplay !== 'row') {
         var allRowsSelected = props.allRowsSelected(props.value);
@@ -3822,10 +3342,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           disabled: props.empty
         });
       }
-
       return null;
     };
-
     var createFilter = function createFilter() {
       if (props.filterDisplay === 'menu' && getColumnProp('filter')) {
         return /*#__PURE__*/React__namespace.createElement(ColumnFilter, {
@@ -3837,10 +3355,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           filtersStore: props.filtersStore
         });
       }
-
       return null;
     };
-
     var createHeader = function createHeader(sortMeta) {
       var title = createTitle();
       var sortIcon = createSortIcon(sortMeta);
@@ -3851,10 +3367,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         className: "p-column-header-content"
       }, title, sortIcon, badge, checkbox, filter);
     };
-
     var createElement = function createElement() {
       var _isSortableDisabled = isSortableDisabled();
-
       var sortMeta = getSortMeta();
       var style = getStyle();
       var align = getColumnProp('alignHeader') || getColumnProp('align');
@@ -3898,34 +3412,28 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         content: headerTooltip
       }, headerTooltipOptions)));
     };
-
     var element = createElement();
     return element;
   });
   HeaderCell.displayName = 'HeaderCell';
 
   function ownKeys$1(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 _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var TableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
     var _React$useState = React__namespace.useState([]),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        sortableDisabledFieldsState = _React$useState2[0],
-        setSortableDisabledFieldsState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      sortableDisabledFieldsState = _React$useState2[0],
+      setSortableDisabledFieldsState = _React$useState2[1];
     var _React$useState3 = React__namespace.useState(false),
-        _React$useState4 = _slicedToArray(_React$useState3, 2),
-        allSortableDisabledState = _React$useState4[0],
-        setAllSortableDisabledState = _React$useState4[1];
-
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      allSortableDisabledState = _React$useState4[0],
+      setAllSortableDisabledState = _React$useState4[1];
     var isSingleSort = props.sortMode === 'single';
     var isMultipleSort = props.sortMode === 'multiple';
     var isAllSortableDisabled = isSingleSort && allSortableDisabledState;
-
     var isColumnSorted = function isColumnSorted(column) {
       return props.sortField !== null ? column.props.field === props.sortField || column.props.sortField === props.sortField : false;
     };
-
     var updateSortableDisabled = function updateSortableDisabled() {
       if (isSingleSort || isMultipleSort && props.onSortChange) {
         var sortableDisabledFields = [];
@@ -3933,7 +3441,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         props.columns.forEach(function (column) {
           if (column.props.sortableDisabled) {
             sortableDisabledFields.push(column.props.sortField || column.props.field);
-
             if (!allSortableDisabled && isColumnSorted(column)) {
               allSortableDisabled = true;
             }
@@ -3943,24 +3450,19 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         setAllSortableDisabledState(allSortableDisabled);
       }
     };
-
     var onSortableChange = function onSortableChange() {
       updateSortableDisabled();
     };
-
     var onCheckboxChange = function onCheckboxChange(e) {
       props.onColumnCheckboxChange(e, props.value);
     };
-
     hooks.useMountEffect(function () {
       updateSortableDisabled();
     });
-
     var createGroupHeaderCells = function createGroupHeaderCells(row) {
       var columns = React__namespace.Children.toArray(row.props.children);
       return createHeaderCells(columns);
     };
-
     var createHeaderCells = function createHeaderCells(columns) {
       return React__namespace.Children.map(columns, function (col, i) {
         var isVisible = col ? !col.props.hidden : true;
@@ -4003,7 +3505,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       });
     };
-
     var createCheckbox = function createCheckbox(selectionMode) {
       if (props.showSelectAll && selectionMode === 'multiple') {
         var allRowsSelected = props.allRowsSelected(props.value);
@@ -4013,10 +3514,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           disabled: props.empty
         });
       }
-
       return null;
     };
-
     var createFilter = function createFilter(column, filter) {
       if (filter) {
         return /*#__PURE__*/React__namespace.createElement(ColumnFilter, {
@@ -4028,28 +3527,23 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           onFilterApply: props.onFilterApply
         });
       }
-
       return null;
     };
-
     var createFilterCells = function createFilterCells() {
       return React__namespace.Children.map(props.columns, function (col, i) {
         var isVisible = !col.props.hidden;
-
         if (isVisible) {
           var _col$props = col.props,
-              filterHeaderStyle = _col$props.filterHeaderStyle,
-              style = _col$props.style,
-              filterHeaderClassName = _col$props.filterHeaderClassName,
-              className = _col$props.className,
-              frozen = _col$props.frozen,
-              columnKey = _col$props.columnKey,
-              field = _col$props.field,
-              selectionMode = _col$props.selectionMode,
-              filter = _col$props.filter;
-
+            filterHeaderStyle = _col$props.filterHeaderStyle,
+            style = _col$props.style,
+            filterHeaderClassName = _col$props.filterHeaderClassName,
+            className = _col$props.className,
+            frozen = _col$props.frozen,
+            columnKey = _col$props.columnKey,
+            field = _col$props.field,
+            selectionMode = _col$props.selectionMode,
+            filter = _col$props.filter;
           var colStyle = _objectSpread$1(_objectSpread$1({}, filterHeaderStyle || {}), style || {});
-
           var colClassName = utils.classNames('p-filter-column', filterHeaderClassName, className, {
             'p-frozen-column': frozen
           });
@@ -4062,11 +3556,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             className: colClassName
           }, checkbox, filterRow);
         }
-
         return null;
       });
     };
-
     var createContent = function createContent() {
       if (props.headerColumnGroup) {
         var rows = React__namespace.Children.toArray(props.headerColumnGroup.props.children);
@@ -4086,7 +3578,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, headerRow, filterRow);
       }
     };
-
     var content = createContent();
     return /*#__PURE__*/React__namespace.createElement("thead", {
       className: "p-datatable-thead"
@@ -4095,69 +3586,56 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
   TableHeader.displayName = 'TableHeader';
 
   function 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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     var _React$useState = React__namespace.useState(props.first),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        firstState = _React$useState2[0],
-        setFirstState = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      firstState = _React$useState2[0],
+      setFirstState = _React$useState2[1];
     var _React$useState3 = React__namespace.useState(props.rows),
-        _React$useState4 = _slicedToArray(_React$useState3, 2),
-        rowsState = _React$useState4[0],
-        setRowsState = _React$useState4[1];
-
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      rowsState = _React$useState4[0],
+      setRowsState = _React$useState4[1];
     var _React$useState5 = React__namespace.useState(props.sortField),
-        _React$useState6 = _slicedToArray(_React$useState5, 2),
-        sortFieldState = _React$useState6[0],
-        setSortFieldState = _React$useState6[1];
-
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      sortFieldState = _React$useState6[0],
+      setSortFieldState = _React$useState6[1];
     var _React$useState7 = React__namespace.useState(props.sortOrder),
-        _React$useState8 = _slicedToArray(_React$useState7, 2),
-        sortOrderState = _React$useState8[0],
-        setSortOrderState = _React$useState8[1];
-
+      _React$useState8 = _slicedToArray(_React$useState7, 2),
+      sortOrderState = _React$useState8[0],
+      setSortOrderState = _React$useState8[1];
     var _React$useState9 = React__namespace.useState(props.multiSortMeta),
-        _React$useState10 = _slicedToArray(_React$useState9, 2),
-        multiSortMetaState = _React$useState10[0],
-        setMultiSortMetaState = _React$useState10[1];
-
+      _React$useState10 = _slicedToArray(_React$useState9, 2),
+      multiSortMetaState = _React$useState10[0],
+      setMultiSortMetaState = _React$useState10[1];
     var _React$useState11 = React__namespace.useState(props.filters),
-        _React$useState12 = _slicedToArray(_React$useState11, 2),
-        filtersState = _React$useState12[0],
-        setFiltersState = _React$useState12[1];
-
+      _React$useState12 = _slicedToArray(_React$useState11, 2),
+      filtersState = _React$useState12[0],
+      setFiltersState = _React$useState12[1];
     var _React$useState13 = React__namespace.useState([]),
-        _React$useState14 = _slicedToArray(_React$useState13, 2),
-        columnOrderState = _React$useState14[0],
-        setColumnOrderState = _React$useState14[1];
-
+      _React$useState14 = _slicedToArray(_React$useState13, 2),
+      columnOrderState = _React$useState14[0],
+      setColumnOrderState = _React$useState14[1];
     var _React$useState15 = React__namespace.useState(null),
-        _React$useState16 = _slicedToArray(_React$useState15, 2),
-        groupRowsSortMetaState = _React$useState16[0],
-        setGroupRowsSortMetaState = _React$useState16[1];
-
+      _React$useState16 = _slicedToArray(_React$useState15, 2),
+      groupRowsSortMetaState = _React$useState16[0],
+      setGroupRowsSortMetaState = _React$useState16[1];
     var _React$useState17 = React__namespace.useState({}),
-        _React$useState18 = _slicedToArray(_React$useState17, 2),
-        editingMetaState = _React$useState18[0],
-        setEditingMetaState = _React$useState18[1];
-
+      _React$useState18 = _slicedToArray(_React$useState17, 2),
+      editingMetaState = _React$useState18[0],
+      setEditingMetaState = _React$useState18[1];
     var _React$useState19 = React__namespace.useState(null),
-        _React$useState20 = _slicedToArray(_React$useState19, 2),
-        attributeSelectorState = _React$useState20[0],
-        setAttributeSelectorState = _React$useState20[1];
-
+      _React$useState20 = _slicedToArray(_React$useState19, 2),
+      attributeSelectorState = _React$useState20[0],
+      setAttributeSelectorState = _React$useState20[1];
     var _React$useState21 = React__namespace.useState(props.rows),
-        _React$useState22 = _slicedToArray(_React$useState21, 2),
-        d_rowsState = _React$useState22[0],
-        setD_rowsState = _React$useState22[1];
-
+      _React$useState22 = _slicedToArray(_React$useState21, 2),
+      d_rowsState = _React$useState22[0],
+      setD_rowsState = _React$useState22[1];
     var _React$useState23 = React__namespace.useState({}),
-        _React$useState24 = _slicedToArray(_React$useState23, 2),
-        d_filtersState = _React$useState24[0],
-        setD_filtersState = _React$useState24[1];
-
+      _React$useState24 = _slicedToArray(_React$useState23, 2),
+      d_filtersState = _React$useState24[0],
+      setD_filtersState = _React$useState24[1];
     var elementRef = React__namespace.useRef(null);
     var tableRef = React__namespace.useRef(null);
     var wrapperRef = React__namespace.useRef(null);
@@ -4184,92 +3662,74 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     var columnSortFunction = React__namespace.useRef(null);
     var columnField = React__namespace.useRef(null);
     var filterTimeout = React__namespace.useRef(null);
-
     if (props.rows !== d_rowsState && !props.onPage) {
       setRowsState(props.rows);
       setD_rowsState(props.rows);
     }
-
     var _useEventListener = hooks.useEventListener({
-      type: 'mousemove',
-      listener: function listener(event) {
-        if (columnResizing.current) {
-          onColumnResize(event);
+        type: 'mousemove',
+        listener: function listener(event) {
+          if (columnResizing.current) {
+            onColumnResize(event);
+          }
         }
-      }
-    }),
-        _useEventListener2 = _slicedToArray(_useEventListener, 2),
-        bindDocumentMouseMoveListener = _useEventListener2[0],
-        unbindDocumentMouseMoveListener = _useEventListener2[1];
-
+      }),
+      _useEventListener2 = _slicedToArray(_useEventListener, 2),
+      bindDocumentMouseMoveListener = _useEventListener2[0],
+      unbindDocumentMouseMoveListener = _useEventListener2[1];
     var _useEventListener3 = hooks.useEventListener({
-      type: 'mouseup',
-      listener: function listener() {
-        if (columnResizing.current) {
-          columnResizing.current = false;
-          onColumnResizeEnd();
+        type: 'mouseup',
+        listener: function listener() {
+          if (columnResizing.current) {
+            columnResizing.current = false;
+            onColumnResizeEnd();
+          }
         }
-      }
-    }),
-        _useEventListener4 = _slicedToArray(_useEventListener3, 2),
-        bindDocumentMouseUpListener = _useEventListener4[0],
-        unbindDocumentMouseUpListener = _useEventListener4[1];
-
+      }),
+      _useEventListener4 = _slicedToArray(_useEventListener3, 2),
+      bindDocumentMouseUpListener = _useEventListener4[0],
+      unbindDocumentMouseUpListener = _useEventListener4[1];
     var isCustomStateStorage = function isCustomStateStorage() {
       return props.stateStorage === 'custom';
     };
-
     var isStateful = function isStateful() {
       return props.stateKey != null || isCustomStateStorage();
     };
-
     var isVirtualScrollerDisabled = function isVirtualScrollerDisabled() {
       return utils.ObjectUtils.isEmpty(props.virtualScrollerOptions) || !props.scrollable;
     };
-
     var isEquals = function isEquals(data1, data2) {
       return props.compareSelectionBy === 'equals' ? data1 === data2 : utils.ObjectUtils.equals(data1, data2, props.dataKey);
     };
-
     var hasFilter = function hasFilter() {
       return utils.ObjectUtils.isNotEmpty(getFilters()) || props.globalFilter;
     };
-
     var getFirst = function getFirst() {
       return props.onPage ? props.first : firstState;
     };
-
     var getRows = function getRows() {
       return props.onPage ? props.rows : rowsState;
     };
-
     var getSortField = function getSortField() {
       return props.onSort ? props.sortField : sortFieldState;
     };
-
     var getSortOrder = function getSortOrder() {
       return props.onSort ? props.sortOrder : sortOrderState;
     };
-
     var getMultiSortMeta = function getMultiSortMeta() {
       return (props.onSort ? props.multiSortMeta : multiSortMetaState) || [];
     };
-
     var getFilters = function getFilters() {
       return props.onFilter ? props.filters : filtersState;
     };
-
     var getColumnProp = function getColumnProp(col, prop) {
       return col.props[prop];
     };
-
     var getColumns = function getColumns(ignoreReorderable) {
       var columns = React__namespace.Children.toArray(props.children);
-
       if (!columns) {
         return null;
       }
-
       if (!ignoreReorderable && props.reorderableColumns && columnOrderState) {
         var orderedColumns = columnOrderState.reduce(function (arr, columnKey) {
           var column = findColumnByKey(columns, columnKey);
@@ -4280,95 +3740,72 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           return orderedColumns.indexOf(col) < 0;
         })));
       }
-
       return columns;
     };
-
     var getStorage = function getStorage() {
       switch (props.stateStorage) {
         case 'local':
           return window.localStorage;
-
         case 'session':
           return window.sessionStorage;
-
         case 'custom':
           return null;
-
         default:
           throw new Error(props.stateStorage + ' is not a valid value for the state storage, supported values are "local", "session" and "custom".');
       }
     };
-
     var saveState = function saveState() {
       var state = {};
-
       if (props.paginator) {
         state.first = getFirst();
         state.rows = getRows();
       }
-
       var sortField = getSortField();
-
       if (sortField) {
         state.sortField = sortField;
         state.sortOrder = getSortOrder();
       }
-
       var multiSortMeta = getMultiSortMeta();
-
       if (multiSortMeta) {
         state.multiSortMeta = multiSortMeta;
       }
-
       if (hasFilter()) {
         state.filters = getFilters();
       }
-
       if (props.resizableColumns) {
         saveColumnWidths(state);
       }
-
       if (props.reorderableColumns) {
         state.columnOrder = columnOrderState;
       }
-
       if (props.expandedRows) {
         state.expandedRows = props.expandedRows;
       }
-
       if (props.selection && props.onSelectionChange) {
         state.selection = props.selection;
       }
-
       if (isCustomStateStorage()) {
         if (props.customSaveState) {
           props.customSaveState(state);
         }
       } else {
         var storage = getStorage();
-
         if (utils.ObjectUtils.isNotEmpty(state)) {
           storage.setItem(props.stateKey, JSON.stringify(state));
         }
       }
-
       if (props.onStateSave) {
         props.onStateSave(state);
       }
     };
-
     var clearState = function clearState() {
       var storage = getStorage();
-
       if (storage && props.stateKey) {
         storage.removeItem(props.stateKey);
       }
     };
-
     var restoreState = function restoreState() {
       var restoredState = {};
-
       if (isCustomStateStorage()) {
         if (props.customRestoreState) {
           restoredState = props.customRestoreState();
@@ -4377,26 +3814,20 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         var storage = getStorage();
         var stateString = storage.getItem(props.stateKey);
         var dateFormat = /\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z/;
-
         var reviver = function reviver(key, value) {
           return typeof value === 'string' && dateFormat.test(value) ? new Date(value) : value;
         };
-
         if (stateString) {
           restoredState = JSON.parse(stateString, reviver);
         }
       }
-
       _restoreState(restoredState);
     };
-
     var restoreTableState = function restoreTableState(restoredState) {
       _restoreState(restoredState);
     };
-
     var _restoreState = function _restoreState() {
       var restoredState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
       if (utils.ObjectUtils.isNotEmpty(restoredState)) {
         if (props.paginator) {
           if (props.onPage) {
@@ -4411,14 +3842,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
                 pageCount: pageCount
               };
             };
-
             props.onPage(createEvent(getOnPageParams(restoredState.first, restoredState.rows)));
           } else {
             setFirstState(restoredState.first);
             setRowsState(restoredState.rows);
           }
         }
-
         if (restoredState.sortField) {
           if (props.onSort) {
             props.onSort(createEvent({
@@ -4430,7 +3859,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             setSortOrderState(restoredState.sortOrder);
           }
         }
-
         if (restoredState.multiSortMeta) {
           if (props.onSort) {
             props.onSort(createEvent({
@@ -4440,10 +3868,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             setMultiSortMetaState(restoredState.multiSortMeta);
           }
         }
-
         if (restoredState.filters) {
           setD_filtersState(cloneFilters(restoredState.filters));
-
           if (props.onFilter) {
             props.onFilter(createEvent({
               filters: restoredState.filters
@@ -4452,35 +3878,29 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             setFiltersState(cloneFilters(restoredState.filters));
           }
         }
-
         if (props.resizableColumns) {
           columnWidthsState.current = restoredState.columnWidths;
           tableWidthState.current = restoredState.tableWidth;
           restoreColumnWidths();
         }
-
         if (props.reorderableColumns) {
           setColumnOrderState(restoredState.columnOrder);
         }
-
         if (restoredState.expandedRows && props.onRowToggle) {
           props.onRowToggle({
             data: restoredState.expandedRows
           });
         }
-
         if (restoredState.selection && props.onSelectionChange) {
           props.onSelectionChange({
             value: restoredState.selection
           });
         }
-
         if (props.onStateRestore) {
           props.onStateRestore(restoredState);
         }
       }
     };
-
     var saveColumnWidths = function saveColumnWidths(state) {
       var widths = [];
       var headers = utils.DomHandler.find(elementRef.current, '.p-datatable-thead > tr > th');
@@ -4488,22 +3908,18 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         return widths.push(utils.DomHandler.getOuterWidth(header));
       });
       state.columnWidths = widths.join(',');
-
       if (props.columnResizeMode === 'expand') {
         state.tableWidth = utils.DomHandler.getOuterWidth(tableRef.current) + 'px';
       }
     };
-
     var restoreColumnWidths = function restoreColumnWidths() {
       if (columnWidthsState.current) {
         var widths = columnWidthsState.current.split(',');
-
         if (props.columnResizeMode === 'expand' && tableWidthState.current) {
           tableRef.current.style.width = tableWidthState.current;
           tableRef.current.style.minWidth = tableWidthState.current;
           elementRef.current.style.width = tableWidthState.current;
         }
-
         if (utils.ObjectUtils.isNotEmpty(widths)) {
           createStyleElement();
           var innerHTML = '';
@@ -4515,26 +3931,21 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       }
     };
-
     var findParentHeader = function findParentHeader(element) {
       if (element.nodeName === 'TH') {
         return element;
       } else {
         var parent = element.parentElement;
-
         while (parent.nodeName !== 'TH') {
           parent = parent.parentElement;
           if (!parent) break;
         }
-
         return parent;
       }
     };
-
     var getGroupRowSortField = function getGroupRowSortField() {
       return props.sortMode === 'single' ? props.sortField : groupRowsSortMetaState ? groupRowsSortMetaState.field : null;
     };
-
     var getSelectableData = function getSelectableData(val) {
       if (props.showSelectionElement || props.isDataSelectable) {
         return val.filter(function (data, index) {
@@ -4550,16 +3961,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           return isSelectable;
         });
       }
-
       return val;
     };
-
     var allRowsSelected = function allRowsSelected(processedData) {
       if (props.onSelectAllChange) {
         return props.selectAll;
       } else {
         var _data = props.selectionPageOnly ? dataToRender(processedData) : processedData;
-
         var val = props.frozenValue ? [].concat(_toConsumableArray(props.frozenValue), _toConsumableArray(_data)) : _data;
         var selectableVal = getSelectableData(val);
         return selectableVal && props.selection && selectableVal.every(function (sv) {
@@ -4569,7 +3977,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       }
     };
-
     var getSelectionModeInColumn = function getSelectionModeInColumn(columns) {
       if (columns) {
         var col = columns.find(function (c) {
@@ -4577,31 +3984,24 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
         return col ? col.props.selectionMode : null;
       }
-
       return null;
     };
-
     var findColumnByKey = function findColumnByKey(columns, key) {
       return utils.ObjectUtils.isNotEmpty(columns) ? columns.find(function (col) {
         return col.props.columnKey === key || col.props.field === key;
       }) : null;
     };
-
     var getTotalRecords = function getTotalRecords(data) {
       return props.lazy ? props.totalRecords : data ? data.length : 0;
     };
-
     var onEditingMetaChange = function onEditingMetaChange(e) {
       var rowData = e.rowData,
-          field = e.field,
-          editingKey = e.editingKey;
-          e.rowIndex;
-          var editing = e.editing;
-
+        field = e.field,
+        editingKey = e.editingKey;
+        e.rowIndex;
+        var editing = e.editing;
       var editingMeta = _objectSpread({}, editingMetaState);
-
       var meta = editingMeta[editingKey];
-
       if (editing) {
         !meta && (meta = editingMeta[editingKey] = {
           data: _objectSpread({}, rowData),
@@ -4614,19 +4014,16 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
         !fields.length ? delete editingMeta[editingKey] : meta['fields'] = fields;
       }
-
       setEditingMetaState(editingMeta);
     };
-
     var clearEditingMetaData = function clearEditingMetaData() {
       if (props.editMode && utils.ObjectUtils.isNotEmpty(editingMetaState)) {
         setEditingMetaState({});
       }
     };
-
     var onColumnResizeStart = function onColumnResizeStart(e) {
       var event = e.originalEvent,
-          column = e.column;
+        column = e.column;
       var containerLeft = utils.DomHandler.getOffset(elementRef.current).left;
       resizeColumn.current = column;
       resizeColumnElement.current = event.currentTarget.parentElement;
@@ -4634,7 +4031,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       lastResizeHelperX.current = event.pageX - containerLeft + elementRef.current.scrollLeft;
       bindColumnResizeEvents();
     };
-
     var onColumnResize = function onColumnResize(event) {
       var containerLeft = utils.DomHandler.getOffset(elementRef.current).left;
       utils.DomHandler.addClass(elementRef.current, 'p-unselectable-text');
@@ -4643,42 +4039,33 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       resizeHelperRef.current.style.left = event.pageX - containerLeft + elementRef.current.scrollLeft + 'px';
       resizeHelperRef.current.style.display = 'block';
     };
-
     var onColumnResizeEnd = function onColumnResizeEnd() {
       var delta = resizeHelperRef.current.offsetLeft - lastResizeHelperX.current;
       var columnWidth = resizeColumnElement.current.offsetWidth;
       var newColumnWidth = columnWidth + delta;
       var minWidth = resizeColumnElement.current.style.minWidth || 15;
-
       if (columnWidth + delta > parseInt(minWidth, 10)) {
         if (props.columnResizeMode === 'fit') {
           var nextColumn = resizeColumnElement.current.nextElementSibling;
           var nextColumnWidth = nextColumn.offsetWidth - delta;
-
           if (newColumnWidth > 15 && nextColumnWidth > 15) {
             resizeTableCells(newColumnWidth, nextColumnWidth);
           }
         } else if (props.columnResizeMode === 'expand') {
           var tableWidth = tableRef.current.offsetWidth + delta + 'px';
-
           var updateTableWidth = function updateTableWidth(el) {
             !!el && (el.style.width = el.style.minWidth = tableWidth);
           };
-
           updateTableWidth(tableRef.current);
-
           if (!isVirtualScrollerDisabled()) {
             updateTableWidth(bodyRef.current);
             updateTableWidth(frozenBodyRef.current);
-
             if (wrapperRef.current) {
               updateTableWidth(utils.DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller-content'));
             }
           }
-
           resizeTableCells(newColumnWidth);
         }
-
         if (props.onColumnResizeEnd) {
           props.onColumnResizeEnd({
             element: resizeColumnElement.current,
@@ -4686,19 +4073,16 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             delta: delta
           });
         }
-
         if (isStateful()) {
           saveState();
         }
       }
-
       resizeHelperRef.current.style.display = 'none';
       resizeColumn.current = null;
       resizeColumnElement.current = null;
       utils.DomHandler.removeClass(elementRef.current, 'p-unselectable-text');
       unbindColumnResizeEvents();
     };
-
     var resizeTableCells = function resizeTableCells(newColumnWidth, nextColumnWidth) {
       var widths = [];
       var colIndex = utils.DomHandler.index(resizeColumnElement.current);
@@ -4716,42 +4100,34 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       });
       styleElement.current.innerHTML = innerHTML;
     };
-
     var bindColumnResizeEvents = function bindColumnResizeEvents() {
       bindDocumentMouseMoveListener();
       bindDocumentMouseUpListener();
     };
-
     var unbindColumnResizeEvents = function unbindColumnResizeEvents() {
       unbindDocumentMouseMoveListener();
       unbindDocumentMouseUpListener();
     };
-
     var onColumnHeaderMouseDown = function onColumnHeaderMouseDown(e) {
       utils.DomHandler.clearSelection();
       var event = e.originalEvent,
-          column = e.column;
-
+        column = e.column;
       if (props.reorderableColumns && getColumnProp(column, 'reorderable') !== false && !getColumnProp(column, 'frozen')) {
         if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || utils.DomHandler.hasClass(event.target, 'p-column-resizer')) event.currentTarget.draggable = false;else event.currentTarget.draggable = true;
       }
     };
-
     var onColumnHeaderCheckboxChange = function onColumnHeaderCheckboxChange(e, processedData) {
       if (props.onSelectAllChange) {
         props.onSelectAllChange(e);
       } else {
         var originalEvent = e.originalEvent,
-            checked = e.checked;
-
+          checked = e.checked;
         var _data2 = props.selectionPageOnly ? dataToRender(processedData) : processedData;
-
         var selection = props.selectionPageOnly && props.selection ? props.selection.filter(function (s) {
           return !_data2.some(function (d) {
             return isEquals(s, d);
           });
         }) : [];
-
         if (checked) {
           selection = props.frozenValue ? [].concat(_toConsumableArray(selection), _toConsumableArray(props.frozenValue), _toConsumableArray(_data2)) : [].concat(_toConsumableArray(selection), _toConsumableArray(_data2));
           selection = getSelectableData(selection);
@@ -4767,7 +4143,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             type: 'all'
           });
         }
-
         if (props.onSelectionChange) {
           props.onSelectionChange({
             originalEvent: originalEvent,
@@ -4777,16 +4152,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       }
     };
-
     var onColumnHeaderDragStart = function onColumnHeaderDragStart(e) {
       var event = e.originalEvent,
-          column = e.column;
-
+        column = e.column;
       if (columnResizing.current) {
         event.preventDefault();
         return;
       }
-
       if (!props.reorderableColumns) return;
       colReorderIconWidth.current = utils.DomHandler.getHiddenElementOuterWidth(reorderIndicatorUpRef.current);
       colReorderIconHeight.current = utils.DomHandler.getHiddenElementOuterHeight(reorderIndicatorUpRef.current);
@@ -4797,12 +4169,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
 
     var onColumnHeaderDragOver = function onColumnHeaderDragOver(e) {
       var event = e.originalEvent,
-          column = e.column;
+        column = e.column;
       var dropHeader = findParentHeader(event.currentTarget);
-
       if (props.reorderableColumns && draggedColumnElement.current && dropHeader && !getColumnProp(column, 'frozen')) {
         event.preventDefault();
-
         if (draggedColumnElement.current !== dropHeader) {
           var containerOffset = utils.DomHandler.getOffset(elementRef.current);
           var dropHeaderOffset = utils.DomHandler.getOffset(dropHeader);
@@ -4810,7 +4180,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
           reorderIndicatorUpRef.current.style.top = dropHeaderOffset.top - containerOffset.top - (colReorderIconHeight.current - 1) + 'px';
           reorderIndicatorDownRef.current.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
-
           if (event.pageX > columnCenter) {
             reorderIndicatorUpRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(colReorderIconWidth.current / 2) + 'px';
             reorderIndicatorDownRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(colReorderIconWidth.current / 2) + 'px';
@@ -4820,69 +4189,53 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             reorderIndicatorDownRef.current.style.left = targetLeft - Math.ceil(colReorderIconWidth.current / 2) + 'px';
             dropPosition.current = -1;
           }
-
           reorderIndicatorUpRef.current.style.display = 'block';
           reorderIndicatorDownRef.current.style.display = 'block';
         }
       }
     };
-
     var onColumnHeaderDragLeave = function onColumnHeaderDragLeave(e) {
       var event = e.originalEvent;
-
       if (props.reorderableColumns && draggedColumnElement.current) {
         event.preventDefault();
         reorderIndicatorUpRef.current.style.display = 'none';
         reorderIndicatorDownRef.current.style.display = 'none';
       }
     };
-
     var onColumnHeaderDrop = function onColumnHeaderDrop(e) {
       var event = e.originalEvent,
-          column = e.column;
+        column = e.column;
       event.preventDefault();
-
       if (draggedColumnElement.current) {
         var dragIndex = utils.DomHandler.index(draggedColumnElement.current);
         var dropIndex = utils.DomHandler.index(findParentHeader(event.currentTarget));
         var allowDrop = dragIndex !== dropIndex;
-
         if (allowDrop && (dropIndex - dragIndex === 1 && dropPosition.current === -1 || dragIndex - dropIndex === 1 && dropPosition.current === 1)) {
           allowDrop = false;
         }
-
         if (allowDrop) {
           var _columns = getColumns();
-
           var isSameColumn = function isSameColumn(col1, col2) {
             return col1.props.columnKey || col2.props.columnKey ? utils.ObjectUtils.equals(col1.props, col2.props, 'columnKey') : utils.ObjectUtils.equals(col1.props, col2.props, 'field');
           };
-
           var dragColIndex = _columns.findIndex(function (child) {
             return isSameColumn(child, draggedColumn.current);
           });
-
           var dropColIndex = _columns.findIndex(function (child) {
             return isSameColumn(child, column);
           });
-
           if (dropColIndex < dragColIndex && dropPosition.current === 1) {
             dropColIndex++;
           }
-
           if (dropColIndex > dragColIndex && dropPosition.current === -1) {
             dropColIndex--;
           }
-
           utils.ObjectUtils.reorderArray(_columns, dragColIndex, dropColIndex);
-
           var columnOrder = _columns.reduce(function (orders, col) {
             orders.push(col.props.columnKey || col.props.field);
             return orders;
           }, []);
-
           setColumnOrderState(columnOrder);
-
           if (props.onColReorder) {
             props.onColReorder({
               originalEvent: event,
@@ -4892,7 +4245,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             });
           }
         }
-
         reorderIndicatorUpRef.current.style.display = 'none';
         reorderIndicatorDownRef.current.style.display = 'none';
         draggedColumnElement.current.draggable = false;
@@ -4901,11 +4253,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         dropPosition.current = null;
       }
     };
-
     var createStyleElement = function createStyleElement() {
       styleElement.current = utils.DomHandler.createInlineStyle(PrimeReact__default["default"].nonce);
     };
-
     var createResponsiveStyle = function createResponsiveStyle() {
       if (!responsiveStyleElement.current) {
         responsiveStyleElement.current = utils.DomHandler.createInlineStyle(PrimeReact__default["default"].nonce);
@@ -4913,35 +4263,29 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         responsiveStyleElement.current.innerHTML = innerHTML;
       }
     };
-
     var destroyResponsiveStyle = function destroyResponsiveStyle() {
       responsiveStyleElement.current = utils.DomHandler.removeInlineStyle(responsiveStyleElement.current);
     };
-
     var destroyStyleElement = function destroyStyleElement() {
       styleElement.current = utils.DomHandler.removeInlineStyle(styleElement.current);
     };
-
     var onPageChange = function onPageChange(e) {
       clearEditingMetaData();
-
       if (props.onPage) {
         props.onPage(createEvent(e));
       } else {
         setFirstState(e.first);
         setRowsState(e.rows);
       }
-
       if (props.onValueChange) {
         props.onValueChange(processedData());
       }
     };
-
     var onSortChange = function onSortChange(e) {
       clearEditingMetaData();
       var event = e.originalEvent,
-          column = e.column,
-          sortableDisabledFields = e.sortableDisabledFields;
+        column = e.column,
+        sortableDisabledFields = e.sortableDisabledFields;
       var sortField = column.props.sortField || column.props.field;
       var sortOrder = props.defaultSortOrder;
       var multiSortMeta;
@@ -4949,7 +4293,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       columnSortable.current = column.props.sortable;
       columnSortFunction.current = column.props.sortFunction;
       columnField.current = sortField;
-
       if (props.sortMode === 'multiple') {
         var metaKey = event.metaKey || event.ctrlKey;
         multiSortMeta = _toConsumableArray(getMultiSortMeta());
@@ -4961,7 +4304,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           field: sortField,
           order: sortOrder
         };
-
         if (sortOrder) {
           multiSortMeta = metaKey ? multiSortMeta : multiSortMeta.filter(function (meta) {
             return sortableDisabledFields.some(function (field) {
@@ -4972,23 +4314,19 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         } else if (props.removableSort) {
           removeSortMeta(newMetaData, multiSortMeta);
         }
-
         eventMeta = {
           multiSortMeta: multiSortMeta
         };
       } else {
         sortOrder = getSortField() === sortField ? getCalculatedSortOrder(getSortOrder()) : sortOrder;
-
         if (props.removableSort) {
           sortField = sortOrder ? sortField : null;
         }
-
         eventMeta = {
           sortField: sortField,
           sortOrder: sortOrder
         };
       }
-
       if (props.onSort) {
         props.onSort(createEvent(eventMeta));
       } else {
@@ -4997,7 +4335,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         setSortOrderState(eventMeta.sortOrder);
         setMultiSortMetaState(eventMeta.multiSortMeta);
       }
-
       if (props.onValueChange) {
         props.onValueChange(processedData({
           sortField: sortField,
@@ -5006,34 +4343,27 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }));
       }
     };
-
     var getCalculatedSortOrder = function getCalculatedSortOrder(currentOrder) {
       return props.removableSort ? props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;
     };
-
     var compareValuesOnSort = function compareValuesOnSort(value1, value2, order) {
       return utils.ObjectUtils.sort(value1, value2, order, PrimeReact__default["default"].locale, PrimeReact__default["default"].nullSortOrder);
     };
-
     var addSortMeta = function addSortMeta(meta, multiSortMeta) {
       var index = multiSortMeta.findIndex(function (sortMeta) {
         return sortMeta.field === meta.field;
       });
       if (index >= 0) multiSortMeta[index] = meta;else multiSortMeta.push(meta);
     };
-
     var removeSortMeta = function removeSortMeta(meta, multiSortMeta) {
       var index = multiSortMeta.findIndex(function (sortMeta) {
         return sortMeta.field === meta.field;
       });
-
       if (index >= 0) {
         multiSortMeta.splice(index, 1);
       }
-
       multiSortMeta = multiSortMeta.length > 0 ? multiSortMeta : null;
     };
-
     var sortSingle = function sortSingle(data, field, order) {
       if (props.groupRowsBy && props.groupRowsBy === props.sortField) {
         var multiSortMeta = [{
@@ -5046,9 +4376,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
         return sortMultiple(data, multiSortMeta);
       }
-
       var value = _toConsumableArray(data);
-
       if (columnSortable.current && columnSortFunction.current) {
         value = columnSortFunction.current({
           data: data,
@@ -5062,29 +4390,22 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           return compareValuesOnSort(value1, value2, order);
         });
       }
-
       return value;
     };
-
     var sortMultiple = function sortMultiple(data) {
       var multiSortMeta = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-
       if (props.groupRowsBy && (groupRowsSortMetaState || multiSortMeta.length && props.groupRowsBy === multiSortMeta[0].field)) {
         var groupRowsSortMeta = groupRowsSortMetaState;
         var firstSortMeta = multiSortMeta[0];
-
         if (!groupRowsSortMeta) {
           groupRowsSortMeta = firstSortMeta;
           setGroupRowsSortMetaState(groupRowsSortMeta);
         }
-
         if (firstSortMeta.field !== groupRowsSortMeta.field) {
           multiSortMeta = [groupRowsSortMeta].concat(_toConsumableArray(multiSortMeta));
         }
       }
-
       var value = _toConsumableArray(data);
-
       if (columnSortable.current && columnSortFunction.current) {
         var meta = multiSortMeta.find(function (meta) {
           return meta.field === columnField.current;
@@ -5102,31 +4423,26 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           return multisortField(data1, data2, multiSortMeta, 0);
         });
       }
-
       return value;
     };
-
     var multisortField = function multisortField(data1, data2, multiSortMeta, index) {
       var value1 = utils.ObjectUtils.resolveFieldData(data1, multiSortMeta[index].field);
-      var value2 = utils.ObjectUtils.resolveFieldData(data2, multiSortMeta[index].field); // check if they are equal handling dates and locales
+      var value2 = utils.ObjectUtils.resolveFieldData(data2, multiSortMeta[index].field);
 
+      // check if they are equal handling dates and locales
       if (utils.ObjectUtils.compare(value1, value2, PrimeReact__default["default"].locale) === 0) {
         return multiSortMeta.length - 1 > index ? multisortField(data1, data2, multiSortMeta, index + 1) : 0;
       }
-
       return compareValuesOnSort(value1, value2, multiSortMeta[index].order);
     };
-
     var onFilterChange = function onFilterChange(filters) {
       clearEditingMetaData();
       setD_filtersState(filters);
     };
-
     var onFilterApply = function onFilterApply(filtersToApply) {
       clearTimeout(filterTimeout.current);
       filterTimeout.current = setTimeout(function () {
         var filters = cloneFilters(filtersToApply || d_filtersState);
-
         if (props.onFilter) {
           props.onFilter(createEvent({
             filters: filters
@@ -5135,7 +4451,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           setFirstState(0);
           setFiltersState(filters);
         }
-
         if (props.onValueChange) {
           props.onValueChange(processedData({
             filters: filters
@@ -5143,7 +4458,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       }, props.filterDelay);
     };
-
     var filterLocal = function filterLocal(data, filters) {
       if (!data) return;
       filters = filters || {};
@@ -5151,7 +4465,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       var filteredValue = [];
       var isGlobalFilter = filters['global'] || props.globalFilter;
       var globalFilterFieldsArray;
-
       if (isGlobalFilter) {
         globalFilterFieldsArray = props.globalFilterFields || columns.filter(function (col) {
           return !col.props.excludeGlobalFilter;
@@ -5159,23 +4472,19 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           return col.props.filterField || col.props.field;
         });
       }
-
       for (var i = 0; i < data.length; i++) {
         var localMatch = true;
         var globalMatch = false;
         var localFiltered = false;
-
         for (var prop in filters) {
           if (Object.prototype.hasOwnProperty.call(filters, prop) && prop !== 'global') {
             localFiltered = true;
             var filterField = prop;
             var filterMeta = filters[filterField];
-
             if (filterMeta.operator) {
               for (var j = 0; j < filterMeta.constraints.length; j++) {
                 var filterConstraint = filterMeta.constraints[j];
                 localMatch = executeLocalFilter(filterField, data[i], filterConstraint, j);
-
                 if (filterMeta.operator === PrimeReact.FilterOperator.OR && localMatch || filterMeta.operator === PrimeReact.FilterOperator.AND && !localMatch) {
                   break;
                 }
@@ -5183,46 +4492,37 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             } else {
               localMatch = executeLocalFilter(filterField, data[i], filterMeta, 0);
             }
-
             if (!localMatch) {
               break;
             }
           }
         }
-
         if (isGlobalFilter && !globalMatch && globalFilterFieldsArray) {
           for (var _j = 0; _j < globalFilterFieldsArray.length; _j++) {
             var globalFilterField = globalFilterFieldsArray[_j];
             var matchMode = filters['global'] ? filters['global'].matchMode : props.globalFilterMatchMode;
             var value = filters['global'] ? filters['global'].value : props.globalFilter;
             globalMatch = PrimeReact.FilterService.filters[matchMode](utils.ObjectUtils.resolveFieldData(data[i], globalFilterField), value, props.filterLocale);
-
             if (globalMatch) {
               break;
             }
           }
         }
-
         var matches = void 0;
-
         if (isGlobalFilter) {
           matches = localFiltered ? localFiltered && localMatch && globalMatch : globalMatch;
         } else {
           matches = localFiltered && localMatch;
         }
-
         if (matches) {
           filteredValue.push(data[i]);
         }
       }
-
       if (filteredValue.length === props.value.length) {
         filteredValue = data;
       }
-
       return filteredValue;
     };
-
     var executeLocalFilter = function executeLocalFilter(field, rowData, filterMeta, index) {
       var filterValue = filterMeta.value;
       var filterMatchMode = filterMeta.matchMode === 'custom' ? "custom_".concat(field) : filterMeta.matchMode || PrimeReact.FilterMatchMode.STARTS_WITH;
@@ -5230,17 +4530,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       var filterConstraint = PrimeReact.FilterService.filters[filterMatchMode];
       return utils.ObjectUtils.isFunction(filterConstraint) && filterConstraint(dataFieldValue, filterValue, props.filterLocale, index);
     };
-
     var cloneFilters = function cloneFilters(filters) {
       filters = filters || props.filters;
       var cloned = {};
-
       if (filters) {
         Object.entries(filters).forEach(function (_ref) {
           var _ref2 = _slicedToArray(_ref, 2),
-              prop = _ref2[0],
-              value = _ref2[1];
-
+            prop = _ref2[0],
+            value = _ref2[1];
           cloned[prop] = value.operator ? {
             operator: value.operator,
             constraints: value.constraints.map(function (constraint) {
@@ -5250,7 +4547,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         });
       } else {
         var _columns2 = getColumns();
-
         cloned = _columns2.reduce(function (filters, col) {
           var field = col.props.filterField || col.props.field;
           var filterFunction = col.props.filterFunction;
@@ -5260,19 +4556,16 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             value: null,
             matchMode: matchMode
           };
-
           if (filterFunction) {
             PrimeReact.FilterService.register("custom_".concat(field), function () {
               for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
                 args[_key] = arguments[_key];
               }
-
               return filterFunction.apply(void 0, args.concat([{
                 column: col
               }]));
             });
           }
-
           filters[field] = props.filterDisplay === 'menu' ? {
             operator: PrimeReact.FilterOperator.AND,
             constraints: [constraint]
@@ -5280,15 +4573,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           return filters;
         }, {});
       }
-
       return cloned;
     };
-
     var filter = function filter(value, field, matchMode) {
       var index = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-
       var filters = _objectSpread({}, d_filtersState);
-
       var meta = filters[field];
       var constraint = meta && meta.operator ? meta.constraints[index] : meta;
       constraint = meta ? {
@@ -5302,91 +4591,77 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       setD_filtersState(filters);
       onFilterApply(filters);
     };
-
     var reset = function reset() {
       setD_rowsState(props.rows);
       setD_filtersState(cloneFilters(props.filters));
       setGroupRowsSortMetaState(null);
       setEditingMetaState({});
-
       if (!props.onPage) {
         setFirstState(props.first);
         setRowsState(props.rows);
       }
-
       if (!props.onSort) {
         setSortFieldState(props.sortField);
         setSortOrderState(props.sortOrder);
         setMultiSortMetaState(props.multiSortMeta);
       }
-
       if (!props.onFilter) {
         setFiltersState(props.filters);
       }
-
       resetColumnOrder();
     };
-
     var resetScroll = function resetScroll() {
       if (wrapperRef.current) {
         var scrollableContainer = !isVirtualScrollerDisabled() ? utils.DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller') : wrapperRef.current;
         scrollableContainer.scrollTo(0, 0);
       }
     };
-
     var resetColumnOrder = function resetColumnOrder() {
       var columns = getColumns(true);
       var columnOrder = [];
-
       if (columns) {
         columnOrder = columns.reduce(function (orders, col) {
           orders.push(col.props.columnKey || col.props.field);
           return orders;
         }, []);
       }
-
       setColumnOrderState(columnOrder);
     };
-
     var exportCSV = function exportCSV(options) {
       var data;
       var csv = "\uFEFF";
       var columns = getColumns();
-
       if (options && options.selectionOnly) {
         data = props.selection || [];
       } else {
         data = [].concat(_toConsumableArray(props.frozenValue || []), _toConsumableArray(processedData() || []));
-      } //headers
-
+      }
 
+      //headers
       columns.forEach(function (column, i) {
         var _column$props = column.props,
-            field = _column$props.field,
-            header = _column$props.header,
-            exportable = _column$props.exportable;
-
+          field = _column$props.field,
+          header = _column$props.header,
+          exportable = _column$props.exportable;
         if (exportable && field) {
           csv += '"' + (header || field) + '"';
-
           if (i < columns.length - 1) {
             csv += props.csvSeparator;
           }
         }
-      }); //body
+      });
 
+      //body
       data.forEach(function (record) {
         csv += '\n';
         columns.forEach(function (column, i) {
           var _column$props2 = column.props,
-              colField = _column$props2.field,
-              exportField = _column$props2.exportField,
-              exportable = _column$props2.exportable;
+            colField = _column$props2.field,
+            exportField = _column$props2.exportField,
+            exportable = _column$props2.exportable;
           var field = exportField || colField;
-
           if (exportable && field) {
             var cellData = utils.ObjectUtils.resolveFieldData(record, field);
-
             if (cellData != null) {
               cellData = props.exportFunction ? props.exportFunction({
                 data: cellData,
@@ -5395,9 +4670,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
                 column: column
               }) : String(cellData).replace(/"/g, '""');
             } else cellData = '';
-
             csv += '"' + cellData + '"';
-
             if (i < columns.length - 1) {
               csv += props.csvSeparator;
             }
@@ -5406,13 +4679,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       });
       utils.DomHandler.exportCSV(csv, props.exportFilename);
     };
-
     var closeEditingCell = function closeEditingCell() {
       if (props.editMode !== 'row') {
         document.body.click();
       }
     };
-
     var createEvent = function createEvent(event) {
       return _objectSpread({
         first: getFirst(),
@@ -5423,58 +4694,45 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         filters: getFilters()
       }, event);
     };
-
     var processedData = function processedData(localState) {
       var data = props.value || [];
-
       if (!props.lazy) {
         if (data && data.length) {
           var filters = localState && localState.filters || getFilters();
           var sortField = localState && localState.sortField || getSortField();
           var sortOrder = localState && localState.sortOrder || getSortOrder();
           var multiSortMeta = localState && localState.multiSortMeta || getMultiSortMeta();
-
           var _columns3 = getColumns();
-
           var sortColumn = _columns3.find(function (col) {
             return col.props.field === sortField;
           });
-
           if (sortColumn) {
             columnSortable.current = sortColumn.props.sortable;
             columnSortFunction.current = sortColumn.props.sortFunction;
           }
-
           if (utils.ObjectUtils.isNotEmpty(filters) || props.globalFilter) {
             data = filterLocal(data, filters);
           }
-
           if (sortField || utils.ObjectUtils.isNotEmpty(multiSortMeta)) {
             if (props.sortMode === 'single') data = sortSingle(data, sortField, sortOrder);else if (props.sortMode === 'multiple') data = sortMultiple(data, multiSortMeta);
           }
         }
       }
-
       return data;
     };
-
     var dataToRender = function dataToRender(data) {
       if (data && props.paginator) {
         var first = props.lazy ? 0 : getFirst();
         return data.slice(first, first + getRows());
       }
-
       return data;
     };
-
     hooks.useMountEffect(function () {
       setAttributeSelectorState(utils.UniqueComponentId());
       setFiltersState(cloneFilters(props.filters));
       setD_filtersState(cloneFilters(props.filters));
-
       if (isStateful()) {
         restoreState();
-
         if (props.resizableColumns) {
           restoreColumnWidths();
         }
@@ -5482,14 +4740,19 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     });
     hooks.useUpdateEffect(function () {
       elementRef.current.setAttribute(attributeSelectorState, '');
-
       if (props.responsiveLayout === 'stack' && !props.scrollable) {
         createResponsiveStyle();
       }
     }, [attributeSelectorState]);
     hooks.useUpdateEffect(function () {
-      setFiltersState(cloneFilters(props.filters));
+      var filters = cloneFilters(props.filters);
+      setFiltersState(filters);
       setD_filtersState(cloneFilters(props.filters));
+      if (props.onValueChange) {
+        props.onValueChange(processedData({
+          filters: filters
+        }));
+      }
     }, [props.filters]);
     hooks.useUpdateEffect(function () {
       if (isStateful()) {
@@ -5498,11 +4761,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     });
     hooks.useUpdateEffect(function () {
       destroyResponsiveStyle();
-
       if (props.responsiveLayout === 'stack' && !props.scrollable) {
         createResponsiveStyle();
       }
-    }, [props.responsiveLayout]);
+    }, [props.responsiveLayout, props.scrollable]);
     hooks.useUpdateEffect(function () {
       if (props.globalFilter) {
         filter(props.globalFilter, 'global', props.globalFilterMatchMode);
@@ -5538,7 +4800,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       };
     });
-
     var createLoader = function createLoader() {
       if (props.loading) {
         var iconClassName = utils.classNames('p-datatable-loading-icon pi-spin', props.loadingIcon);
@@ -5548,35 +4809,28 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           className: iconClassName
         }));
       }
-
       return null;
     };
-
     var createHeader = function createHeader() {
       if (props.header) {
         var _content = utils.ObjectUtils.getJSXElement(props.header, {
           props: props
         });
-
         return /*#__PURE__*/React__namespace.createElement("div", {
           className: "p-datatable-header"
         }, _content);
       }
-
       return null;
     };
-
     var createTableHeader = function createTableHeader(options, empty) {
       var sortField = getSortField();
       var sortOrder = getSortOrder();
-
       var multiSortMeta = _toConsumableArray(getMultiSortMeta());
-
       var groupRowSortField = getGroupRowSortField();
       var filters = d_filtersState;
       var filtersStore = !props.onFilter && props.filters || getFilters();
       var processedData = options.items,
-          columns = options.columns;
+        columns = options.columns;
       return /*#__PURE__*/React__namespace.createElement(TableHeader, {
         value: processedData,
         tableProps: props,
@@ -5612,14 +4866,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         reorderableColumns: props.reorderableColumns
       });
     };
-
     var createTableBody = function createTableBody(options, selectionModeInColumn, empty, isVirtualScrollerDisabled) {
       var first = getFirst();
       var rows = options.rows,
-          columns = options.columns,
-          contentRef = options.contentRef,
-          className = options.className;
-          options.itemSize;
+        columns = options.columns,
+        contentRef = options.contentRef,
+        className = options.className;
+        options.itemSize;
       var frozenBody = props.frozenValue && /*#__PURE__*/React__namespace.createElement(TableBody, {
         ref: frozenBodyRef,
         value: props.frozenValue,
@@ -5635,6 +4888,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         tabIndex: props.tabIndex,
         onRowClick: props.onRowClick,
         onRowDoubleClick: props.onRowDoubleClick,
+        onRowMouseEnter: props.onRowMouseEnter,
+        onRowMouseLeave: props.onRowMouseLeave,
         onCellClick: props.onCellClick,
         selection: props.selection,
         onSelectionChange: props.onSelectionChange,
@@ -5705,6 +4960,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         tabIndex: props.tabIndex,
         onRowClick: props.onRowClick,
         onRowDoubleClick: props.onRowDoubleClick,
+        onRowMouseEnter: props.onRowMouseEnter,
+        onRowMouseLeave: props.onRowMouseLeave,
         onCellClick: props.onCellClick,
         selection: props.selection,
         onSelectionChange: props.onSelectionChange,
@@ -5762,7 +5019,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       });
       return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, frozenBody, body);
     };
-
     var createTableFooter = function createTableFooter(options) {
       var columns = options.columns;
       return /*#__PURE__*/React__namespace.createElement(TableFooter, {
@@ -5771,12 +5027,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         footerColumnGroup: props.footerColumnGroup
       });
     };
-
     var createContent = function createContent(processedData, columns, selectionModeInColumn, empty) {
       if (!columns) return;
-
       var _isVirtualScrollerDisabled = isVirtualScrollerDisabled();
-
       var virtualScrollerOptions = props.virtualScrollerOptions || {};
       return /*#__PURE__*/React__namespace.createElement("div", {
         ref: wrapperRef,
@@ -5801,7 +5054,6 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
             tableRef.current = el;
             options.spacerRef && options.spacerRef(el);
           };
-
           var tableClassName = utils.classNames('p-datatable-table', props.tableClassName);
           var tableHeader = createTableHeader(options, empty);
           var tableBody = createTableBody(options, selectionModeInColumn, empty, _isVirtualScrollerDisabled);
@@ -5815,21 +5067,17 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         }
       })));
     };
-
     var createFooter = function createFooter() {
       if (props.footer) {
         var _content2 = utils.ObjectUtils.getJSXElement(props.footer, {
           props: props
         });
-
         return /*#__PURE__*/React__namespace.createElement("div", {
           className: "p-datatable-footer"
         }, _content2);
       }
-
       return null;
     };
-
     var createPaginator = function createPaginator(position, totalRecords) {
       var className = utils.classNames('p-paginator-' + position, props.paginatorClassName);
       return /*#__PURE__*/React__namespace.createElement(paginator.Paginator, {
@@ -5848,23 +5096,18 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         dropdownAppendTo: props.paginatorDropdownAppendTo
       });
     };
-
     var createPaginatorTop = function createPaginatorTop(totalRecords) {
       if (props.paginator && props.paginatorPosition !== 'bottom') {
         return createPaginator('top', totalRecords);
       }
-
       return null;
     };
-
     var createPaginatorBottom = function createPaginatorBottom(totalRecords) {
       if (props.paginator && props.paginatorPosition !== 'top') {
         return createPaginator('bottom', totalRecords);
       }
-
       return null;
     };
-
     var createResizeHelper = function createResizeHelper() {
       if (props.resizableColumns) {
         return /*#__PURE__*/React__namespace.createElement("div", {
@@ -5875,10 +5118,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           }
         });
       }
-
       return null;
     };
-
     var createReorderIndicators = function createReorderIndicators() {
       if (props.reorderableColumns) {
         var style = {
@@ -5895,10 +5136,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           style: style
         }));
       }
-
       return null;
     };
-
     var data = processedData();
     var columns = getColumns();
     var totalRecords = getTotalRecords(data);
@@ -6008,6 +5247,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     onFilter: null,
     onPage: null,
     onRowClick: null,
+    onRowMouseEnter: null,
+    onRowMouseLeave: null,
     onRowCollapse: null,
     onRowDoubleClick: null,
     onRowEditCancel: null,