primereact 8.7.2 → 9.0.0-beta.1

package/treetable/treetable.cjs.js

@@ -39,20 +39,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,
@@ -63,17 +88,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;
 }
 
@@ -107,33 +129,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() {
@@ -144,83 +166,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__namespace.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      editingState = _React$useState2[0],
-      setEditingState = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    editingState = _React$useState2[0],
+    setEditingState = _React$useState2[1];
   var elementRef = React__namespace.useRef(null);
   var keyHelperRef = React__namespace.useRef(null);
   var selfClick = React__namespace.useRef(false);
   var overlayEventListener = React__namespace.useRef(null);
   var tabIndexTimeout = React__namespace.useRef(null);
-
   var _useEventListener = hooks.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.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.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();
       }
@@ -228,19 +234,15 @@ var TreeTableBodyCell = function TreeTableBodyCell(props) {
       closeCell();
     }
   };
-
   React__namespace.useEffect(function () {
     if (elementRef.current && props.editor) {
       clearTimeout(tabIndexTimeout.current);
-
       if (editingState) {
         var focusable = utils.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 () {
@@ -268,7 +270,6 @@ var TreeTableBodyCell = function TreeTableBodyCell(props) {
   });
   var style = props.bodyStyle || props.style;
   var content;
-
   if (editingState) {
     if (props.editor) content = utils.ObjectUtils.getJSXElement(props.editor, {
       node: props.node,
@@ -285,9 +286,8 @@ var TreeTableBodyCell = function TreeTableBodyCell(props) {
       props: props
     });else content = utils.ObjectUtils.resolveFieldData(props.node.data, props.field);
   }
-  /* eslint-disable */
-
 
+  /* eslint-disable */
   var editorKeyHelper = props.editor && /*#__PURE__*/React__namespace.createElement("a", {
     tabIndex: 0,
     ref: keyHelperRef,
@@ -307,13 +307,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__namespace.memo(function (props) {
   var elementRef = React__namespace.useRef(null);
@@ -321,13 +317,11 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
   var checkboxBoxRef = React__namespace.useRef(null);
   var nodeTouched = React__namespace.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;
@@ -337,10 +331,8 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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,
@@ -348,7 +340,6 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
     });
     invokeToggleEvents(event, false);
   };
-
   var invokeToggleEvents = function invokeToggleEvents(event, expanded) {
     if (expanded) {
       if (props.onExpand) {
@@ -366,26 +357,20 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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,
@@ -393,7 +378,6 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
           selectionKeys: selectionKeys
         });
       }
-
       if (props.onUnselect) {
         props.onUnselect({
           originalEvent: event,
@@ -404,7 +388,6 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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,
@@ -412,7 +395,6 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
           selectionKeys: selectionKeys
         });
       }
-
       if (props.onSelect) {
         props.onSelect({
           originalEvent: event,
@@ -420,36 +402,29 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
         });
       }
     }
-
     if (props.onSelectionChange) {
       props.onSelectionChange({
         originalEvent: event,
         value: selectionKeys
       });
     }
-
     utils.DomHandler.clearSelection();
   };
-
   var onCheckboxFocus = function onCheckboxFocus() {
     utils.DomHandler.addClass(checkboxBoxRef.current, 'p-focus');
     utils.DomHandler.addClass(checkboxRef.current, 'p-checkbox-focused');
   };
-
   var onCheckboxBlur = function onCheckboxBlur() {
     utils.DomHandler.removeClass(checkboxBoxRef.current, 'p-focus');
     utils.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;
@@ -460,7 +435,6 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
     } finally {
       _iterator.f();
     }
-
     if (check && checkedChildCount === props.node.children.length) {
       selectionKeys[props.node.key] = {
         checked: true,
@@ -470,7 +444,6 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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
@@ -479,35 +452,29 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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) {
     utils.DomHandler.clearSelection();
-
     if (props.onContextMenuSelectionChange) {
       props.onContextMenuSelectionChange({
         originalEvent: event,
         value: props.node.key
       });
     }
-
     if (props.onContextMenu) {
       props.onContextMenu({
         originalEvent: event,
@@ -515,53 +482,45 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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();
@@ -569,19 +528,15 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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 ? PrimeReact.ariaLabel('collapseLabel') : PrimeReact.ariaLabel('expandLabel');
     var iconClassName = utils.classNames('p-treetable-toggler-icon pi pi-fw', {
@@ -604,17 +559,14 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
       "aria-hidden": "true"
     }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
   };
-
   var createCheckbox = function createCheckbox() {
     if (props.selectionMode === 'checkbox' && props.node.selectable !== false) {
       var checked = isChecked();
       var partialChecked = isPartialChecked();
-
       var _className = utils.classNames('p-checkbox-box', {
         'p-highlight': checked,
         'p-indeterminate': partialChecked
       });
-
       var icon = utils.classNames('p-checkbox-icon p-c', {
         'pi pi-check': checked,
         'pi pi-minus': partialChecked
@@ -641,15 +593,12 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
       return null;
     }
   };
-
   var createCell = function createCell(column) {
     var toggler, checkbox;
-
     if (column.props.expander) {
       toggler = createToggler();
       checkbox = createCheckbox();
     }
-
     return /*#__PURE__*/React__namespace.createElement(TreeTableBodyCell, _extends({
       key: column.props.columnKey || column.props.field
     }, column.props, {
@@ -660,7 +609,6 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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) {
@@ -695,19 +643,16 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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 = utils.classNames(className, props.node.className);
   return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("tr", {
     ref: elementRef,
@@ -723,30 +668,22 @@ var TreeTableRow = /*#__PURE__*/React__namespace.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__namespace.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));
         }
@@ -756,14 +693,11 @@ var TreeTableBody = /*#__PURE__*/React__namespace.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({
@@ -771,13 +705,10 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
         node: node
       });
     }
-
     var targetNode = event.target.nodeName;
-
     if (targetNode === 'INPUT' || targetNode === 'BUTTON' || targetNode === 'A' || utils.DomHandler.hasClass(event.target, 'p-clickable')) {
       return;
     }
-
     if ((isSingleSelectionMode || isMultipleSelectionMode) && node.selectable !== false) {
       var selectionKeys;
       var selected = isSelected(node);
@@ -786,26 +717,25 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
       var rowIndex = flatKeys.findIndex(function (key) {
         return key === node.key;
       });
-
       if (isMultipleSelectionMode && event.shiftKey) {
-        utils.DomHandler.clearSelection(); // find first selected row
+        utils.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;
@@ -813,7 +743,6 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
               selectionKeys = _objectSpread$1({}, props.selectionKeys);
               delete selectionKeys[node.key];
             }
-
             if (props.onUnselect) {
               props.onUnselect({
                 originalEvent: event,
@@ -827,7 +756,6 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
               selectionKeys = !metaKey ? {} : props.selectionKeys ? _objectSpread$1({}, props.selectionKeys) : {};
               selectionKeys[node.key] = true;
             }
-
             if (props.onSelect) {
               props.onSelect({
                 originalEvent: event,
@@ -839,7 +767,6 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
           if (isSingleSelectionMode) {
             if (selected) {
               selectionKeys = null;
-
               if (props.onUnselect) {
                 props.onUnselect({
                   originalEvent: event,
@@ -848,7 +775,6 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
               }
             } else {
               selectionKeys = node.key;
-
               if (props.onSelect) {
                 props.onSelect({
                   originalEvent: event,
@@ -860,7 +786,6 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
             if (selected) {
               selectionKeys = _objectSpread$1({}, props.selectionKeys);
               delete selectionKeys[node.key];
-
               if (props.onUnselect) {
                 props.onUnselect({
                   originalEvent: event,
@@ -870,7 +795,6 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
             } else {
               selectionKeys = props.selectionKeys ? _objectSpread$1({}, props.selectionKeys) : {};
               selectionKeys[node.key] = true;
-
               if (props.onSelect) {
                 props.onSelect({
                   originalEvent: event,
@@ -881,7 +805,6 @@ var TreeTableBody = /*#__PURE__*/React__namespace.memo(function (props) {
           }
         }
       }
-
       if (props.onSelectionChange) {
         props.onSelectionChange({
           originalEvent: event,
@@ -890,11 +813,9 @@ var TreeTableBody = /*#__PURE__*/React__namespace.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__namespace.createElement(TreeTableRow, {
       key: node.key || JSON.stringify(node.data),
@@ -922,40 +843,33 @@ var TreeTableBody = /*#__PURE__*/React__namespace.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 || PrimeReact.localeOption('emptyMessage');
-
       return /*#__PURE__*/React__namespace.createElement("tr", null, /*#__PURE__*/React__namespace.createElement("td", {
         className: "p-treetable-emptymessage",
         colSpan: colSpan
       }, _content));
     }
   };
-
   var content = props.value && props.value.length ? createRows() : createEmptyMessage();
   return /*#__PURE__*/React__namespace.createElement("tbody", {
     className: "p-treetable-tbody"
@@ -973,7 +887,6 @@ var TreeTableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
       colSpan: column.props.colSpan
     }, column.props.footer);
   };
-
   var createFooterRow = function createFooterRow(row, index) {
     var rowColumns = React__namespace.Children.toArray(row.props.children);
     var rowFooterCells = rowColumns.map(createFooterCell);
@@ -981,12 +894,10 @@ var TreeTableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
       key: index
     }, rowFooterCells);
   };
-
   var createColumnGroup = function createColumnGroup() {
     var rows = React__namespace.Children.toArray(props.columnGroup.props.children);
     return rows.map(createFooterRow);
   };
-
   var createColumns = function createColumns(columns) {
     if (columns) {
       var headerCells = columns.map(createFooterCell);
@@ -995,7 +906,6 @@ var TreeTableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
       return null;
     }
   };
-
   var hasFooter = function hasFooter() {
     if (props.columnGroup) {
       return true;
@@ -1006,12 +916,9 @@ var TreeTableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
         }
       }
     }
-
     return false;
   };
-
   var content = props.columnGroup ? createColumnGroup() : createColumns(props.columns);
-
   if (hasFooter()) {
     return /*#__PURE__*/React__namespace.createElement("tfoot", {
       className: "p-treetable-tfoot"
@@ -1023,17 +930,13 @@ var TreeTableFooter = /*#__PURE__*/React__namespace.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__namespace.memo(function (props) {
   var filterTimeout = React__namespace.useRef(null);
-
   var onHeaderClick = function onHeaderClick(event, column) {
     if (column.props.sortable) {
       var targetNode = event.target;
-
       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')) {
         props.onSort({
           originalEvent: event,
@@ -1045,20 +948,17 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.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++) {
@@ -1067,10 +967,8 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
         }
       }
     }
-
     return -1;
   };
-
   var onResizerMouseDown = function onResizerMouseDown(event, column) {
     if (props.resizableColumns && props.onResizeStart) {
       props.onResizeStart({
@@ -1080,7 +978,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       });
     }
   };
-
   var _onDragStart = function onDragStart(event, column) {
     if (props.onDragStart) {
       props.onDragStart({
@@ -1089,7 +986,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       });
     }
   };
-
   var _onDragOver = function onDragOver(event, column) {
     if (props.onDragOver) {
       props.onDragOver({
@@ -1098,7 +994,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       });
     }
   };
-
   var _onDragLeave = function onDragLeave(event, column) {
     if (props.onDragLeave) {
       props.onDragLeave({
@@ -1107,7 +1002,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       });
     }
   };
-
   var _onDrop = function onDrop(event, column) {
     if (props.onDrop) {
       props.onDrop({
@@ -1116,13 +1010,11 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.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({
@@ -1134,16 +1026,13 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.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;
           }
@@ -1154,10 +1043,8 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.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';
@@ -1166,15 +1053,12 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.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';
@@ -1186,7 +1070,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       return null;
     }
   };
-
   var createResizer = function createResizer(column) {
     if (props.resizableColumns) {
       return /*#__PURE__*/React__namespace.createElement("span", {
@@ -1199,20 +1082,16 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       return null;
     }
   };
-
   var createSortBadge = function createSortBadge(sortMetaDataIndex) {
     if (sortMetaDataIndex !== -1 && props.multiSortMeta && props.multiSortMeta.length > 1) {
       return /*#__PURE__*/React__namespace.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__namespace.createElement(inputtext.InputText, {
         onInput: function onInput(e) {
@@ -1225,7 +1104,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
         maxLength: column.props.filterMaxLength
       });
     }
-
     if (options.filterOnly) {
       return /*#__PURE__*/React__namespace.createElement("th", {
         key: column.props.columnKey || column.props.field || options.index,
@@ -1293,7 +1171,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       }, column.props.headerTooltipOptions)));
     }
   };
-
   var createHeaderRow = function createHeaderRow(row, index) {
     var rowColumns = React__namespace.Children.toArray(row.props.children);
     var rowHeaderCells = rowColumns.map(function (col, i) {
@@ -1307,12 +1184,10 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       key: index
     }, rowHeaderCells);
   };
-
   var createColumnGroup = function createColumnGroup() {
     var rows = React__namespace.Children.toArray(props.columnGroup.props.children);
     return rows.map(createHeaderRow);
   };
-
   var createColumns = function createColumns(columns) {
     if (columns) {
       if (hasColumnFilter(columns)) {
@@ -1342,7 +1217,6 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       return null;
     }
   };
-
   var content = props.columnGroup ? createColumnGroup() : createColumns(props.columns);
   return /*#__PURE__*/React__namespace.createElement("thead", {
     className: "p-treetable-thead"
@@ -1358,18 +1232,15 @@ var TreeTableScrollableView = /*#__PURE__*/React__namespace.memo(function (props
   var scrollTableRef = React__namespace.useRef(null);
   var scrollFooterRef = React__namespace.useRef(null);
   var scrollFooterBoxRef = React__namespace.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 = utils.DomHandler.getOuterHeight(datatableContainer);
         var relativeHeight = utils.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';
@@ -1379,49 +1250,38 @@ var TreeTableScrollableView = /*#__PURE__*/React__namespace.memo(function (props
       }
     }
   };
-
   var findDataTableContainer = function findDataTableContainer(element) {
     if (element) {
       var el = element;
-
       while (el && !utils.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 = utils.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;
     }
   };
-
   hooks.useMountEffect(function () {
     if (!props.frozen) {
       var scrollBarWidth = utils.DomHandler.calculateScrollbarWidth();
       scrollHeaderBoxRef.current.style.marginRight = scrollBarWidth + 'px';
-
       if (scrollFooterBoxRef.current) {
         scrollFooterBoxRef.current.style.marginRight = scrollBarWidth + 'px';
       }
@@ -1432,7 +1292,6 @@ var TreeTableScrollableView = /*#__PURE__*/React__namespace.memo(function (props
   React__namespace.useEffect(function () {
     setScrollHeight();
   });
-
   var createColGroup = function createColGroup() {
     if (utils.ObjectUtils.isNotEmpty(props.columns)) {
       var cols = props.columns.map(function (col, i) {
@@ -1447,7 +1306,6 @@ var TreeTableScrollableView = /*#__PURE__*/React__namespace.memo(function (props
       return null;
     }
   };
-
   var className = utils.classNames('p-treetable-scrollable-view', {
     'p-treetable-frozen-view': props.frozen,
     'p-treetable-unfrozen-view': !props.frozen && props.frozenWidth
@@ -1498,56 +1356,45 @@ var TreeTableScrollableView = /*#__PURE__*/React__namespace.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__namespace.forwardRef(function (props, ref) {
   var _React$useState = React__namespace.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__namespace.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__namespace.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__namespace.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__namespace.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__namespace.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__namespace.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__namespace.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__namespace.useRef(null);
+  var tableRef = React__namespace.useRef(null);
   var resizerHelperRef = React__namespace.useRef(null);
   var reorderIndicatorUpRef = React__namespace.useRef(null);
   var reorderIndicatorDownRef = React__namespace.useRef(null);
@@ -1563,32 +1410,29 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
   var columnSortable = React__namespace.useRef(null);
   var columnSortFunction = React__namespace.useRef(null);
   var columnField = React__namespace.useRef(null);
-
   var _useEventListener = hooks.useEventListener({
-    type: 'mousemove',
-    listener: function listener(event) {
-      if (columnResizing.current) {
-        onColumnResize(event);
+      type: 'mousemove',
+      listener: function listener(event) {
+        if (columnResizing.current) {
+          onColumnResize(event);
+        }
       }
-    }
-  }),
-      _useEventListener2 = _slicedToArray(_useEventListener, 2),
-      bindDocumentMouseMoveListener = _useEventListener2[0],
-      unbindDocumentMouseMoveListener = _useEventListener2[1];
-
+    }),
+    _useEventListener2 = _slicedToArray(_useEventListener, 2),
+    bindDocumentMouseMoveListener = _useEventListener2[0],
+    unbindDocumentMouseMoveListener = _useEventListener2[1];
   var _useEventListener3 = hooks.useEventListener({
-    type: 'mouseup',
-    listener: function listener(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);
@@ -1596,7 +1440,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
       setExpandedKeysState(event.value);
     }
   };
-
   var onPageChange = function onPageChange(event) {
     if (props.onPage) {
       props.onPage(event);
@@ -1605,7 +1448,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
       setRowsState(event.rows);
     }
   };
-
   var onSort = function onSort(event) {
     var sortField = event.sortField;
     var sortOrder = props.defaultSortOrder;
@@ -1614,49 +1456,40 @@ var TreeTable = /*#__PURE__*/React__namespace.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 {
@@ -1666,48 +1499,37 @@ var TreeTable = /*#__PURE__*/React__namespace.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,
@@ -1721,53 +1543,43 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
         var value2 = utils.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 = utils.ObjectUtils.resolveFieldData(node1.data, multiSortMeta[index].field);
-    var value2 = utils.ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].field); // check if they are equal handling dates and locales
+    var value2 = utils.ObjectUtils.resolveFieldData(node2.data, multiSortMeta[index].field);
 
+    // check if they are equal handling dates and locales
     if (utils.ObjectUtils.compare(value1, value2, PrimeReact__default["default"].locale) === 0) {
       return multiSortMeta.length - 1 > index ? multisortField(node1, node2, multiSortMeta, index + 1) : 0;
     }
-
     return compareValuesOnSort(value1, value2, multiSortMeta[index].order);
   };
-
   var compareValuesOnSort = function compareValuesOnSort(value1, value2, order) {
     return utils.ObjectUtils.sort(value1, value2, order, PrimeReact__default["default"].locale, PrimeReact__default["default"].nullSortOrder);
   };
-
   var filter = function filter(value, field, mode) {
     onFilter({
       value: value,
@@ -1775,7 +1587,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
       matchMode: mode
     });
   };
-
   var onFilter = function onFilter(event) {
     var filters = getFilters();
     var newFilters = filters ? _objectSpread({}, filters) : {};
@@ -1783,7 +1594,6 @@ var TreeTable = /*#__PURE__*/React__namespace.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
@@ -1793,15 +1603,12 @@ var TreeTable = /*#__PURE__*/React__namespace.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 = utils.DomHandler.getOffset(elementRef.current).left;
     resizeColumn.current = event.columnEl;
@@ -1810,7 +1617,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     lastResizerHelperX.current = event.originalEvent.pageX - containerLeft + elementRef.current.scrollLeft;
     bindColumnResizeEvents();
   };
-
   var onColumnResize = function onColumnResize(event) {
     var containerLeft = utils.DomHandler.getOffset(elementRef.current).left;
     utils.DomHandler.addClass(elementRef.current, 'p-unselectable-text');
@@ -1819,18 +1625,15 @@ var TreeTable = /*#__PURE__*/React__namespace.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);
@@ -1843,7 +1646,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
             resizeColGroup(scrollableFooterTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
           } else {
             resizeColumn.current.style.width = newColumnWidth + 'px';
-
             if (nextColumn) {
               nextColumn.style.width = nextColumnWidth + 'px';
             }
@@ -1852,31 +1654,23 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
       } else if (props.columnResizeMode === 'expand') {
         if (props.scrollable) {
           var _scrollableView = findParentScrollableView(resizeColumn.current);
-
           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');
-
           _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 = utils.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,
@@ -1885,37 +1679,30 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
         });
       }
     }
-
     resizerHelperRef.current.style.display = 'none';
     resizeColumn.current = null;
     resizeColumnProps.current = null;
     utils.DomHandler.removeClass(elementRef.current, 'p-unselectable-text');
     unbindColumnResizeEvents();
   };
-
   var findParentScrollableView = function findParentScrollableView(column) {
     if (column) {
       var parent = column.parentElement;
-
       while (parent && !utils.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';
         }
@@ -1924,26 +1711,21 @@ var TreeTable = /*#__PURE__*/React__namespace.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 = utils.DomHandler.getHiddenElementOuterWidth(reorderIndicatorUpRef.current);
     iconHeight.current = utils.DomHandler.getHiddenElementOuterHeight(reorderIndicatorUpRef.current);
     draggedColumnEl.current = findParentHeader(event.currentTarget);
@@ -1954,19 +1736,16 @@ var TreeTable = /*#__PURE__*/React__namespace.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 = utils.DomHandler.getOffset(elementRef.current);
       var dropHeaderOffset = utils.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';
@@ -1976,65 +1755,51 @@ var TreeTable = /*#__PURE__*/React__namespace.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 = utils.DomHandler.index(draggedColumnEl.current);
       var dropIndex = utils.DomHandler.index(findParentHeader(event.currentTarget));
       var allowDrop = dragIndex !== dropIndex;
-
       if (allowDrop && (dropIndex - dragIndex === 1 && dropPosition.current === -1 || dragIndex - dropIndex === 1 && dropPosition.current === 1)) {
         allowDrop = false;
       }
-
       if (allowDrop) {
         var columns = columnOrderState ? getColumns() : React__namespace.Children.toArray(props.children);
-
         var isSameColumn = function isSameColumn(col1, col2) {
           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) {
           return isSameColumn(child, draggedColumn.current);
         });
         var dropColIndex = columns.findIndex(function (child) {
           return isSameColumn(child, column);
         });
-
         if (dropColIndex < dragColIndex && dropPosition.current === 1) {
           dropColIndex++;
         }
-
         if (dropColIndex > dragColIndex && dropPosition.current === -1) {
           dropColIndex--;
         }
-
         utils.ObjectUtils.reorderArray(columns, dragColIndex, dropColIndex);
         var columnOrder = [];
-
         var _iterator = _createForOfIteratorHelper(columns),
-            _step;
-
+          _step;
         try {
           for (_iterator.s(); !(_step = _iterator.n()).done;) {
             var _column = _step.value;
@@ -2045,9 +1810,7 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
         } finally {
           _iterator.f();
         }
-
         setColumnOrderState(columnOrder);
-
         if (props.onColReorder) {
           props.onColReorder({
             dragIndex: dragColIndex,
@@ -2056,7 +1819,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
           });
         }
       }
-
       reorderIndicatorUpRef.current.style.display = 'none';
       reorderIndicatorDownRef.current.style.display = 'none';
       draggedColumnEl.current.draggable = false;
@@ -2064,79 +1826,61 @@ var TreeTable = /*#__PURE__*/React__namespace.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__namespace.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);
             }
@@ -2146,7 +1890,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
         } finally {
           _iterator2.f();
         }
-
         return [].concat(orderedColumns, _toConsumableArray(columns.filter(function (item) {
           return orderedColumns.indexOf(item) < 0;
         })));
@@ -2154,36 +1897,27 @@ var TreeTable = /*#__PURE__*/React__namespace.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);
@@ -2194,20 +1928,15 @@ var TreeTable = /*#__PURE__*/React__namespace.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);
@@ -2218,37 +1947,31 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     } finally {
       _iterator4.f();
     }
-
     return scrollableColumns;
   };
-
   var filterLocal = function filterLocal(value) {
     var filteredNodes = [];
     var filters = getFilters();
     var columns = React__namespace.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;
@@ -2270,20 +1993,17 @@ var TreeTable = /*#__PURE__*/React__namespace.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 = PrimeReact.FilterService.filters[props.globalFilterMatchMode];
             paramsWithoutNode = {
@@ -2292,20 +2012,16 @@ var TreeTable = /*#__PURE__*/React__namespace.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);
         }
@@ -2315,28 +2031,20 @@ var TreeTable = /*#__PURE__*/React__namespace.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);
@@ -2348,26 +2056,22 @@ var TreeTable = /*#__PURE__*/React__namespace.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 = utils.ObjectUtils.resolveFieldData(node.data, filterField);
-
     if (filterConstraint(dataFieldValue, filterValue, props.filterLocale, options)) {
       matched = true;
     }
-
     if (!matched || isStrictMode && !isNodeLeaf(node)) {
       matched = findFilteredNodes(node, {
         filterField: filterField,
@@ -2376,36 +2080,28 @@ var TreeTable = /*#__PURE__*/React__namespace.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 (utils.ObjectUtils.isNotEmpty(filters) || props.globalFilter) {
           data = filterLocal(data);
         }
-
         if (sortField || utils.ObjectUtils.isNotEmpty(multiSortMeta)) {
           if (props.sortMode === 'single') data = sortSingle(data);else if (props.sortMode === 'multiple') data = sortMultiple(data);
         }
       }
     }
-
     return data;
   };
-
   React__namespace.useImperativeHandle(ref, function () {
     return {
       props: props,
@@ -2415,13 +2111,10 @@ var TreeTable = /*#__PURE__*/React__namespace.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__namespace.createElement(TreeTableHeader, {
       columns: columns,
@@ -2443,14 +2136,12 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
       filterDelay: props.filterDelay
     });
   };
-
   var createTableFooter = function createTableFooter(columns, columnGroup) {
     return /*#__PURE__*/React__namespace.createElement(TreeTableFooter, {
       columns: columns,
       columnGroup: columnGroup
     });
   };
-
   var createTableBody = function createTableBody(value, columns) {
     return /*#__PURE__*/React__namespace.createElement(TreeTableBody, {
       value: value,
@@ -2481,7 +2172,6 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
       onContextMenu: props.onContextMenu
     });
   };
-
   var createPaginator = function createPaginator(position, totalRecords) {
     var className = utils.classNames('p-paginator-' + position, props.paginatorClassName);
     return /*#__PURE__*/React__namespace.createElement(paginator.Paginator, {
@@ -2500,7 +2190,6 @@ var TreeTable = /*#__PURE__*/React__namespace.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);
@@ -2515,23 +2204,19 @@ var TreeTable = /*#__PURE__*/React__namespace.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__namespace.createElement("div", {
       className: "p-treetable-scrollable-wrapper"
     }, frozenView, scrollableView);
   };
-
   var createRegularTable = function createRegularTable(value) {
     var columns = getColumns();
     var header = createTableHeader(columns, props.headerColumnGroup);
@@ -2540,15 +2225,14 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     return /*#__PURE__*/React__namespace.createElement("div", {
       className: "p-treetable-wrapper"
     }, /*#__PURE__*/React__namespace.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 = utils.classNames('p-treetable-loading-icon pi-spin', props.loadingIcon);
@@ -2560,10 +2244,8 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
         className: iconClassName
       })));
     }
-
     return null;
   };
-
   var data = processData();
   var otherProps = utils.ObjectUtils.findDiffKeys(props, TreeTable.defaultProps);
   var className = utils.classNames('p-treetable p-component', {