primereact 7.0.0-rc.2 → 7.0.0

package/datatable/datatable.cjs.js

@@ -4,8 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var paginator = require('primereact/paginator');
-var core = require('primereact/core');
+var utils = require('primereact/utils');
 var PrimeReact = require('primereact/api');
+var overlayservice = require('primereact/overlayservice');
+var ripple = require('primereact/ripple');
+var csstransition = require('primereact/csstransition');
+var portal = require('primereact/portal');
 var inputtext = require('primereact/inputtext');
 var dropdown = require('primereact/dropdown');
 var button = require('primereact/button');
@@ -315,17 +319,17 @@ var RowRadioButton = /*#__PURE__*/function (_Component) {
     value: function render() {
       var _this2 = this;
 
-      var className = core.classNames('p-radiobutton-box p-component', {
+      var className = utils.classNames('p-radiobutton-box p-component', {
         'p-highlight': this.props.checked,
         'p-focus': this.state.focused,
         'p-disabled': this.props.disabled
       });
       var name = "".concat(this.props.tableSelector, "_dt_radio");
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-radiobutton p-component"
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-hidden-accessible"
-      }, /*#__PURE__*/React__default['default'].createElement("input", {
+      }, /*#__PURE__*/React__default["default"].createElement("input", {
         name: name,
         ref: function ref(el) {
           return _this2.input = el;
@@ -336,12 +340,12 @@ var RowRadioButton = /*#__PURE__*/function (_Component) {
         onBlur: this.onBlur,
         onChange: this.onChange,
         onKeyDown: this.onKeyDown
-      })), /*#__PURE__*/React__default['default'].createElement("div", {
+      })), /*#__PURE__*/React__default["default"].createElement("div", {
         className: className,
         onClick: this.onClick,
         role: "radio",
         "aria-checked": this.props.checked
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-radiobutton-icon"
       })));
     }
@@ -412,19 +416,19 @@ var RowCheckbox = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var className = core.classNames('p-checkbox-box p-component', {
+      var className = utils.classNames('p-checkbox-box p-component', {
         'p-highlight': this.props.checked,
         'p-disabled': this.props.disabled,
         'p-focus': this.state.focused
       });
-      var iconClassName = core.classNames('p-checkbox-icon', {
+      var iconClassName = utils.classNames('p-checkbox-icon', {
         'pi pi-check': this.props.checked
       });
       var tabIndex = this.props.disabled ? null : '0';
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-checkbox p-component",
         onClick: this.onClick
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: className,
         role: "checkbox",
         "aria-checked": this.props.checked,
@@ -432,7 +436,7 @@ var RowCheckbox = /*#__PURE__*/function (_Component) {
         onKeyDown: this.onKeyDown,
         onFocus: this.onFocus,
         onBlur: this.onBlur
-      }, /*#__PURE__*/React__default['default'].createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: iconClassName
       })));
     }
@@ -496,7 +500,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
   }, {
     key: "equalsData",
     value: function equalsData(data) {
-      return this.props.compareSelectionBy === 'equals' ? data === this.props.rowData : core.ObjectUtils.equals(data, this.props.rowData, this.props.dataKey);
+      return this.props.compareSelectionBy === 'equals' ? data === this.props.rowData : utils.ObjectUtils.equals(data, this.props.rowData, this.props.dataKey);
     }
   }, {
     key: "equals",
@@ -543,7 +547,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
   }, {
     key: "resolveFieldData",
     value: function resolveFieldData(data) {
-      return core.ObjectUtils.resolveFieldData(data || this.props.rowData, this.field);
+      return utils.ObjectUtils.resolveFieldData(data || this.props.rowData, this.field);
     }
   }, {
     key: "getEditingRowData",
@@ -584,7 +588,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
         }, function () {
           _this3.unbindDocumentEditListener();
 
-          core.OverlayService.off('overlay-click', _this3.overlayEventListener);
+          overlayservice.OverlayService.off('overlay-click', _this3.overlayEventListener);
           _this3.overlayEventListener = null;
         });
       }, 1);
@@ -621,25 +625,27 @@ var BodyCell = /*#__PURE__*/function (_Component) {
         }
 
         this.closeCell(event);
+      } else {
+        event.preventDefault();
       }
     }
   }, {
     key: "findNextSelectableCell",
     value: function findNextSelectableCell(cell) {
       var nextCell = cell.nextElementSibling;
-      return nextCell ? core.DomHandler.hasClass(nextCell, 'p-selectable-cell') ? nextCell : this.findNextSelectableRow(nextCell) : null;
+      return nextCell ? utils.DomHandler.hasClass(nextCell, 'p-selectable-cell') ? nextCell : this.findNextSelectableRow(nextCell) : null;
     }
   }, {
     key: "findPrevSelectableCell",
     value: function findPrevSelectableCell(cell) {
       var prevCell = cell.previousElementSibling;
-      return prevCell ? core.DomHandler.hasClass(prevCell, 'p-selectable-cell') ? prevCell : this.findPrevSelectableRow(prevCell) : null;
+      return prevCell ? utils.DomHandler.hasClass(prevCell, 'p-selectable-cell') ? prevCell : this.findPrevSelectableRow(prevCell) : null;
     }
   }, {
     key: "findNextSelectableRow",
     value: function findNextSelectableRow(row) {
       var nextRow = row.nextElementSibling;
-      return nextRow ? core.DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : this.findNextSelectableRow(nextRow) : null;
+      return nextRow ? utils.DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : this.findNextSelectableRow(nextRow) : null;
     }
   }, {
     key: "findPrevSelectableRow",
@@ -647,7 +653,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
       var prevRow = row.previousElementSibling;
 
       if (prevRow) {
-        return core.DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : this.findPrevSelectableRow(prevRow);
+        return utils.DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : this.findPrevSelectableRow(prevRow);
       }
 
       return null;
@@ -668,7 +674,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
       clearTimeout(this.tabindexTimeout);
       this.tabindexTimeout = setTimeout(function () {
         if (_this4.state.editing) {
-          var focusableEl = core.DomHandler.getFirstFocusableElement(_this4.el, ':not(.p-cell-editor-key-helper)');
+          var focusableEl = utils.DomHandler.getFirstFocusableElement(_this4.el, ':not(.p-cell-editor-key-helper)');
           focusableEl && focusableEl.focus();
         }
 
@@ -688,7 +694,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
           var next = this.el.nextElementSibling;
 
           if (next) {
-            right = core.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
+            right = utils.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
           }
 
           styleObject['right'] = right + 'px';
@@ -697,7 +703,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
           var prev = this.el.previousElementSibling;
 
           if (prev) {
-            left = core.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+            left = utils.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
           }
 
           styleObject['left'] = left + 'px';
@@ -756,7 +762,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
                 }
               };
 
-              core.OverlayService.on('overlay-click', _this5.overlayEventListener);
+              overlayservice.OverlayService.on('overlay-click', _this5.overlayEventListener);
             }
           });
         }, 1);
@@ -857,13 +863,16 @@ var BodyCell = /*#__PURE__*/function (_Component) {
 
           case 13:
             // @deprecated
-            this.onClick(event);
-            event.preventDefault();
+            if (!utils.DomHandler.isClickable(target)) {
+              this.onClick(event);
+              event.preventDefault();
+            }
+
             break;
           //space
 
           case 32:
-            if (target.nodeName !== 'INPUT' && target.nodeName !== 'TEXTAREA' && !target.readOnly) {
+            if (!utils.DomHandler.isClickable(target) && !target.readOnly) {
               this.onClick(event);
               event.preventDefault();
             }
@@ -994,7 +1003,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
       this.unbindDocumentEditListener();
 
       if (this.overlayEventListener) {
-        core.OverlayService.off('overlay-click', this.overlayEventListener);
+        overlayservice.OverlayService.off('overlay-click', this.overlayEventListener);
         this.overlayEventListener = null;
       }
     }
@@ -1010,8 +1019,8 @@ var BodyCell = /*#__PURE__*/function (_Component) {
         column: this.props.column,
         field: this.field
       });
