primereact 8.7.2 → 9.0.0-beta.1

package/treetable/treetable.esm.js

@@ -12,20 +12,45 @@ function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
-
       for (var key in source) {
         if (Object.prototype.hasOwnProperty.call(source, key)) {
           target[key] = source[key];
         }
       }
     }
-
     return target;
   };
   return _extends.apply(this, arguments);
 }
 
+function _typeof(obj) {
+  "@babel/helpers - typeof";
+
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
+}
+
+function _toPrimitive(input, hint) {
+  if (_typeof(input) !== "object" || input === null) return input;
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (_typeof(res) !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
+}
+
+function _toPropertyKey(arg) {
+  var key = _toPrimitive(arg, "string");
+  return _typeof(key) === "symbol" ? key : String(key);
+}
+
 function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
   if (key in obj) {
     Object.defineProperty(obj, key, {
       value: value,
@@ -36,17 +61,14 @@ function _defineProperty(obj, key, value) {
   } else {
     obj[key] = value;
   }
-
   return obj;
 }
 
 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;
 }
 
@@ -80,33 +102,33 @@ function _arrayWithHoles(arr) {
 }
 
 function _iterableToArrayLimit(arr, i) {
-  var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-
-  if (_i == null) return;
-  var _arr = [];
-  var _n = true;
-  var _d = false;
-
-  var _s, _e;
-
-  try {
-    for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
-      _arr.push(_s.value);
-
-      if (i && _arr.length === i) break;
-    }
-  } catch (err) {
-    _d = true;
-    _e = err;
-  } finally {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
     try {
-      if (!_n && _i["return"] != null) _i["return"]();
+      if (_x = (_i = _i.call(arr)).next, 0 === i) {
+        if (Object(_i) !== _i) return;
+        _n = !1;
+      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {
+        ;
+      }
+    } catch (err) {
+      _d = !0, _e = err;
     } finally {
-      if (_d) throw _e;
+      try {
+        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
     }
+    return _arr;
   }
-
-  return _arr;
 }
 
 function _nonIterableRest() {
@@ -117,83 +139,67 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$4(arr, i) || _nonIterableRest();
 }
 
-function _readOnlyError(name) {
-  throw new TypeError("\"" + name + "\" is read-only");
-}
-
 var TreeTableBodyCell = function TreeTableBodyCell(props) {
   var _React$useState = React.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      editingState = _React$useState2[0],
-      setEditingState = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    editingState = _React$useState2[0],
+    setEditingState = _React$useState2[1];
   var elementRef = React.useRef(null);
   var keyHelperRef = React.useRef(null);
   var selfClick = React.useRef(false);
   var overlayEventListener = React.useRef(null);
   var tabIndexTimeout = React.useRef(null);
-
   var _useEventListener = useEventListener({
-    type: 'click',
-    listener: function listener(e) {
-      if (!selfClick.current && isOutsideClicked(e.target)) {
-        switchCellToViewMode(e);
+      type: 'click',
+      listener: function listener(e) {
+        if (!selfClick.current && isOutsideClicked(e.target)) {
+          switchCellToViewMode(e);
+        }
+        selfClick.current = false;
       }
-
-      selfClick.current = false;
-    }
-  }),
-      _useEventListener2 = _slicedToArray(_useEventListener, 2),
-      bindDocumentClickListener = _useEventListener2[0],
-      unbindDocumentClickListener = _useEventListener2[1];
-
+    }),
+    _useEventListener2 = _slicedToArray(_useEventListener, 2),
+    bindDocumentClickListener = _useEventListener2[0],
+    unbindDocumentClickListener = _useEventListener2[1];
   var onClick = function onClick() {
     if (props.editor && !editingState && (props.selectOnEdit || !props.selectOnEdit && props.selected)) {
       selfClick.current = true;
       setEditingState(true);
       bindDocumentClickListener();
-
       overlayEventListener.current = function (e) {
         if (!isOutsideClicked(e.target)) {
           selfClick.current = true;
         }
       };
-
       OverlayService.on('overlay-click', overlayEventListener.current);
     }
   };
-
   var onKeyDown = function onKeyDown(event) {
     if (event.which === 13 || event.which === 9) {
       switchCellToViewMode(event);
     }
   };
-
   var isOutsideClicked = function isOutsideClicked(target) {
     return elementRef.current && !(elementRef.current.isSameNode(target) || elementRef.current.contains(target));
   };
-
   var closeCell = function closeCell() {
     /* When using the 'tab' key, the focus event of the next cell is not called in IE. */
     setTimeout(function () {
       setEditingState(false);
       unbindDocumentClickListener();
       OverlayService.off('overlay-click', overlayEventListener.current);
-      _readOnlyError("overlayEventListener");
+      overlayEventListener.current = null;
     }, 1);
   };
-
   var onEditorFocus = function onEditorFocus(event) {
     onClick();
   };
-
   var switchCellToViewMode = function switchCellToViewMode(event) {
     if (props.cellEditValidator) {
       var valid = props.cellEditValidator({
         originalEvent: event,
         columnProps: props
       });
-
       if (valid) {
         closeCell();
       }
@@ -201,19 +207,15 @@ var TreeTableBodyCell = function TreeTableBodyCell(props) {
       closeCell();
     }
   };
-
   React.useEffect(function () {
     if (elementRef.current && props.editor) {
       clearTimeout(tabIndexTimeout.current);
-
       if (editingState) {
         var focusable = DomHandler.findSingle(elementRef.current, 'input');
-
         if (focusable && document.activeElement !== focusable && !focusable.hasAttribute('data-isCellEditing')) {
           focusable.setAttribute('data-isCellEditing', true);
           focusable.focus();
         }
-
         keyHelperRef.current.tabIndex = -1;
       } else {
         tabIndexTimeout.current = setTimeout(function () {
@@ -241,7 +243,6 @@ var TreeTableBodyCell = function TreeTableBodyCell(props) {
   });
   var style = props.bodyStyle || props.style;
   var content;
-
   if (editingState) {
     if (props.editor) content = ObjectUtils.getJSXElement(props.editor, {
       node: props.node,
@@ -258,9 +259,8 @@ var TreeTableBodyCell = function TreeTableBodyCell(props) {
       props: props
     });else content = ObjectUtils.resolveFieldData(props.node.data, props.field);
   }
-  /* eslint-disable */
-
 
+  /* eslint-disable */
   var editorKeyHelper = props.editor && /*#__PURE__*/React.createElement("a", {
     tabIndex: 0,
     ref: keyHelperRef,
@@ -280,13 +280,9 @@ var TreeTableBodyCell = function TreeTableBodyCell(props) {
 TreeTableBodyCell.displayName = 'TreeTableBodyCell';
 
 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; }
-
 function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
   var elementRef = React.useRef(null);
@@ -294,13 +290,11 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
   var checkboxBoxRef = React.useRef(null);
   var nodeTouched = React.useRef(false);
   var expanded = props.expandedKeys ? props.expandedKeys[props.node.key] !== undefined : false;
-
   var onTogglerClick = function onTogglerClick(event) {
     expanded ? collapse(event) : expand(event);
     event.preventDefault();
     event.stopPropagation();
   };
-
   var expand = function expand(event) {
     var expandedKeys = props.expandedKeys ? _objectSpread$2({}, props.expandedKeys) : {};
     expandedKeys[props.node.key] = true;
@@ -310,10 +304,8 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
     });
     invokeToggleEvents(event, true);
   };
-
   var collapse = function collapse(event) {
     var expandedKeys = _objectSpread$2({}, props.expandedKeys);
-
     delete expandedKeys[props.node.key];
     props.onToggle({
       originalEvent: event,
@@ -321,7 +313,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
     });
     invokeToggleEvents(event, false);
   };
-
   var invokeToggleEvents = function invokeToggleEvents(event, expanded) {
     if (expanded) {
       if (props.onExpand) {
@@ -339,26 +330,20 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       }
     }
   };
-
   var onClick = function onClick(event) {
     if (props.onRowClick) {
       props.onRowClick(event, props.node);
     }
-
     nodeTouched.current = false;
   };
-
   var onTouchEnd = function onTouchEnd() {
     nodeTouched.current = true;
   };
-
   var onCheckboxChange = function onCheckboxChange(event) {
     var checked = isChecked();
     var selectionKeys = props.selectionKeys ? _objectSpread$2({}, props.selectionKeys) : {};
-
     if (checked) {
       if (props.propagateSelectionDown) propagateDown(props.node, false, selectionKeys);else delete selectionKeys[props.node.key];
-
       if (props.propagateSelectionUp && props.onPropagateUp) {
         props.onPropagateUp({
           originalEvent: event,
@@ -366,7 +351,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
           selectionKeys: selectionKeys
         });
       }
-
       if (props.onUnselect) {
         props.onUnselect({
           originalEvent: event,
@@ -377,7 +361,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       if (props.propagateSelectionDown) propagateDown(props.node, true, selectionKeys);else selectionKeys[props.node.key] = {
         checked: true
       };
-
       if (props.propagateSelectionUp && props.onPropagateUp) {
         props.onPropagateUp({
           originalEvent: event,
@@ -385,7 +368,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
           selectionKeys: selectionKeys
         });
       }
-
       if (props.onSelect) {
         props.onSelect({
           originalEvent: event,
@@ -393,36 +375,29 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
         });
       }
     }
-
     if (props.onSelectionChange) {
       props.onSelectionChange({
         originalEvent: event,
         value: selectionKeys
       });
     }
-
     DomHandler.clearSelection();
   };
-
   var onCheckboxFocus = function onCheckboxFocus() {
     DomHandler.addClass(checkboxBoxRef.current, 'p-focus');
     DomHandler.addClass(checkboxRef.current, 'p-checkbox-focused');
   };
-
   var onCheckboxBlur = function onCheckboxBlur() {
     DomHandler.removeClass(checkboxBoxRef.current, 'p-focus');
     DomHandler.removeClass(checkboxRef.current, 'p-checkbox-focused');
   };
-
   var propagateUp = function propagateUp(event) {
     var check = event.check;
     var selectionKeys = event.selectionKeys;
     var checkedChildCount = 0;
     var childPartialSelected = false;
-
     var _iterator = _createForOfIteratorHelper$3(props.node.children),
-        _step;
-
+      _step;
     try {
       for (_iterator.s(); !(_step = _iterator.n()).done;) {
         var child = _step.value;
@@ -433,7 +408,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
     } finally {
       _iterator.f();
     }
-
     if (check && checkedChildCount === props.node.children.length) {
       selectionKeys[props.node.key] = {
         checked: true,
@@ -443,7 +417,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       if (!check) {
         delete selectionKeys[props.node.key];
       }
-
       if (childPartialSelected || checkedChildCount > 0 && checkedChildCount !== props.node.children.length) selectionKeys[props.node.key] = {
         checked: false,
         partialChecked: true
@@ -452,35 +425,29 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
         partialChecked: false
       };
     }
-
     if (props.propagateSelectionUp && props.onPropagateUp) {
       props.onPropagateUp(event);
     }
   };
-
   var propagateDown = function propagateDown(node, check, selectionKeys) {
     if (check) selectionKeys[node.key] = {
       checked: true,
       partialChecked: false
     };else delete selectionKeys[node.key];
-
     if (node.children && node.children.length) {
       for (var i = 0; i < node.children.length; i++) {
         propagateDown(node.children[i], check, selectionKeys);
       }
     }
   };
-
   var onRightClick = function onRightClick(event) {
     DomHandler.clearSelection();
-
     if (props.onContextMenuSelectionChange) {
       props.onContextMenuSelectionChange({
         originalEvent: event,
         value: props.node.key
       });
     }
-
     if (props.onContextMenu) {
       props.onContextMenu({
         originalEvent: event,
@@ -488,53 +455,45 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       });
     }
   };
-
   var onKeyDown = function onKeyDown(event) {
     if (event.target === elementRef.current) {
       var rowElement = event.currentTarget;
-
       switch (event.which) {
         //down arrow
         case 40:
           var nextRow = rowElement.nextElementSibling;
-
           if (nextRow) {
             nextRow.focus();
           }
-
           event.preventDefault();
           break;
-        //up arrow
 
+        //up arrow
         case 38:
           var previousRow = rowElement.previousElementSibling;
-
           if (previousRow) {
             previousRow.focus();
           }
-
           event.preventDefault();
           break;
-        //right arrow
 
+        //right arrow
         case 39:
           if (!expanded) {
             expand(event);
           }
-
           event.preventDefault();
           break;
-        //left arrow
 
+        //left arrow
         case 37:
           if (expanded) {
             collapse(event);
           }
-
           event.preventDefault();
           break;
-        //enter
 
+        //enter
         case 13:
           onClick(event);
           event.preventDefault();
@@ -542,19 +501,15 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       }
     }
   };
-
   var isSelected = function isSelected() {
     if ((props.selectionMode === 'single' || props.selectionMode === 'multiple') && props.selectionKeys) return props.selectionMode === 'single' ? props.selectionKeys === props.node.key : props.selectionKeys[props.node.key] !== undefined;else return false;
   };
-
   var isChecked = function isChecked() {
     return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].checked : false;
   };
-
   var isPartialChecked = function isPartialChecked() {
     return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].partialChecked : false;
   };
-
   var createToggler = function createToggler() {
     var label = expanded ? ariaLabel('collapseLabel') : ariaLabel('expandLabel');
     var iconClassName = classNames('p-treetable-toggler-icon pi pi-fw', {
@@ -577,17 +532,14 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       "aria-hidden": "true"
     }), /*#__PURE__*/React.createElement(Ripple, null));
   };
-
   var createCheckbox = function createCheckbox() {
     if (props.selectionMode === 'checkbox' && props.node.selectable !== false) {
       var checked = isChecked();
       var partialChecked = isPartialChecked();
-
       var _className = classNames('p-checkbox-box', {
         'p-highlight': checked,
         'p-indeterminate': partialChecked
       });
-
       var icon = classNames('p-checkbox-icon p-c', {
         'pi pi-check': checked,
         'pi pi-minus': partialChecked
@@ -614,15 +566,12 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var createCell = function createCell(column) {
     var toggler, checkbox;
-
     if (column.props.expander) {
       toggler = createToggler();
       checkbox = createCheckbox();
     }
-
     return /*#__PURE__*/React.createElement(TreeTableBodyCell, _extends({
       key: column.props.columnKey || column.props.field
     }, column.props, {
@@ -633,7 +582,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       rowIndex: props.rowIndex
     }), toggler, checkbox);
   };
-
   var createChildren = function createChildren() {
     if (expanded && props.node.children) {
       return props.node.children.map(function (childNode, index) {
@@ -668,19 +616,16 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var cells = props.columns.map(createCell);
   var children = createChildren();
   var className = {
     'p-highlight': isSelected(),
     'p-highlight-contextmenu': props.contextMenuSelectionKey && props.contextMenuSelectionKey === props.node.key
   };
-
   if (props.rowClassName) {
     var rowClassName = props.rowClassName(props.node);
     className = _objectSpread$2(_objectSpread$2({}, className), rowClassName);
   }
-
   className = classNames(className, props.node.className);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("tr", {
     ref: elementRef,
@@ -696,30 +641,22 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
 TreeTableRow.displayName = 'TreeTableRow';
 
 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$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$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$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; }
 var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
   var isSingleSelectionMode = props.selectionMode === 'single';
   var isMultipleSelectionMode = props.selectionMode === 'multiple';
-
   var flattenizeTree = function flattenizeTree(nodes) {
     var rows = [];
     nodes = nodes || props.value;
-
     var _iterator = _createForOfIteratorHelper$2(nodes),
-        _step;
-
+      _step;
     try {
       for (_iterator.s(); !(_step = _iterator.n()).done;) {
         var node = _step.value;
         rows.push(node.key);
-
         if (isExpandedKey(node.key)) {
           rows = rows.concat(flattenizeTree(node.children));
         }
@@ -729,14 +666,11 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
     } finally {
       _iterator.f();
     }
-
     return rows;
   };
-
   var isExpandedKey = function isExpandedKey(key) {
     return props.expandedKeys && !!props.expandedKeys[key];
   };
-
   var onRowClick = function onRowClick(event, node) {
     if (props.onRowClick) {
       props.onRowClick({
@@ -744,13 +678,10 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
         node: node
       });
     }
-
     var targetNode = event.target.nodeName;
-
     if (targetNode === 'INPUT' || targetNode === 'BUTTON' || targetNode === 'A' || DomHandler.hasClass(event.target, 'p-clickable')) {
       return;
     }
-
     if ((isSingleSelectionMode || isMultipleSelectionMode) && node.selectable !== false) {
       var selectionKeys;
       var selected = isSelected(node);
@@ -759,26 +690,25 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
       var rowIndex = flatKeys.findIndex(function (key) {
         return key === node.key;
       });
-
       if (isMultipleSelectionMode && event.shiftKey) {
-        DomHandler.clearSelection(); // find first selected row
+        DomHandler.clearSelection();
 
+        // find first selected row
         var anchorRowIndex = flatKeys.findIndex(function (key) {
           return props.selectionKeys[key];
         });
         var rangeStart = Math.min(rowIndex, anchorRowIndex);
         var rangeEnd = Math.max(rowIndex, anchorRowIndex);
         selectionKeys = _objectSpread$1({}, props.selectionKeys);
-
         for (var i = rangeStart; i <= rangeEnd; i++) {
           var rowKey = flatKeys[i];
           selectionKeys[rowKey] = true;
         }
       } else {
         //anchorRowIndex = rowIndex;
+
         if (metaSelection) {
           var metaKey = event.metaKey || event.ctrlKey;
-
           if (selected && metaKey) {
             if (isSingleSelectionMode) {
               selectionKeys = null;
@@ -786,7 +716,6 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
               selectionKeys = _objectSpread$1({}, props.selectionKeys);
               delete selectionKeys[node.key];
             }
-
             if (props.onUnselect) {
               props.onUnselect({
                 originalEvent: event,
@@ -800,7 +729,6 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
               selectionKeys = !metaKey ? {} : props.selectionKeys ? _objectSpread$1({}, props.selectionKeys) : {};
               selectionKeys[node.key] = true;
             }
-
             if (props.onSelect) {
               props.onSelect({
                 originalEvent: event,
@@ -812,7 +740,6 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
           if (isSingleSelectionMode) {
             if (selected) {
               selectionKeys = null;
-
               if (props.onUnselect) {
                 props.onUnselect({
                   originalEvent: event,
@@ -821,7 +748,6 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
               }
             } else {
               selectionKeys = node.key;
-
               if (props.onSelect) {
                 props.onSelect({
                   originalEvent: event,
@@ -833,7 +759,6 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
             if (selected) {
               selectionKeys = _objectSpread$1({}, props.selectionKeys);
               delete selectionKeys[node.key];
-
               if (props.onUnselect) {
                 props.onUnselect({
                   originalEvent: event,
@@ -843,7 +768,6 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
             } else {
               selectionKeys = props.selectionKeys ? _objectSpread$1({}, props.selectionKeys) : {};
               selectionKeys[node.key] = true;
-
               if (props.onSelect) {
                 props.onSelect({
                   originalEvent: event,
@@ -854,7 +778,6 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
           }
         }
       }
-
       if (props.onSelectionChange) {
         props.onSelectionChange({
           originalEvent: event,
@@ -863,11 +786,9 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
       }
     }
   };
-
   var isSelected = function isSelected(node) {
     if ((isSingleSelectionMode || isMultipleSelectionMode) && props.selectionKeys) return isSingleSelectionMode ? props.selectionKeys === node.key : props.selectionKeys[node.key] !== undefined;else return false;
   };
-
   var createRow = function createRow(node, index) {
     return /*#__PURE__*/React.createElement(TreeTableRow, {
       key: node.key || JSON.stringify(node.data),
@@ -895,40 +816,33 @@ var TreeTableBody = /*#__PURE__*/React.memo(function (props) {
       onContextMenu: props.onContextMenu
     });
   };
-
   var createRows = function createRows() {
     if (props.paginator && !props.lazy) {
       var rpp = props.rows || 0;
       var startIndex = props.first || 0;
       var endIndex = startIndex + rpp;
       var rows = [];
-
       for (var i = startIndex; i < endIndex; i++) {
         var rowData = props.value[i];
         if (rowData) rows.push(createRow(props.value[i]));else break;
       }
-
       return rows;
     } else {
       return props.value.map(createRow);
     }
   };
-
   var createEmptyMessage = function createEmptyMessage() {
     if (props.loading) {
       return null;
     } else {
       var colSpan = props.columns ? props.columns.length : null;
-
       var _content = props.emptyMessage || localeOption('emptyMessage');
-
       return /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
         className: "p-treetable-emptymessage",
         colSpan: colSpan
       }, _content));
     }
   };
-
   var content = props.value && props.value.length ? createRows() : createEmptyMessage();
   return /*#__PURE__*/React.createElement("tbody", {
     className: "p-treetable-tbody"
@@ -946,7 +860,6 @@ var TreeTableFooter = /*#__PURE__*/React.memo(function (props) {
       colSpan: column.props.colSpan
     }, column.props.footer);
   };
-
   var createFooterRow = function createFooterRow(row, index) {
     var rowColumns = React.Children.toArray(row.props.children);
     var rowFooterCells = rowColumns.map(createFooterCell);
@@ -954,12 +867,10 @@ var TreeTableFooter = /*#__PURE__*/React.memo(function (props) {
       key: index
     }, rowFooterCells);
   };
-
   var createColumnGroup = function createColumnGroup() {
     var rows = React.Children.toArray(props.columnGroup.props.children);
     return rows.map(createFooterRow);
   };
-
   var createColumns = function createColumns(columns) {
     if (columns) {
       var headerCells = columns.map(createFooterCell);
@@ -968,7 +879,6 @@ var TreeTableFooter = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var hasFooter = function hasFooter() {
     if (props.columnGroup) {
       return true;
@@ -979,12 +889,9 @@ var TreeTableFooter = /*#__PURE__*/React.memo(function (props) {
         }
       }
     }
-
     return false;
   };
-
   var content = props.columnGroup ? createColumnGroup() : createColumns(props.columns);
-
   if (hasFooter()) {
     return /*#__PURE__*/React.createElement("tfoot", {
       className: "p-treetable-tfoot"
@@ -996,17 +903,13 @@ var TreeTableFooter = /*#__PURE__*/React.memo(function (props) {
 TreeTableFooter.displayName = 'TreeTableFooter';
 
 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; }
 var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
   var filterTimeout = React.useRef(null);
-
   var onHeaderClick = function onHeaderClick(event, column) {
     if (column.props.sortable) {
       var targetNode = event.target;
-
       if (DomHandler.hasClass(targetNode, 'p-sortable-column') || DomHandler.hasClass(targetNode, 'p-column-title') || DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
         props.onSort({
           originalEvent: event,
@@ -1018,20 +921,17 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       }
     }
   };
-
   var onHeaderMouseDown = function onHeaderMouseDown(event, column) {
     if (props.reorderableColumns && column.props.reorderable) {
       if (event.target.nodeName !== 'INPUT') event.currentTarget.draggable = true;else if (event.target.nodeName === 'INPUT') event.currentTarget.draggable = false;
     }
   };
-
   var onHeaderKeyDown = function onHeaderKeyDown(event, column) {
     if (event.key === 'Enter') {
       onHeaderClick(event, column);
       event.preventDefault();
     }
   };
-
   var getMultiSortMetaDataIndex = function getMultiSortMetaDataIndex(column) {
     if (props.multiSortMeta) {
       for (var i = 0; i < props.multiSortMeta.length; i++) {
@@ -1040,10 +940,8 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
         }
       }
     }
-
     return -1;
   };
-
   var onResizerMouseDown = function onResizerMouseDown(event, column) {
     if (props.resizableColumns && props.onResizeStart) {
       props.onResizeStart({
@@ -1053,7 +951,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       });
     }
   };
-
   var _onDragStart = function onDragStart(event, column) {
     if (props.onDragStart) {
       props.onDragStart({
@@ -1062,7 +959,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       });
     }
   };
-
   var _onDragOver = function onDragOver(event, column) {
     if (props.onDragOver) {
       props.onDragOver({
@@ -1071,7 +967,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       });
     }
   };
-
   var _onDragLeave = function onDragLeave(event, column) {
     if (props.onDragLeave) {
       props.onDragLeave({
@@ -1080,7 +975,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       });
     }
   };
-
   var _onDrop = function onDrop(event, column) {
     if (props.onDrop) {
       props.onDrop({
@@ -1089,13 +983,11 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       });
     }
   };
-
   var onFilterInput = function onFilterInput(e, column) {
     if (column.props.filter && props.onFilter) {
       if (filterTimeout.current) {
         clearTimeout(filterTimeout.current);
       }
-
       var filterValue = e.target.value;
       filterTimeout.current = setTimeout(function () {
         props.onFilter({
@@ -1107,16 +999,13 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       }, props.filterDelay);
     }
   };
-
   var hasColumnFilter = function hasColumnFilter(columns) {
     if (columns) {
       var _iterator = _createForOfIteratorHelper$1(columns),
-          _step;
-
+        _step;
       try {
         for (_iterator.s(); !(_step = _iterator.n()).done;) {
           var col = _step.value;
-
           if (col.props.filter) {
             return true;
           }
@@ -1127,10 +1016,8 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
         _iterator.f();
       }
     }
-
     return false;
   };
-
   var getAriaSort = function getAriaSort(column, sorted, sortOrder) {
     if (column.props.sortable) {
       var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-down' : 'pi-sort-up' : 'pi-sort';
@@ -1139,15 +1026,12 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var getColumnProp = function getColumnProp(column) {
     for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
       args[_key - 1] = arguments[_key];
     }
-
     return column ? typeof args[0] === 'string' ? column.props[args[0]] : (args[0] || column).props[args[1]] : null;
   };
-
   var createSortIcon = function createSortIcon(column, sorted, sortOrder) {
     if (column.props.sortable) {
       var sortIcon = sorted ? sortOrder < 0 ? 'pi-sort-amount-down' : 'pi-sort-amount-up-alt' : 'pi-sort-alt';
@@ -1159,7 +1043,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var createResizer = function createResizer(column) {
     if (props.resizableColumns) {
       return /*#__PURE__*/React.createElement("span", {
@@ -1172,20 +1055,16 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var createSortBadge = function createSortBadge(sortMetaDataIndex) {
     if (sortMetaDataIndex !== -1 && props.multiSortMeta && props.multiSortMeta.length > 1) {
       return /*#__PURE__*/React.createElement("span", {
         className: "p-sortable-column-badge"
       }, sortMetaDataIndex + 1);
     }
-
     return null;
   };
-
   var createHeaderCell = function createHeaderCell(column, options) {
     var filterElement;
-
     if (column.props.filter && options.renderFilter) {
       filterElement = column.props.filterElement || /*#__PURE__*/React.createElement(InputText, {
         onInput: function onInput(e) {
@@ -1198,7 +1077,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
         maxLength: column.props.filterMaxLength
       });
     }
-
     if (options.filterOnly) {
       return /*#__PURE__*/React.createElement("th", {
         key: column.props.columnKey || column.props.field || options.index,
@@ -1266,7 +1144,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       }, column.props.headerTooltipOptions)));
     }
   };
-
   var createHeaderRow = function createHeaderRow(row, index) {
     var rowColumns = React.Children.toArray(row.props.children);
     var rowHeaderCells = rowColumns.map(function (col, i) {
@@ -1280,12 +1157,10 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       key: index
     }, rowHeaderCells);
   };
-
   var createColumnGroup = function createColumnGroup() {
     var rows = React.Children.toArray(props.columnGroup.props.children);
     return rows.map(createHeaderRow);
   };
-
   var createColumns = function createColumns(columns) {
     if (columns) {
       if (hasColumnFilter(columns)) {
@@ -1315,7 +1190,6 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var content = props.columnGroup ? createColumnGroup() : createColumns(props.columns);
   return /*#__PURE__*/React.createElement("thead", {
     className: "p-treetable-thead"
@@ -1331,18 +1205,15 @@ var TreeTableScrollableView = /*#__PURE__*/React.memo(function (props) {
   var scrollTableRef = React.useRef(null);
   var scrollFooterRef = React.useRef(null);
   var scrollFooterBoxRef = React.useRef(null);
-
   var setScrollHeight = function setScrollHeight() {
     if (props.scrollHeight) {
       if (props.scrollHeight.indexOf('%') !== -1) {
         var datatableContainer = findDataTableContainer(elementRef.current);
         scrollBodyRef.current.style.visibility = 'hidden';
         scrollBodyRef.current.style.height = '100px'; //temporary height to calculate static height
-
         var containerHeight = DomHandler.getOuterHeight(datatableContainer);
         var relativeHeight = DomHandler.getOuterHeight(datatableContainer.parentElement) * parseInt(props.scrollHeight, 10) / 100;
         var staticHeight = containerHeight - 100; //total height of headers, footers, paginators
-
         var scrollBodyHeight = relativeHeight - staticHeight;
         scrollBodyRef.current.style.height = 'auto';
         scrollBodyRef.current.style.maxHeight = scrollBodyHeight + 'px';
@@ -1352,49 +1223,38 @@ var TreeTableScrollableView = /*#__PURE__*/React.memo(function (props) {
       }
     }
   };
-
   var findDataTableContainer = function findDataTableContainer(element) {
     if (element) {
       var el = element;
-
       while (el && !DomHandler.hasClass(el, 'p-treetable')) {
         el = el.parentElement;
       }
-
       return el;
     } else {
       return null;
     }
   };
-
   var onHeaderScroll = function onHeaderScroll() {
     scrollHeaderRef.current.scrollLeft = 0;
   };
-
   var onBodyScroll = function onBodyScroll() {
     var frozenView = elementRef.current.previousElementSibling;
     var frozenScrollBody;
-
     if (frozenView) {
       frozenScrollBody = DomHandler.findSingle(frozenView, '.p-treetable-scrollable-body');
     }
-
     scrollHeaderBoxRef.current.style.marginLeft = -1 * scrollBodyRef.current.scrollLeft + 'px';
-
     if (scrollFooterBoxRef.current) {
       scrollFooterBoxRef.current.style.marginLeft = -1 * scrollBodyRef.current.scrollLeft + 'px';
     }
-
     if (frozenScrollBody) {
       frozenScrollBody.scrollTop = scrollBodyRef.current.scrollTop;
     }
   };
-
   useMountEffect(function () {
     if (!props.frozen) {
       var scrollBarWidth = DomHandler.calculateScrollbarWidth();
       scrollHeaderBoxRef.current.style.marginRight = scrollBarWidth + 'px';
-
       if (scrollFooterBoxRef.current) {
         scrollFooterBoxRef.current.style.marginRight = scrollBarWidth + 'px';
       }
@@ -1405,7 +1265,6 @@ var TreeTableScrollableView = /*#__PURE__*/React.memo(function (props) {
   React.useEffect(function () {
     setScrollHeight();
   });
-
   var createColGroup = function createColGroup() {
     if (ObjectUtils.isNotEmpty(props.columns)) {
       var cols = props.columns.map(function (col, i) {
@@ -1420,7 +1279,6 @@ var TreeTableScrollableView = /*#__PURE__*/React.memo(function (props) {
       return null;
     }
   };
-
   var className = classNames('p-treetable-scrollable-view', {
     'p-treetable-frozen-view': props.frozen,
     'p-treetable-unfrozen-view': !props.frozen && props.frozenWidth
@@ -1471,56 +1329,45 @@ var TreeTableScrollableView = /*#__PURE__*/React.memo(function (props) {
 TreeTableScrollableView.displayName = 'TreeTableScrollableView';
 
 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); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _React$useState = React.useState(props.expandedKeys),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      expandedKeysState = _React$useState2[0],
-      setExpandedKeysState = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    expandedKeysState = _React$useState2[0],
+    setExpandedKeysState = _React$useState2[1];
   var _React$useState3 = React.useState(props.first),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      firstState = _React$useState4[0],
-      setFirstState = _React$useState4[1];
-
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    firstState = _React$useState4[0],
+    setFirstState = _React$useState4[1];
   var _React$useState5 = React.useState(props.rows),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      rowsState = _React$useState6[0],
-      setRowsState = _React$useState6[1];
-
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    rowsState = _React$useState6[0],
+    setRowsState = _React$useState6[1];
   var _React$useState7 = React.useState(props.sortField),
-      _React$useState8 = _slicedToArray(_React$useState7, 2),
-      sortFieldState = _React$useState8[0],
-      setSortFieldState = _React$useState8[1];
-
+    _React$useState8 = _slicedToArray(_React$useState7, 2),
+    sortFieldState = _React$useState8[0],
+    setSortFieldState = _React$useState8[1];
   var _React$useState9 = React.useState(props.sortOrder),
-      _React$useState10 = _slicedToArray(_React$useState9, 2),
-      sortOrderState = _React$useState10[0],
-      setSortOrderState = _React$useState10[1];
-
+    _React$useState10 = _slicedToArray(_React$useState9, 2),
+    sortOrderState = _React$useState10[0],
+    setSortOrderState = _React$useState10[1];
   var _React$useState11 = React.useState(props.multiSortMeta),
-      _React$useState12 = _slicedToArray(_React$useState11, 2),
-      multiSortMetaState = _React$useState12[0],
-      setMultiSortMetaState = _React$useState12[1];
-
+    _React$useState12 = _slicedToArray(_React$useState11, 2),
+    multiSortMetaState = _React$useState12[0],
+    setMultiSortMetaState = _React$useState12[1];
   var _React$useState13 = React.useState(props.filters),
-      _React$useState14 = _slicedToArray(_React$useState13, 2),
-      filtersState = _React$useState14[0],
-      setFiltersState = _React$useState14[1];
-
+    _React$useState14 = _slicedToArray(_React$useState13, 2),
+    filtersState = _React$useState14[0],
+    setFiltersState = _React$useState14[1];
   var _React$useState15 = React.useState([]),
-      _React$useState16 = _slicedToArray(_React$useState15, 2),
-      columnOrderState = _React$useState16[0],
-      setColumnOrderState = _React$useState16[1];
-
+    _React$useState16 = _slicedToArray(_React$useState15, 2),
+    columnOrderState = _React$useState16[0],
+    setColumnOrderState = _React$useState16[1];
   var elementRef = React.useRef(null);
+  var tableRef = React.useRef(null);
   var resizerHelperRef = React.useRef(null);
   var reorderIndicatorUpRef = React.useRef(null);
   var reorderIndicatorDownRef = React.useRef(null);
@@ -1536,32 +1383,29 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var columnSortable = React.useRef(null);
   var columnSortFunction = React.useRef(null);
   var columnField = React.useRef(null);
-
   var _useEventListener = useEventListener({
-    type: 'mousemove',
-    listener: function listener(event) {
-      if (columnResizing.current) {
-        onColumnResize(event);
+      type: 'mousemove',
+      listener: function listener(event) {
+        if (columnResizing.current) {
+          onColumnResize(event);
+        }
       }
-    }
-  }),
-      _useEventListener2 = _slicedToArray(_useEventListener, 2),
-      bindDocumentMouseMoveListener = _useEventListener2[0],
-      unbindDocumentMouseMoveListener = _useEventListener2[1];
-
+    }),
+    _useEventListener2 = _slicedToArray(_useEventListener, 2),
+    bindDocumentMouseMoveListener = _useEventListener2[0],
+    unbindDocumentMouseMoveListener = _useEventListener2[1];
   var _useEventListener3 = useEventListener({
-    type: 'mouseup',
-    listener: function listener(event) {
-      if (columnResizing.current) {
-        columnResizing.current = false;
-        onColumnResizeEnd();
+      type: 'mouseup',
+      listener: function listener(event) {
+        if (columnResizing.current) {
+          columnResizing.current = false;
+          onColumnResizeEnd();
+        }
       }
-    }
-  }),
-      _useEventListener4 = _slicedToArray(_useEventListener3, 2),
-      bindDocumentMouseUpListener = _useEventListener4[0],
-      unbindDocumentMouseUpListener = _useEventListener4[1];
-
+    }),
+    _useEventListener4 = _slicedToArray(_useEventListener3, 2),
+    bindDocumentMouseUpListener = _useEventListener4[0],
+    unbindDocumentMouseUpListener = _useEventListener4[1];
   var onToggle = function onToggle(event) {
     if (props.onToggle) {
       props.onToggle(event);
@@ -1569,7 +1413,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       setExpandedKeysState(event.value);
     }
   };
-
   var onPageChange = function onPageChange(event) {
     if (props.onPage) {
       props.onPage(event);
@@ -1578,7 +1421,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       setRowsState(event.rows);
     }
   };
-
   var onSort = function onSort(event) {
     var sortField = event.sortField;
     var sortOrder = props.defaultSortOrder;
@@ -1587,49 +1429,40 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
     columnSortable.current = event.sortable;
     columnSortFunction.current = event.sortFunction;
     columnField.current = event.sortField;
-
     if (props.sortMode === 'multiple') {
       var metaKey = event.originalEvent.metaKey || event.originalEvent.ctrlKey;
       multiSortMeta = _toConsumableArray(getMultiSortMeta());
-
       if (multiSortMeta && multiSortMeta instanceof Array) {
         var sortMeta = multiSortMeta.find(function (sortMeta) {
           return sortMeta.field === sortField;
         });
         sortOrder = sortMeta ? getCalculatedSortOrder(sortMeta.order) : sortOrder;
       }
-
       var newMetaData = {
         field: sortField,
         order: sortOrder
       };
-
       if (sortOrder) {
         if (!multiSortMeta || !metaKey) {
           multiSortMeta = [];
         }
-
         addSortMeta(newMetaData, multiSortMeta);
       } else if (props.removableSort && multiSortMeta) {
         removeSortMeta(newMetaData, multiSortMeta);
       }
-
       eventMeta = {
         multiSortMeta: multiSortMeta
       };
     } else {
       sortOrder = getSortField() === sortField ? getCalculatedSortOrder(getSortOrder()) : sortOrder;
-
       if (props.removableSort) {
         sortField = sortOrder ? sortField : null;
       }
-
       eventMeta = {
         sortField: sortField,
         sortOrder: sortOrder
       };
     }
-
     if (props.onSort) {
       props.onSort(eventMeta);
     } else {
@@ -1639,48 +1472,37 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       setMultiSortMetaState(eventMeta.multiSortMeta);
     }
   };
-
   var getCalculatedSortOrder = function getCalculatedSortOrder(currentOrder) {
     return props.removableSort ? props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;
   };
-
   var addSortMeta = function addSortMeta(meta, multiSortMeta) {
     var index = -1;
-
     for (var i = 0; i < multiSortMeta.length; i++) {
       if (multiSortMeta[i].field === meta.field) {
         index = i;
         break;
       }
     }
-
     if (index >= 0) multiSortMeta[index] = meta;else multiSortMeta.push(meta);
   };
-
   var removeSortMeta = function removeSortMeta(meta, multiSortMeta) {
     var index = -1;
-
     for (var i = 0; i < multiSortMeta.length; i++) {
       if (multiSortMeta[i].field === meta.field) {
         index = i;
         break;
       }
     }
-
     if (index >= 0) {
       multiSortMeta.splice(index, 1);
     }
-
     multiSortMeta = multiSortMeta.length > 0 ? multiSortMeta : null;
   };
-
   var sortSingle = function sortSingle(data) {
     return sortNodes(data);
   };
-
   var sortNodes = function sortNodes(data) {
     var value = _toConsumableArray(data);
-
     if (columnSortable.current && columnSortable.current === 'custom' && columnSortFunction.current) {
       value = columnSortFunction.current({
         data: data,
@@ -1694,53 +1516,43 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
         var value2 = ObjectUtils.resolveFieldData(node2.data, sortField);
         return compareValuesOnSort(value1, value2, getSortOrder());
       });
-
       for (var i = 0; i < value.length; i++) {
         if (value[i].children && value[i].children.length) {
           value[i].children = sortNodes(value[i].children);
         }
       }
     }
-
     return value;
   };
-
   var sortMultiple = function sortMultiple(data) {
     var multiSortMeta = getMultiSortMeta();
     if (multiSortMeta) return sortMultipleNodes(data, multiSortMeta);else return data;
   };
-
   var sortMultipleNodes = function sortMultipleNodes(data, multiSortMeta) {
     var value = _toConsumableArray(data);
-
     value.sort(function (node1, node2) {
       return multisortField(node1, node2, multiSortMeta, 0);
     });
-
     for (var i = 0; i < value.length; i++) {
       if (value[i].children && value[i].children.length) {
         value[i].children = sortMultipleNodes(value[i].children, multiSortMeta);
       }
     }
-
     return value;
   };
-
   var multisortField = function multisortField(node1, node2, multiSortMeta, index) {
     var value1 = ObjectUtils.resolveFieldData(node1.data, multiSortMeta[index].field);
-    var value2 = ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].field); // check if they are equal handling dates and locales
+    var value2 = ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].field);
 
+    // check if they are equal handling dates and locales
     if (ObjectUtils.compare(value1, value2, PrimeReact.locale) === 0) {
       return multiSortMeta.length - 1 > index ? multisortField(node1, node2, multiSortMeta, index + 1) : 0;
     }
-
     return compareValuesOnSort(value1, value2, multiSortMeta[index].order);
   };
-
   var compareValuesOnSort = function compareValuesOnSort(value1, value2, order) {
     return ObjectUtils.sort(value1, value2, order, PrimeReact.locale, PrimeReact.nullSortOrder);
   };
-
   var filter = function filter(value, field, mode) {
     onFilter({
       value: value,
@@ -1748,7 +1560,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       matchMode: mode
     });
   };
-
   var onFilter = function onFilter(event) {
     var filters = getFilters();
     var newFilters = filters ? _objectSpread({}, filters) : {};
@@ -1756,7 +1567,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       value: event.value,
       matchMode: event.matchMode
     };else if (newFilters[event.field]) delete newFilters[event.field];
-
     if (props.onFilter) {
       props.onFilter({
         filters: newFilters
@@ -1766,15 +1576,12 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       setFiltersState(newFilters);
     }
   };
-
   var isFilterBlank = function isFilterBlank(filter) {
     if (filter !== null && filter !== undefined) {
       if (typeof filter === 'string' && filter.trim().length === 0 || filter instanceof Array && filter.length === 0) return true;else return false;
     }
-
     return true;
   };
-
   var onColumnResizeStart = function onColumnResizeStart(event) {
     var containerLeft = DomHandler.getOffset(elementRef.current).left;
     resizeColumn.current = event.columnEl;
@@ -1783,7 +1590,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
     lastResizerHelperX.current = event.originalEvent.pageX - containerLeft + elementRef.current.scrollLeft;
     bindColumnResizeEvents();
   };
-
   var onColumnResize = function onColumnResize(event) {
     var containerLeft = DomHandler.getOffset(elementRef.current).left;
     DomHandler.addClass(elementRef.current, 'p-unselectable-text');
@@ -1792,18 +1598,15 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
     resizerHelperRef.current.style.left = event.pageX - containerLeft + elementRef.current.scrollLeft + 'px';
     resizerHelperRef.current.style.display = 'block';
   };
-
   var onColumnResizeEnd = function onColumnResizeEnd(event) {
     var delta = resizerHelperRef.current.offsetLeft - lastResizerHelperX.current;
     var columnWidth = resizeColumn.current.offsetWidth;
     var newColumnWidth = columnWidth + delta;
     var minWidth = resizeColumn.current.style.minWidth || 15;
-
     if (columnWidth + delta > parseInt(minWidth, 10)) {
       if (props.columnResizeMode === 'fit') {
         var nextColumn = resizeColumn.current.nextElementSibling;
         var nextColumnWidth = nextColumn.offsetWidth - delta;
-
         if (newColumnWidth > 15 && nextColumnWidth > 15) {
           if (props.scrollable) {
             var scrollableView = findParentScrollableView(resizeColumn.current);
@@ -1816,7 +1619,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
             resizeColGroup(scrollableFooterTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
           } else {
             resizeColumn.current.style.width = newColumnWidth + 'px';
-
             if (nextColumn) {
               nextColumn.style.width = nextColumnWidth + 'px';
             }
@@ -1825,31 +1627,23 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       } else if (props.columnResizeMode === 'expand') {
         if (props.scrollable) {
           var _scrollableView = findParentScrollableView(resizeColumn.current);
-
           var _scrollableBodyTable = DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-body-table');
-
           var _scrollableHeaderTable = DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-header-table');
-
           var _scrollableFooterTable = DomHandler.findSingle(_scrollableView, 'table.p-treetable-scrollable-footer-table');
-
           _scrollableBodyTable.style.width = _scrollableBodyTable.offsetWidth + delta + 'px';
           _scrollableHeaderTable.style.width = _scrollableHeaderTable.offsetWidth + delta + 'px';
-
           if (_scrollableFooterTable) {
             _scrollableFooterTable.style.width = _scrollableHeaderTable.offsetWidth + delta + 'px';
           }
-
           var _resizeColumnIndex = DomHandler.index(resizeColumn.current);
-
           resizeColGroup(_scrollableHeaderTable, _resizeColumnIndex, newColumnWidth, null);
           resizeColGroup(_scrollableBodyTable, _resizeColumnIndex, newColumnWidth, null);
           resizeColGroup(_scrollableFooterTable, _resizeColumnIndex, newColumnWidth, null);
         } else {
-          table.style.width = table.offsetWidth + delta + 'px';
+          tableRef.current.style.width = tableRef.current.offsetWidth + delta + 'px';
           resizeColumn.current.style.width = newColumnWidth + 'px';
         }
       }
-
       if (props.onColumnResizeEnd) {
         props.onColumnResizeEnd({
           element: resizeColumn.current,
@@ -1858,37 +1652,30 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
         });
       }
     }
-
     resizerHelperRef.current.style.display = 'none';
     resizeColumn.current = null;
     resizeColumnProps.current = null;
     DomHandler.removeClass(elementRef.current, 'p-unselectable-text');
     unbindColumnResizeEvents();
   };
-
   var findParentScrollableView = function findParentScrollableView(column) {
     if (column) {
       var parent = column.parentElement;
-
       while (parent && !DomHandler.hasClass(parent, 'p-treetable-scrollable-view')) {
         parent = parent.parentElement;
       }
-
       return parent;
     } else {
       return null;
     }
   };
-
   var resizeColGroup = function resizeColGroup(table, resizeColumnIndex, newColumnWidth, nextColumnWidth) {
     if (table) {
       var colGroup = table.children[0].nodeName === 'COLGROUP' ? table.children[0] : null;
-
       if (colGroup) {
         var col = colGroup.children[resizeColumnIndex];
         var nextCol = col.nextElementSibling;
         col.style.width = newColumnWidth + 'px';
-
         if (nextCol && nextColumnWidth) {
           nextCol.style.width = nextColumnWidth + 'px';
         }
@@ -1897,26 +1684,21 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       }
     }
   };
-
   var bindColumnResizeEvents = function bindColumnResizeEvents() {
     bindDocumentMouseMoveListener();
     bindDocumentMouseUpListener();
   };
-
   var unbindColumnResizeEvents = function unbindColumnResizeEvents() {
     unbindDocumentMouseMoveListener();
     unbindDocumentMouseUpListener();
   };
-
   var onColumnDragStart = function onColumnDragStart(e) {
     var event = e.originalEvent,
-        column = e.column;
-
+      column = e.column;
     if (columnResizing.current) {
       event.preventDefault();
       return;
     }
-
     iconWidth.current = DomHandler.getHiddenElementOuterWidth(reorderIndicatorUpRef.current);
     iconHeight.current = DomHandler.getHiddenElementOuterHeight(reorderIndicatorUpRef.current);
     draggedColumnEl.current = findParentHeader(event.currentTarget);
@@ -1927,19 +1709,16 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var onColumnDragOver = function onColumnDragOver(e) {
     var event = e.originalEvent;
     var dropHeader = findParentHeader(event.currentTarget);
-
     if (props.reorderableColumns && draggedColumnEl.current && dropHeader) {
       event.preventDefault();
       var containerOffset = DomHandler.getOffset(elementRef.current);
       var dropHeaderOffset = DomHandler.getOffset(dropHeader);
-
       if (draggedColumnEl.current !== dropHeader) {
-        var targetLeft = dropHeaderOffset.left - containerOffset.left; //let targetTop =  containerOffset.top - dropHeaderOffset.top;
-
+        var targetLeft = dropHeaderOffset.left - containerOffset.left;
+        //let targetTop =  containerOffset.top - dropHeaderOffset.top;
         var columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
         reorderIndicatorUpRef.current.style.top = dropHeaderOffset.top - containerOffset.top - (iconHeight.current - 1) + 'px';
         reorderIndicatorDownRef.current.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
-
         if (event.pageX > columnCenter) {
           reorderIndicatorUpRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(iconWidth.current / 2) + 'px';
           reorderIndicatorDownRef.current.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(iconWidth.current / 2) + 'px';
@@ -1949,65 +1728,51 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
           reorderIndicatorDownRef.current.style.left = targetLeft - Math.ceil(iconWidth.current / 2) + 'px';
           dropPosition.current = -1;
         }
-
         reorderIndicatorUpRef.current.style.display = 'block';
         reorderIndicatorDownRef.current.style.display = 'block';
       }
     }
   };
-
   var onColumnDragLeave = function onColumnDragLeave(e) {
     var event = e.originalEvent;
-
     if (props.reorderableColumns && draggedColumnEl.current) {
       event.preventDefault();
       reorderIndicatorUpRef.current.style.display = 'none';
       reorderIndicatorDownRef.current.style.display = 'none';
     }
   };
-
   var onColumnDrop = function onColumnDrop(e) {
     var event = e.originalEvent,
-        column = e.column;
+      column = e.column;
     event.preventDefault();
-
     if (draggedColumnEl.current) {
       var dragIndex = DomHandler.index(draggedColumnEl.current);
       var dropIndex = DomHandler.index(findParentHeader(event.currentTarget));
       var allowDrop = dragIndex !== dropIndex;
-
       if (allowDrop && (dropIndex - dragIndex === 1 && dropPosition.current === -1 || dragIndex - dropIndex === 1 && dropPosition.current === 1)) {
         allowDrop = false;
       }
-
       if (allowDrop) {
         var columns = columnOrderState ? getColumns() : React.Children.toArray(props.children);
-
         var isSameColumn = function isSameColumn(col1, col2) {
           return col1.props.columnKey || col2.props.columnKey ? ObjectUtils.equals(col1, col2, 'props.columnKey') : ObjectUtils.equals(col1, col2, 'props.field');
         };
-
         var dragColIndex = columns.findIndex(function (child) {
           return isSameColumn(child, draggedColumn.current);
         });
         var dropColIndex = columns.findIndex(function (child) {
           return isSameColumn(child, column);
         });
-
         if (dropColIndex < dragColIndex && dropPosition.current === 1) {
           dropColIndex++;
         }
-
         if (dropColIndex > dragColIndex && dropPosition.current === -1) {
           dropColIndex--;
         }
-
         ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
         var columnOrder = [];
-
         var _iterator = _createForOfIteratorHelper(columns),
-            _step;
-
+          _step;
         try {
           for (_iterator.s(); !(_step = _iterator.n()).done;) {
             var _column = _step.value;
@@ -2018,9 +1783,7 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
         } finally {
           _iterator.f();
         }
-
         setColumnOrderState(columnOrder);
-
         if (props.onColReorder) {
           props.onColReorder({
             dragIndex: dragColIndex,
@@ -2029,7 +1792,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
           });
         }
       }
-
       reorderIndicatorUpRef.current.style.display = 'none';
       reorderIndicatorDownRef.current.style.display = 'none';
       draggedColumnEl.current.draggable = false;
@@ -2037,79 +1799,61 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       dropPosition.current = null;
     }
   };
-
   var findParentHeader = function findParentHeader(element) {
     if (element.nodeName === 'TH') {
       return element;
     } else {
       var parent = element.parentElement;
-
       while (parent.nodeName !== 'TH') {
         parent = parent.parentElement;
         if (!parent) break;
       }
-
       return parent;
     }
   };
-
   var getExpandedKeys = function getExpandedKeys() {
     return props.onToggle ? props.expandedKeys : expandedKeysState;
   };
-
   var getFirst = function getFirst() {
     return props.onPage ? props.first : firstState;
   };
-
   var getRows = function getRows() {
     return props.onPage ? props.rows : rowsState;
   };
-
   var getSortField = function getSortField() {
     return props.onSort ? props.sortField : sortFieldState;
   };
-
   var getSortOrder = function getSortOrder() {
     return props.onSort ? props.sortOrder : sortOrderState;
   };
-
   var getMultiSortMeta = function getMultiSortMeta() {
     return (props.onSort ? props.multiSortMeta : multiSortMetaState) || [];
   };
-
   var getFilters = function getFilters() {
     return props.onFilter ? props.filters : filtersState;
   };
-
   var findColumnByKey = function findColumnByKey(columns, key) {
     if (columns && columns.length) {
       for (var i = 0; i < columns.length; i++) {
         var child = columns[i];
-
         if (child.props.columnKey === key || child.props.field === key) {
           return child;
         }
       }
     }
-
     return null;
   };
-
   var getColumns = function getColumns() {
     var columns = React.Children.toArray(props.children);
-
     if (columns && columns.length) {
       if (props.reorderableColumns && columnOrderState) {
         var orderedColumns = [];
-
         var _iterator2 = _createForOfIteratorHelper(columnOrderState),
-            _step2;
-
+          _step2;
         try {
           for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
             var columnKey = _step2.value;
             var column = findColumnByKey(columns, columnKey);
-
             if (column) {
               orderedColumns.push(column);
             }
@@ -2119,7 +1863,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
         } finally {
           _iterator2.f();
         }
-
         return [].concat(orderedColumns, _toConsumableArray(columns.filter(function (item) {
           return orderedColumns.indexOf(item) < 0;
         })));
@@ -2127,36 +1870,27 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
         return columns;
       }
     }
-
     return null;
   };
-
   var getTotalRecords = function getTotalRecords(data) {
     return props.lazy ? props.totalRecords : data ? data.length : 0;
   };
-
   var isSingleSelectionMode = function isSingleSelectionMode() {
     return props.selectionMode && props.selectionMode === 'single';
   };
-
   var isMultipleSelectionMode = function isMultipleSelectionMode() {
     return props.selectionMode && props.selectionMode === 'multiple';
   };
-
   var isRowSelectionMode = function isRowSelectionMode() {
     return isSingleSelectionMode() || isMultipleSelectionMode();
   };
-
   var getFrozenColumns = function getFrozenColumns(columns) {
     var frozenColumns = null;
-
     var _iterator3 = _createForOfIteratorHelper(columns),
-        _step3;
-
+      _step3;
     try {
       for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
         var col = _step3.value;
-
         if (col.props.frozen) {
           frozenColumns = frozenColumns || [];
           frozenColumns.push(col);
@@ -2167,20 +1901,15 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
     } finally {
       _iterator3.f();
     }
-
     return frozenColumns;
   };
-
   var getScrollableColumns = function getScrollableColumns(columns) {
     var scrollableColumns = null;
-
     var _iterator4 = _createForOfIteratorHelper(columns),
-        _step4;
-
+      _step4;
     try {
       for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
         var col = _step4.value;
-
         if (!col.props.frozen) {
           scrollableColumns = scrollableColumns || [];
           scrollableColumns.push(col);
@@ -2191,37 +1920,31 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
     } finally {
       _iterator4.f();
     }
-
     return scrollableColumns;
   };
-
   var filterLocal = function filterLocal(value) {
     var filteredNodes = [];
     var filters = getFilters();
     var columns = React.Children.toArray(props.children);
     var isStrictMode = props.filterMode === 'strict';
-
     var _iterator5 = _createForOfIteratorHelper(value),
-        _step5;
-
+      _step5;
     try {
       for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
         var node = _step5.value;
-
         var copyNode = _objectSpread({}, node);
-
         var localMatch = true;
         var globalMatch = false;
-
         for (var j = 0; j < columns.length; j++) {
           var col = columns[j];
           var filterMeta = filters ? filters[col.props.field] : null;
           var filterField = col.props.field;
           var filterValue = void 0,
-              filterConstraint = void 0,
-              paramsWithoutNode = void 0,
-              options = void 0; //local
+            filterConstraint = void 0,
+            paramsWithoutNode = void 0,
+            options = void 0;
 
+          //local
           if (filterMeta) {
             var filterMatchMode = filterMeta.matchMode || col.props.filterMatchMode || 'startsWith';
             filterValue = filterMeta.value;
@@ -2243,20 +1966,17 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
               isStrictMode: isStrictMode,
               options: options
             };
-
             if (isStrictMode && !(findFilteredNodes(copyNode, paramsWithoutNode) || isFilterMatched(copyNode, paramsWithoutNode)) || !isStrictMode && !(isFilterMatched(copyNode, paramsWithoutNode) || findFilteredNodes(copyNode, paramsWithoutNode))) {
               localMatch = false;
             }
-
             if (!localMatch) {
               break;
             }
-          } //global
-
+          }
 
+          //global
           if (props.globalFilter && !globalMatch) {
             var copyNodeForGlobal = _objectSpread({}, copyNode);
-
             filterValue = props.globalFilter;
             filterConstraint = FilterService.filters[props.globalFilterMatchMode];
             paramsWithoutNode = {
@@ -2265,20 +1985,16 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
               filterConstraint: filterConstraint,
               isStrictMode: isStrictMode
             };
-
             if (isStrictMode && (findFilteredNodes(copyNodeForGlobal, paramsWithoutNode) || isFilterMatched(copyNodeForGlobal, paramsWithoutNode)) || !isStrictMode && (isFilterMatched(copyNodeForGlobal, paramsWithoutNode) || findFilteredNodes(copyNodeForGlobal, paramsWithoutNode))) {
               globalMatch = true;
               copyNode = copyNodeForGlobal;
             }
           }
         }
-
         var matches = localMatch;
-
         if (props.globalFilter) {
           matches = localMatch && globalMatch;
         }
-
         if (matches) {
           filteredNodes.push(copyNode);
         }
@@ -2288,28 +2004,20 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
     } finally {
       _iterator5.f();
     }
-
     return filteredNodes;
   };
-
   var findFilteredNodes = function findFilteredNodes(node, paramsWithoutNode) {
     if (node) {
       var matched = false;
-
       if (node.children) {
         var childNodes = _toConsumableArray(node.children);
-
         node.children = [];
-
         var _iterator6 = _createForOfIteratorHelper(childNodes),
-            _step6;
-
+          _step6;
         try {
           for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
             var childNode = _step6.value;
-
             var copyChildNode = _objectSpread({}, childNode);
-
             if (isFilterMatched(copyChildNode, paramsWithoutNode)) {
               matched = true;
               node.children.push(copyChildNode);
@@ -2321,26 +2029,22 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
           _iterator6.f();
         }
       }
-
       if (matched) {
         return true;
       }
     }
   };
-
   var isFilterMatched = function isFilterMatched(node, _ref) {
     var filterField = _ref.filterField,
-        filterValue = _ref.filterValue,
-        filterConstraint = _ref.filterConstraint,
-        isStrictMode = _ref.isStrictMode,
-        options = _ref.options;
+      filterValue = _ref.filterValue,
+      filterConstraint = _ref.filterConstraint,
+      isStrictMode = _ref.isStrictMode,
+      options = _ref.options;
     var matched = false;
     var dataFieldValue = ObjectUtils.resolveFieldData(node.data, filterField);
-
     if (filterConstraint(dataFieldValue, filterValue, props.filterLocale, options)) {
       matched = true;
     }
-
     if (!matched || isStrictMode && !isNodeLeaf(node)) {
       matched = findFilteredNodes(node, {
         filterField: filterField,
@@ -2349,36 +2053,28 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
         isStrictMode: isStrictMode
       }) || matched;
     }
-
     return matched;
   };
-
   var isNodeLeaf = function isNodeLeaf(node) {
     return node.leaf === false ? false : !(node.children && node.children.length);
   };
-
   var processData = function processData() {
     var data = props.value || [];
-
     if (!props.lazy) {
       if (data && data.length) {
         var filters = getFilters();
         var sortField = getSortField();
         var multiSortMeta = getMultiSortMeta();
-
         if (ObjectUtils.isNotEmpty(filters) || props.globalFilter) {
           data = filterLocal(data);
         }
-
         if (sortField || ObjectUtils.isNotEmpty(multiSortMeta)) {
           if (props.sortMode === 'single') data = sortSingle(data);else if (props.sortMode === 'multiple') data = sortMultiple(data);
         }
       }
     }
-
     return data;
   };
-
   React.useImperativeHandle(ref, function () {
     return {
       props: props,
@@ -2388,13 +2084,10 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       }
     };
   });
-
   var createTableHeader = function createTableHeader(columns, columnGroup) {
     var sortField = getSortField();
     var sortOrder = getSortOrder();
-
     var multiSortMeta = _toConsumableArray(getMultiSortMeta());
-
     var filters = getFilters();
     return /*#__PURE__*/React.createElement(TreeTableHeader, {
       columns: columns,
@@ -2416,14 +2109,12 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       filterDelay: props.filterDelay
     });
   };
-
   var createTableFooter = function createTableFooter(columns, columnGroup) {
     return /*#__PURE__*/React.createElement(TreeTableFooter, {
       columns: columns,
       columnGroup: columnGroup
     });
   };
-
   var createTableBody = function createTableBody(value, columns) {
     return /*#__PURE__*/React.createElement(TreeTableBody, {
       value: value,
@@ -2454,7 +2145,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onContextMenu: props.onContextMenu
     });
   };
-
   var createPaginator = function createPaginator(position, totalRecords) {
     var className = classNames('p-paginator-' + position, props.paginatorClassName);
     return /*#__PURE__*/React.createElement(Paginator, {
@@ -2473,7 +2163,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       dropdownAppendTo: props.paginatorDropdownAppendTo
     });
   };
-
   var createScrollableView = function createScrollableView(value, columns, frozen, headerColumnGroup, footerColumnGroup) {
     var header = createTableHeader(columns, headerColumnGroup);
     var footer = createTableFooter(columns, footerColumnGroup);
@@ -2488,23 +2177,19 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
       frozenWidth: props.frozenWidth
     });
   };
-
   var createScrollableTable = function createScrollableTable(value) {
     var columns = getColumns();
     var frozenColumns = getFrozenColumns(columns);
     var scrollableColumns = frozenColumns ? getScrollableColumns(columns) : columns;
     var frozenView, scrollableView;
-
     if (frozenColumns) {
       frozenView = createScrollableView(value, frozenColumns, true, props.frozenHeaderColumnGroup, props.frozenFooterColumnGroup);
     }
-
     scrollableView = createScrollableView(value, scrollableColumns, false, props.headerColumnGroup, props.footerColumnGroup);
     return /*#__PURE__*/React.createElement("div", {
       className: "p-treetable-scrollable-wrapper"
     }, frozenView, scrollableView);
   };
-
   var createRegularTable = function createRegularTable(value) {
     var columns = getColumns();
     var header = createTableHeader(columns, props.headerColumnGroup);
@@ -2513,15 +2198,14 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
     return /*#__PURE__*/React.createElement("div", {
       className: "p-treetable-wrapper"
     }, /*#__PURE__*/React.createElement("table", {
+      ref: tableRef,
       style: props.tableStyle,
       className: props.tableClassName
     }, header, footer, body));
   };
-
   var createTable = function createTable(value) {
     return props.scrollable ? createScrollableTable(value) : createRegularTable(value);
   };
-
   var createLoader = function createLoader() {
     if (props.loading) {
       var iconClassName = classNames('p-treetable-loading-icon pi-spin', props.loadingIcon);
@@ -2533,10 +2217,8 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (props, ref) {
         className: iconClassName
       })));
     }
-
     return null;
   };
-
   var data = processData();
   var otherProps = ObjectUtils.findDiffKeys(props, TreeTable.defaultProps);
   var className = classNames('p-treetable p-component', {