primereact 7.0.0-rc.2 → 7.2.0

package/treetable/treetable.cjs.js

@@ -4,15 +4,17 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var api = require('primereact/api');
-var core = require('primereact/core');
+var utils = require('primereact/utils');
 var paginator = require('primereact/paginator');
 var inputtext = require('primereact/inputtext');
+var overlayservice = require('primereact/overlayservice');
+var ripple = require('primereact/ripple');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function _arrayLikeToArray$3(arr, len) {
+function _arrayLikeToArray$5(arr, len) {
   if (len == null || len > arr.length) len = arr.length;
 
   for (var i = 0, arr2 = new Array(len); i < len; i++) {
@@ -23,20 +25,20 @@ function _arrayLikeToArray$3(arr, len) {
 }
 
 function _arrayWithoutHoles(arr) {
-  if (Array.isArray(arr)) return _arrayLikeToArray$3(arr);
+  if (Array.isArray(arr)) return _arrayLikeToArray$5(arr);
 }
 
 function _iterableToArray(iter) {
   if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
 }
 
-function _unsupportedIterableToArray$3(o, minLen) {
+function _unsupportedIterableToArray$5(o, minLen) {
   if (!o) return;
-  if (typeof o === "string") return _arrayLikeToArray$3(o, minLen);
+  if (typeof o === "string") return _arrayLikeToArray$5(o, minLen);
   var n = Object.prototype.toString.call(o).slice(8, -1);
   if (n === "Object" && o.constructor) n = o.constructor.name;
   if (n === "Map" || n === "Set") return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$3(o, minLen);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$5(o, minLen);
 }
 
 function _nonIterableSpread() {
@@ -44,7 +46,7 @@ function _nonIterableSpread() {
 }
 
 function _toConsumableArray(arr) {
-  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$3(arr) || _nonIterableSpread();
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$5(arr) || _nonIterableSpread();
 }
 
 function _classCallCheck(instance, Constructor) {
@@ -66,6 +68,9 @@ function _defineProperties(target, props) {
 function _createClass(Constructor, protoProps, staticProps) {
   if (protoProps) _defineProperties(Constructor.prototype, protoProps);
   if (staticProps) _defineProperties(Constructor, staticProps);
+  Object.defineProperty(Constructor, "prototype", {
+    writable: false
+  });
   return Constructor;
 }
 
@@ -98,23 +103,20 @@ function _inherits(subClass, superClass) {
       configurable: true
     }
   });
+  Object.defineProperty(subClass, "prototype", {
+    writable: false
+  });
   if (superClass) _setPrototypeOf(subClass, superClass);
 }
 
 function _typeof(obj) {
   "@babel/helpers - typeof";
 
-  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-    _typeof = function _typeof(obj) {
-      return typeof obj;
-    };
-  } else {
-    _typeof = function _typeof(obj) {
-      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-    };
-  }
-
-  return _typeof(obj);
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
 }
 
 function _possibleConstructorReturn(self, call) {
@@ -149,11 +151,11 @@ function _defineProperty(obj, key, value) {
   return obj;
 }
 
-function _createForOfIteratorHelper$2(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$2(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _createForOfIteratorHelper$4(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$4(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 
-function _unsupportedIterableToArray$2(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$2(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$2(o, minLen); }
+function _unsupportedIterableToArray$4(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$4(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$4(o, minLen); }
 
-function _arrayLikeToArray$2(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _arrayLikeToArray$4(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
 function _createSuper$6(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$6(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
@@ -182,14 +184,14 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
       if (column.props.sortable) {
         var targetNode = event.target;
 
-        if (core.DomHandler.hasClass(targetNode, 'p-sortable-column') || core.DomHandler.hasClass(targetNode, 'p-column-title') || core.DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || core.DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
+        if (utils.DomHandler.hasClass(targetNode, 'p-sortable-column') || utils.DomHandler.hasClass(targetNode, 'p-column-title') || utils.DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || utils.DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
           this.props.onSort({
             originalEvent: event,
             sortField: column.props.sortField || column.props.field,
             sortFunction: column.props.sortFunction,
             sortable: column.props.sortable
           });
-          core.DomHandler.clearSelection();
+          utils.DomHandler.clearSelection();
         }
       }
     }
@@ -298,7 +300,7 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
     key: "hasColumnFilter",
     value: function hasColumnFilter(columns) {
       if (columns) {
-        var _iterator = _createForOfIteratorHelper$2(columns),
+        var _iterator = _createForOfIteratorHelper$4(columns),
             _step;
 
         try {
@@ -323,8 +325,8 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
     value: function renderSortIcon(column, sorted, sortOrder) {
       if (column.props.sortable) {
         var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
-        var sortIconClassName = core.classNames('p-sortable-column-icon', 'pi pi-fw', sortIcon);
-        return /*#__PURE__*/React__default['default'].createElement("span", {
+        var sortIconClassName = utils.classNames('p-sortable-column-icon', 'pi pi-fw', sortIcon);
+        return /*#__PURE__*/React__default["default"].createElement("span", {
           className: sortIconClassName
         });
       } else {
@@ -337,7 +339,7 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
       var _this3 = this;
 
       if (this.props.resizableColumns) {
-        return /*#__PURE__*/React__default['default'].createElement("span", {
+        return /*#__PURE__*/React__default["default"].createElement("span", {
           className: "p-column-resizer p-clickable",
           onMouseDown: function onMouseDown(e) {
             return _this3.onResizerMouseDown(e, column);
@@ -361,7 +363,7 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
     key: "renderSortBadge",
     value: function renderSortBadge(sortMetaDataIndex) {
       if (sortMetaDataIndex !== -1 && this.state.badgeVisible) {
-        return /*#__PURE__*/React__default['default'].createElement("span", {
+        return /*#__PURE__*/React__default["default"].createElement("span", {
           className: "p-sortable-column-badge"
         }, sortMetaDataIndex + 1);
       }
@@ -376,7 +378,7 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
       var filterElement;
 
       if (column.props.filter && options.renderFilter) {
-        filterElement = column.props.filterElement || /*#__PURE__*/React__default['default'].createElement(inputtext.InputText, {
+        filterElement = column.props.filterElement || /*#__PURE__*/React__default["default"].createElement(inputtext.InputText, {
           onInput: function onInput(e) {
             return _this4.onFilterInput(e, column);
           },
@@ -389,9 +391,9 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
       }
 
       if (options.filterOnly) {
-        return /*#__PURE__*/React__default['default'].createElement("th", {
+        return /*#__PURE__*/React__default["default"].createElement("th", {
           key: column.props.columnKey || column.props.field || options.index,
-          className: core.classNames('p-filter-column', column.props.filterHeaderClassName),
+          className: utils.classNames('p-filter-column', column.props.filterHeaderClassName),
           style: column.props.filterHeaderStyle || column.props.style,
           rowSpan: column.props.rowSpan,
           colSpan: column.props.colSpan
@@ -407,13 +409,13 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
         var sortIconElement = this.renderSortIcon(column, sorted, sortOrder);
         var ariaSortData = this.getAriaSort(column, sorted, sortOrder);
         var sortBadge = this.renderSortBadge(sortMetaDataIndex);
-        var className = core.classNames(column.props.headerClassName || column.props.className, {
+        var className = utils.classNames(column.props.headerClassName || column.props.className, {
           'p-sortable-column': column.props.sortable,
           'p-highlight': sorted,
           'p-resizable-column': this.props.resizableColumns
         });
         var resizer = this.renderResizer(column);
-        return /*#__PURE__*/React__default['default'].createElement("th", {
+        return /*#__PURE__*/React__default["default"].createElement("th", {
           key: column.columnKey || column.field || options.index,
           className: className,
           style: column.props.headerStyle || column.props.style,
@@ -442,7 +444,7 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
           onDrop: function onDrop(e) {
             return _this4.onDrop(e, column);
           }
-        }, resizer, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, resizer, /*#__PURE__*/React__default["default"].createElement("span", {
           className: "p-column-title"
         }, column.props.header), sortIconElement, sortBadge, filterElement);
       }
@@ -452,7 +454,7 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
     value: function renderHeaderRow(row, index) {
       var _this5 = this;
 
-      var rowColumns = React__default['default'].Children.toArray(row.props.children);
+      var rowColumns = React__default["default"].Children.toArray(row.props.children);
       var rowHeaderCells = rowColumns.map(function (col, i) {
         return _this5.renderHeaderCell(col, {
           index: i,
@@ -460,72 +462,1044 @@ var TreeTableHeader = /*#__PURE__*/function (_Component) {
           renderFilter: true
         });
       });
-      return /*#__PURE__*/React__default['default'].createElement("tr", {
-        key: index
-      }, rowHeaderCells);
+      return /*#__PURE__*/React__default["default"].createElement("tr", {
+        key: index
+      }, rowHeaderCells);
+    }
+  }, {
+    key: "renderColumnGroup",
+    value: function renderColumnGroup() {
+      var _this6 = this;
+
+      var rows = React__default["default"].Children.toArray(this.props.columnGroup.props.children);
+      return rows.map(function (row, i) {
+        return _this6.renderHeaderRow(row, i);
+      });
+    }
+  }, {
+    key: "renderColumns",
+    value: function renderColumns(columns) {
+      var _this7 = this;
+
+      if (columns) {
+        if (this.hasColumnFilter(columns)) {
+          return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("tr", null, columns.map(function (col, i) {
+            return _this7.renderHeaderCell(col, {
+              index: i,
+              filterOnly: false,
+              renderFilter: false
+            });
+          })), /*#__PURE__*/React__default["default"].createElement("tr", null, columns.map(function (col, i) {
+            return _this7.renderHeaderCell(col, {
+              index: i,
+              filterOnly: true,
+              renderFilter: true
+            });
+          })));
+        } else {
+          return /*#__PURE__*/React__default["default"].createElement("tr", null, columns.map(function (col, i) {
+            return _this7.renderHeaderCell(col, {
+              index: i,
+              filterOnly: false,
+              renderFilter: false
+            });
+          }));
+        }
+      } else {
+        return null;
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var content = this.props.columnGroup ? this.renderColumnGroup() : this.renderColumns(this.props.columns);
+      return /*#__PURE__*/React__default["default"].createElement("thead", {
+        className: "p-treetable-thead"
+      }, content);
+    }
+  }], [{
+    key: "getDerivedStateFromProps",
+    value: function getDerivedStateFromProps(nextProps, prevState) {
+      return {
+        badgeVisible: nextProps.multiSortMeta && nextProps.multiSortMeta.length > 1
+      };
+    }
+  }]);
+
+  return TreeTableHeader;
+}(React.Component);
+
+function _createForOfIteratorHelper$3(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$3(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray$3(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$3(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$3(o, minLen); }
+
+function _arrayLikeToArray$3(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+var DomHandler = /*#__PURE__*/function () {
+  function DomHandler() {
+    _classCallCheck(this, DomHandler);
+  }
+
+  _createClass(DomHandler, null, [{
+    key: "innerWidth",
+    value: function innerWidth(el) {
+      if (el) {
+        var width = el.offsetWidth;
+        var style = getComputedStyle(el);
+        width += parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
+        return width;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "width",
+    value: function width(el) {
+      if (el) {
+        var width = el.offsetWidth;
+        var style = getComputedStyle(el);
+        width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
+        return width;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getWindowScrollTop",
+    value: function getWindowScrollTop() {
+      var doc = document.documentElement;
+      return (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
+    }
+  }, {
+    key: "getWindowScrollLeft",
+    value: function getWindowScrollLeft() {
+      var doc = document.documentElement;
+      return (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
+    }
+  }, {
+    key: "getOuterWidth",
+    value: function getOuterWidth(el, margin) {
+      if (el) {
+        var width = el.offsetWidth || el.getBoundingClientRect().width;
+
+        if (margin) {
+          var style = getComputedStyle(el);
+          width += parseFloat(style.marginLeft) + parseFloat(style.marginRight);
+        }
+
+        return width;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getOuterHeight",
+    value: function getOuterHeight(el, margin) {
+      if (el) {
+        var height = el.offsetHeight || el.getBoundingClientRect().height;
+
+        if (margin) {
+          var style = getComputedStyle(el);
+          height += parseFloat(style.marginTop) + parseFloat(style.marginBottom);
+        }
+
+        return height;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getClientHeight",
+    value: function getClientHeight(el, margin) {
+      if (el) {
+        var height = el.clientHeight;
+
+        if (margin) {
+          var style = getComputedStyle(el);
+          height += parseFloat(style.marginTop) + parseFloat(style.marginBottom);
+        }
+
+        return height;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getClientWidth",
+    value: function getClientWidth(el, margin) {
+      if (el) {
+        var width = el.clientWidth;
+
+        if (margin) {
+          var style = getComputedStyle(el);
+          width += parseFloat(style.marginLeft) + parseFloat(style.marginRight);
+        }
+
+        return width;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getViewport",
+    value: function getViewport() {
+      var win = window,
+          d = document,
+          e = d.documentElement,
+          g = d.getElementsByTagName('body')[0],
+          w = win.innerWidth || e.clientWidth || g.clientWidth,
+          h = win.innerHeight || e.clientHeight || g.clientHeight;
+      return {
+        width: w,
+        height: h
+      };
+    }
+  }, {
+    key: "getOffset",
+    value: function getOffset(el) {
+      if (el) {
+        var rect = el.getBoundingClientRect();
+        return {
+          top: rect.top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0),
+          left: rect.left + (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0)
+        };
+      }
+
+      return {
+        top: 'auto',
+        left: 'auto'
+      };
+    }
+  }, {
+    key: "index",
+    value: function index(element) {
+      if (element) {
+        var children = element.parentNode.childNodes;
+        var num = 0;
+
+        for (var i = 0; i < children.length; i++) {
+          if (children[i] === element) return num;
+          if (children[i].nodeType === 1) num++;
+        }
+      }
+
+      return -1;
+    }
+  }, {
+    key: "addMultipleClasses",
+    value: function addMultipleClasses(element, className) {
+      if (element && className) {
+        if (element.classList) {
+          var styles = className.split(' ');
+
+          for (var i = 0; i < styles.length; i++) {
+            element.classList.add(styles[i]);
+          }
+        } else {
+          var _styles = className.split(' ');
+
+          for (var _i = 0; _i < _styles.length; _i++) {
+            element.className += ' ' + _styles[_i];
+          }
+        }
+      }
+    }
+  }, {
+    key: "removeMultipleClasses",
+    value: function removeMultipleClasses(element, className) {
+      if (element && className) {
+        if (element.classList) {
+          var styles = className.split(' ');
+
+          for (var i = 0; i < styles.length; i++) {
+            element.classList.remove(styles[i]);
+          }
+        } else {
+          var _styles2 = className.split(' ');
+
+          for (var _i2 = 0; _i2 < _styles2.length; _i2++) {
+            element.className = element.className.replace(new RegExp('(^|\\b)' + _styles2[_i2].split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
+          }
+        }
+      }
+    }
+  }, {
+    key: "addClass",
+    value: function addClass(element, className) {
+      if (element && className) {
+        if (element.classList) element.classList.add(className);else element.className += ' ' + className;
+      }
+    }
+  }, {
+    key: "removeClass",
+    value: function removeClass(element, className) {
+      if (element && className) {
+        if (element.classList) element.classList.remove(className);else element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
+      }
+    }
+  }, {
+    key: "hasClass",
+    value: function hasClass(element, className) {
+      if (element) {
+        if (element.classList) return element.classList.contains(className);else return new RegExp('(^| )' + className + '( |$)', 'gi').test(element.className);
+      }
+    }
+  }, {
+    key: "find",
+    value: function find(element, selector) {
+      return element ? Array.from(element.querySelectorAll(selector)) : [];
+    }
+  }, {
+    key: "findSingle",
+    value: function findSingle(element, selector) {
+      if (element) {
+        return element.querySelector(selector);
+      }
+
+      return null;
+    }
+  }, {
+    key: "getHeight",
+    value: function getHeight(el) {
+      if (el) {
+        var height = el.offsetHeight;
+        var style = getComputedStyle(el);
+        height -= parseFloat(style.paddingTop) + parseFloat(style.paddingBottom) + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
+        return height;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getWidth",
+    value: function getWidth(el) {
+      if (el) {
+        var width = el.offsetWidth;
+        var style = getComputedStyle(el);
+        width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight) + parseFloat(style.borderLeftWidth) + parseFloat(style.borderRightWidth);
+        return width;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "alignOverlay",
+    value: function alignOverlay(overlay, target, appendTo) {
+      var calculateMinWidth = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
+
+      if (overlay && target) {
+        if (appendTo === 'self') {
+          this.relativePosition(overlay, target);
+        } else {
+          calculateMinWidth && (overlay.style.minWidth = DomHandler.getOuterWidth(target) + 'px');
+          this.absolutePosition(overlay, target);
+        }
+      }
+    }
+  }, {
+    key: "absolutePosition",
+    value: function absolutePosition(element, target) {
+      if (element) {
+        var elementDimensions = element.offsetParent ? {
+          width: element.offsetWidth,
+          height: element.offsetHeight
+        } : this.getHiddenElementDimensions(element);
+        var elementOuterHeight = elementDimensions.height;
+        var elementOuterWidth = elementDimensions.width;
+        var targetOuterHeight = target.offsetHeight;
+        var targetOuterWidth = target.offsetWidth;
+        var targetOffset = target.getBoundingClientRect();
+        var windowScrollTop = this.getWindowScrollTop();
+        var windowScrollLeft = this.getWindowScrollLeft();
+        var viewport = this.getViewport();
+        var top, left;
+
+        if (targetOffset.top + targetOuterHeight + elementOuterHeight > viewport.height) {
+          top = targetOffset.top + windowScrollTop - elementOuterHeight;
+
+          if (top < 0) {
+            top = windowScrollTop;
+          }
+
+          element.style.transformOrigin = 'bottom';
+        } else {
+          top = targetOuterHeight + targetOffset.top + windowScrollTop;
+          element.style.transformOrigin = 'top';
+        }
+
+        if (targetOffset.left + targetOuterWidth + elementOuterWidth > viewport.width) left = Math.max(0, targetOffset.left + windowScrollLeft + targetOuterWidth - elementOuterWidth);else left = targetOffset.left + windowScrollLeft;
+        element.style.top = top + 'px';
+        element.style.left = left + 'px';
+      }
+    }
+  }, {
+    key: "relativePosition",
+    value: function relativePosition(element, target) {
+      if (element) {
+        var elementDimensions = element.offsetParent ? {
+          width: element.offsetWidth,
+          height: element.offsetHeight
+        } : this.getHiddenElementDimensions(element);
+        var targetHeight = target.offsetHeight;
+        var targetOffset = target.getBoundingClientRect();
+        var viewport = this.getViewport();
+        var top, left;
+
+        if (targetOffset.top + targetHeight + elementDimensions.height > viewport.height) {
+          top = -1 * elementDimensions.height;
+
+          if (targetOffset.top + top < 0) {
+            top = -1 * targetOffset.top;
+          }
+
+          element.style.transformOrigin = 'bottom';
+        } else {
+          top = targetHeight;
+          element.style.transformOrigin = 'top';
+        }
+
+        if (elementDimensions.width > viewport.width) {
+          // element wider then viewport and cannot fit on screen (align at left side of viewport)
+          left = targetOffset.left * -1;
+        } else if (targetOffset.left + elementDimensions.width > viewport.width) {
+          // element wider then viewport but can be fit on screen (align at right side of viewport)
+          left = (targetOffset.left + elementDimensions.width - viewport.width) * -1;
+        } else {
+          // element fits on screen (align with target)
+          left = 0;
+        }
+
+        element.style.top = top + 'px';
+        element.style.left = left + 'px';
+      }
+    }
+  }, {
+    key: "flipfitCollision",
+    value: function flipfitCollision(element, target) {
+      var _this = this;
+
+      var my = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'left top';
+      var at = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'left bottom';
+      var callback = arguments.length > 4 ? arguments[4] : undefined;
+      var targetOffset = target.getBoundingClientRect();
+      var viewport = this.getViewport();
+      var myArr = my.split(' ');
+      var atArr = at.split(' ');
+
+      var getPositionValue = function getPositionValue(arr, isOffset) {
+        return isOffset ? +arr.substring(arr.search(/(\+|-)/g)) || 0 : arr.substring(0, arr.search(/(\+|-)/g)) || arr;
+      };
+
+      var position = {
+        my: {
+          x: getPositionValue(myArr[0]),
+          y: getPositionValue(myArr[1] || myArr[0]),
+          offsetX: getPositionValue(myArr[0], true),
+          offsetY: getPositionValue(myArr[1] || myArr[0], true)
+        },
+        at: {
+          x: getPositionValue(atArr[0]),
+          y: getPositionValue(atArr[1] || atArr[0]),
+          offsetX: getPositionValue(atArr[0], true),
+          offsetY: getPositionValue(atArr[1] || atArr[0], true)
+        }
+      };
+      var myOffset = {
+        left: function left() {
+          var totalOffset = position.my.offsetX + position.at.offsetX;
+          return totalOffset + targetOffset.left + (position.my.x === 'left' ? 0 : -1 * (position.my.x === 'center' ? _this.getOuterWidth(element) / 2 : _this.getOuterWidth(element)));
+        },
+        top: function top() {
+          var totalOffset = position.my.offsetY + position.at.offsetY;
+          return totalOffset + targetOffset.top + (position.my.y === 'top' ? 0 : -1 * (position.my.y === 'center' ? _this.getOuterHeight(element) / 2 : _this.getOuterHeight(element)));
+        }
+      };
+      var alignWithAt = {
+        count: {
+          x: 0,
+          y: 0
+        },
+        left: function left() {
+          var left = myOffset.left();
+          var scrollLeft = DomHandler.getWindowScrollLeft();
+          element.style.left = left + scrollLeft + 'px';
+
+          if (this.count.x === 2) {
+            element.style.left = scrollLeft + 'px';
+            this.count.x = 0;
+          } else if (left < 0) {
+            this.count.x++;
+            position.my.x = 'left';
+            position.at.x = 'right';
+            position.my.offsetX *= -1;
+            position.at.offsetX *= -1;
+            this.right();
+          }
+        },
+        right: function right() {
+          var left = myOffset.left() + DomHandler.getOuterWidth(target);
+          var scrollLeft = DomHandler.getWindowScrollLeft();
+          element.style.left = left + scrollLeft + 'px';
+
+          if (this.count.x === 2) {
+            element.style.left = viewport.width - DomHandler.getOuterWidth(element) + scrollLeft + 'px';
+            this.count.x = 0;
+          } else if (left + DomHandler.getOuterWidth(element) > viewport.width) {
+            this.count.x++;
+            position.my.x = 'right';
+            position.at.x = 'left';
+            position.my.offsetX *= -1;
+            position.at.offsetX *= -1;
+            this.left();
+          }
+        },
+        top: function top() {
+          var top = myOffset.top();
+          var scrollTop = DomHandler.getWindowScrollTop();
+          element.style.top = top + scrollTop + 'px';
+
+          if (this.count.y === 2) {
+            element.style.left = scrollTop + 'px';
+            this.count.y = 0;
+          } else if (top < 0) {
+            this.count.y++;
+            position.my.y = 'top';
+            position.at.y = 'bottom';
+            position.my.offsetY *= -1;
+            position.at.offsetY *= -1;
+            this.bottom();
+          }
+        },
+        bottom: function bottom() {
+          var top = myOffset.top() + DomHandler.getOuterHeight(target);
+          var scrollTop = DomHandler.getWindowScrollTop();
+          element.style.top = top + scrollTop + 'px';
+
+          if (this.count.y === 2) {
+            element.style.left = viewport.height - DomHandler.getOuterHeight(element) + scrollTop + 'px';
+            this.count.y = 0;
+          } else if (top + DomHandler.getOuterHeight(target) > viewport.height) {
+            this.count.y++;
+            position.my.y = 'bottom';
+            position.at.y = 'top';
+            position.my.offsetY *= -1;
+            position.at.offsetY *= -1;
+            this.top();
+          }
+        },
+        center: function center(axis) {
+          if (axis === 'y') {
+            var top = myOffset.top() + DomHandler.getOuterHeight(target) / 2;
+            element.style.top = top + DomHandler.getWindowScrollTop() + 'px';
+
+            if (top < 0) {
+              this.bottom();
+            } else if (top + DomHandler.getOuterHeight(target) > viewport.height) {
+              this.top();
+            }
+          } else {
+            var left = myOffset.left() + DomHandler.getOuterWidth(target) / 2;
+            element.style.left = left + DomHandler.getWindowScrollLeft() + 'px';
+
+            if (left < 0) {
+              this.left();
+            } else if (left + DomHandler.getOuterWidth(element) > viewport.width) {
+              this.right();
+            }
+          }
+        }
+      };
+      alignWithAt[position.at.x]('x');
+      alignWithAt[position.at.y]('y');
+
+      if (this.isFunction(callback)) {
+        callback(position);
+      }
+    }
+  }, {
+    key: "findCollisionPosition",
+    value: function findCollisionPosition(position) {
+      if (position) {
+        var isAxisY = position === 'top' || position === 'bottom';
+        var myXPosition = position === 'left' ? 'right' : 'left';
+        var myYPosition = position === 'top' ? 'bottom' : 'top';
+
+        if (isAxisY) {
+          return {
+            axis: 'y',
+            my: "center ".concat(myYPosition),
+            at: "center ".concat(position)
+          };
+        }
+
+        return {
+          axis: 'x',
+          my: "".concat(myXPosition, " center"),
+          at: "".concat(position, " center")
+        };
+      }
+    }
+  }, {
+    key: "getParents",
+    value: function getParents(element) {
+      var parents = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+      return element['parentNode'] === null ? parents : this.getParents(element.parentNode, parents.concat([element.parentNode]));
+    }
+  }, {
+    key: "getScrollableParents",
+    value: function getScrollableParents(element) {
+      var scrollableParents = [];
+
+      if (element) {
+        var parents = this.getParents(element);
+        var overflowRegex = /(auto|scroll)/;
+
+        var overflowCheck = function overflowCheck(node) {
+          var styleDeclaration = node ? getComputedStyle(node) : null;
+          return styleDeclaration && (overflowRegex.test(styleDeclaration.getPropertyValue('overflow')) || overflowRegex.test(styleDeclaration.getPropertyValue('overflowX')) || overflowRegex.test(styleDeclaration.getPropertyValue('overflowY')));
+        };
+
+        var _iterator = _createForOfIteratorHelper$3(parents),
+            _step;
+
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var parent = _step.value;
+            var scrollSelectors = parent.nodeType === 1 && parent.dataset['scrollselectors'];
+
+            if (scrollSelectors) {
+              var selectors = scrollSelectors.split(',');
+
+              var _iterator2 = _createForOfIteratorHelper$3(selectors),
+                  _step2;
+
+              try {
+                for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+                  var selector = _step2.value;
+                  var el = this.findSingle(parent, selector);
+
+                  if (el && overflowCheck(el)) {
+                    scrollableParents.push(el);
+                  }
+                }
+              } catch (err) {
+                _iterator2.e(err);
+              } finally {
+                _iterator2.f();
+              }
+            }
+
+            if (parent.nodeType !== 9 && overflowCheck(parent)) {
+              scrollableParents.push(parent);
+            }
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
+        }
+      }
+
+      return scrollableParents;
+    }
+  }, {
+    key: "getHiddenElementOuterHeight",
+    value: function getHiddenElementOuterHeight(element) {
+      if (element) {
+        element.style.visibility = 'hidden';
+        element.style.display = 'block';
+        var elementHeight = element.offsetHeight;
+        element.style.display = 'none';
+        element.style.visibility = 'visible';
+        return elementHeight;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getHiddenElementOuterWidth",
+    value: function getHiddenElementOuterWidth(element) {
+      if (element) {
+        element.style.visibility = 'hidden';
+        element.style.display = 'block';
+        var elementWidth = element.offsetWidth;
+        element.style.display = 'none';
+        element.style.visibility = 'visible';
+        return elementWidth;
+      }
+
+      return 0;
+    }
+  }, {
+    key: "getHiddenElementDimensions",
+    value: function getHiddenElementDimensions(element) {
+      var dimensions = {};
+
+      if (element) {
+        element.style.visibility = 'hidden';
+        element.style.display = 'block';
+        dimensions.width = element.offsetWidth;
+        dimensions.height = element.offsetHeight;
+        element.style.display = 'none';
+        element.style.visibility = 'visible';
+      }
+
+      return dimensions;
+    }
+  }, {
+    key: "fadeIn",
+    value: function fadeIn(element, duration) {
+      if (element) {
+        element.style.opacity = 0;
+        var last = +new Date();
+        var opacity = 0;
+
+        var tick = function tick() {
+          opacity = +element.style.opacity + (new Date().getTime() - last) / duration;
+          element.style.opacity = opacity;
+          last = +new Date();
+
+          if (+opacity < 1) {
+            window.requestAnimationFrame && requestAnimationFrame(tick) || setTimeout(tick, 16);
+          }
+        };
+
+        tick();
+      }
+    }
+  }, {
+    key: "fadeOut",
+    value: function fadeOut(element, duration) {
+      if (element) {
+        var opacity = 1,
+            interval = 50,
+            gap = interval / duration;
+        var fading = setInterval(function () {
+          opacity -= gap;
+
+          if (opacity <= 0) {
+            opacity = 0;
+            clearInterval(fading);
+          }
+
+          element.style.opacity = opacity;
+        }, interval);
+      }
+    }
+  }, {
+    key: "getUserAgent",
+    value: function getUserAgent() {
+      return navigator.userAgent;
+    }
+  }, {
+    key: "isIOS",
+    value: function isIOS() {
+      return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window['MSStream'];
+    }
+  }, {
+    key: "isAndroid",
+    value: function isAndroid() {
+      return /(android)/i.test(navigator.userAgent);
+    }
+  }, {
+    key: "isTouchDevice",
+    value: function isTouchDevice() {
+      return 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;
+    }
+  }, {
+    key: "isFunction",
+    value: function isFunction(obj) {
+      return !!(obj && obj.constructor && obj.call && obj.apply);
+    }
+  }, {
+    key: "appendChild",
+    value: function appendChild(element, target) {
+      if (this.isElement(target)) target.appendChild(element);else if (target.el && target.el.nativeElement) target.el.nativeElement.appendChild(element);else throw new Error('Cannot append ' + target + ' to ' + element);
+    }
+  }, {
+    key: "removeChild",
+    value: function removeChild(element, target) {
+      if (this.isElement(target)) target.removeChild(element);else if (target.el && target.el.nativeElement) target.el.nativeElement.removeChild(element);else throw new Error('Cannot remove ' + element + ' from ' + target);
+    }
+  }, {
+    key: "isElement",
+    value: function isElement(obj) {
+      return (typeof HTMLElement === "undefined" ? "undefined" : _typeof(HTMLElement)) === "object" ? obj instanceof HTMLElement : obj && _typeof(obj) === "object" && obj !== null && obj.nodeType === 1 && typeof obj.nodeName === "string";
+    }
+  }, {
+    key: "scrollInView",
+    value: function scrollInView(container, item) {
+      var borderTopValue = getComputedStyle(container).getPropertyValue('borderTopWidth');
+      var borderTop = borderTopValue ? parseFloat(borderTopValue) : 0;
+      var paddingTopValue = getComputedStyle(container).getPropertyValue('paddingTop');
+      var paddingTop = paddingTopValue ? parseFloat(paddingTopValue) : 0;
+      var containerRect = container.getBoundingClientRect();
+      var itemRect = item.getBoundingClientRect();
+      var offset = itemRect.top + document.body.scrollTop - (containerRect.top + document.body.scrollTop) - borderTop - paddingTop;
+      var scroll = container.scrollTop;
+      var elementHeight = container.clientHeight;
+      var itemHeight = this.getOuterHeight(item);
+
+      if (offset < 0) {
+        container.scrollTop = scroll + offset;
+      } else if (offset + itemHeight > elementHeight) {
+        container.scrollTop = scroll + offset - elementHeight + itemHeight;
+      }
+    }
+  }, {
+    key: "clearSelection",
+    value: function clearSelection() {
+      if (window.getSelection) {
+        if (window.getSelection().empty) {
+          window.getSelection().empty();
+        } else if (window.getSelection().removeAllRanges && window.getSelection().rangeCount > 0 && window.getSelection().getRangeAt(0).getClientRects().length > 0) {
+          window.getSelection().removeAllRanges();
+        }
+      } else if (document['selection'] && document['selection'].empty) {
+        try {
+          document['selection'].empty();
+        } catch (error) {//ignore IE bug
+        }
+      }
+    }
+  }, {
+    key: "calculateScrollbarWidth",
+    value: function calculateScrollbarWidth(el) {
+      if (el) {
+        var style = getComputedStyle(el);
+        return el.offsetWidth - el.clientWidth - parseFloat(style.borderLeftWidth) - parseFloat(style.borderRightWidth);
+      } else {
+        if (this.calculatedScrollbarWidth != null) return this.calculatedScrollbarWidth;
+        var scrollDiv = document.createElement("div");
+        scrollDiv.className = "p-scrollbar-measure";
+        document.body.appendChild(scrollDiv);
+        var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
+        document.body.removeChild(scrollDiv);
+        this.calculatedScrollbarWidth = scrollbarWidth;
+        return scrollbarWidth;
+      }
+    }
+  }, {
+    key: "getBrowser",
+    value: function getBrowser() {
+      if (!this.browser) {
+        var matched = this.resolveUserAgent();
+        this.browser = {};
+
+        if (matched.browser) {
+          this.browser[matched.browser] = true;
+          this.browser['version'] = matched.version;
+        }
+
+        if (this.browser['chrome']) {
+          this.browser['webkit'] = true;
+        } else if (this.browser['webkit']) {
+          this.browser['safari'] = true;
+        }
+      }
+
+      return this.browser;
+    }
+  }, {
+    key: "resolveUserAgent",
+    value: function resolveUserAgent() {
+      var ua = navigator.userAgent.toLowerCase();
+      var match = /(chrome)[ ]([\w.]+)/.exec(ua) || /(webkit)[ ]([\w.]+)/.exec(ua) || /(opera)(?:.*version|)[ ]([\w.]+)/.exec(ua) || /(msie) ([\w.]+)/.exec(ua) || ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua) || [];
+      return {
+        browser: match[1] || "",
+        version: match[2] || "0"
+      };
+    }
+  }, {
+    key: "isVisible",
+    value: function isVisible(element) {
+      return element && element.offsetParent != null;
+    }
+  }, {
+    key: "isExist",
+    value: function isExist(element) {
+      return element !== null && typeof element !== 'undefined' && element.nodeName && element.parentNode;
+    }
+  }, {
+    key: "hasDOM",
+    value: function hasDOM() {
+      return !!(typeof window !== 'undefined' && window.document && window.document.createElement);
+    }
+  }, {
+    key: "getFocusableElements",
+    value: function getFocusableElements(element) {
+      var selector = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+      var focusableElements = DomHandler.find(element, "button:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])".concat(selector, ",\n                [href][clientHeight][clientWidth]:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n                input:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n                select:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n                textarea:not([tabindex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n                [tabIndex]:not([tabIndex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector, ",\n                [contenteditable]:not([tabIndex = \"-1\"]):not([disabled]):not([style*=\"display:none\"]):not([hidden])").concat(selector));
+      var visibleFocusableElements = [];
+
+      var _iterator3 = _createForOfIteratorHelper$3(focusableElements),
+          _step3;
+
+      try {
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var focusableElement = _step3.value;
+          if (getComputedStyle(focusableElement).display !== "none" && getComputedStyle(focusableElement).visibility !== "hidden") visibleFocusableElements.push(focusableElement);
+        }
+      } catch (err) {
+        _iterator3.e(err);
+      } finally {
+        _iterator3.f();
+      }
+
+      return visibleFocusableElements;
+    }
+  }, {
+    key: "getFirstFocusableElement",
+    value: function getFirstFocusableElement(element, selector) {
+      var focusableElements = DomHandler.getFocusableElements(element, selector);
+      return focusableElements.length > 0 ? focusableElements[0] : null;
+    }
+  }, {
+    key: "getLastFocusableElement",
+    value: function getLastFocusableElement(element, selector) {
+      var focusableElements = DomHandler.getFocusableElements(element, selector);
+      return focusableElements.length > 0 ? focusableElements[focusableElements.length - 1] : null;
+    }
+  }, {
+    key: "getCursorOffset",
+    value: function getCursorOffset(el, prevText, nextText, currentText) {
+      if (el) {
+        var style = getComputedStyle(el);
+        var ghostDiv = document.createElement('div');
+        ghostDiv.style.position = 'absolute';
+        ghostDiv.style.top = '0px';
+        ghostDiv.style.left = '0px';
+        ghostDiv.style.visibility = 'hidden';
+        ghostDiv.style.pointerEvents = 'none';
+        ghostDiv.style.overflow = style.overflow;
+        ghostDiv.style.width = style.width;
+        ghostDiv.style.height = style.height;
+        ghostDiv.style.padding = style.padding;
+        ghostDiv.style.border = style.border;
+        ghostDiv.style.overflowWrap = style.overflowWrap;
+        ghostDiv.style.whiteSpace = style.whiteSpace;
+        ghostDiv.style.lineHeight = style.lineHeight;
+        ghostDiv.innerHTML = prevText.replace(/\r\n|\r|\n/g, '<br />');
+        var ghostSpan = document.createElement('span');
+        ghostSpan.textContent = currentText;
+        ghostDiv.appendChild(ghostSpan);
+        var text = document.createTextNode(nextText);
+        ghostDiv.appendChild(text);
+        document.body.appendChild(ghostDiv);
+        var offsetLeft = ghostSpan.offsetLeft,
+            offsetTop = ghostSpan.offsetTop,
+            clientHeight = ghostSpan.clientHeight;
+        document.body.removeChild(ghostDiv);
+        return {
+          left: Math.abs(offsetLeft - el.scrollLeft),
+          top: Math.abs(offsetTop - el.scrollTop) + clientHeight
+        };
+      }
+
+      return {
+        top: 'auto',
+        left: 'auto'
+      };
+    }
+  }, {
+    key: "invokeElementMethod",
+    value: function invokeElementMethod(element, methodName, args) {
+      element[methodName].apply(element, args);
+    }
+  }, {
+    key: "isClickable",
+    value: function isClickable(element) {
+      var targetNode = element.nodeName;
+      var parentNode = element.parentElement && element.parentElement.nodeName;
+      return targetNode === 'INPUT' || targetNode === 'TEXTAREA' || targetNode === 'BUTTON' || targetNode === 'A' || parentNode === 'INPUT' || parentNode === 'TEXTAREA' || parentNode === 'BUTTON' || parentNode === 'A' || this.hasClass(element, 'p-button') || this.hasClass(element.parentElement, 'p-button') || this.hasClass(element.parentElement, 'p-checkbox') || this.hasClass(element.parentElement, 'p-radiobutton');
+    }
+  }, {
+    key: "applyStyle",
+    value: function applyStyle(element, style) {
+      if (typeof style === 'string') {
+        element.style.cssText = this.style;
+      } else {
+        for (var prop in this.style) {
+          element.style[prop] = style[prop];
+        }
+      }
+    }
+  }, {
+    key: "exportCSV",
+    value: function exportCSV(csv, filename) {
+      var blob = new Blob([csv], {
+        type: 'application/csv;charset=utf-8;'
+      });
+
+      if (window.navigator.msSaveOrOpenBlob) {
+        navigator.msSaveOrOpenBlob(blob, filename + '.csv');
+      } else {
+        var isDownloaded = DomHandler.saveAs({
+          name: filename + '.csv',
+          src: URL.createObjectURL(blob)
+        });
+
+        if (!isDownloaded) {
+          csv = 'data:text/csv;charset=utf-8,' + csv;
+          window.open(encodeURI(csv));
+        }
+      }
     }
   }, {
-    key: "renderColumnGroup",
-    value: function renderColumnGroup() {
-      var _this6 = this;
+    key: "saveAs",
+    value: function saveAs(file) {
+      if (file) {
+        var link = document.createElement('a');
+
+        if (link.download !== undefined) {
+          var name = file.name,
+              src = file.src;
+          link.setAttribute('href', src);
+          link.setAttribute('download', name);
+          link.style.display = 'none';
+          document.body.appendChild(link);
+          link.click();
+          document.body.removeChild(link);
+          return true;
+        }
+      }
 
-      var rows = React__default['default'].Children.toArray(this.props.columnGroup.props.children);
-      return rows.map(function (row, i) {
-        return _this6.renderHeaderRow(row, i);
-      });
+      return false;
     }
   }, {
-    key: "renderColumns",
-    value: function renderColumns(columns) {
-      var _this7 = this;
+    key: "createInlineStyle",
+    value: function createInlineStyle(nonce) {
+      var styleElement = document.createElement('style');
 
-      if (columns) {
-        if (this.hasColumnFilter(columns)) {
-          return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("tr", null, columns.map(function (col, i) {
-            return _this7.renderHeaderCell(col, {
-              index: i,
-              filterOnly: false,
-              renderFilter: false
-            });
-          })), /*#__PURE__*/React__default['default'].createElement("tr", null, columns.map(function (col, i) {
-            return _this7.renderHeaderCell(col, {
-              index: i,
-              filterOnly: true,
-              renderFilter: true
-            });
-          })));
-        } else {
-          return /*#__PURE__*/React__default['default'].createElement("tr", null, columns.map(function (col, i) {
-            return _this7.renderHeaderCell(col, {
-              index: i,
-              filterOnly: false,
-              renderFilter: false
-            });
-          }));
+      try {
+        if (!nonce) {
+          nonce = process.env.REACT_APP_CSS_NONCE;
         }
-      } else {
-        return null;
+      } catch (error) {// NOOP
       }
+
+      nonce && styleElement.setAttribute('nonce', nonce);
+      document.head.appendChild(styleElement);
+      return styleElement;
     }
   }, {
-    key: "render",
-    value: function render() {
-      var content = this.props.columnGroup ? this.renderColumnGroup() : this.renderColumns(this.props.columns);
-      return /*#__PURE__*/React__default['default'].createElement("thead", {
-        className: "p-treetable-thead"
-      }, content);
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(nextProps, prevState) {
-      return {
-        badgeVisible: nextProps.multiSortMeta && nextProps.multiSortMeta.length > 1
-      };
+    key: "removeInlineStyle",
+    value: function removeInlineStyle(styleElement) {
+      if (this.isExist(styleElement)) {
+        try {
+          document.head.removeChild(styleElement);
+        } catch (error) {// style element may have already been removed in a fast refresh
+        }
+
+        styleElement = null;
+      }
+
+      return styleElement;
     }
   }]);
 
-  return TreeTableHeader;
-}(React.Component);
+  return DomHandler;
+}();
 
 function _extends() {
   _extends = Object.assign || function (target) {
@@ -588,7 +1562,7 @@ var TreeTableBodyCell = /*#__PURE__*/function (_Component) {
             }
           };
 
-          core.OverlayService.on('overlay-click', _this2.overlayEventListener);
+          overlayservice.OverlayService.on('overlay-click', _this2.overlayEventListener);
         });
       }
     }
@@ -642,7 +1616,7 @@ var TreeTableBodyCell = /*#__PURE__*/function (_Component) {
         }, function () {
           _this4.unbindDocumentEditListener();
 
-          core.OverlayService.off('overlay-click', _this4.overlayEventListener);
+          overlayservice.OverlayService.off('overlay-click', _this4.overlayEventListener);
           _this4.overlayEventListener = null;
         });
       }, 1);
@@ -677,7 +1651,7 @@ var TreeTableBodyCell = /*#__PURE__*/function (_Component) {
         clearTimeout(this.tabindexTimeout);
 
         if (this.state && this.state.editing) {
-          var focusable = core.DomHandler.findSingle(this.container, 'input');
+          var focusable = utils.DomHandler.findSingle(this.container, 'input');
 
           if (focusable && document.activeElement !== focusable && !focusable.hasAttribute('data-isCellEditing')) {
             focusable.setAttribute('data-isCellEditing', true);
@@ -700,7 +1674,7 @@ var TreeTableBodyCell = /*#__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;
       }
     }
@@ -709,7 +1683,7 @@ var TreeTableBodyCell = /*#__PURE__*/function (_Component) {
     value: function render() {
       var _this6 = this;
 
-      var className = core.classNames(this.props.bodyClassName || this.props.className, {
+      var className = utils.classNames(this.props.bodyClassName || this.props.className, {
         'p-editable-column': this.props.editor,
         'p-cell-editing': this.props.editor ? this.state.editing : false
       });
@@ -717,35 +1691,35 @@ var TreeTableBodyCell = /*#__PURE__*/function (_Component) {
       var content;
 
       if (this.state && this.state.editing) {
-        if (this.props.editor) content = core.ObjectUtils.getJSXElement(this.props.editor, {
+        if (this.props.editor) content = utils.ObjectUtils.getJSXElement(this.props.editor, {
           node: this.props.node,
           rowData: this.props.node.data,
-          value: core.ObjectUtils.resolveFieldData(this.props.node.data, this.props.field),
+          value: utils.ObjectUtils.resolveFieldData(this.props.node.data, this.props.field),
           field: this.props.field,
           rowIndex: this.props.rowIndex,
           props: this.props
         });else throw new Error("Editor is not found on column.");
       } else {
-        if (this.props.body) content = core.ObjectUtils.getJSXElement(this.props.body, this.props.node, {
+        if (this.props.body) content = utils.ObjectUtils.getJSXElement(this.props.body, this.props.node, {
           field: this.props.field,
           rowIndex: this.props.rowIndex,
           props: this.props
-        });else content = core.ObjectUtils.resolveFieldData(this.props.node.data, this.props.field);
+        });else content = utils.ObjectUtils.resolveFieldData(this.props.node.data, this.props.field);
       }
       /* eslint-disable */
 
 
-      var editorKeyHelper = this.props.editor && /*#__PURE__*/React__default['default'].createElement("a", {
+      var editorKeyHelper = this.props.editor && /*#__PURE__*/React__default["default"].createElement("a", {
         tabIndex: 0,
         ref: function ref(el) {
           _this6.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 _this6.container = el;
         },
@@ -760,15 +1734,15 @@ var TreeTableBodyCell = /*#__PURE__*/function (_Component) {
   return TreeTableBodyCell;
 }(React.Component);
 
-function _createForOfIteratorHelper$1(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$1(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _createForOfIteratorHelper$2(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$2(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 
-function _unsupportedIterableToArray$1(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$1(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen); }
+function _unsupportedIterableToArray$2(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$2(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$2(o, minLen); }
 
-function _arrayLikeToArray$1(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _arrayLikeToArray$2(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _createSuper$4(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$4(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
@@ -811,7 +1785,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
   }, {
     key: "expand",
     value: function expand(event) {
-      var expandedKeys = this.props.expandedKeys ? _objectSpread$1({}, this.props.expandedKeys) : {};
+      var expandedKeys = this.props.expandedKeys ? _objectSpread$2({}, this.props.expandedKeys) : {};
       expandedKeys[this.props.node.key] = true;
       this.props.onToggle({
         originalEvent: event,
@@ -822,7 +1796,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
   }, {
     key: "collapse",
     value: function collapse(event) {
-      var expandedKeys = _objectSpread$1({}, this.props.expandedKeys);
+      var expandedKeys = _objectSpread$2({}, this.props.expandedKeys);
 
       delete expandedKeys[this.props.node.key];
       this.props.onToggle({
@@ -854,107 +1828,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
     key: "onClick",
     value: function onClick(event) {
       if (this.props.onRowClick) {
-        this.props.onRowClick({
-          originalEvent: event,
-          node: this.props.node
-        });
-      }
-
-      var targetNode = event.target.nodeName;
-
-      if (targetNode === 'INPUT' || targetNode === 'BUTTON' || targetNode === 'A' || core.DomHandler.hasClass(event.target, 'p-clickable') || core.DomHandler.hasClass(event.target, 'p-treetable-toggler') || core.DomHandler.hasClass(event.target.parentElement, 'p-treetable-toggler')) {
-        return;
-      }
-
-      if ((this.isSingleSelectionMode() || this.isMultipleSelectionMode()) && this.props.node.selectable !== false) {
-        var selectionKeys;
-        var selected = this.isSelected();
-        var metaSelection = this.nodeTouched ? false : this.props.metaKeySelection;
-
-        if (metaSelection) {
-          var metaKey = event.metaKey || event.ctrlKey;
-
-          if (selected && metaKey) {
-            if (this.isSingleSelectionMode()) {
-              selectionKeys = null;
-            } else {
-              selectionKeys = _objectSpread$1({}, this.props.selectionKeys);
-              delete selectionKeys[this.props.node.key];
-            }
-
-            if (this.props.onUnselect) {
-              this.props.onUnselect({
-                originalEvent: event,
-                node: this.props.node
-              });
-            }
-          } else {
-            if (this.isSingleSelectionMode()) {
-              selectionKeys = this.props.node.key;
-            } else if (this.isMultipleSelectionMode()) {
-              selectionKeys = !metaKey ? {} : this.props.selectionKeys ? _objectSpread$1({}, this.props.selectionKeys) : {};
-              selectionKeys[this.props.node.key] = true;
-            }
-
-            if (this.props.onSelect) {
-              this.props.onSelect({
-                originalEvent: event,
-                node: this.props.node
-              });
-            }
-          }
-        } else {
-          if (this.isSingleSelectionMode()) {
-            if (selected) {
-              selectionKeys = null;
-
-              if (this.props.onUnselect) {
-                this.props.onUnselect({
-                  originalEvent: event,
-                  node: this.props.node
-                });
-              }
-            } else {
-              selectionKeys = this.props.node.key;
-
-              if (this.props.onSelect) {
-                this.props.onSelect({
-                  originalEvent: event,
-                  node: this.props.node
-                });
-              }
-            }
-          } else {
-            if (selected) {
-              selectionKeys = _objectSpread$1({}, this.props.selectionKeys);
-              delete selectionKeys[this.props.node.key];
-
-              if (this.props.onUnselect) {
-                this.props.onUnselect({
-                  originalEvent: event,
-                  node: this.props.node
-                });
-              }
-            } else {
-              selectionKeys = this.props.selectionKeys ? _objectSpread$1({}, this.props.selectionKeys) : {};
-              selectionKeys[this.props.node.key] = true;
-
-              if (this.props.onSelect) {
-                this.props.onSelect({
-                  originalEvent: event,
-                  node: this.props.node
-                });
-              }
-            }
-          }
-        }
-
-        if (this.props.onSelectionChange) {
-          this.props.onSelectionChange({
-            originalEvent: event,
-            value: selectionKeys
-          });
-        }
+        this.props.onRowClick(event, this.props.node);
       }
 
       this.nodeTouched = false;
@@ -968,7 +1842,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
     key: "onCheckboxChange",
     value: function onCheckboxChange(event) {
       var checked = this.isChecked();
-      var selectionKeys = this.props.selectionKeys ? _objectSpread$1({}, this.props.selectionKeys) : {};
+      var selectionKeys = this.props.selectionKeys ? _objectSpread$2({}, this.props.selectionKeys) : {};
 
       if (checked) {
         if (this.props.propagateSelectionDown) this.propagateDown(this.props.node, false, selectionKeys);else delete selectionKeys[this.props.node.key];
@@ -1015,17 +1889,19 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
         });
       }
 
-      core.DomHandler.clearSelection();
+      utils.DomHandler.clearSelection();
     }
   }, {
     key: "onCheckboxFocus",
     value: function onCheckboxFocus() {
-      core.DomHandler.addClass(this.checkboxBox, 'p-focus');
+      utils.DomHandler.addClass(this.checkboxBox, 'p-focus');
+      utils.DomHandler.addClass(this.checkboxRef, 'p-checkbox-focused');
     }
   }, {
     key: "onCheckboxBlur",
     value: function onCheckboxBlur() {
-      core.DomHandler.removeClass(this.checkboxBox, 'p-focus');
+      utils.DomHandler.removeClass(this.checkboxBox, 'p-focus');
+      utils.DomHandler.removeClass(this.checkboxRef, 'p-checkbox-focused');
     }
   }, {
     key: "propagateUp",
@@ -1035,7 +1911,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
       var checkedChildCount = 0;
       var childPartialSelected = false;
 
-      var _iterator = _createForOfIteratorHelper$1(this.props.node.children),
+      var _iterator = _createForOfIteratorHelper$2(this.props.node.children),
           _step;
 
       try {
@@ -1089,7 +1965,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
   }, {
     key: "onRightClick",
     value: function onRightClick(event) {
-      core.DomHandler.clearSelection();
+      utils.DomHandler.clearSelection();
 
       if (this.props.onContextMenuSelectionChange) {
         this.props.onContextMenuSelectionChange({
@@ -1160,16 +2036,6 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
         }
       }
     }
-  }, {
-    key: "isSingleSelectionMode",
-    value: function isSingleSelectionMode() {
-      return this.props.selectionMode && this.props.selectionMode === 'single';
-    }
-  }, {
-    key: "isMultipleSelectionMode",
-    value: function isMultipleSelectionMode() {
-      return this.props.selectionMode && this.props.selectionMode === 'multiple';
-    }
   }, {
     key: "isExpanded",
     value: function isExpanded() {
@@ -1194,7 +2060,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
     key: "renderToggler",
     value: function renderToggler() {
       var expanded = this.isExpanded();
-      var iconClassName = core.classNames('"p-treetable-toggler-icon pi pi-fw', {
+      var iconClassName = utils.classNames('"p-treetable-toggler-icon pi pi-fw', {
         'pi-chevron-right': !expanded,
         'pi-chevron-down': expanded
       });
@@ -1202,15 +2068,15 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
         marginLeft: this.props.level * 16 + 'px',
         visibility: this.props.node.leaf === false || this.props.node.children && this.props.node.children.length ? 'visible' : 'hidden'
       };
-      return /*#__PURE__*/React__default['default'].createElement("button", {
+      return /*#__PURE__*/React__default["default"].createElement("button", {
         type: "button",
         className: "p-treetable-toggler p-link p-unselectable-text",
         onClick: this.onTogglerClick,
         tabIndex: -1,
         style: style
-      }, /*#__PURE__*/React__default['default'].createElement("i", {
+      }, /*#__PURE__*/React__default["default"].createElement("i", {
         className: iconClassName
-      }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+      }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
     }
   }, {
     key: "renderCheckbox",
@@ -1220,31 +2086,34 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
       if (this.props.selectionMode === 'checkbox' && this.props.node.selectable !== false) {
         var checked = this.isChecked();
         var partialChecked = this.isPartialChecked();
-        var className = core.classNames('p-checkbox-box', {
+        var className = utils.classNames('p-checkbox-box', {
           'p-highlight': checked,
           'p-indeterminate': partialChecked
         });
-        var icon = core.classNames('p-checkbox-icon p-c', {
+        var icon = utils.classNames('p-checkbox-icon p-c', {
           'pi pi-check': checked,
           'pi pi-minus': partialChecked
         });
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-checkbox p-treetable-checkbox p-component",
+          ref: function ref(el) {
+            return _this2.checkboxRef = el;
+          },
           onClick: this.onCheckboxChange,
           role: "checkbox",
           "aria-checked": checked
-        }, /*#__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", {
           type: "checkbox",
           onFocus: this.onCheckboxFocus,
           onBlur: this.onCheckboxBlur
-        })), /*#__PURE__*/React__default['default'].createElement("div", {
+        })), /*#__PURE__*/React__default["default"].createElement("div", {
           className: className,
           ref: function ref(el) {
             return _this2.checkboxBox = el;
           }
-        }, /*#__PURE__*/React__default['default'].createElement("span", {
+        }, /*#__PURE__*/React__default["default"].createElement("span", {
           className: icon
         })));
       } else {
@@ -1261,7 +2130,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
         checkbox = this.renderCheckbox();
       }
 
-      return /*#__PURE__*/React__default['default'].createElement(TreeTableBodyCell, _extends({
+      return /*#__PURE__*/React__default["default"].createElement(TreeTableBodyCell, _extends({
         key: column.props.columnKey || column.props.field
       }, column.props, {
         selectOnEdit: this.props.selectOnEdit,
@@ -1277,7 +2146,7 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
 
       if (this.isExpanded() && this.props.node.children) {
         return this.props.node.children.map(function (childNode, index) {
-          return /*#__PURE__*/React__default['default'].createElement(TreeTableRow, {
+          return /*#__PURE__*/React__default["default"].createElement(TreeTableRow, {
             key: childNode.key || JSON.stringify(childNode.data),
             level: _this3.props.level + 1,
             rowIndex: _this3.props.rowIndex + '_' + index,
@@ -1324,11 +2193,11 @@ var TreeTableRow = /*#__PURE__*/function (_Component) {
 
       if (this.props.rowClassName) {
         var rowClassName = this.props.rowClassName(this.props.node);
-        className = _objectSpread$1(_objectSpread$1({}, className), rowClassName);
+        className = _objectSpread$2(_objectSpread$2({}, className), rowClassName);
       }
 
-      className = core.classNames(className, this.props.node.className);
-      return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("tr", {
+      className = utils.classNames(className, this.props.node.className);
+      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("tr", {
         ref: function ref(el) {
           return _this4.container = el;
         },
@@ -1370,6 +2239,16 @@ _defineProperty(TreeTableRow, "defaultProps", {
   onContextMenu: null
 });
 
+function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _createForOfIteratorHelper$1(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$1(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray$1(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$1(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen); }
+
+function _arrayLikeToArray$1(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
 function _createSuper$3(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$3(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
 function _isNativeReflectConstruct$3() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -1378,16 +2257,20 @@ var TreeTableBody = /*#__PURE__*/function (_Component) {
 
   var _super = _createSuper$3(TreeTableBody);
 
-  function TreeTableBody() {
+  function TreeTableBody(props) {
+    var _this;
+
     _classCallCheck(this, TreeTableBody);
 
-    return _super.apply(this, arguments);
+    _this = _super.call(this, props);
+    _this.onRowClick = _this.onRowClick.bind(_assertThisInitialized(_this));
+    return _this;
   }
 
   _createClass(TreeTableBody, [{
     key: "createRow",
     value: function createRow(node, index) {
-      return /*#__PURE__*/React__default['default'].createElement(TreeTableRow, {
+      return /*#__PURE__*/React__default["default"].createElement(TreeTableRow, {
         key: node.key || JSON.stringify(node.data),
         level: 0,
         rowIndex: index,
@@ -1402,7 +2285,7 @@ var TreeTableBody = /*#__PURE__*/function (_Component) {
         selectionKeys: this.props.selectionKeys,
         onSelectionChange: this.props.onSelectionChange,
         metaKeySelection: this.props.metaKeySelection,
-        onRowClick: this.props.onRowClick,
+        onRowClick: this.onRowClick,
         onSelect: this.props.onSelect,
         onUnselect: this.props.onUnselect,
         propagateSelectionUp: this.props.propagateSelectionUp,
@@ -1413,10 +2296,187 @@ var TreeTableBody = /*#__PURE__*/function (_Component) {
         onContextMenu: this.props.onContextMenu
       });
     }
+  }, {
+    key: "flattenizeTree",
+    value: function flattenizeTree(nodes) {
+      var rows = [];
+      nodes = nodes || this.props.value;
+
+      var _iterator = _createForOfIteratorHelper$1(nodes),
+          _step;
+
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var node = _step.value;
+          rows.push(node.key);
+
+          if (this.isExpandedKey(node.key)) {
+            rows = rows.concat(this.flattenizeTree(node.children));
+          }
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+
+      return rows;
+    }
+  }, {
+    key: "isExpandedKey",
+    value: function isExpandedKey(key) {
+      return this.props.expandedKeys && !!this.props.expandedKeys[key];
+    }
+  }, {
+    key: "onRowClick",
+    value: function onRowClick(event, node) {
+      var _this2 = this;
+
+      if (this.props.onRowClick) {
+        this.props.onRowClick({
+          originalEvent: event,
+          node: node
+        });
+      }
+
+      var targetNode = event.target.nodeName;
+
+      if (targetNode === 'INPUT' || targetNode === 'BUTTON' || targetNode === 'A' || DomHandler.hasClass(event.target, 'p-clickable') || DomHandler.hasClass(event.target, 'p-treetable-toggler') || DomHandler.hasClass(event.target.parentElement, 'p-treetable-toggler')) {
+        return;
+      }
+
+      if ((this.isSingleSelectionMode() || this.isMultipleSelectionMode()) && node.selectable !== false) {
+        var selectionKeys;
+        var selected = this.isSelected(node);
+        var metaSelection = this.nodeTouched ? false : this.props.metaKeySelection;
+        var flatKeys = this.flattenizeTree();
+        var rowIndex = flatKeys.findIndex(function (key) {
+          return key === node.key;
+        });
+
+        if (this.isMultipleSelectionMode() && event.shiftKey) {
+          DomHandler.clearSelection(); // find first selected row
+
+          var anchorRowIndex = flatKeys.findIndex(function (key) {
+            return _this2.props.selectionKeys[key];
+          });
+          var rangeStart = Math.min(rowIndex, anchorRowIndex);
+          var rangeEnd = Math.max(rowIndex, anchorRowIndex);
+          selectionKeys = _objectSpread$1({}, this.props.selectionKeys);
+
+          for (var i = rangeStart; i <= rangeEnd; i++) {
+            var rowKey = flatKeys[i];
+            selectionKeys[rowKey] = true;
+          }
+        } else {
+          this.anchorRowIndex = rowIndex;
+
+          if (metaSelection) {
+            var metaKey = event.metaKey || event.ctrlKey;
+
+            if (selected && metaKey) {
+              if (this.isSingleSelectionMode()) {
+                selectionKeys = null;
+              } else {
+                selectionKeys = _objectSpread$1({}, this.props.selectionKeys);
+                delete selectionKeys[node.key];
+              }
+
+              if (this.props.onUnselect) {
+                this.props.onUnselect({
+                  originalEvent: event,
+                  node: node
+                });
+              }
+            } else {
+              if (this.isSingleSelectionMode()) {
+                selectionKeys = node.key;
+              } else if (this.isMultipleSelectionMode()) {
+                selectionKeys = !metaKey ? {} : this.props.selectionKeys ? _objectSpread$1({}, this.props.selectionKeys) : {};
+                selectionKeys[node.key] = true;
+              }
+
+              if (this.props.onSelect) {
+                this.props.onSelect({
+                  originalEvent: event,
+                  node: node
+                });
+              }
+            }
+          } else {
+            if (this.isSingleSelectionMode()) {
+              if (selected) {
+                selectionKeys = null;
+
+                if (this.props.onUnselect) {
+                  this.props.onUnselect({
+                    originalEvent: event,
+                    node: node
+                  });
+                }
+              } else {
+                selectionKeys = node.key;
+
+                if (this.props.onSelect) {
+                  this.props.onSelect({
+                    originalEvent: event,
+                    node: node
+                  });
+                }
+              }
+            } else {
+              if (selected) {
+                selectionKeys = _objectSpread$1({}, this.props.selectionKeys);
+                delete selectionKeys[node.key];
+
+                if (this.props.onUnselect) {
+                  this.props.onUnselect({
+                    originalEvent: event,
+                    node: node
+                  });
+                }
+              } else {
+                selectionKeys = this.props.selectionKeys ? _objectSpread$1({}, this.props.selectionKeys) : {};
+                selectionKeys[node.key] = true;
+
+                if (this.props.onSelect) {
+                  this.props.onSelect({
+                    originalEvent: event,
+                    node: node
+                  });
+                }
+              }
+            }
+          }
+        }
+
+        if (this.props.onSelectionChange) {
+          this.props.onSelectionChange({
+            originalEvent: event,
+            value: selectionKeys
+          });
+        }
+      }
+    }
+  }, {
+    key: "isSingleSelectionMode",
+    value: function isSingleSelectionMode() {
+      return this.props.selectionMode && this.props.selectionMode === 'single';
+    }
+  }, {
+    key: "isMultipleSelectionMode",
+    value: function isMultipleSelectionMode() {
+      return this.props.selectionMode && this.props.selectionMode === 'multiple';
+    }
+  }, {
+    key: "isSelected",
+    value: function isSelected(node) {
+      if ((this.props.selectionMode === 'single' || this.props.selectionMode === 'multiple') && this.props.selectionKeys) return this.props.selectionMode === 'single' ? this.props.selectionKeys === node.key : this.props.selectionKeys[node.key] !== undefined;else return false;
+    }
   }, {
     key: "renderRows",
     value: function renderRows() {
-      var _this = this;
+      var _this3 = this;
 
       if (this.props.paginator && !this.props.lazy) {
         var rpp = this.props.rows || 0;
@@ -1432,7 +2492,7 @@ var TreeTableBody = /*#__PURE__*/function (_Component) {
         return rows;
       } else {
         return this.props.value.map(function (node, index) {
-          return _this.createRow(node, index);
+          return _this3.createRow(node, index);
         });
       }
     }
@@ -1443,17 +2503,18 @@ var TreeTableBody = /*#__PURE__*/function (_Component) {
         return null;
       } else {
         var colSpan = this.props.columns ? this.props.columns.length : null;
-        return /*#__PURE__*/React__default['default'].createElement("tr", null, /*#__PURE__*/React__default['default'].createElement("td", {
+        var content = this.props.emptyMessage || api.localeOption('emptyMessage');
+        return /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
           className: "p-treetable-emptymessage",
           colSpan: colSpan
-        }, this.props.emptyMessage));
+        }, content));
       }
     }
   }, {
     key: "render",
     value: function render() {
       var content = this.props.value && this.props.value.length ? this.renderRows() : this.renderEmptyMessage();
-      return /*#__PURE__*/React__default['default'].createElement("tbody", {
+      return /*#__PURE__*/React__default["default"].createElement("tbody", {
         className: "p-treetable-tbody"
       }, content);
     }
@@ -1477,7 +2538,7 @@ _defineProperty(TreeTableBody, "defaultProps", {
   propagateSelectionDown: true,
   lazy: false,
   rowClassName: null,
-  emptyMessage: "No records found",
+  emptyMessage: null,
   loading: false,
   onExpand: null,
   onCollapse: null,
@@ -1507,7 +2568,7 @@ var TreeTableFooter = /*#__PURE__*/function (_Component) {
   _createClass(TreeTableFooter, [{
     key: "renderFooterCell",
     value: function renderFooterCell(column, index) {
-      return /*#__PURE__*/React__default['default'].createElement("td", {
+      return /*#__PURE__*/React__default["default"].createElement("td", {
         key: column.field || index,
         className: column.props.footerClassName || column.props.className,
         style: column.props.footerStyle || column.props.style,
@@ -1520,11 +2581,11 @@ var TreeTableFooter = /*#__PURE__*/function (_Component) {
     value: function renderFooterRow(row, index) {
       var _this = this;
 
-      var rowColumns = React__default['default'].Children.toArray(row.props.children);
+      var rowColumns = React__default["default"].Children.toArray(row.props.children);
       var rowFooterCells = rowColumns.map(function (col, index) {
         return _this.renderFooterCell(col, index);
       });
-      return /*#__PURE__*/React__default['default'].createElement("tr", {
+      return /*#__PURE__*/React__default["default"].createElement("tr", {
         key: index
       }, rowFooterCells);
     }
@@ -1533,7 +2594,7 @@ var TreeTableFooter = /*#__PURE__*/function (_Component) {
     value: function renderColumnGroup() {
       var _this2 = this;
 
-      var rows = React__default['default'].Children.toArray(this.props.columnGroup.props.children);
+      var rows = React__default["default"].Children.toArray(this.props.columnGroup.props.children);
       return rows.map(function (row, i) {
         return _this2.renderFooterRow(row, i);
       });
@@ -1547,7 +2608,7 @@ var TreeTableFooter = /*#__PURE__*/function (_Component) {
         var headerCells = columns.map(function (col, index) {
           return _this3.renderFooterCell(col, index);
         });
-        return /*#__PURE__*/React__default['default'].createElement("tr", null, headerCells);
+        return /*#__PURE__*/React__default["default"].createElement("tr", null, headerCells);
       } else {
         return null;
       }
@@ -1573,7 +2634,7 @@ var TreeTableFooter = /*#__PURE__*/function (_Component) {
       var content = this.props.columnGroup ? this.renderColumnGroup() : this.renderColumns(this.props.columns);
 
       if (this.hasFooter()) {
-        return /*#__PURE__*/React__default['default'].createElement("tfoot", {
+        return /*#__PURE__*/React__default["default"].createElement("tfoot", {
           className: "p-treetable-tfoot"
         }, content);
       } else {
@@ -1615,14 +2676,14 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
       this.setScrollHeight();
 
       if (!this.props.frozen) {
-        var scrollBarWidth = core.DomHandler.calculateScrollbarWidth();
+        var scrollBarWidth = utils.DomHandler.calculateScrollbarWidth();
         this.scrollHeaderBox.style.marginRight = scrollBarWidth + 'px';
 
         if (this.scrollFooterBox) {
           this.scrollFooterBox.style.marginRight = scrollBarWidth + 'px';
         }
       } else {
-        this.scrollBody.style.paddingBottom = core.DomHandler.calculateScrollbarWidth() + 'px';
+        this.scrollBody.style.paddingBottom = utils.DomHandler.calculateScrollbarWidth() + 'px';
       }
     }
   }, {
@@ -1639,8 +2700,8 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
           this.scrollBody.style.visibility = 'hidden';
           this.scrollBody.style.height = '100px'; //temporary height to calculate static height
 
-          var containerHeight = core.DomHandler.getOuterHeight(datatableContainer);
-          var relativeHeight = core.DomHandler.getOuterHeight(datatableContainer.parentElement) * parseInt(this.props.scrollHeight, 10) / 100;
+          var containerHeight = utils.DomHandler.getOuterHeight(datatableContainer);
+          var relativeHeight = utils.DomHandler.getOuterHeight(datatableContainer.parentElement) * parseInt(this.props.scrollHeight, 10) / 100;
           var staticHeight = containerHeight - 100; //total height of headers, footers, paginators
 
           var scrollBodyHeight = relativeHeight - staticHeight;
@@ -1658,7 +2719,7 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
       if (element) {
         var el = element;
 
-        while (el && !core.DomHandler.hasClass(el, 'p-treetable')) {
+        while (el && !utils.DomHandler.hasClass(el, 'p-treetable')) {
           el = el.parentElement;
         }
 
@@ -1679,7 +2740,7 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
       var frozenScrollBody;
 
       if (frozenView) {
-        frozenScrollBody = core.DomHandler.findSingle(frozenView, '.p-treetable-scrollable-body');
+        frozenScrollBody = utils.DomHandler.findSingle(frozenView, '.p-treetable-scrollable-body');
       }
 
       this.scrollHeaderBox.style.marginLeft = -1 * this.scrollBody.scrollLeft + 'px';
@@ -1695,20 +2756,20 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
   }, {
     key: "calculateRowHeight",
     value: function calculateRowHeight() {
-      var row = core.DomHandler.findSingle(this.scrollTable, 'tr:not(.p-treetable-emptymessage-row)');
+      var row = utils.DomHandler.findSingle(this.scrollTable, 'tr:not(.p-treetable-emptymessage-row)');
 
       if (row) {
-        this.rowHeight = core.DomHandler.getOuterHeight(row);
+        this.rowHeight = utils.DomHandler.getOuterHeight(row);
       }
     }
   }, {
     key: "renderColGroup",
     value: function renderColGroup() {
       if (this.props.columns && this.props.columns.length) {
-        return /*#__PURE__*/React__default['default'].createElement("colgroup", {
+        return /*#__PURE__*/React__default["default"].createElement("colgroup", {
           className: "p-treetable-scrollable-colgroup"
         }, this.props.columns.map(function (col, i) {
-          return /*#__PURE__*/React__default['default'].createElement("col", {
+          return /*#__PURE__*/React__default["default"].createElement("col", {
             key: col.field + '_' + i
           });
         }));
@@ -1721,7 +2782,7 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
     value: function render() {
       var _this2 = this;
 
-      var className = core.classNames('p-treetable-scrollable-view', {
+      var className = utils.classNames('p-treetable-scrollable-view', {
         'p-treetable-frozen-view': this.props.frozen,
         'p-treetable-unfrozen-view': !this.props.frozen && this.props.frozenWidth
       });
@@ -1731,7 +2792,7 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
       var scrollableBodyStyle = !this.props.frozen && this.props.scrollHeight ? {
         overflowY: 'scroll'
       } : null;
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: className,
         style: {
           width: width,
@@ -1740,27 +2801,27 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
         ref: function ref(el) {
           _this2.container = el;
         }
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-scrollable-header",
         ref: function ref(el) {
           _this2.scrollHeader = el;
         },
         onScroll: this.onHeaderScroll
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-scrollable-header-box",
         ref: function ref(el) {
           _this2.scrollHeaderBox = el;
         }
-      }, /*#__PURE__*/React__default['default'].createElement("table", {
+      }, /*#__PURE__*/React__default["default"].createElement("table", {
         className: "p-treetable-scrollable-header-table"
-      }, colGroup, this.props.header))), /*#__PURE__*/React__default['default'].createElement("div", {
+      }, colGroup, this.props.header))), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-scrollable-body",
         ref: function ref(el) {
           _this2.scrollBody = el;
         },
         style: scrollableBodyStyle,
         onScroll: this.onBodyScroll
-      }, /*#__PURE__*/React__default['default'].createElement("table", {
+      }, /*#__PURE__*/React__default["default"].createElement("table", {
         ref: function ref(el) {
           _this2.scrollTable = el;
         },
@@ -1768,17 +2829,17 @@ var TreeTableScrollableView = /*#__PURE__*/function (_Component) {
           top: '0'
         },
         className: "p-treetable-scrollable-body-table"
-      }, colGroup, this.props.body)), /*#__PURE__*/React__default['default'].createElement("div", {
+      }, colGroup, this.props.body)), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-scrollable-footer",
         ref: function ref(el) {
           _this2.scrollFooter = el;
         }
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-scrollable-footer-box",
         ref: function ref(el) {
           _this2.scrollFooterBox = el;
         }
-      }, /*#__PURE__*/React__default['default'].createElement("table", {
+      }, /*#__PURE__*/React__default["default"].createElement("table", {
         className: "p-treetable-scrollable-footer-table"
       }, colGroup, this.props.footer))));
     }
@@ -1797,15 +2858,15 @@ _defineProperty(TreeTableScrollableView, "defaultProps", {
   frozenBody: null
 });
 
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
@@ -1997,8 +3058,8 @@ var TreeTable = /*#__PURE__*/function (_Component) {
         value.sort(function (node1, node2) {
           var sortField = _this2.getSortField();
 
-          var value1 = core.ObjectUtils.resolveFieldData(node1.data, sortField);
-          var value2 = core.ObjectUtils.resolveFieldData(node2.data, sortField);
+          var value1 = utils.ObjectUtils.resolveFieldData(node1.data, sortField);
+          var value2 = utils.ObjectUtils.resolveFieldData(node2.data, sortField);
           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
@@ -2043,8 +3104,8 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "multisortField",
     value: function multisortField(node1, node2, multiSortMeta, index) {
-      var value1 = core.ObjectUtils.resolveFieldData(node1.data, multiSortMeta[index].field);
-      var value2 = core.ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].field);
+      var value1 = utils.ObjectUtils.resolveFieldData(node1.data, multiSortMeta[index].field);
+      var value2 = utils.ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].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 (value1 === value2) {
@@ -2105,7 +3166,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "onColumnResizeStart",
     value: function onColumnResizeStart(event) {
-      var containerLeft = core.DomHandler.getOffset(this.container).left;
+      var containerLeft = utils.DomHandler.getOffset(this.container).left;
       this.resizeColumn = event.columnEl;
       this.resizeColumnProps = event.column;
       this.columnResizing = true;
@@ -2115,8 +3176,8 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "onColumnResize",
     value: function onColumnResize(event) {
-      var containerLeft = core.DomHandler.getOffset(this.container).left;
-      core.DomHandler.addClass(this.container, 'p-unselectable-text');
+      var containerLeft = utils.DomHandler.getOffset(this.container).left;
+      utils.DomHandler.addClass(this.container, 'p-unselectable-text');
       this.resizerHelper.style.height = this.container.offsetHeight + 'px';
       this.resizerHelper.style.top = 0 + 'px';
       this.resizerHelper.style.left = event.pageX - containerLeft + this.container.scrollLeft + 'px';
@@ -2138,10 +3199,10 @@ var TreeTable = /*#__PURE__*/function (_Component) {
           if (newColumnWidth > 15 && nextColumnWidth > 15) {
             if (this.props.scrollable) {
               var scrollableView = this.findParentScrollableView(this.resizeColumn);
-              var scrollableBodyTable = core.DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-body-table');
-              var scrollableHeaderTable = core.DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-header-table');
-              var scrollableFooterTable = core.DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-footer-table');
-              var resizeColumnIndex = core.DomHandler.index(this.resizeColumn);
+              var scrollableBodyTable = utils.DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-body-table');
+              var scrollableHeaderTable = utils.DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-header-table');
+              var scrollableFooterTable = utils.DomHandler.findSingle(scrollableView, 'table.p-treetable-scrollable-footer-table');
+              var resizeColumnIndex = utils.DomHandler.index(this.resizeColumn);
               this.resizeColGroup(scrollableHeaderTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
               this.resizeColGroup(scrollableBodyTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
               this.resizeColGroup(scrollableFooterTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
@@ -2157,11 +3218,11 @@ var TreeTable = /*#__PURE__*/function (_Component) {
           if (this.props.scrollable) {
             var _scrollableView = this.findParentScrollableView(this.resizeColumn);
 
-            var _scrollableBodyTable = core.DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-body-table');
+            var _scrollableBodyTable = utils.DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-body-table');
 
-            var _scrollableHeaderTable = core.DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-header-table');
+            var _scrollableHeaderTable = utils.DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-header-table');
 
-            var _scrollableFooterTable = core.DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-footer-table');
+            var _scrollableFooterTable = utils.DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-footer-table');
 
             _scrollableBodyTable.style.width = _scrollableBodyTable.offsetWidth + delta + 'px';
             _scrollableHeaderTable.style.width = _scrollableHeaderTable.offsetWidth + delta + 'px';
@@ -2170,7 +3231,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
               _scrollableFooterTable.style.width = _scrollableHeaderTable.offsetWidth + delta + 'px';
             }
 
-            var _resizeColumnIndex = core.DomHandler.index(this.resizeColumn);
+            var _resizeColumnIndex = utils.DomHandler.index(this.resizeColumn);
 
             this.resizeColGroup(_scrollableHeaderTable, _resizeColumnIndex, newColumnWidth, null);
             this.resizeColGroup(_scrollableBodyTable, _resizeColumnIndex, newColumnWidth, null);
@@ -2193,7 +3254,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       this.resizerHelper.style.display = 'none';
       this.resizeColumn = null;
       this.resizeColumnProps = null;
-      core.DomHandler.removeClass(this.container, 'p-unselectable-text');
+      utils.DomHandler.removeClass(this.container, 'p-unselectable-text');
       this.unbindColumnResizeEvents();
     }
   }, {
@@ -2202,7 +3263,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       if (column) {
         var parent = column.parentElement;
 
-        while (parent && !core.DomHandler.hasClass(parent, 'p-treetable-scrollable-view')) {
+        while (parent && !utils.DomHandler.hasClass(parent, 'p-treetable-scrollable-view')) {
           parent = parent.parentElement;
         }
 
@@ -2265,8 +3326,8 @@ var TreeTable = /*#__PURE__*/function (_Component) {
         return;
       }
 
-      this.iconWidth = core.DomHandler.getHiddenElementOuterWidth(this.reorderIndicatorUp);
-      this.iconHeight = core.DomHandler.getHiddenElementOuterHeight(this.reorderIndicatorUp);
+      this.iconWidth = utils.DomHandler.getHiddenElementOuterWidth(this.reorderIndicatorUp);
+      this.iconHeight = utils.DomHandler.getHiddenElementOuterHeight(this.reorderIndicatorUp);
       this.draggedColumnEl = this.findParentHeader(event.currentTarget);
       this.draggedColumn = column;
       event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
@@ -2279,8 +3340,8 @@ var TreeTable = /*#__PURE__*/function (_Component) {
 
       if (this.props.reorderableColumns && this.draggedColumnEl && dropHeader) {
         event.preventDefault();
-        var containerOffset = core.DomHandler.getOffset(this.container);
-        var dropHeaderOffset = core.DomHandler.getOffset(dropHeader);
+        var containerOffset = utils.DomHandler.getOffset(this.container);
+        var dropHeaderOffset = utils.DomHandler.getOffset(dropHeader);
 
         if (this.draggedColumnEl !== dropHeader) {
           var targetLeft = dropHeaderOffset.left - containerOffset.left; //let targetTop =  containerOffset.top - dropHeaderOffset.top;
@@ -2325,8 +3386,8 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       event.preventDefault();
 
       if (this.draggedColumnEl) {
-        var dragIndex = core.DomHandler.index(this.draggedColumnEl);
-        var dropIndex = core.DomHandler.index(this.findParentHeader(event.currentTarget));
+        var dragIndex = utils.DomHandler.index(this.draggedColumnEl);
+        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)) {
@@ -2334,10 +3395,10 @@ var TreeTable = /*#__PURE__*/function (_Component) {
         }
 
         if (allowDrop) {
-          var columns = this.state.columnOrder ? this.getColumns() : React__default['default'].Children.toArray(this.props.children);
+          var columns = this.state.columnOrder ? this.getColumns() : React__default["default"].Children.toArray(this.props.children);
 
           var isSameColumn = function isSameColumn(col1, col2) {
-            return col1.props.columnKey || col2.props.columnKey ? core.ObjectUtils.equals(col1, col2, 'props.columnKey') : core.ObjectUtils.equals(col1, col2, 'props.field');
+            return col1.props.columnKey || col2.props.columnKey ? utils.ObjectUtils.equals(col1, col2, 'props.columnKey') : utils.ObjectUtils.equals(col1, col2, 'props.field');
           };
 
           var dragColIndex = columns.findIndex(function (child) {
@@ -2355,7 +3416,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
             dropColIndex--;
           }
 
-          core.ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
+          utils.ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
           var columnOrder = [];
 
           var _iterator = _createForOfIteratorHelper(columns),
@@ -2461,7 +3522,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "getColumns",
     value: function getColumns() {
-      var columns = React__default['default'].Children.toArray(this.props.children);
+      var columns = React__default["default"].Children.toArray(this.props.children);
 
       if (columns && columns.length) {
         if (this.props.reorderableColumns && this.state.columnOrder) {
@@ -2570,7 +3631,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
     value: function filterLocal(value) {
       var filteredNodes = [];
       var filters = this.getFilters();
-      var columns = React__default['default'].Children.toArray(this.props.children);
+      var columns = React__default["default"].Children.toArray(this.props.children);
       var isStrictMode = this.props.filterMode === 'strict';
 
       var _iterator5 = _createForOfIteratorHelper(value),
@@ -2709,7 +3770,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
           isStrictMode = _ref.isStrictMode,
           options = _ref.options;
       var matched = false;
-      var dataFieldValue = core.ObjectUtils.resolveFieldData(node.data, filterField);
+      var dataFieldValue = utils.ObjectUtils.resolveFieldData(node.data, filterField);
 
       if (filterConstraint(dataFieldValue, filterValue, this.props.filterLocale, options)) {
         matched = true;
@@ -2755,7 +3816,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "createTableHeader",
     value: function createTableHeader(columns, columnGroup) {
-      return /*#__PURE__*/React__default['default'].createElement(TreeTableHeader, {
+      return /*#__PURE__*/React__default["default"].createElement(TreeTableHeader, {
         columns: columns,
         columnGroup: columnGroup,
         tabIndex: this.props.tabIndex,
@@ -2778,7 +3839,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "createTableFooter",
     value: function createTableFooter(columns, columnGroup) {
-      return /*#__PURE__*/React__default['default'].createElement(TreeTableFooter, {
+      return /*#__PURE__*/React__default["default"].createElement(TreeTableFooter, {
         columns: columns,
         columnGroup: columnGroup
       });
@@ -2786,7 +3847,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "createTableBody",
     value: function createTableBody(value, columns) {
-      return /*#__PURE__*/React__default['default'].createElement(TreeTableBody, {
+      return /*#__PURE__*/React__default["default"].createElement(TreeTableBody, {
         value: value,
         columns: columns,
         expandedKeys: this.getExpandedKeys(),
@@ -2818,8 +3879,8 @@ var TreeTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "createPaginator",
     value: function createPaginator(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,
@@ -2841,7 +3902,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       var header = this.createTableHeader(columns, headerColumnGroup);
       var footer = this.createTableFooter(columns, footerColumnGroup);
       var body = this.createTableBody(value, columns);
-      return /*#__PURE__*/React__default['default'].createElement(TreeTableScrollableView, {
+      return /*#__PURE__*/React__default["default"].createElement(TreeTableScrollableView, {
         columns: columns,
         header: header,
         body: body,
@@ -2864,7 +3925,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       }
 
       scrollableView = this.createScrollableView(value, scrollableColumns, false, this.props.headerColumnGroup, this.props.footerColumnGroup);
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-scrollable-wrapper"
       }, frozenView, scrollableView);
     }
@@ -2877,9 +3938,9 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       var header = this.createTableHeader(columns, this.props.headerColumnGroup);
       var footer = this.createTableFooter(columns, this.props.footerColumnGroup);
       var body = this.createTableBody(value, columns);
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-wrapper"
-      }, /*#__PURE__*/React__default['default'].createElement("table", {
+      }, /*#__PURE__*/React__default["default"].createElement("table", {
         style: this.props.tableStyle,
         className: this.props.tableClassName,
         ref: function ref(el) {
@@ -2896,12 +3957,12 @@ var TreeTable = /*#__PURE__*/function (_Component) {
     key: "renderLoader",
     value: function renderLoader() {
       if (this.props.loading) {
-        var iconClassName = core.classNames('p-treetable-loading-icon pi-spin', this.props.loadingIcon);
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        var iconClassName = utils.classNames('p-treetable-loading-icon pi-spin', this.props.loadingIcon);
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-treetable-loading"
-        }, /*#__PURE__*/React__default['default'].createElement("div", {
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-treetable-loading-overlay p-component-overlay"
-        }, /*#__PURE__*/React__default['default'].createElement("i", {
+        }, /*#__PURE__*/React__default["default"].createElement("i", {
           className: iconClassName
         })));
       }
@@ -2914,8 +3975,9 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       var _this7 = this;
 
       var value = this.processValue();
-      var className = core.classNames('p-treetable p-component', {
-        'p-treetable-hoverable-rows': this.isRowSelectionMode(),
+      var className = utils.classNames('p-treetable p-component', {
+        'p-treetable-hoverable-rows': this.props.rowHover,
+        'p-treetable-selectable': this.isRowSelectionMode(),
         'p-treetable-resizable': this.props.resizableColumns,
         'p-treetable-resizable-fit': this.props.resizableColumns && this.props.columnResizeMode === 'fit',
         'p-treetable-auto-layout': this.props.autoLayout,
@@ -2924,16 +3986,16 @@ var TreeTable = /*#__PURE__*/function (_Component) {
       }, this.props.className);
       var table = this.renderTable(value);
       var totalRecords = this.getTotalRecords(value);
-      var headerFacet = this.props.header && /*#__PURE__*/React__default['default'].createElement("div", {
+      var headerFacet = this.props.header && /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-header"
       }, this.props.header);
-      var footerFacet = this.props.footer && /*#__PURE__*/React__default['default'].createElement("div", {
+      var footerFacet = this.props.footer && /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-treetable-footer"
       }, this.props.footer);
       var paginatorTop = this.props.paginator && this.props.paginatorPosition !== 'bottom' && this.createPaginator('top', totalRecords);
       var paginatorBottom = this.props.paginator && this.props.paginatorPosition !== 'top' && this.createPaginator('bottom', totalRecords);
       var loader = this.renderLoader();
-      var resizeHelper = this.props.resizableColumns && /*#__PURE__*/React__default['default'].createElement("div", {
+      var resizeHelper = this.props.resizableColumns && /*#__PURE__*/React__default["default"].createElement("div", {
         ref: function ref(el) {
           _this7.resizerHelper = el;
         },
@@ -2942,7 +4004,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
           display: 'none'
         }
       });
-      var reorderIndicatorUp = this.props.reorderableColumns && /*#__PURE__*/React__default['default'].createElement("span", {
+      var reorderIndicatorUp = this.props.reorderableColumns && /*#__PURE__*/React__default["default"].createElement("span", {
         ref: function ref(el) {
           return _this7.reorderIndicatorUp = el;
         },
@@ -2952,7 +4014,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
           display: 'none'
         }
       });
-      var reorderIndicatorDown = this.props.reorderableColumns && /*#__PURE__*/React__default['default'].createElement("span", {
+      var reorderIndicatorDown = this.props.reorderableColumns && /*#__PURE__*/React__default["default"].createElement("span", {
         ref: function ref(el) {
           return _this7.reorderIndicatorDown = el;
         },
@@ -2962,7 +4024,7 @@ var TreeTable = /*#__PURE__*/function (_Component) {
           display: 'none'
         }
       });
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         id: this.props.id,
         className: className,
         style: this.props.style,
@@ -3030,12 +4092,13 @@ _defineProperty(TreeTable, "defaultProps", {
   frozenWidth: null,
   resizableColumns: false,
   columnResizeMode: 'fit',
-  emptyMessage: "No records found",
+  emptyMessage: null,
   filters: null,
   globalFilter: null,
   filterMode: 'lenient',
   filterDelay: 300,
   filterLocale: undefined,
+  rowHover: false,
   showGridlines: false,
   stripedRows: false,
   onFilter: null,