-      var content = core.ObjectUtils.getJSXElement(this.getVirtualScrollerOption('loadingTemplate'), options);
-      return /*#__PURE__*/React__default['default'].createElement("td", null, content);
+      var content = utils.ObjectUtils.getJSXElement(this.getVirtualScrollerOption('loadingTemplate'), options);
+      return /*#__PURE__*/React__default["default"].createElement("td", null, content);
     }
   }, {
     key: "renderElement",
@@ -1031,11 +1040,11 @@ var BodyCell = /*#__PURE__*/function (_Component) {
       var editor = this.getColumnProp('editor');
       var frozen = this.getColumnProp('frozen');
       var value = this.resolveFieldData();
-      var cellClassName = core.ObjectUtils.getPropValue(this.props.cellClassName, value, {
+      var cellClassName = utils.ObjectUtils.getPropValue(this.props.cellClassName, value, {
         props: this.props.tableProps,
         rowData: this.props.rowData
       });
-      var className = core.classNames(this.getColumnProp('bodyClassName'), this.getColumnProp('class'), cellClassName, {
+      var className = utils.classNames(this.getColumnProp('bodyClassName'), this.getColumnProp('class'), cellClassName, {
         'p-selection-column': selectionMode !== null,
         'p-editable-column': editor,
         'p-cell-editing': editor && this.state.editing,
@@ -1044,14 +1053,14 @@ var BodyCell = /*#__PURE__*/function (_Component) {
         'p-highlight': cellSelected
       });
       var style = this.getStyle();
-      var title = this.props.responsiveLayout === 'stack' && /*#__PURE__*/React__default['default'].createElement("span", {
+      var title = this.props.responsiveLayout === 'stack' && /*#__PURE__*/React__default["default"].createElement("span", {
         className: "p-column-title"
-      }, core.ObjectUtils.getJSXElement(header, {
+      }, utils.ObjectUtils.getJSXElement(header, {
         props: this.props.tableProps
       }));
 
       if (body && !this.state.editing) {
-        content = body ? core.ObjectUtils.getJSXElement(body, this.props.rowData, {
+        content = body ? utils.ObjectUtils.getJSXElement(body, this.props.rowData, {
           column: this.props.column,
           field: this.field,
           rowIndex: this.props.rowIndex,
@@ -1059,7 +1068,7 @@ var BodyCell = /*#__PURE__*/function (_Component) {
           props: this.props.tableProps
         }) : value;
       } else if (editor && this.state.editing) {
-        content = core.ObjectUtils.getJSXElement(editor, {
+        content = utils.ObjectUtils.getJSXElement(editor, {
           rowData: this.state.editingRowData,
           value: this.resolveFieldData(this.state.editingRowData),
           column: this.props.column,
@@ -1071,16 +1080,16 @@ var BodyCell = /*#__PURE__*/function (_Component) {
         });
       } else if (selectionMode) {
         var showSelection = this.props.showSelectionElement ? this.props.showSelectionElement(this.props.rowData, {
-          index: this.props.rowIndex,
+          rowIndex: this.props.rowIndex,
           props: this.props.tableProps
         }) : true;
-        content = showSelection && /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, selectionMode === 'single' && /*#__PURE__*/React__default['default'].createElement(RowRadioButton, {
+        content = showSelection && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, selectionMode === 'single' && /*#__PURE__*/React__default["default"].createElement(RowRadioButton, {
           value: this.props.rowData,
           checked: this.props.selected,
           onChange: this.props.onRadioChange,
           tabIndex: this.props.tabIndex,
           tableSelector: this.props.tableSelector
-        }), selectionMode === 'multiple' && /*#__PURE__*/React__default['default'].createElement(RowCheckbox, {
+        }), selectionMode === 'multiple' && /*#__PURE__*/React__default["default"].createElement(RowCheckbox, {
           value: this.props.rowData,
           checked: this.props.selected,
           onChange: this.props.onCheckboxChange,
@@ -1088,38 +1097,39 @@ var BodyCell = /*#__PURE__*/function (_Component) {
         }));
       } else if (rowReorder) {
         var showReorder = this.props.showRowReorderElement ? this.props.showRowReorderElement(this.props.rowData, {
-          index: this.props.rowIndex,
+          rowIndex: this.props.rowIndex,
           props: this.props.tableProps
         }) : true;
-        content = showReorder && /*#__PURE__*/React__default['default'].createElement("i", {
-          className: core.classNames('p-datatable-reorderablerow-handle', this.getColumnProp('rowReorderIcon'))
+        content = showReorder && /*#__PURE__*/React__default["default"].createElement("i", {
+          className: utils.classNames('p-datatable-reorderablerow-handle', this.getColumnProp('rowReorderIcon'))
         });
       } else if (expander) {
-        var iconClassName = core.classNames('p-row-toggler-icon', this.props.expanded ? this.props.expandedRowIcon : this.props.collapsedRowIcon);
+        var iconClassName = utils.classNames('p-row-toggler-icon', this.props.expanded ? this.props.expandedRowIcon : this.props.collapsedRowIcon);
         var ariaControls = "".concat(this.props.tableSelector, "_content_").concat(this.props.rowIndex, "_expanded");
         var expanderProps = {
           onClick: this.onRowToggle,
           className: 'p-row-toggler p-link',
           iconClassName: iconClassName
         };
-        content = /*#__PURE__*/React__default['default'].createElement("button", {
+        content = /*#__PURE__*/React__default["default"].createElement("button", {
           className: expanderProps.className,
           onClick: expanderProps.onClick,
           type: "button",
           "aria-expanded": this.props.expanded,
           "aria-controls": ariaControls,
           tabIndex: this.props.tabIndex
-        }, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, /*#__PURE__*/React__default["default"].createElement("span", {
           className: expanderProps.iconClassName
-        }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+        }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
 
         if (body) {
           expanderProps['element'] = content;
-          content = core.ObjectUtils.getJSXElement(body, this.props.rowData, {
+          content = utils.ObjectUtils.getJSXElement(body, this.props.rowData, {
             column: this.props.column,
             field: this.field,
-            index: this.props.rowIndex,
+            rowIndex: this.props.rowIndex,
             frozenRow: this.props.frozenRow,
+            props: this.props.tableProps,
             expander: expanderProps
           });
         }
@@ -1136,21 +1146,21 @@ var BodyCell = /*#__PURE__*/function (_Component) {
             cancelClassName: 'p-row-editor-cancel p-link',
             cancelIconClassName: 'p-row-editor-cancel-icon pi pi-fw pi-times'
           };
-          content = /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("button", {
+          content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("button", {
             type: "button",
             onClick: rowEditorProps.onSaveClick,
             className: rowEditorProps.saveClassName,
             tabIndex: this.props.tabIndex
-          }, /*#__PURE__*/React__default['default'].createElement("span", {
+          }, /*#__PURE__*/React__default["default"].createElement("span", {
             className: rowEditorProps.saveIconClassName
-          }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null)), /*#__PURE__*/React__default['default'].createElement("button", {
+          }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null)), /*#__PURE__*/React__default["default"].createElement("button", {
             type: "button",
             onClick: rowEditorProps.onCancelClick,
             className: rowEditorProps.cancelClassName,
             tabIndex: this.props.tabIndex
-          }, /*#__PURE__*/React__default['default'].createElement("span", {
+          }, /*#__PURE__*/React__default["default"].createElement("span", {
             className: rowEditorProps.cancelIconClassName
-          }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null)));
+          }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null)));
         } else {
           rowEditorProps = {
             editing: false,
@@ -1158,23 +1168,24 @@ var BodyCell = /*#__PURE__*/function (_Component) {
             initClassName: 'p-row-editor-init p-link',
             initIconClassName: 'p-row-editor-init-icon pi pi-fw pi-pencil'
           };
-          content = /*#__PURE__*/React__default['default'].createElement("button", {
+          content = /*#__PURE__*/React__default["default"].createElement("button", {
             type: "button",
             onClick: rowEditorProps.onInitClick,
             className: rowEditorProps.initClassName,
             tabIndex: this.props.tabIndex
-          }, /*#__PURE__*/React__default['default'].createElement("span", {
+          }, /*#__PURE__*/React__default["default"].createElement("span", {
             className: rowEditorProps.initIconClassName
-          }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+          }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
         }
 
         if (body) {
           rowEditorProps['element'] = content;
-          content = core.ObjectUtils.getJSXElement(body, this.props.rowData, {
+          content = utils.ObjectUtils.getJSXElement(body, this.props.rowData, {
             column: this.props.column,
             field: this.field,
-            index: this.props.rowIndex,
+            rowIndex: this.props.rowIndex,
             frozenRow: this.props.frozenRow,
+            props: this.props.tableProps,
             rowEditor: rowEditorProps
           });
         }
@@ -1184,18 +1195,18 @@ var BodyCell = /*#__PURE__*/function (_Component) {
 
       if (!isRowEditor && editor) {
         /* eslint-disable */
-        editorKeyHelper = /*#__PURE__*/React__default['default'].createElement("a", {
+        editorKeyHelper = /*#__PURE__*/React__default["default"].createElement("a", {
           tabIndex: "0",
           ref: function ref(el) {
             return _this7.keyHelper = el;
           },
           className: "p-cell-editor-key-helper p-hidden-accessible",
           onFocus: this.onEditorFocus
-        }, /*#__PURE__*/React__default['default'].createElement("span", null));
+        }, /*#__PURE__*/React__default["default"].createElement("span", null));
         /* eslint-enable */
       }
 
-      return /*#__PURE__*/React__default['default'].createElement("td", {
+      return /*#__PURE__*/React__default["default"].createElement("td", {
         ref: function ref(el) {
           return _this7.el = el;
         },
@@ -1292,7 +1303,7 @@ var BodyRow = /*#__PURE__*/function (_Component) {
   }, {
     key: "equals",
     value: function equals(data1, data2) {
-      return this.props.compareSelectionBy === 'equals' ? data1 === data2 : core.ObjectUtils.equals(data1, data2, this.props.dataKey);
+      return this.props.compareSelectionBy === 'equals' ? data1 === data2 : utils.ObjectUtils.equals(data1, data2, this.props.dataKey);
     }
   }, {
     key: "getColumnProp",
@@ -1330,13 +1341,13 @@ var BodyRow = /*#__PURE__*/function (_Component) {
     key: "findNextSelectableRow",
     value: function findNextSelectableRow(row) {
       var nextRow = row.nextElementSibling;
-      return nextRow ? core.DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : this.findNextSelectableRow(nextRow) : null;
+      return nextRow ? utils.DomHandler.hasClass(nextRow, 'p-selectable-row') ? nextRow : this.findNextSelectableRow(nextRow) : null;
     }
   }, {
     key: "findPrevSelectableRow",
     value: function findPrevSelectableRow(row) {
       var prevRow = row.previousElementSibling;
-      return prevRow ? core.DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : this.findPrevSelectableRow(prevRow) : null;
+      return prevRow ? utils.DomHandler.hasClass(prevRow, 'p-selectable-row') ? prevRow : this.findPrevSelectableRow(prevRow) : null;
     }
   }, {
     key: "shouldRenderBodyCell",
@@ -1347,8 +1358,8 @@ var BodyRow = /*#__PURE__*/function (_Component) {
         var prevRowData = value[i - 1];
 
         if (prevRowData) {
-          var currentRowFieldData = core.ObjectUtils.resolveFieldData(value[i], this.getColumnProp(column, 'field'));
-          var previousRowFieldData = core.ObjectUtils.resolveFieldData(prevRowData, this.getColumnProp(column, 'field'));
+          var currentRowFieldData = utils.ObjectUtils.resolveFieldData(value[i], this.getColumnProp(column, 'field'));
+          var previousRowFieldData = utils.ObjectUtils.resolveFieldData(prevRowData, this.getColumnProp(column, 'field'));
           return currentRowFieldData !== previousRowFieldData;
         }
       }
@@ -1359,7 +1370,7 @@ var BodyRow = /*#__PURE__*/function (_Component) {
     key: "calculateRowGroupSize",
     value: function calculateRowGroupSize(value, column, index) {
       if (this.isGrouped(column)) {
-        var currentRowFieldData = core.ObjectUtils.resolveFieldData(value[index], this.getColumnProp(column, 'field'));
+        var currentRowFieldData = utils.ObjectUtils.resolveFieldData(value[index], this.getColumnProp(column, 'field'));
         var nextRowFieldData = currentRowFieldData;
         var groupRowSpan = 0;
 
@@ -1368,7 +1379,7 @@ var BodyRow = /*#__PURE__*/function (_Component) {
           var nextRowData = value[++index];
 
           if (nextRowData) {
-            nextRowFieldData = core.ObjectUtils.resolveFieldData(nextRowData, this.getColumnProp(column, 'field'));
+            nextRowFieldData = utils.ObjectUtils.resolveFieldData(nextRowData, this.getColumnProp(column, 'field'));
           } else {
             break;
           }
@@ -1446,13 +1457,16 @@ var BodyRow = /*#__PURE__*/function (_Component) {
 
           case 13:
             // @deprecated
-            this.onClick(event);
-            event.preventDefault();
+            if (!utils.DomHandler.isClickable(target)) {
+              this.onClick(event);
+              event.preventDefault();
+            }
+
             break;
           //space
 
           case 32:
-            if (target.nodeName !== 'INPUT' && target.nodeName !== 'TEXTAREA' && !target.readOnly) {
+            if (!utils.DomHandler.isClickable(target) && !target.readOnly) {
               this.onClick(event);
               event.preventDefault();
             }
@@ -1535,7 +1549,7 @@ var BodyRow = /*#__PURE__*/function (_Component) {
             index = e.index;
 
         if (dataKey) {
-          var dataKeyValue = String(core.ObjectUtils.resolveFieldData(data, dataKey));
+          var dataKeyValue = String(utils.ObjectUtils.resolveFieldData(data, dataKey));
           editingRows = this.props.editingRows ? _objectSpread$6({}, this.props.editingRows) : {};
           if (editingRows[dataKeyValue] != null) delete editingRows[dataKeyValue];else editingRows[dataKeyValue] = true;
         } else {
@@ -1628,7 +1642,7 @@ var BodyRow = /*#__PURE__*/function (_Component) {
 
           var editing = _this3.getEditing();
 
-          return /*#__PURE__*/React__default['default'].createElement(BodyCell, {
+          return /*#__PURE__*/React__default["default"].createElement(BodyCell, {
             key: key,
             value: _this3.props.value,
             tableProps: _this3.props.tableProps,
@@ -1678,10 +1692,10 @@ var BodyRow = /*#__PURE__*/function (_Component) {
     value: function render() {
       var _this4 = this;
 
-      var rowClassName = core.ObjectUtils.getPropValue(this.props.rowClassName, this.props.rowData, {
+      var rowClassName = utils.ObjectUtils.getPropValue(this.props.rowClassName, this.props.rowData, {
         props: this.props.tableProps
       });
-      var className = core.classNames(rowClassName, {
+      var className = utils.classNames(rowClassName, {
         'p-highlight': !this.props.allowCellSelection && this.props.selected,
         'p-highlight-contextmenu': this.props.contextMenuSelected,
         'p-selectable-row': this.props.allowRowSelection,
@@ -1689,7 +1703,7 @@ var BodyRow = /*#__PURE__*/function (_Component) {
       });
       var content = this.renderContent();
       var tabIndex = this.getTabIndex();
-      return /*#__PURE__*/React__default['default'].createElement("tr", {
+      return /*#__PURE__*/React__default["default"].createElement("tr", {
         ref: function ref(el) {
           return _this4.el = el;
         },
@@ -1744,15 +1758,15 @@ var RowTogglerButton = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var iconClassName = core.classNames('p-row-toggler-icon', this.props.expanded ? this.props.expandedRowIcon : this.props.collapsedRowIcon);
-      return /*#__PURE__*/React__default['default'].createElement("button", {
+      var iconClassName = utils.classNames('p-row-toggler-icon', this.props.expanded ? this.props.expandedRowIcon : this.props.collapsedRowIcon);
+      return /*#__PURE__*/React__default["default"].createElement("button", {
         type: "button",
         onClick: this.onClick,
         className: "p-row-toggler p-link",
         tabIndex: this.props.tabIndex
-      }, /*#__PURE__*/React__default['default'].createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: iconClassName
-      }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+      }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
     }
   }]);
 
@@ -1818,7 +1832,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
   }, {
     key: "equals",
     value: function equals(data1, data2) {
-      if (this.allowCellSelection()) return (data1.rowIndex === data2.rowIndex || data1.rowData === data2.rowData) && (data1.field === data2.field || data1.cellIndex === data2.cellIndex);else return this.compareSelectionBy === 'equals' ? data1 === data2 : core.ObjectUtils.equals(data1, data2, this.props.dataKey);
+      if (this.allowCellSelection()) return (data1.rowIndex === data2.rowIndex || data1.rowData === data2.rowData) && (data1.field === data2.field || data1.cellIndex === data2.cellIndex);else return this.compareSelectionBy === 'equals' ? data1 === data2 : utils.ObjectUtils.equals(data1, data2, this.props.dataKey);
     }
   }, {
     key: "isSubheaderGrouping",
@@ -1897,7 +1911,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
         if (this.isSubheaderGrouping() && this.props.expandableRowGroups) {
           return this.isRowGroupExpanded(rowData);
         } else {
-          if (this.props.dataKey) return this.props.expandedRows ? this.props.expandedRows[core.ObjectUtils.resolveFieldData(rowData, this.props.dataKey)] !== undefined : false;else return this.findIndex(this.props.expandedRows, rowData) !== -1;
+          if (this.props.dataKey) return this.props.expandedRows ? this.props.expandedRows[utils.ObjectUtils.resolveFieldData(rowData, this.props.dataKey)] !== undefined : false;else return this.findIndex(this.props.expandedRows, rowData) !== -1;
         }
       }
 
@@ -1909,16 +1923,16 @@ var TableBody = /*#__PURE__*/function (_Component) {
       var _this2 = this;
 
       if (this.props.dataKey === this.props.groupRowsBy) return Object.keys(this.props.expandedRows).some(function (data) {
-        return core.ObjectUtils.equals(data, core.ObjectUtils.resolveFieldData(rowData, _this2.props.dataKey));
+        return utils.ObjectUtils.equals(data, utils.ObjectUtils.resolveFieldData(rowData, _this2.props.dataKey));
       });else return this.props.expandedRows.some(function (data) {
-        return core.ObjectUtils.equals(data, rowData, _this2.props.groupRowsBy);
+        return utils.ObjectUtils.equals(data, rowData, _this2.props.groupRowsBy);
       });
     }
   }, {
     key: "isRowEditing",
     value: function isRowEditing(rowData) {
       if (this.props.editMode === 'row' && rowData && this.props.editingRows) {
-        if (this.props.dataKey) return this.props.editingRows ? this.props.editingRows[core.ObjectUtils.resolveFieldData(rowData, this.props.dataKey)] !== undefined : false;else return this.findIndex(this.props.editingRows, rowData) !== -1;
+        if (this.props.dataKey) return this.props.editingRows ? this.props.editingRows[utils.ObjectUtils.resolveFieldData(rowData, this.props.dataKey)] !== undefined : false;else return this.findIndex(this.props.editingRows, rowData) !== -1;
       }
 
       return false;
@@ -1941,7 +1955,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
   }, {
     key: "allowSelection",
     value: function allowSelection(event) {
-      return !core.DomHandler.isClickable(event.originalEvent.target);
+      return !utils.DomHandler.isClickable(event.originalEvent.target);
     }
   }, {
     key: "allowMetaKeySelection",
@@ -1997,16 +2011,16 @@ var TableBody = /*#__PURE__*/function (_Component) {
   }, {
     key: "getRowKey",
     value: function getRowKey(rowData, index) {
-      return this.props.dataKey ? core.ObjectUtils.resolveFieldData(rowData, this.props.dataKey) + '_' + index : index;
+      return this.props.dataKey ? utils.ObjectUtils.resolveFieldData(rowData, this.props.dataKey) + '_' + index : index;
     }
   }, {
     key: "shouldRenderRowGroupHeader",
     value: function shouldRenderRowGroupHeader(value, rowData, i) {
-      var currentRowFieldData = core.ObjectUtils.resolveFieldData(rowData, this.props.groupRowsBy);
+      var currentRowFieldData = utils.ObjectUtils.resolveFieldData(rowData, this.props.groupRowsBy);
       var prevRowData = value[i - 1];
 
       if (prevRowData) {
-        var previousRowFieldData = core.ObjectUtils.resolveFieldData(prevRowData, this.props.groupRowsBy);
+        var previousRowFieldData = utils.ObjectUtils.resolveFieldData(prevRowData, this.props.groupRowsBy);
         return currentRowFieldData !== previousRowFieldData;
       } else {
         return true;
@@ -2018,11 +2032,11 @@ var TableBody = /*#__PURE__*/function (_Component) {
       if (this.props.expandableRowGroups && !expanded) {
         return false;
       } else {
-        var currentRowFieldData = core.ObjectUtils.resolveFieldData(rowData, this.props.groupRowsBy);
+        var currentRowFieldData = utils.ObjectUtils.resolveFieldData(rowData, this.props.groupRowsBy);
         var nextRowData = value[i + 1];
 
         if (nextRowData) {
-          var nextRowFieldData = core.ObjectUtils.resolveFieldData(nextRowData, this.props.groupRowsBy);
+          var nextRowFieldData = utils.ObjectUtils.resolveFieldData(nextRowData, this.props.groupRowsBy);
           return currentRowFieldData !== nextRowFieldData;
         } else {
           return true;
@@ -2032,12 +2046,12 @@ var TableBody = /*#__PURE__*/function (_Component) {
   }, {
     key: "updateFrozenRowStickyPosition",
     value: function updateFrozenRowStickyPosition() {
-      this.el.style.top = core.DomHandler.getOuterHeight(this.el.previousElementSibling) + 'px';
+      this.el.style.top = utils.DomHandler.getOuterHeight(this.el.previousElementSibling) + 'px';
     }
   }, {
     key: "updateFrozenRowGroupHeaderStickyPosition",
     value: function updateFrozenRowGroupHeaderStickyPosition() {
-      var tableHeaderHeight = core.DomHandler.getOuterHeight(this.el.previousElementSibling);
+      var tableHeaderHeight = utils.DomHandler.getOuterHeight(this.el.previousElementSibling);
       var top = tableHeaderHeight + 'px';
 
       if (this.state.rowGroupHeaderStyleObject && this.state.rowGroupHeaderStyleObject.top !== top) {
@@ -2048,6 +2062,12 @@ var TableBody = /*#__PURE__*/function (_Component) {
         });
       }
     }
+  }, {
+    key: "updateVirtualScrollerPosition",
+    value: function updateVirtualScrollerPosition() {
+      var tableHeaderHeight = utils.DomHandler.getOuterHeight(this.el.previousElementSibling);
+      this.el.style.top = (this.el.style.top || 0) + tableHeaderHeight + 'px';
+    }
   }, {
     key: "onSingleSelection",
     value: function onSingleSelection(_ref) {
@@ -2144,7 +2164,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
   }, {
     key: "onRangeSelection",
     value: function onRangeSelection(event) {
-      core.DomHandler.clearSelection();
+      utils.DomHandler.clearSelection();
       this.rangeRowIndex = this.allowCellSelection() ? event.rowIndex : event.index;
       var selectionInRange = this.selectRange(event);
       var selection = this.isMultipleSelection() ? _toConsumableArray(new Set([].concat(_toConsumableArray(this.props.selection || []), _toConsumableArray(selectionInRange)))) : selectionInRange;
@@ -2233,7 +2253,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
         for (var j = cellRangeStart; j <= cellRangeEnd; j++) {
           var field = columns[j].props.field;
           var rangeRowData = {
-            value: core.ObjectUtils.resolveFieldData(rowData, field),
+            value: utils.ObjectUtils.resolveFieldData(rowData, field),
             field: field,
             rowData: rowData,
             rowIndex: i,
@@ -2274,7 +2294,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
     value: function enableDragSelection(event) {
       if (this.props.dragSelection && !this.dragSelectionHelper) {
         this.dragSelectionHelper = document.createElement('div');
-        core.DomHandler.addClass(this.dragSelectionHelper, 'p-datatable-drag-selection-helper');
+        utils.DomHandler.addClass(this.dragSelectionHelper, 'p-datatable-drag-selection-helper');
         this.initialDragPosition = {
           x: event.clientX,
           y: event.clientY
@@ -2291,10 +2311,10 @@ var TableBody = /*#__PURE__*/function (_Component) {
 
       if (!this.allowCellSelection()) {
         if (this.isCheckboxSelectionModeInColumn()) {
-          var checkbox = core.DomHandler.findSingle(target, 'td.p-selection-column .p-checkbox-box');
+          var checkbox = utils.DomHandler.findSingle(target, 'td.p-selection-column .p-checkbox-box');
           checkbox && checkbox.focus();
         } else if (this.isRadioSelectionModeInColumn()) {
-          var radio = core.DomHandler.findSingle(target, 'td.p-selection-column input[type="radio"]');
+          var radio = utils.DomHandler.findSingle(target, 'td.p-selection-column input[type="radio"]');
           radio && radio.focus();
         }
       }
@@ -2342,7 +2362,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
     value: function onRowDoubleClick(e) {
       var event = e.originalEvent;
 
-      if (core.DomHandler.isClickable(event.target)) {
+      if (utils.DomHandler.isClickable(event.target)) {
         return;
       }
 
@@ -2354,7 +2374,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
     key: "onRowRightClick",
     value: function onRowRightClick(event) {
       if (this.props.onContextMenu || this.props.onContextMenuSelectionChange) {
-        core.DomHandler.clearSelection();
+        utils.DomHandler.clearSelection();
 
         if (this.props.onContextMenuSelectionChange) {
           this.props.onContextMenuSelectionChange({
@@ -2381,9 +2401,9 @@ var TableBody = /*#__PURE__*/function (_Component) {
   }, {
     key: "onRowMouseDown",
     value: function onRowMouseDown(e) {
-      core.DomHandler.clearSelection();
+      utils.DomHandler.clearSelection();
       var event = e.originalEvent;
-      if (core.DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) event.currentTarget.draggable = true;else event.currentTarget.draggable = false;
+      if (utils.DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) event.currentTarget.draggable = true;else event.currentTarget.draggable = false;
 
       if (this.allowRowDrag(e)) {
         this.enableDragSelection(event);
@@ -2409,7 +2429,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
       var hasDataKey = this.props.groupRowsBy ? dataKey === this.props.groupRowsBy : !!dataKey;
 
       if (hasDataKey) {
-        var dataKeyValue = String(core.ObjectUtils.resolveFieldData(event.data, dataKey));
+        var dataKeyValue = String(utils.ObjectUtils.resolveFieldData(event.data, dataKey));
         expandedRows = this.props.expandedRows ? _objectSpread$5({}, this.props.expandedRows) : {};
 
         if (expandedRows[dataKeyValue] != null) {
@@ -2481,19 +2501,19 @@ var TableBody = /*#__PURE__*/function (_Component) {
 
       if (this.rowDragging && this.draggedRowIndex !== index) {
         var rowElement = event.currentTarget;
-        var rowY = core.DomHandler.getOffset(rowElement).top + core.DomHandler.getWindowScrollTop();
+        var rowY = utils.DomHandler.getOffset(rowElement).top + utils.DomHandler.getWindowScrollTop();
         var pageY = event.pageY;
-        var rowMidY = rowY + core.DomHandler.getOuterHeight(rowElement) / 2;
+        var rowMidY = rowY + utils.DomHandler.getOuterHeight(rowElement) / 2;
         var prevRowElement = rowElement.previousElementSibling;
 
         if (pageY < rowMidY) {
-          core.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
+          utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
           this.droppedRowIndex = index;
-          if (prevRowElement) core.DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');else core.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
+          if (prevRowElement) utils.DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');else utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
         } else {
-          if (prevRowElement) core.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');else core.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
+          if (prevRowElement) utils.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');else utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
           this.droppedRowIndex = index + 1;
-          core.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
+          utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
         }
       }
 
@@ -2507,11 +2527,11 @@ var TableBody = /*#__PURE__*/function (_Component) {
       var prevRowElement = rowElement.previousElementSibling;
 
       if (prevRowElement) {
-        core.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
+        utils.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
       }
 
-      core.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
-      core.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-top');
+      utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
+      utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-top');
     }
   }, {
     key: "onRowDragEnd",
@@ -2532,7 +2552,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
 
         var val = _toConsumableArray(this.props.value);
 
-        core.ObjectUtils.reorderArray(val, this.draggedRowIndex, dropIndex);
+        utils.ObjectUtils.reorderArray(val, this.draggedRowIndex, dropIndex);
 
         if (this.props.onRowReorder) {
           this.props.onRowReorder({
@@ -2677,8 +2697,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
       }
 
       if (!this.props.isVirtualScrollerDisabled && this.getVirtualScrollerOption('vertical')) {
-        var style = getComputedStyle(this.el);
-        this.el.style.top = parseFloat(style.top) + parseFloat(this.props.virtualScrollerOptions.itemSize) + 'px';
+        this.updateVirtualScrollerPosition();
       }
     }
   }, {
@@ -2693,8 +2712,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
       }
 
       if (!this.props.isVirtualScrollerDisabled && this.getVirtualScrollerOption('vertical') && this.getVirtualScrollerOption('itemSize', prevProps.virtualScrollerOptions) !== this.getVirtualScrollerOption('itemSize')) {
-        var style = getComputedStyle(this.el);
-        this.el.style.top = parseFloat(style.top) + parseFloat(this.getVirtualScrollerOption('itemSize')) - parseFloat(this.getVirtualScrollerOption('itemSize', prevProps.virtualScrollerOptions)) + 'px';
+        this.updateVirtualScrollerPosition();
       }
     }
   }, {
@@ -2709,14 +2727,14 @@ var TableBody = /*#__PURE__*/function (_Component) {
     value: function renderEmptyContent() {
       if (!this.props.loading) {
         var colSpan = this.getColumnsLength();
-        var content = core.ObjectUtils.getJSXElement(this.props.emptyMessage, {
+        var content = utils.ObjectUtils.getJSXElement(this.props.emptyMessage, {
           props: this.props,
           frozen: this.props.frozenRow
-        });
-        return /*#__PURE__*/React__default['default'].createElement("tr", {
+        }) || PrimeReact.localeOption('emptyMessage');
+        return /*#__PURE__*/React__default["default"].createElement("tr", {
           className: "p-datatable-emptymessage",
           role: "row"
-        }, /*#__PURE__*/React__default['default'].createElement("td", {
+        }, /*#__PURE__*/React__default["default"].createElement("td", {
           colSpan: colSpan,
           role: "cell"
         }, content));
@@ -2729,24 +2747,24 @@ var TableBody = /*#__PURE__*/function (_Component) {
     value: function renderGroupHeader(rowData, index, expanded, isSubheaderGrouping, colSpan) {
       if (isSubheaderGrouping && this.shouldRenderRowGroupHeader(this.props.value, rowData, index)) {
         var style = this.rowGroupHeaderStyle();
-        var toggler = this.props.expandableRowGroups && /*#__PURE__*/React__default['default'].createElement(RowTogglerButton, {
+        var toggler = this.props.expandableRowGroups && /*#__PURE__*/React__default["default"].createElement(RowTogglerButton, {
           onClick: this.onRowToggle,
           rowData: rowData,
           expanded: expanded,
           expandedRowIcon: this.props.expandedRowIcon,
           collapsedRowIcon: this.props.collapsedRowIcon
         });
-        var content = core.ObjectUtils.getJSXElement(this.props.rowGroupHeaderTemplate, rowData, {
+        var content = utils.ObjectUtils.getJSXElement(this.props.rowGroupHeaderTemplate, rowData, {
           index: index,
           props: this.props.tableProps
         });
-        return /*#__PURE__*/React__default['default'].createElement("tr", {
+        return /*#__PURE__*/React__default["default"].createElement("tr", {
           className: "p-rowgroup-header",
           style: style,
           role: "row"
-        }, /*#__PURE__*/React__default['default'].createElement("td", {
+        }, /*#__PURE__*/React__default["default"].createElement("td", {
           colSpan: colSpan
-        }, toggler, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, toggler, /*#__PURE__*/React__default["default"].createElement("span", {
           className: "p-rowgroup-header-name"
         }, content)));
       }
@@ -2762,7 +2780,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
         var allowRowSelection = this.allowRowSelection();
         var allowCellSelection = this.allowCellSelection();
         var editing = this.isRowEditing(rowData);
-        return /*#__PURE__*/React__default['default'].createElement(BodyRow, {
+        return /*#__PURE__*/React__default["default"].createElement(BodyRow, {
           tableProps: this.props.tableProps,
           tableSelector: this.props.tableSelector,
           value: this.props.value,
@@ -2827,15 +2845,15 @@ var TableBody = /*#__PURE__*/function (_Component) {
     key: "renderExpansion",
     value: function renderExpansion(rowData, index, expanded, isSubheaderGrouping, colSpan) {
       if (expanded && !(isSubheaderGrouping && this.props.expandableRowGroups)) {
-        var content = core.ObjectUtils.getJSXElement(this.props.rowExpansionTemplate, rowData, {
+        var content = utils.ObjectUtils.getJSXElement(this.props.rowExpansionTemplate, rowData, {
           index: index
         });
         var id = "".concat(this.props.tableSelector, "_content_").concat(index, "_expanded");
-        return /*#__PURE__*/React__default['default'].createElement("tr", {
+        return /*#__PURE__*/React__default["default"].createElement("tr", {
           id: id,
           className: "p-datatable-row-expansion",
           role: "row"
-        }, /*#__PURE__*/React__default['default'].createElement("td", {
+        }, /*#__PURE__*/React__default["default"].createElement("td", {
           role: "cell",
           colSpan: colSpan
         }, content));
@@ -2847,12 +2865,12 @@ var TableBody = /*#__PURE__*/function (_Component) {
     key: "renderGroupFooter",
     value: function renderGroupFooter(rowData, index, expanded, isSubheaderGrouping, colSpan) {
       if (isSubheaderGrouping && this.shouldRenderRowGroupFooter(this.props.value, rowData, index, expanded)) {
-        var content = core.ObjectUtils.getJSXElement(this.props.rowGroupFooterTemplate, rowData, {
+        var content = utils.ObjectUtils.getJSXElement(this.props.rowGroupFooterTemplate, rowData, {
           index: index,
           colSpan: colSpan,
           props: this.props.tableProps
         });
-        return /*#__PURE__*/React__default['default'].createElement("tr", {
+        return /*#__PURE__*/React__default["default"].createElement("tr", {
           className: "p-rowgroup-footer",
           role: "row"
         }, content);
@@ -2884,7 +2902,7 @@ var TableBody = /*#__PURE__*/function (_Component) {
 
         var groupFooter = _this5.renderGroupFooter(rowData, index, expanded, isSubheaderGrouping, colSpan);
 
-        return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, {
+        return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
           key: key
         }, groupHeader, row, expansion, groupFooter);
       });
@@ -2892,9 +2910,9 @@ var TableBody = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var className = core.classNames('p-datatable-tbody', this.props.className);
+      var className = utils.classNames('p-datatable-tbody', this.props.className);
       var content = this.props.empty ? this.renderEmptyContent() : this.renderContent();
-      return /*#__PURE__*/React__default['default'].createElement("tbody", {
+      return /*#__PURE__*/React__default["default"].createElement("tbody", {
         ref: this.ref,
         className: className
       }, content);
@@ -2953,7 +2971,7 @@ var FooterCell = /*#__PURE__*/function (_Component) {
           var next = this.el.nextElementSibling;
 
           if (next) {
-            right = core.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
+            right = utils.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
           }
 
           styleObject['right'] = right + 'px';
@@ -2962,7 +2980,7 @@ var FooterCell = /*#__PURE__*/function (_Component) {
           var prev = this.el.previousElementSibling;
 
           if (prev) {
-            left = core.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+            left = utils.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
           }
 
           styleObject['left'] = left + 'px';
@@ -2993,15 +3011,15 @@ var FooterCell = /*#__PURE__*/function (_Component) {
       var _this2 = this;
 
       var style = this.getStyle();
-      var className = core.classNames(this.getColumnProp('footerClassName'), this.getColumnProp('className'), {
+      var className = utils.classNames(this.getColumnProp('footerClassName'), this.getColumnProp('className'), {
         'p-frozen-column': this.getColumnProp('frozen')
       });
       var colSpan = this.getColumnProp('colSpan');
       var rowSpan = this.getColumnProp('rowSpan');
-      var content = core.ObjectUtils.getJSXElement(this.getColumnProp('footer'), {
+      var content = utils.ObjectUtils.getJSXElement(this.getColumnProp('footer'), {
         props: this.props.tableProps
       });
-      return /*#__PURE__*/React__default['default'].createElement("td", {
+      return /*#__PURE__*/React__default["default"].createElement("td", {
         ref: function ref(el) {
           return _this2.el = el;
         },
@@ -3041,7 +3059,7 @@ var TableFooter = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderGroupFooterCells",
     value: function renderGroupFooterCells(row) {
-      var columns = React__default['default'].Children.toArray(row.props.children);
+      var columns = React__default["default"].Children.toArray(row.props.children);
       return this.renderFooterCells(columns);
     }
   }, {
@@ -3049,10 +3067,10 @@ var TableFooter = /*#__PURE__*/function (_Component) {
     value: function renderFooterCells(columns) {
       var _this = this;
 
-      return React__default['default'].Children.map(columns, function (col, i) {
+      return React__default["default"].Children.map(columns, function (col, i) {
         var isVisible = col ? !col.props.hidden : true;
         var key = col ? col.props.columnKey || col.props.field || i : i;
-        return isVisible && /*#__PURE__*/React__default['default'].createElement(FooterCell, {
+        return isVisible && /*#__PURE__*/React__default["default"].createElement(FooterCell, {
           key: key,
           tableProps: _this.props.tableProps,
           column: col
@@ -3065,16 +3083,16 @@ var TableFooter = /*#__PURE__*/function (_Component) {
       var _this2 = this;
 
       if (this.props.footerColumnGroup) {
-        var rows = React__default['default'].Children.toArray(this.props.footerColumnGroup.props.children);
+        var rows = React__default["default"].Children.toArray(this.props.footerColumnGroup.props.children);
         return rows.map(function (row, i) {
-          return /*#__PURE__*/React__default['default'].createElement("tr", {
+          return /*#__PURE__*/React__default["default"].createElement("tr", {
             key: i,
             role: "row"
           }, _this2.renderGroupFooterCells(row));
         });
       }
 
-      return /*#__PURE__*/React__default['default'].createElement("tr", {
+      return /*#__PURE__*/React__default["default"].createElement("tr", {
         role: "row"
       }, this.renderFooterCells(this.props.columns));
     }
@@ -3083,7 +3101,7 @@ var TableFooter = /*#__PURE__*/function (_Component) {
     value: function render() {
       if (this.hasFooter()) {
         var content = this.renderContent();
-        return /*#__PURE__*/React__default['default'].createElement("tfoot", {
+        return /*#__PURE__*/React__default["default"].createElement("tfoot", {
           className: "p-datatable-tfoot"
         }, content);
       }
@@ -3157,19 +3175,19 @@ var HeaderCheckbox = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var boxClassName = core.classNames('p-checkbox-box p-component', {
+      var boxClassName = utils.classNames('p-checkbox-box p-component', {
         'p-highlight': this.props.checked,
         'p-disabled': this.props.disabled,
         'p-focus': this.state.focused
       });
-      var iconClassName = core.classNames('p-checkbox-icon', {
+      var iconClassName = utils.classNames('p-checkbox-icon', {
         'pi pi-check': this.props.checked
       });
       var tabIndex = this.props.disabled ? null : 0;
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-checkbox p-component",
         onClick: this.onClick
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: boxClassName,
         role: "checkbox",
         "aria-checked": this.props.checked,
@@ -3177,7 +3195,7 @@ var HeaderCheckbox = /*#__PURE__*/function (_Component) {
         onFocus: this.onFocus,
         onBlur: this.onBlur,
         onKeyDown: this.onKeyDown
-      }, /*#__PURE__*/React__default['default'].createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: iconClassName
       })));
     }
@@ -3225,11 +3243,9 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
 
     _this = _super.call(this, props);
     _this.state = {
-      overlayVisible: false,
-      defaultMatchMode: null,
-      defaultOperator: null
+      overlayVisible: false
     };
-    _this.overlayRef = /*#__PURE__*/React__default['default'].createRef();
+    _this.overlayRef = /*#__PURE__*/React__default["default"].createRef();
     _this.filterCallback = _this.filterCallback.bind(_assertThisInitialized(_this));
     _this.filterApplyCallback = _this.filterApplyCallback.bind(_assertThisInitialized(_this));
     _this.onOperatorChange = _this.onOperatorChange.bind(_assertThisInitialized(_this));
@@ -3262,6 +3278,11 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     get: function get() {
       return this.props.filters[this.field];
     }
+  }, {
+    key: "filterStoreModel",
+    get: function get() {
+      return this.props.filtersStore[this.field];
+    }
   }, {
     key: "hasFilter",
     value: function hasFilter() {
@@ -3280,7 +3301,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
   }, {
     key: "isFilterBlank",
     value: function isFilterBlank(filter) {
-      return core.ObjectUtils.isEmpty(filter);
+      return utils.ObjectUtils.isEmpty(filter);
     }
   }, {
     key: "isRowMatchModeSelected",
@@ -3295,7 +3316,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
   }, {
     key: "matchModes",
     value: function matchModes() {
-      return this.getColumnProp('filterMatchModeOptions') || PrimeReact__default['default'].filterMatchModeOptions[this.findDataType()].map(function (key) {
+      return this.getColumnProp('filterMatchModeOptions') || PrimeReact__default["default"].filterMatchModeOptions[this.findDataType()].map(function (key) {
         return {
           label: PrimeReact.localeOption(key),
           value: key
@@ -3337,6 +3358,22 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     value: function getColumnProp(prop) {
       return this.props.column.props[prop];
     }
+  }, {
+    key: "getDefaultConstraint",
+    value: function getDefaultConstraint() {
+      if (this.props.filtersStore && this.filterStoreModel) {
+        if (this.filterStoreModel.operator) {
+          return {
+            matchMode: this.filterStoreModel.constraints[0].matchMode,
+            operator: this.filterStoreModel.operator
+          };
+        } else {
+          return {
+            matchMode: this.filterStoreModel.matchMode
+          };
+        }
+      }
+    }
   }, {
     key: "findDataType",
     value: function findDataType() {
@@ -3344,16 +3381,16 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       var matchMode = this.getColumnProp('filterMatchMode');
 
       var hasMatchMode = function hasMatchMode(key) {
-        return PrimeReact__default['default'].filterMatchModeOptions[key].some(function (mode) {
+        return PrimeReact__default["default"].filterMatchModeOptions[key].some(function (mode) {
           return mode === matchMode;
         });
       };
 
       if (matchMode === 'custom' && !hasMatchMode(dataType)) {
-        PrimeReact__default['default'].filterMatchModeOptions[dataType].push(FilterMatchMode.CUSTOM);
+        PrimeReact__default["default"].filterMatchModeOptions[dataType].push(FilterMatchMode.CUSTOM);
         return dataType;
       } else if (matchMode) {
-        return Object.keys(PrimeReact__default['default'].filterMatchModeOptions).find(function (key) {
+        return Object.keys(PrimeReact__default["default"].filterMatchModeOptions).find(function (key) {
           return hasMatchMode(key);
         }) || dataType;
       }
@@ -3365,19 +3402,20 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     value: function clearFilter() {
       var field = this.field;
       var filterClearCallback = this.getColumnProp('onFilterClear');
+      var defaultConstraint = this.getDefaultConstraint();
 
       var filters = _objectSpread$3({}, this.props.filters);
 
       if (filters[field].operator) {
         filters[field].constraints.splice(1);
-        filters[field].operator = this.state.defaultOperator;
+        filters[field].operator = defaultConstraint.operator;
         filters[field].constraints[0] = {
           value: null,
-          matchMode: this.state.defaultMatchMode
+          matchMode: defaultConstraint.matchMode
         };
       } else {
         filters[field].value = null;
-        filters[field].matchMode = this.state.defaultMatchMode;
+        filters[field].matchMode = defaultConstraint.matchMode;
       }
 
       filterClearCallback && filterClearCallback();
@@ -3416,7 +3454,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
 
         case 'ArrowDown':
           if (this.state.overlayVisible) {
-            var focusable = core.DomHandler.getFirstFocusableElement(this.overlay);
+            var focusable = utils.DomHandler.getFirstFocusableElement(this.overlay);
             focusable && focusable.focus();
             event.preventDefault();
           } else if (event.altKey) {
@@ -3550,12 +3588,13 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     key: "addConstraint",
     value: function addConstraint() {
       var filterConstraintAddCallback = this.getColumnProp('onFilterConstraintAdd');
+      var defaultConstraint = this.getDefaultConstraint();
 
       var filters = _objectSpread$3({}, this.props.filters);
 
       var newConstraint = {
         value: null,
-        matchMode: this.state.defaultMatchMode
+        matchMode: defaultConstraint.matchMode
       };
       filters[this.field].constraints.push(newConstraint);
       filterConstraintAddCallback && filterConstraintAddCallback({
@@ -3590,13 +3629,13 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     key: "findNextItem",
     value: function findNextItem(item) {
       var nextItem = item.nextElementSibling;
-      if (nextItem) return core.DomHandler.hasClass(nextItem, 'p-column-filter-separator') ? this.findNextItem(nextItem) : nextItem;else return item.parentElement.firstElementChild;
+      if (nextItem) return utils.DomHandler.hasClass(nextItem, 'p-column-filter-separator') ? this.findNextItem(nextItem) : nextItem;else return item.parentElement.firstElementChild;
     }
   }, {
     key: "findPrevItem",
     value: function findPrevItem(item) {
       var prevItem = item.previousElementSibling;
-      if (prevItem) return core.DomHandler.hasClass(prevItem, 'p-column-filter-separator') ? this.findPrevItem(prevItem) : prevItem;else return item.parentElement.lastElementChild;
+      if (prevItem) return utils.DomHandler.hasClass(prevItem, 'p-column-filter-separator') ? this.findPrevItem(prevItem) : prevItem;else return item.parentElement.lastElementChild;
     }
   }, {
     key: "hide",
@@ -3609,7 +3648,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     key: "onContentClick",
     value: function onContentClick(event) {
       this.selfClick = true;
-      core.OverlayService.emit('overlay-click', {
+      overlayservice.OverlayService.emit('overlay-click', {
         originalEvent: event,
         target: this.overlay
       });
@@ -3624,8 +3663,8 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     value: function onOverlayEnter() {
       var _this2 = this;
 
-      core.ZIndexUtils.set('overlay', this.overlay);
-      core.DomHandler.alignOverlay(this.overlay, this.icon, PrimeReact__default['default'].appendTo, false);
+      utils.ZIndexUtils.set('overlay', this.overlay, PrimeReact__default["default"].autoZIndex, PrimeReact__default["default"].zIndex['overlay']);
+      utils.DomHandler.alignOverlay(this.overlay, this.icon, PrimeReact__default["default"].appendTo, false);
       this.bindOutsideClickListener();
       this.bindScrollListener();
       this.bindResizeListener();
@@ -3636,7 +3675,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
         }
       };
 
-      core.OverlayService.on('overlay-click', this.overlayEventListener);
+      overlayservice.OverlayService.on('overlay-click', this.overlayEventListener);
     }
   }, {
     key: "onOverlayExit",
@@ -3646,7 +3685,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
   }, {
     key: "onOverlayExited",
     value: function onOverlayExited() {
-      core.ZIndexUtils.clear(this.overlay);
+      utils.ZIndexUtils.clear(this.overlay);
     }
   }, {
     key: "onOverlayHide",
@@ -3654,7 +3693,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       this.unbindOutsideClickListener();
       this.unbindResizeListener();
       this.unbindScrollListener();
-      core.OverlayService.off('overlay-click', this.overlayEventListener);
+      overlayservice.OverlayService.off('overlay-click', this.overlayEventListener);
       this.overlayEventListener = null;
     }
   }, {
@@ -3689,7 +3728,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       var _this4 = this;
 
       if (!this.scrollHandler) {
-        this.scrollHandler = new core.ConnectedOverlayScrollHandler(this.icon, function () {
+        this.scrollHandler = new utils.ConnectedOverlayScrollHandler(this.icon, function () {
           if (_this4.state.overlayVisible) {
             _this4.hide();
           }
@@ -3795,41 +3834,23 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       args && this.filterCallback(args[0], args[1]);
       this.props.onFilterApply();
     }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      if (this.props.filters && this.filterModel) {
-        var filterModel = this.filterModel;
-
-        if (filterModel.operator) {
-          this.setState({
-            defaultMatchMode: filterModel.constraints[0].matchMode,
-            defaultOperator: filterModel.operator
-          });
-        } else {
-          this.setState({
-            defaultMatchMode: this.filterModel.matchMode
-          });
-        }
-      }
-    }
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
       if (this.props.display === 'menu' && this.state.overlayVisible) {
-        core.DomHandler.alignOverlay(this.overlay, this.icon, PrimeReact__default['default'].appendTo, false);
+        utils.DomHandler.alignOverlay(this.overlay, this.icon, PrimeReact__default["default"].appendTo, false);
       }
     }
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       if (this.overlayEventListener) {
-        core.OverlayService.off('overlay-click', this.overlayEventListener);
+        overlayservice.OverlayService.off('overlay-click', this.overlayEventListener);
         this.overlayEventListener = null;
       }
 
       if (this.overlay) {
-        core.ZIndexUtils.clear(this.overlay);
+        utils.ZIndexUtils.clear(this.overlay);
         this.onOverlayHide();
       }
     }
@@ -3838,14 +3859,14 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     value: function renderFilterElement(model, index) {
       var _this6 = this;
 
-      return this.getColumnProp('filterElement') ? core.ObjectUtils.getJSXElement(this.getColumnProp('filterElement'), {
+      return this.getColumnProp('filterElement') ? utils.ObjectUtils.getJSXElement(this.getColumnProp('filterElement'), {
         field: this.field,
         index: index,
         filterModel: model,
         value: model.value,
         filterApplyCallback: this.filterApplyCallback,
         filterCallback: this.filterCallback
-      }) : /*#__PURE__*/React__default['default'].createElement(inputtext.InputText, {
+      }) : /*#__PURE__*/React__default["default"].createElement(inputtext.InputText, {
         type: this.getColumnProp('filterType'),
         value: model.value || '',
         onChange: function onChange(e) {
@@ -3861,7 +3882,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     value: function renderRowFilterElement() {
       if (this.props.display === 'row') {
         var content = this.renderFilterElement(this.filterModel, 0);
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-fluid p-column-filter-element"
         }, content);
       }
@@ -3883,11 +3904,11 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       var _this7 = this;
 
       if (this.showMenuButton()) {
-        var className = core.classNames('p-column-filter-menu-button p-link', {
+        var className = utils.classNames('p-column-filter-menu-button p-link', {
           'p-column-filter-menu-button-open': this.state.overlayVisible,
           'p-column-filter-menu-button-active': this.hasFilter()
         });
-        return /*#__PURE__*/React__default['default'].createElement("button", {
+        return /*#__PURE__*/React__default["default"].createElement("button", {
           ref: function ref(el) {
             return _this7.icon = el;
           },
@@ -3897,7 +3918,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
           "aria-expanded": this.state.overlayVisible,
           onClick: this.toggleMenu,
           onKeyDown: this.onToggleButtonKeyDown
-        }, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, /*#__PURE__*/React__default["default"].createElement("span", {
           className: "pi pi-filter-icon pi-filter"
         }));
       }
@@ -3908,14 +3929,14 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     key: "renderClearButton",
     value: function renderClearButton() {
       if (this.getColumnProp('showClearButton') && this.props.display === 'row') {
-        var className = core.classNames('p-column-filter-clear-button p-link', {
+        var className = utils.classNames('p-column-filter-clear-button p-link', {
           'p-hidden-space': !this.hasRowFilter()
         });
-        return /*#__PURE__*/React__default['default'].createElement("button", {
+        return /*#__PURE__*/React__default["default"].createElement("button", {
           className: className,
           type: "button",
           onClick: this.clearFilter
-        }, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, /*#__PURE__*/React__default["default"].createElement("span", {
           className: "pi pi-filter-slash"
         }));
       }
@@ -3930,16 +3951,16 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       if (this.isShowMatchModes()) {
         var matchModes = this.matchModes();
         var noFilterLabel = this.noFilterLabel();
-        return /*#__PURE__*/React__default['default'].createElement("ul", {
+        return /*#__PURE__*/React__default["default"].createElement("ul", {
           className: "p-column-filter-row-items"
         }, matchModes.map(function (matchMode, i) {
           var value = matchMode.value,
               label = matchMode.label;
-          var className = core.classNames('p-column-filter-row-item', {
+          var className = utils.classNames('p-column-filter-row-item', {
             'p-highlight': _this8.isRowMatchModeSelected(value)
           });
           var tabIndex = i === 0 ? 0 : null;
-          return /*#__PURE__*/React__default['default'].createElement("li", {
+          return /*#__PURE__*/React__default["default"].createElement("li", {
             className: className,
             key: label,
             onClick: function onClick() {
@@ -3950,9 +3971,9 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
             },
             tabIndex: tabIndex
           }, label);
-        }), /*#__PURE__*/React__default['default'].createElement("li", {
+        }), /*#__PURE__*/React__default["default"].createElement("li", {
           className: "p-column-filter-separator"
-        }), /*#__PURE__*/React__default['default'].createElement("li", {
+        }), /*#__PURE__*/React__default["default"].createElement("li", {
           className: "p-column-filter-row-item",
           onClick: this.clearFilter,
           onKeyDown: function onKeyDown(e) {
@@ -3969,9 +3990,9 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       if (this.isShowOperator()) {
         var options = this.operatorOptions();
         var value = this.operator();
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-column-filter-operator"
-        }, /*#__PURE__*/React__default['default'].createElement(dropdown.Dropdown, {
+        }, /*#__PURE__*/React__default["default"].createElement(dropdown.Dropdown, {
           options: options,
           value: value,
           onChange: this.onOperatorChange,
@@ -3988,7 +4009,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
 
       if (this.isShowMatchModes()) {
         var options = this.matchModes();
-        return /*#__PURE__*/React__default['default'].createElement(dropdown.Dropdown, {
+        return /*#__PURE__*/React__default["default"].createElement(dropdown.Dropdown, {
           options: options,
           value: constraint.matchMode,
           onChange: function onChange(e) {
@@ -4007,7 +4028,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
 
       if (this.showRemoveIcon()) {
         var removeRuleLabel = this.removeRuleButtonLabel();
-        return /*#__PURE__*/React__default['default'].createElement(button.Button, {
+        return /*#__PURE__*/React__default["default"].createElement(button.Button, {
           type: "button",
           icon: "pi pi-trash",
           className: "p-column-filter-remove-button p-button-text p-button-danger p-button-sm",
@@ -4026,7 +4047,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       var _this11 = this;
 
       var fieldConstraints = this.fieldConstraints();
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-column-filter-constraints"
       }, fieldConstraints.map(function (fieldConstraint, i) {
         var matchModeDropdown = _this11.renderMatchModeDropdown(fieldConstraint, i);
@@ -4035,10 +4056,10 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
 
         var removeButton = _this11.renderRemoveButton(i);
 
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           key: i,
           className: "p-column-filter-constraint"
-        }, matchModeDropdown, menuFilterElement, /*#__PURE__*/React__default['default'].createElement("div", null, removeButton));
+        }, matchModeDropdown, menuFilterElement, /*#__PURE__*/React__default["default"].createElement("div", null, removeButton));
       }));
     }
   }, {
@@ -4046,9 +4067,9 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     value: function renderAddRule() {
       if (this.isShowAddConstraint()) {
         var addRuleLabel = this.addRuleButtonLabel();
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-column-filter-add-rule"
-        }, /*#__PURE__*/React__default['default'].createElement(button.Button, {
+        }, /*#__PURE__*/React__default["default"].createElement(button.Button, {
           type: "button",
           label: addRuleLabel,
           icon: "pi pi-plus",
@@ -4065,7 +4086,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       if (this.getColumnProp('showClearButton')) {
         if (!this.getColumnProp('filterClear')) {
           var clearLabel = this.clearButtonLabel();
-          return /*#__PURE__*/React__default['default'].createElement(button.Button, {
+          return /*#__PURE__*/React__default["default"].createElement(button.Button, {
             type: "button",
             className: "p-button-outlined p-button-sm",
             onClick: this.clearFilter,
@@ -4073,7 +4094,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
           });
         }
 
-        return core.ObjectUtils.getJSXElement(this.getColumnProp('filterClear'), {
+        return utils.ObjectUtils.getJSXElement(this.getColumnProp('filterClear'), {
           field: this.field,
           filterModel: this.filterModel,
           filterClearCallback: this.clearFilter
@@ -4088,7 +4109,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       if (this.getColumnProp('showApplyButton')) {
         if (!this.getColumnProp('filterApply')) {
           var applyLabel = this.applyButtonLabel();
-          return /*#__PURE__*/React__default['default'].createElement(button.Button, {
+          return /*#__PURE__*/React__default["default"].createElement(button.Button, {
             type: "button",
             className: "p-button-sm",
             onClick: this.applyFilter,
@@ -4096,7 +4117,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
           });
         }
 
-        return core.ObjectUtils.getJSXElement(this.getColumnProp('filterApply'), {
+        return utils.ObjectUtils.getJSXElement(this.getColumnProp('filterApply'), {
           field: this.field,
           filterModel: this.filterModel,
           filterApplyCallback: this.applyFilter
@@ -4110,7 +4131,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
     value: function renderButtonBar() {
       var clearButton = this.renderFilterClearButton();
       var applyButton = this.renderFilterApplyButton();
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-column-filter-buttonbar"
       }, clearButton, applyButton);
     }
@@ -4121,29 +4142,29 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       var constraints = this.renderConstraints();
       var addRule = this.renderAddRule();
       var buttonBar = this.renderButtonBar();
-      return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, operator, constraints, addRule, buttonBar);
+      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, operator, constraints, addRule, buttonBar);
     }
   }, {
     key: "renderOverlay",
     value: function renderOverlay() {
       var style = this.getColumnProp('filterMenuStyle');
-      var className = core.classNames('p-column-filter-overlay p-component p-fluid', this.getColumnProp('filterMenuClassName'), {
+      var className = utils.classNames('p-column-filter-overlay p-component p-fluid', this.getColumnProp('filterMenuClassName'), {
         'p-column-filter-overlay-menu': this.props.display === 'menu',
-        'p-input-filled': PrimeReact__default['default'].inputStyle === 'filled',
-        'p-ripple-disabled': PrimeReact__default['default'].ripple === false
+        'p-input-filled': PrimeReact__default["default"].inputStyle === 'filled',
+        'p-ripple-disabled': PrimeReact__default["default"].ripple === false
       });
-      var filterHeader = core.ObjectUtils.getJSXElement(this.getColumnProp('filterHeader'), {
+      var filterHeader = utils.ObjectUtils.getJSXElement(this.getColumnProp('filterHeader'), {
         field: this.field,
         filterModel: this.filterModel,
         filterApplyCallback: this.filterApplyCallback
       });
-      var filterFooter = core.ObjectUtils.getJSXElement(this.getColumnProp('filterFooter'), {
+      var filterFooter = utils.ObjectUtils.getJSXElement(this.getColumnProp('filterFooter'), {
         field: this.field,
         filterModel: this.filterModel,
         filterApplyCallback: this.filterApplyCallback
       });
       var items = this.props.display === 'row' ? this.renderRowItems() : this.renderItems();
-      return /*#__PURE__*/React__default['default'].createElement(core.Portal, null, /*#__PURE__*/React__default['default'].createElement(core.CSSTransition, {
+      return /*#__PURE__*/React__default["default"].createElement(portal.Portal, null, /*#__PURE__*/React__default["default"].createElement(csstransition.CSSTransition, {
         nodeRef: this.overlayRef,
         classNames: "p-connected-overlay",
         in: this.state.overlayVisible,
@@ -4155,7 +4176,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
         onEnter: this.onOverlayEnter,
         onExit: this.onOverlayExit,
         onExited: this.onOverlayExited
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         ref: this.overlayRef,
         style: style,
         className: className,
@@ -4167,7 +4188,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var className = core.classNames('p-column-filter p-fluid', {
+      var className = utils.classNames('p-column-filter p-fluid', {
         'p-column-filter-row': this.props.display === 'row',
         'p-column-filter-menu': this.props.display === 'menu'
       });
@@ -4175,7 +4196,7 @@ var ColumnFilter = /*#__PURE__*/function (_Component) {
       var menuButton = this.renderMenuButton();
       var clearButton = this.renderClearButton();
       var overlay = this.renderOverlay();
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: className
       }, rowFilterElement, menuButton, clearButton, overlay);
     }
@@ -4306,7 +4327,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
           var next = this.el.nextElementSibling;
 
           if (next) {
-            right = core.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
+            right = utils.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
           }
 
           styleObject['right'] = right + 'px';
@@ -4315,7 +4336,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
           var prev = this.el.previousElementSibling;
 
           if (prev) {
-            left = core.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+            left = utils.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
           }
 
           styleObject['left'] = left + 'px';
@@ -4324,7 +4345,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
         var filterRow = this.el.parentElement.nextElementSibling;
 
         if (filterRow) {
-          var index = core.DomHandler.index(this.el);
+          var index = utils.DomHandler.index(this.el);
           filterRow.children[index].style.left = styleObject['left'];
           filterRow.children[index].style.right = styleObject['right'];
         }
@@ -4348,8 +4369,8 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
       if (!this.isSortableDisabled()) {
         var targetNode = event.target;
 
-        if (core.DomHandler.hasClass(targetNode, 'p-sortable-column') || core.DomHandler.hasClass(targetNode, 'p-column-title') || core.DomHandler.hasClass(targetNode, 'p-column-header-content') || core.DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || core.DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
-          core.DomHandler.clearSelection();
+        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();
           this.props.onSortChange({
             originalEvent: event,
             column: this.props.column,
@@ -4369,7 +4390,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
   }, {
     key: "onKeyDown",
     value: function onKeyDown(event) {
-      if (event.key === 'Enter' && event.currentTarget === this.el && core.DomHandler.hasClass(event.currentTarget, 'p-sortable-column')) {
+      if (event.key === 'Enter' && event.currentTarget === this.el && utils.DomHandler.hasClass(event.currentTarget, 'p-sortable-column')) {
         this.onClick(event);
         event.preventDefault();
       }
@@ -4458,7 +4479,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
     key: "renderResizer",
     value: function renderResizer() {
       if (this.props.resizableColumns && !this.getColumnProp('frozen')) {
-        return /*#__PURE__*/React__default['default'].createElement("span", {
+        return /*#__PURE__*/React__default["default"].createElement("span", {
           className: "p-column-resizer",
           onMouseDown: this.onResizerMouseDown,
           onClick: this.onResizerClick,
@@ -4471,10 +4492,10 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderTitle",
     value: function renderTitle() {
-      var title = core.ObjectUtils.getJSXElement(this.getColumnProp('header'), {
+      var title = utils.ObjectUtils.getJSXElement(this.getColumnProp('header'), {
         props: this.props.tableProps
       });
-      return /*#__PURE__*/React__default['default'].createElement("span", {
+      return /*#__PURE__*/React__default["default"].createElement("span", {
         className: "p-column-title"
       }, title);
     }
@@ -4486,8 +4507,8 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
 
       if (this.getColumnProp('sortable')) {
         var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
-        var className = core.classNames('p-sortable-column-icon pi pi-fw', sortIcon);
-        return /*#__PURE__*/React__default['default'].createElement("span", {
+        var className = utils.classNames('p-sortable-column-icon pi pi-fw', sortIcon);
+        return /*#__PURE__*/React__default["default"].createElement("span", {
           className: className
         });
       }
@@ -4501,7 +4522,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
 
       if (metaIndex !== -1 && this.isBadgeVisible()) {
         var value = this.props.groupRowsBy && this.props.groupRowsBy === this.props.groupRowSortField ? metaIndex : metaIndex + 1;
-        return /*#__PURE__*/React__default['default'].createElement("span", {
+        return /*#__PURE__*/React__default["default"].createElement("span", {
           className: "p-sortable-column-badge"
         }, value);
       }
@@ -4513,7 +4534,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
     value: function renderCheckbox() {
       if (this.getColumnProp('selectionMode') === 'multiple' && this.props.filterDisplay !== 'row') {
         var allRowsSelected = this.props.allRowsSelected(this.props.value);
-        return /*#__PURE__*/React__default['default'].createElement(HeaderCheckbox, {
+        return /*#__PURE__*/React__default["default"].createElement(HeaderCheckbox, {
           checked: allRowsSelected,
           onChange: this.props.onColumnCheckboxChange,
           disabled: this.props.empty
@@ -4526,7 +4547,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
     key: "renderFilter",
     value: function renderFilter() {
       if (this.props.filterDisplay === 'menu' && this.getColumnProp('filter')) {
-        return /*#__PURE__*/React__default['default'].createElement(ColumnFilter, {
+        return /*#__PURE__*/React__default["default"].createElement(ColumnFilter, {
           display: "menu",
           column: this.props.column,
           filters: this.props.filters,
@@ -4546,7 +4567,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
       var badge = this.renderBadge(sortMeta);
       var checkbox = this.renderCheckbox();
       var filter = this.renderFilter();
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-column-header-content"
       }, title, sortIcon, badge, checkbox, filter);
     }
@@ -4558,7 +4579,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
       var isSortableDisabled = this.isSortableDisabled();
       var sortMeta = this.getSortMeta();
       var style = this.getStyle();
-      var className = core.classNames(this.getColumnProp('headerClassName'), this.getColumnProp('className'), {
+      var className = utils.classNames(this.getColumnProp('headerClassName'), this.getColumnProp('className'), {
         'p-sortable-column': this.getColumnProp('sortable'),
         'p-resizable-column': this.props.resizableColumns,
         'p-highlight': sortMeta.sorted,
@@ -4573,7 +4594,7 @@ var HeaderCell = /*#__PURE__*/function (_Component) {
       var ariaSort = this.getAriaSort(sortMeta);
       var resizer = this.renderResizer();
       var header = this.renderHeader(sortMeta);
-      return /*#__PURE__*/React__default['default'].createElement("th", {
+      return /*#__PURE__*/React__default["default"].createElement("th", {
         ref: function ref(el) {
           return _this3.el = el;
         },
@@ -4692,7 +4713,7 @@ var TableHeader = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderGroupHeaderCells",
     value: function renderGroupHeaderCells(row) {
-      var columns = React__default['default'].Children.toArray(row.props.children);
+      var columns = React__default["default"].Children.toArray(row.props.children);
       return this.renderHeaderCells(columns);
     }
   }, {
@@ -4700,10 +4721,10 @@ var TableHeader = /*#__PURE__*/function (_Component) {
     value: function renderHeaderCells(columns) {
       var _this3 = this;
 
-      return React__default['default'].Children.map(columns, function (col, i) {
+      return React__default["default"].Children.map(columns, function (col, i) {
         var isVisible = col ? !col.props.hidden : true;
         var key = col ? col.props.columnKey || col.props.field || i : i;
-        return isVisible && /*#__PURE__*/React__default['default'].createElement(HeaderCell, {
+        return isVisible && /*#__PURE__*/React__default["default"].createElement(HeaderCell, {
           key: key,
           value: _this3.props.value,
           tableProps: _this3.props.tableProps,
@@ -4745,7 +4766,7 @@ var TableHeader = /*#__PURE__*/function (_Component) {
     value: function renderFilterCells() {
       var _this4 = this;
 
-      return React__default['default'].Children.map(this.props.columns, function (col, i) {
+      return React__default["default"].Children.map(this.props.columns, function (col, i) {
         var isVisible = !col.props.hidden;
 
         if (isVisible) {
@@ -4762,22 +4783,22 @@ var TableHeader = /*#__PURE__*/function (_Component) {
 
           var colStyle = _objectSpread$1(_objectSpread$1({}, filterHeaderStyle || {}), style || {});
 
-          var colClassName = core.classNames('p-filter-column', filterHeaderClassName, className, {
+          var colClassName = utils.classNames('p-filter-column', filterHeaderClassName, className, {
             'p-frozen-column': frozen
           });
           var colKey = columnKey || field || i;
 
           var allRowsSelected = selectionMode === 'multiple' && _this4.props.allRowsSelected(_this4.props.value);
 
-          return /*#__PURE__*/React__default['default'].createElement("th", {
+          return /*#__PURE__*/React__default["default"].createElement("th", {
             key: colKey,
             style: colStyle,
             className: colClassName
-          }, selectionMode === 'multiple' && /*#__PURE__*/React__default['default'].createElement(HeaderCheckbox, {
+          }, selectionMode === 'multiple' && /*#__PURE__*/React__default["default"].createElement(HeaderCheckbox, {
             checked: allRowsSelected,
             onChange: _this4.onCheckboxChange,
             disabled: _this4.props.empty
-          }), filter && /*#__PURE__*/React__default['default'].createElement(ColumnFilter, {
+          }), filter && /*#__PURE__*/React__default["default"].createElement(ColumnFilter, {
             display: "row",
             column: col,
             filters: _this4.props.filters,
@@ -4796,28 +4817,28 @@ var TableHeader = /*#__PURE__*/function (_Component) {
       var _this5 = this;
 
       if (this.props.headerColumnGroup) {
-        var rows = React__default['default'].Children.toArray(this.props.headerColumnGroup.props.children);
+        var rows = React__default["default"].Children.toArray(this.props.headerColumnGroup.props.children);
         return rows.map(function (row, i) {
-          return /*#__PURE__*/React__default['default'].createElement("tr", {
+          return /*#__PURE__*/React__default["default"].createElement("tr", {
             key: i,
             role: "row"
           }, _this5.renderGroupHeaderCells(row));
         });
       } else {
-        var headerRow = /*#__PURE__*/React__default['default'].createElement("tr", {
+        var headerRow = /*#__PURE__*/React__default["default"].createElement("tr", {
           role: "row"
         }, this.renderHeaderCells(this.props.columns));
-        var filterRow = this.props.filterDisplay === 'row' && /*#__PURE__*/React__default['default'].createElement("tr", {
+        var filterRow = this.props.filterDisplay === 'row' && /*#__PURE__*/React__default["default"].createElement("tr", {
           role: "row"
         }, this.renderFilterCells());
-        return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, headerRow, filterRow);
+        return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, headerRow, filterRow);
       }
     }
   }, {
     key: "render",
     value: function render() {
       var content = this.renderContent();
-      return /*#__PURE__*/React__default['default'].createElement("thead", {
+      return /*#__PURE__*/React__default["default"].createElement("thead", {
         className: "p-datatable-thead"
       }, content);
     }
@@ -4872,7 +4893,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
       _this.restoreState(_this.state);
     }
 
-    _this.attributeSelector = core.UniqueComponentId(); // header
+    _this.attributeSelector = utils.UniqueComponentId(); // header
 
     _this.onSortChange = _this.onSortChange.bind(_assertThisInitialized(_this));
     _this.onFilterChange = _this.onFilterChange.bind(_assertThisInitialized(_this));
@@ -4905,12 +4926,12 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "isVirtualScrollerDisabled",
     value: function isVirtualScrollerDisabled() {
-      return core.ObjectUtils.isEmpty(this.props.virtualScrollerOptions) || !this.props.scrollable;
+      return utils.ObjectUtils.isEmpty(this.props.virtualScrollerOptions) || !this.props.scrollable;
     }
   }, {
     key: "hasFilter",
     value: function hasFilter() {
-      return core.ObjectUtils.isNotEmpty(this.getFilters()) || this.props.globalFilter;
+      return utils.ObjectUtils.isNotEmpty(this.getFilters()) || this.props.globalFilter;
     }
   }, {
     key: "getFirst",
@@ -4952,7 +4973,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
     value: function getColumns(ignoreReorderable) {
       var _this2 = this;
 
-      var columns = React__default['default'].Children.toArray(this.props.children);
+      var columns = React__default["default"].Children.toArray(this.props.children);
 
       if (!columns) {
         return null;
@@ -5039,7 +5060,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
       } else {
         var storage = this.getStorage();
 
-        if (core.ObjectUtils.isNotEmpty(state)) {
+        if (utils.ObjectUtils.isNotEmpty(state)) {
           storage.setItem(this.props.stateKey, JSON.stringify(state));
         }
       }
@@ -5087,7 +5108,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
     value: function restoreTableState(restoredState) {
       var state = this._restoreState(restoredState);
 
-      if (core.ObjectUtils.isNotEmpty(state)) {
+      if (utils.ObjectUtils.isNotEmpty(state)) {
         this.setState(state);
       }
     }
@@ -5098,7 +5119,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
 
       var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
-      if (core.ObjectUtils.isNotEmpty(restoredState)) {
+      if (utils.ObjectUtils.isNotEmpty(restoredState)) {
         if (this.props.paginator) {
           if (this.props.onPage) {
             var getOnPageParams = function getOnPageParams(first, rows) {
@@ -5187,14 +5208,14 @@ var DataTable = /*#__PURE__*/function (_Component) {
     key: "saveColumnWidths",
     value: function saveColumnWidths(state) {
       var widths = [];
-      var headers = core.DomHandler.find(this.el, '.p-datatable-thead > tr > th');
+      var headers = utils.DomHandler.find(this.el, '.p-datatable-thead > tr > th');
       headers.forEach(function (header) {
-        return widths.push(core.DomHandler.getOuterWidth(header));
+        return widths.push(utils.DomHandler.getOuterWidth(header));
       });
       state.columnWidths = widths.join(',');
 
       if (this.props.columnResizeMode === 'expand') {
-        state.tableWidth = core.DomHandler.getOuterWidth(this.table) + 'px';
+        state.tableWidth = utils.DomHandler.getOuterWidth(this.table) + 'px';
       }
     }
   }, {
@@ -5220,7 +5241,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
           });
           this.styleElement.innerHTML = innerHTML;
         } else {
-          core.DomHandler.find(this.table, '.p-datatable-thead > tr > th').forEach(function (header, index) {
+          utils.DomHandler.find(this.table, '.p-datatable-thead > tr > th').forEach(function (header, index) {
             return header.style.width = widths[index] + 'px';
           });
         }
@@ -5250,9 +5271,17 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "allRowsSelected",
     value: function allRowsSelected(processedData) {
+      var _this5 = this;
+
       var val = this.props.frozenValue ? [].concat(_toConsumableArray(this.props.frozenValue), _toConsumableArray(processedData)) : processedData;
-      var length = this.props.lazy ? this.props.totalRecords : val ? val.length : 0;
-      return val && length > 0 && this.props.selection && this.props.selection.length > 0 && this.props.selection.length === length;
+      var selectableVal = this.props.showSelectionElement ? val.filter(function (data, index) {
+        return _this5.props.showSelectionElement(data, {
+          rowIndex: index,
+          props: _this5.props
+        });
+      }) : val;
+      var length = this.props.lazy ? this.props.totalRecords : selectableVal ? selectableVal.length : 0;
+      return selectableVal && length > 0 && this.props.selection && this.props.selection.length > 0 && this.props.selection.length === length;
     }
   }, {
     key: "getSelectionModeInColumn",
@@ -5269,7 +5298,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "findColumnByKey",
     value: function findColumnByKey(columns, key) {
-      return core.ObjectUtils.isNotEmpty(columns) ? columns.find(function (col) {
+      return utils.ObjectUtils.isNotEmpty(columns) ? columns.find(function (col) {
         return col.props.columnKey === key || col.props.field === key;
       }) : null;
     }
@@ -5310,7 +5339,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "clearEditingMetaData",
     value: function clearEditingMetaData() {
-      if (this.props.editMode && core.ObjectUtils.isNotEmpty(this.state.editingMeta)) {
+      if (this.props.editMode && utils.ObjectUtils.isNotEmpty(this.state.editingMeta)) {
         this.setState({
           editingMeta: {}
         });
@@ -5321,7 +5350,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
     value: function onColumnResizeStart(e) {
       var event = e.originalEvent,
           column = e.column;
-      var containerLeft = core.DomHandler.getOffset(this.el).left;
+      var containerLeft = utils.DomHandler.getOffset(this.el).left;
       this.resizeColumn = column;
       this.resizeColumnElement = event.currentTarget.parentElement;
       this.columnResizing = true;
@@ -5331,8 +5360,8 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "onColumnResize",
     value: function onColumnResize(event) {
-      var containerLeft = core.DomHandler.getOffset(this.el).left;
-      core.DomHandler.addClass(this.el, 'p-unselectable-text');
+      var containerLeft = utils.DomHandler.getOffset(this.el).left;
+      utils.DomHandler.addClass(this.el, 'p-unselectable-text');
       this.resizeHelper.style.height = this.el.offsetHeight + 'px';
       this.resizeHelper.style.top = 0 + 'px';
       this.resizeHelper.style.left = event.pageX - containerLeft + this.el.scrollLeft + 'px';
@@ -5377,49 +5406,49 @@ var DataTable = /*#__PURE__*/function (_Component) {
       this.resizeHelper.style.display = 'none';
       this.resizeColumn = null;
       this.resizeColumnElement = null;
-      core.DomHandler.removeClass(this.el, 'p-unselectable-text');
+      utils.DomHandler.removeClass(this.el, 'p-unselectable-text');
       this.unbindColumnResizeEvents();
     }
   }, {
     key: "resizeTableCells",
     value: function resizeTableCells(newColumnWidth, nextColumnWidth) {
-      var _this5 = this;
+      var _this6 = this;
 
       var widths = [];
-      var colIndex = core.DomHandler.index(this.resizeColumnElement);
-      var headers = core.DomHandler.find(this.table, '.p-datatable-thead > tr > th');
+      var colIndex = utils.DomHandler.index(this.resizeColumnElement);
+      var headers = utils.DomHandler.find(this.table, '.p-datatable-thead > tr > th');
       headers.forEach(function (header) {
-        return widths.push(core.DomHandler.getOuterWidth(header));
+        return widths.push(utils.DomHandler.getOuterWidth(header));
       });
       this.destroyStyleElement();
       this.createStyleElement();
       var innerHTML = '';
       widths.forEach(function (width, index) {
         var colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width;
-        var style = _this5.props.scrollable ? "flex: 0 0 ".concat(colWidth, "px !important") : "width: ".concat(colWidth, "px !important");
-        innerHTML += "\n                .p-datatable[".concat(_this5.attributeSelector, "] .p-datatable-thead > tr > th:nth-child(").concat(index + 1, "),\n                .p-datatable[").concat(_this5.attributeSelector, "] .p-datatable-tbody > tr > td:nth-child(").concat(index + 1, "),\n                .p-datatable[").concat(_this5.attributeSelector, "] .p-datatable-tfoot > tr > td:nth-child(").concat(index + 1, ") {\n                    ").concat(style, "\n                }\n            ");
+        var style = _this6.props.scrollable ? "flex: 0 0 ".concat(colWidth, "px !important") : "width: ".concat(colWidth, "px !important");
+        innerHTML += "\n                .p-datatable[".concat(_this6.attributeSelector, "] .p-datatable-thead > tr > th:nth-child(").concat(index + 1, "),\n                .p-datatable[").concat(_this6.attributeSelector, "] .p-datatable-tbody > tr > td:nth-child(").concat(index + 1, "),\n                .p-datatable[").concat(_this6.attributeSelector, "] .p-datatable-tfoot > tr > td:nth-child(").concat(index + 1, ") {\n                    ").concat(style, "\n                }\n            ");
       });
       this.styleElement.innerHTML = innerHTML;
     }
   }, {
     key: "bindColumnResizeEvents",
     value: function bindColumnResizeEvents() {
-      var _this6 = this;
+      var _this7 = this;
 
       if (!this.documentColumnResizeListener) {
         this.documentColumnResizeListener = document.addEventListener('mousemove', function (event) {
-          if (_this6.columnResizing) {
-            _this6.onColumnResize(event);
+          if (_this7.columnResizing) {
+            _this7.onColumnResize(event);
           }
         });
       }
 
       if (!this.documentColumnResizeEndListener) {
         this.documentColumnResizeEndListener = document.addEventListener('mouseup', function () {
-          if (_this6.columnResizing) {
-            _this6.columnResizing = false;
+          if (_this7.columnResizing) {
+            _this7.columnResizing = false;
 
-            _this6.onColumnResizeEnd();
+            _this7.onColumnResizeEnd();
           }
         });
       }
@@ -5440,23 +5469,31 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "onColumnHeaderMouseDown",
     value: function onColumnHeaderMouseDown(e) {
-      core.DomHandler.clearSelection();
+      utils.DomHandler.clearSelection();
       var event = e.originalEvent,
           column = e.column;
 
       if (this.props.reorderableColumns && this.getColumnProp(column, 'reorderable') !== false) {
-        if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || core.DomHandler.hasClass(event.target, 'p-column-resizer')) event.currentTarget.draggable = false;else event.currentTarget.draggable = true;
+        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;
       }
     }
   }, {
     key: "onColumnHeaderCheckboxChange",
     value: function onColumnHeaderCheckboxChange(e, processedData) {
+      var _this8 = this;
+
       var originalEvent = e.originalEvent,
           checked = e.checked;
       var selection;
 
       if (!checked) {
         selection = this.props.frozenValue ? [].concat(_toConsumableArray(this.props.frozenValue), _toConsumableArray(processedData)) : processedData;
+        selection = this.props.showSelectionElement ? selection.filter(function (data, index) {
+          return _this8.props.showSelectionElement(data, {
+            rowIndex: index,
+            props: _this8.props
+          });
+        }) : selection;
         this.props.onAllRowsSelect && this.props.onAllRowsSelect({
           originalEvent: originalEvent,
           data: selection,
@@ -5489,8 +5526,8 @@ var DataTable = /*#__PURE__*/function (_Component) {
         return;
       }
 
-      this.colReorderIconWidth = core.DomHandler.getHiddenElementOuterWidth(this.reorderIndicatorUp);
-      this.colReorderIconHeight = core.DomHandler.getHiddenElementOuterHeight(this.reorderIndicatorUp);
+      this.colReorderIconWidth = utils.DomHandler.getHiddenElementOuterWidth(this.reorderIndicatorUp);
+      this.colReorderIconHeight = utils.DomHandler.getHiddenElementOuterHeight(this.reorderIndicatorUp);
       this.draggedColumn = column;
       this.draggedColumnElement = this.findParentHeader(event.currentTarget);
       event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
@@ -5505,8 +5542,8 @@ var DataTable = /*#__PURE__*/function (_Component) {
         event.preventDefault();
 
         if (this.draggedColumnElement !== dropHeader) {
-          var containerOffset = core.DomHandler.getOffset(this.el);
-          var dropHeaderOffset = core.DomHandler.getOffset(dropHeader);
+          var containerOffset = utils.DomHandler.getOffset(this.el);
+          var dropHeaderOffset = utils.DomHandler.getOffset(dropHeader);
           var targetLeft = dropHeaderOffset.left - containerOffset.left;
           var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
           this.reorderIndicatorUp.style.top = dropHeaderOffset.top - containerOffset.top - (this.colReorderIconHeight - 1) + 'px';
@@ -5541,15 +5578,15 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "onColumnHeaderDrop",
     value: function onColumnHeaderDrop(e) {
-      var _this7 = this;
+      var _this9 = this;
 
       var event = e.originalEvent,
           column = e.column;
       event.preventDefault();
 
       if (this.draggedColumnElement) {
-        var dragIndex = core.DomHandler.index(this.draggedColumnElement);
-        var dropIndex = core.DomHandler.index(this.findParentHeader(event.currentTarget));
+        var dragIndex = utils.DomHandler.index(this.draggedColumnElement);
+        var dropIndex = utils.DomHandler.index(this.findParentHeader(event.currentTarget));
         var allowDrop = dragIndex !== dropIndex;
 
         if (allowDrop && (dropIndex - dragIndex === 1 && this.dropPosition === -1 || dragIndex - dropIndex === 1 && this.dropPosition === 1)) {
@@ -5560,11 +5597,11 @@ var DataTable = /*#__PURE__*/function (_Component) {
           var columns = this.getColumns();
 
           var isSameColumn = function isSameColumn(col1, col2) {
-            return col1.props.columnKey || col2.props.columnKey ? core.ObjectUtils.equals(col1.props, col2.props, 'columnKey') : core.ObjectUtils.equals(col1.props, col2.props, 'field');
+            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, _this7.draggedColumn);
+            return isSameColumn(child, _this9.draggedColumn);
           });
           var dropColIndex = columns.findIndex(function (child) {
             return isSameColumn(child, column);
@@ -5578,7 +5615,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
             dropColIndex--;
           }
 
-          core.ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
+          utils.ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
           var columnOrder = columns.reduce(function (orders, col) {
             orders.push(col.props.columnKey || col.props.field);
             return orders;
@@ -5769,8 +5806,8 @@ var DataTable = /*#__PURE__*/function (_Component) {
         });
       } else {
         value.sort(function (data1, data2) {
-          var value1 = core.ObjectUtils.resolveFieldData(data1, field);
-          var value2 = core.ObjectUtils.resolveFieldData(data2, field);
+          var value1 = utils.ObjectUtils.resolveFieldData(data1, field);
+          var value2 = utils.ObjectUtils.resolveFieldData(data2, field);
           var result = null;
           if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, undefined, {
             numeric: true
@@ -5784,7 +5821,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "sortMultiple",
     value: function sortMultiple(data) {
-      var _this8 = this;
+      var _this10 = this;
 
       var multiSortMeta = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
 
@@ -5801,7 +5838,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
 
       if (this.columnSortable && this.columnSortFunction) {
         var meta = multiSortMeta.find(function (meta) {
-          return meta.field === _this8.columnField;
+          return meta.field === _this10.columnField;
         });
         var field = this.columnField;
         var order = meta ? meta.order : this.defaultSortOrder;
@@ -5811,7 +5848,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
         });
       } else {
         value.sort(function (data1, data2) {
-          return _this8.multisortField(data1, data2, multiSortMeta, 0);
+          return _this10.multisortField(data1, data2, multiSortMeta, 0);
         });
       }
 
@@ -5820,8 +5857,8 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "multisortField",
     value: function multisortField(data1, data2, multiSortMeta, index) {
-      var value1 = core.ObjectUtils.resolveFieldData(data1, multiSortMeta[index].field);
-      var value2 = core.ObjectUtils.resolveFieldData(data2, multiSortMeta[index].field);
+      var value1 = utils.ObjectUtils.resolveFieldData(data1, multiSortMeta[index].field);
+      var value2 = utils.ObjectUtils.resolveFieldData(data2, multiSortMeta[index].field);
       var result = null;
 
       if (typeof value1 === 'string' || value1 instanceof String) {
@@ -5851,25 +5888,25 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "onFilterApply",
     value: function onFilterApply() {
-      var _this9 = this;
+      var _this11 = this;
 
       clearTimeout(this.filterTimeout);
       this.filterTimeout = setTimeout(function () {
-        var filters = _this9.cloneFilters(_this9.state.d_filters);
+        var filters = _this11.cloneFilters(_this11.state.d_filters);
 
-        if (_this9.props.onFilter) {
-          _this9.props.onFilter({
+        if (_this11.props.onFilter) {
+          _this11.props.onFilter({
             filters: filters
           });
         } else {
-          _this9.setState({
+          _this11.setState({
             first: 0,
             filters: filters
           });
         }
 
-        if (_this9.props.onValueChange) {
-          _this9.props.onValueChange(_this9.processedData({
+        if (_this11.props.onValueChange) {
+          _this11.props.onValueChange(_this11.processedData({
             filters: filters
           }));
         }
@@ -5928,7 +5965,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
             var globalFilterField = globalFilterFieldsArray[_j];
             var matchMode = filters['global'] ? filters['global'].matchMode : PrimeReact.FilterMatchMode.CONTAINS;
             var value = filters['global'] ? filters['global'].value : this.props.globalFilter;
-            globalMatch = PrimeReact.FilterService.filters[matchMode](core.ObjectUtils.resolveFieldData(data[i], globalFilterField), value, this.props.filterLocale);
+            globalMatch = PrimeReact.FilterService.filters[matchMode](utils.ObjectUtils.resolveFieldData(data[i], globalFilterField), value, this.props.filterLocale);
 
             if (globalMatch) {
               break;
@@ -5960,14 +5997,14 @@ var DataTable = /*#__PURE__*/function (_Component) {
     value: function executeLocalFilter(field, rowData, filterMeta, index) {
       var filterValue = filterMeta.value;
       var filterMatchMode = filterMeta.matchMode === 'custom' ? "custom_".concat(field) : filterMeta.matchMode || PrimeReact.FilterMatchMode.STARTS_WITH;
-      var dataFieldValue = core.ObjectUtils.resolveFieldData(rowData, field);
+      var dataFieldValue = utils.ObjectUtils.resolveFieldData(rowData, field);
       var filterConstraint = PrimeReact.FilterService.filters[filterMatchMode];
       return filterConstraint(dataFieldValue, filterValue, this.props.filterLocale, index);
     }
   }, {
     key: "cloneFilters",
     value: function cloneFilters(filters) {
-      var _this10 = this;
+      var _this12 = this;
 
       filters = filters || this.props.filters;
       var cloned = {};
@@ -5992,7 +6029,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
             var field = col.props.filterField || col.props.field;
             var filterFunction = col.props.filterFunction;
             var dataType = col.props.dataType;
-            var matchMode = col.props.filterMatchMode || (PrimeReact__default['default'].filterMatchModeOptions[dataType] ? PrimeReact__default['default'].filterMatchModeOptions[dataType][0] : PrimeReact.FilterMatchMode.STARTS_WITH);
+            var matchMode = col.props.filterMatchMode || (PrimeReact__default["default"].filterMatchModeOptions[dataType] ? PrimeReact__default["default"].filterMatchModeOptions[dataType][0] : PrimeReact.FilterMatchMode.STARTS_WITH);
             var constraint = {
               value: null,
               matchMode: matchMode
@@ -6010,7 +6047,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
               });
             }
 
-            _filters[field] = _this10.props.filterDisplay === 'menu' ? {
+            _filters[field] = _this12.props.filterDisplay === 'menu' ? {
               operator: PrimeReact.FilterOperator.AND,
               constraints: [constraint]
             } : constraint;
@@ -6091,7 +6128,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "exportCSV",
     value: function exportCSV(options) {
-      var _this11 = this;
+      var _this13 = this;
 
       var data;
       var csv = "\uFEFF";
@@ -6114,7 +6151,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
           csv += '"' + (header || field) + '"';
 
           if (i < columns.length - 1) {
-            csv += _this11.props.csvSeparator;
+            csv += _this13.props.csvSeparator;
           }
         }
       }); //body
@@ -6127,24 +6164,26 @@ var DataTable = /*#__PURE__*/function (_Component) {
               exportable = _column$props2.exportable;
 
           if (exportable && field) {
-            var cellData = core.ObjectUtils.resolveFieldData(record, field);
+            var cellData = utils.ObjectUtils.resolveFieldData(record, field);
 
             if (cellData != null) {
-              cellData = _this11.props.exportFunction ? _this11.props.exportFunction({
+              cellData = _this13.props.exportFunction ? _this13.props.exportFunction({
                 data: cellData,
-                field: field
+                field: field,
+                rowData: record,
+                column: column
               }) : String(cellData).replace(/"/g, '""');
             } else cellData = '';
 
             csv += '"' + cellData + '"';
 
             if (i < columns.length - 1) {
-              csv += _this11.props.csvSeparator;
+              csv += _this13.props.csvSeparator;
             }
           }
         });
       });
-      core.DomHandler.exportCSV(csv, this.props.exportFilename);
+      utils.DomHandler.exportCSV(csv, this.props.exportFilename);
     }
   }, {
     key: "closeEditingCell",
@@ -6165,11 +6204,11 @@ var DataTable = /*#__PURE__*/function (_Component) {
           var sortOrder = localState && localState.sortOrder || this.getSortOrder();
           var multiSortMeta = localState && localState.multiSortMeta || this.getMultiSortMeta();
 
-          if (core.ObjectUtils.isNotEmpty(filters) || this.props.globalFilter) {
+          if (utils.ObjectUtils.isNotEmpty(filters) || this.props.globalFilter) {
             data = this.filterLocal(data, filters);
           }
 
-          if (sortField || core.ObjectUtils.isNotEmpty(multiSortMeta)) {
+          if (sortField || utils.ObjectUtils.isNotEmpty(multiSortMeta)) {
             if (this.props.sortMode === 'single') data = this.sortSingle(data, sortField, sortOrder);else if (this.props.sortMode === 'multiple') data = this.sortMultiple(data, multiSortMeta);
           }
         }
@@ -6237,10 +6276,10 @@ var DataTable = /*#__PURE__*/function (_Component) {
     key: "renderLoader",
     value: function renderLoader() {
       if (this.props.loading) {
-        var iconClassName = core.classNames('p-datatable-loading-icon pi-spin', this.props.loadingIcon);
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        var iconClassName = utils.classNames('p-datatable-loading-icon pi-spin', this.props.loadingIcon);
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-datatable-loading-overlay p-component-overlay"
-        }, /*#__PURE__*/React__default['default'].createElement("i", {
+        }, /*#__PURE__*/React__default["default"].createElement("i", {
           className: iconClassName
         }));
       }
@@ -6251,10 +6290,10 @@ var DataTable = /*#__PURE__*/function (_Component) {
     key: "renderHeader",
     value: function renderHeader() {
       if (this.props.header) {
-        var content = core.ObjectUtils.getJSXElement(this.props.header, {
+        var content = utils.ObjectUtils.getJSXElement(this.props.header, {
           props: this.props
         });
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-datatable-header"
         }, content);
       }
@@ -6274,7 +6313,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
       var filtersStore = this.getFilters();
       var processedData = options.items,
           columns = options.columns;
-      return /*#__PURE__*/React__default['default'].createElement(TableHeader, {
+      return /*#__PURE__*/React__default["default"].createElement(TableHeader, {
         value: processedData,
         tableProps: this.props,
         columns: columns,
@@ -6318,7 +6357,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
           columns = options.columns,
           contentRef = options.contentRef,
           className = options.className;
-      var frozenBody = this.props.frozenValue && /*#__PURE__*/React__default['default'].createElement(TableBody, {
+      var frozenBody = this.props.frozenValue && /*#__PURE__*/React__default["default"].createElement(TableBody, {
         value: this.props.frozenValue,
         className: "p-datatable-frozen-tbody",
         frozenRow: true,
@@ -6382,7 +6421,7 @@ var DataTable = /*#__PURE__*/function (_Component) {
         rowClassName: this.props.rowClassName,
         isVirtualScrollerDisabled: true
       });
-      var body = /*#__PURE__*/React__default['default'].createElement(TableBody, {
+      var body = /*#__PURE__*/React__default["default"].createElement(TableBody, {
         value: this.dataToRender(rows),
         className: className,
         empty: empty,
@@ -6449,13 +6488,13 @@ var DataTable = /*#__PURE__*/function (_Component) {
         virtualScrollerOptions: options,
         isVirtualScrollerDisabled: isVirtualScrollerDisabled
       });
-      return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, frozenBody, body);
+      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, frozenBody, body);
     }
   }, {
     key: "renderTableFooter",
     value: function renderTableFooter(options) {
       var columns = options.columns;
-      return /*#__PURE__*/React__default['default'].createElement(TableFooter, {
+      return /*#__PURE__*/React__default["default"].createElement(TableFooter, {
         tableProps: this.props,
         columns: columns,
         footerColumnGroup: this.props.footerColumnGroup
@@ -6464,17 +6503,17 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderContent",
     value: function renderContent(processedData, columns, selectionModeInColumn, empty) {
-      var _this12 = this;
+      var _this14 = this;
 
       if (!columns) return;
       var isVirtualScrollerDisabled = this.isVirtualScrollerDisabled();
       var virtualScrollerOptions = this.props.virtualScrollerOptions || {};
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-datatable-wrapper",
         style: {
           maxHeight: isVirtualScrollerDisabled ? this.props.scrollHeight : ''
         }
-      }, /*#__PURE__*/React__default['default'].createElement(virtualscroller.VirtualScroller, _extends({}, virtualScrollerOptions, {
+      }, /*#__PURE__*/React__default["default"].createElement(virtualscroller.VirtualScroller, _extends({}, virtualScrollerOptions, {
         items: processedData,
         columns: columns,
         style: {
@@ -6485,21 +6524,21 @@ var DataTable = /*#__PURE__*/function (_Component) {
         showSpacer: false,
         contentTemplate: function contentTemplate(options) {
           var ref = function ref(el) {
-            _this12.table = el;
+            _this14.table = el;
             options.spacerRef && options.spacerRef(el);
           };
 
-          var tableClassName = core.classNames('p-datatable-table', _this12.props.tableClassName);
+          var tableClassName = utils.classNames('p-datatable-table', _this14.props.tableClassName);
 
-          var tableHeader = _this12.renderTableHeader(options, empty);
+          var tableHeader = _this14.renderTableHeader(options, empty);
 
-          var tableBody = _this12.renderTableBody(options, selectionModeInColumn, empty, isVirtualScrollerDisabled);
+          var tableBody = _this14.renderTableBody(options, selectionModeInColumn, empty, isVirtualScrollerDisabled);
 
-          var tableFooter = _this12.renderTableFooter(options);
+          var tableFooter = _this14.renderTableFooter(options);
 
-          return /*#__PURE__*/React__default['default'].createElement("table", {
+          return /*#__PURE__*/React__default["default"].createElement("table", {
             ref: ref,
-            style: _this12.props.tableStyle,
+            style: _this14.props.tableStyle,
             className: tableClassName,
             role: "table"
           }, tableHeader, tableBody, tableFooter);
@@ -6510,10 +6549,10 @@ var DataTable = /*#__PURE__*/function (_Component) {
     key: "renderFooter",
     value: function renderFooter() {
       if (this.props.footer) {
-        var content = core.ObjectUtils.getJSXElement(this.props.footer, {
+        var content = utils.ObjectUtils.getJSXElement(this.props.footer, {
           props: this.props
         });
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-datatable-footer"
         }, content);
       }
@@ -6523,8 +6562,8 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderPaginator",
     value: function renderPaginator(position, totalRecords) {
-      var className = core.classNames('p-paginator-' + position, this.props.paginatorClassName);
-      return /*#__PURE__*/React__default['default'].createElement(paginator.Paginator, {
+      var className = utils.classNames('p-paginator-' + position, this.props.paginatorClassName);
+      return /*#__PURE__*/React__default["default"].createElement(paginator.Paginator, {
         first: this.getFirst(),
         rows: this.getRows(),
         pageLinkSize: this.props.pageLinkSize,
@@ -6561,12 +6600,12 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderResizeHelper",
     value: function renderResizeHelper() {
-      var _this13 = this;
+      var _this15 = this;
 
       if (this.props.resizableColumns) {
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           ref: function ref(el) {
-            return _this13.resizeHelper = el;
+            return _this15.resizeHelper = el;
           },
           className: "p-column-resizer-helper",
           style: {
@@ -6580,22 +6619,22 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderReorderIndicators",
     value: function renderReorderIndicators() {
-      var _this14 = this;
+      var _this16 = this;
 
       if (this.props.reorderableColumns) {
         var style = {
           position: 'absolute',
           display: 'none'
         };
-        return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("span", {
+        return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
           ref: function ref(el) {
-            return _this14.reorderIndicatorUp = el;
+            return _this16.reorderIndicatorUp = el;
           },
           className: "pi pi-arrow-down p-datatable-reorder-indicator-up",
           style: style
-        }), /*#__PURE__*/React__default['default'].createElement("span", {
+        }), /*#__PURE__*/React__default["default"].createElement("span", {
           ref: function ref(el) {
-            return _this14.reorderIndicatorDown = el;
+            return _this16.reorderIndicatorDown = el;
           },
           className: "pi pi-arrow-up p-datatable-reorder-indicator-down",
           style: style
@@ -6607,14 +6646,14 @@ var DataTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this15 = this;
+      var _this17 = this;
 
       var processedData = this.processedData();
       var columns = this.getColumns();
       var totalRecords = this.getTotalRecords(processedData);
-      var empty = core.ObjectUtils.isEmpty(processedData);
+      var empty = utils.ObjectUtils.isEmpty(processedData);
       var selectionModeInColumn = this.getSelectionModeInColumn(columns);
-      var className = core.classNames('p-datatable p-component', {
+      var className = utils.classNames('p-datatable p-component', {
         'p-datatable-hoverable-rows': this.props.rowHover || this.props.selectionMode || selectionModeInColumn,
         'p-datatable-auto-layout': this.props.autoLayout,
         'p-datatable-resizable': this.props.resizableColumns,
@@ -6641,9 +6680,9 @@ var DataTable = /*#__PURE__*/function (_Component) {
       var footer = this.renderFooter();
       var resizeHelper = this.renderResizeHelper();
       var reorderIndicators = this.renderReorderIndicators();
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         ref: function ref(el) {
-          return _this15.el = el;
+          return _this17.el = el;
         },
         id: this.props.id,
         className: className,
@@ -6698,7 +6737,7 @@ _defineProperty(DataTable, "defaultProps", {
   sortMode: 'single',
   defaultSortOrder: 1,
   removableSort: false,
-  emptyMessage: 'No records found',
+  emptyMessage: null,
   selectionMode: null,
   dragSelection: false,
   cellSelection: false,