material-react-table 0.20.0 → 0.21.0

package/dist/material-react-table.cjs.development.js

@@ -6365,28 +6365,40 @@ var MRT_TableHead = function MRT_TableHead(_ref) {
   }));
 };
 
-/**
- * react-virtual
- *
- * Copyright (c) TanStack
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.md file in the root directory of this source tree.
- *
- * @license MIT
- */
+function _extends$1() {
+  _extends$1 = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
 
-/**
- * virtual-core
- *
- * Copyright (c) TanStack
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.md file in the root directory of this source tree.
- *
- * @license MIT
- */
-var props = ["bottom", "height", "left", "right", "top", "width"];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends$1.apply(this, arguments);
+}
+
+function _objectWithoutPropertiesLoose$2(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+
+  return target;
+}
+
+var props = ['bottom', 'height', 'left', 'right', 'top', 'width'];
 
 var rectChanged = function rectChanged(a, b) {
   if (a === void 0) {
@@ -6456,383 +6468,355 @@ function observeRect(node, cb) {
   };
 }
 
-function memo(getDeps, fn, opts) {
-  let deps = [];
-  let result;
-  return () => {
-    let depTime;
-    if (opts.key && opts.debug != null && opts.debug()) depTime = Date.now();
-    const newDeps = getDeps();
-    const depsChanged = newDeps.length !== deps.length || newDeps.some((dep, index) => deps[index] !== dep);
+var useIsomorphicLayoutEffect$1 = typeof window !== 'undefined' ? React__default.useLayoutEffect : React__default.useEffect;
 
-    if (!depsChanged) {
-      return result;
-    }
-
-    deps = newDeps;
-    let resultTime;
-    if (opts.key && opts.debug != null && opts.debug()) resultTime = Date.now();
-    result = fn(...newDeps);
-    opts == null ? void 0 : opts.onChange == null ? void 0 : opts.onChange(result);
+function useRect(nodeRef, initialRect) {
+  if (initialRect === void 0) {
+    initialRect = {
+      width: 0,
+      height: 0
+    };
+  }
 
-    if (opts.key && opts.debug != null && opts.debug()) {
-      const depEndTime = Math.round((Date.now() - depTime) * 100) / 100;
-      const resultEndTime = Math.round((Date.now() - resultTime) * 100) / 100;
-      const resultFpsPercentage = resultEndTime / 16;
+  var _React$useState = React__default.useState(nodeRef.current),
+      element = _React$useState[0],
+      setElement = _React$useState[1];
 
-      const pad = (str, num) => {
-        str = String(str);
+  var _React$useReducer = React__default.useReducer(rectReducer, initialRect),
+      rect = _React$useReducer[0],
+      dispatch = _React$useReducer[1];
 
-        while (str.length < num) {
-          str = ' ' + str;
-        }
+  var initialRectSet = React__default.useRef(false);
+  useIsomorphicLayoutEffect$1(function () {
+    if (nodeRef.current !== element) {
+      setElement(nodeRef.current);
+    }
+  });
+  useIsomorphicLayoutEffect$1(function () {
+    if (element && !initialRectSet.current) {
+      initialRectSet.current = true;
 
-        return str;
-      };
+      var _rect = element.getBoundingClientRect();
 
-      console.info("%c\u23F1 " + pad(resultEndTime, 5) + " /" + pad(depEndTime, 5) + " ms", "\n            font-size: .6rem;\n            font-weight: bold;\n            color: hsl(" + Math.max(0, Math.min(120 - 120 * resultFpsPercentage, 120)) + "deg 100% 31%);", opts == null ? void 0 : opts.key);
+      dispatch({
+        rect: _rect
+      });
+    }
+  }, [element]);
+  React__default.useEffect(function () {
+    if (!element) {
+      return;
     }
 
-    return result;
-  };
+    var observer = observeRect(element, function (rect) {
+      dispatch({
+        rect: rect
+      });
+    });
+    observer.observe();
+    return function () {
+      observer.unobserve();
+    };
+  }, [element]);
+  return rect;
 }
 
-//
-const defaultKeyExtractor = index => index;
-const defaultRangeExtractor = range => {
-  const start = Math.max(range.startIndex - range.overscan, 0);
-  const end = Math.min(range.endIndex + range.overscan, range.count - 1);
-  const arr = [];
+function rectReducer(state, action) {
+  var rect = action.rect;
 
-  for (let i = start; i <= end; i++) {
-    arr.push(i);
+  if (state.height !== rect.height || state.width !== rect.width) {
+    return rect;
   }
 
-  return arr;
+  return state;
+}
+
+var defaultEstimateSize = function defaultEstimateSize() {
+  return 50;
 };
-const observeElementRect = (instance, cb) => {
-  const observer = observeRect(instance.scrollElement, rect => {
-    cb(rect);
-  });
 
-  if (!instance.scrollElement) {
-    return;
-  }
+var defaultKeyExtractor = function defaultKeyExtractor(index) {
+  return index;
+};
 
-  cb(instance.scrollElement.getBoundingClientRect());
-  observer.observe();
-  return () => {
-    observer.unobserve();
-  };
+var defaultMeasureSize = function defaultMeasureSize(el, horizontal) {
+  var key = horizontal ? 'offsetWidth' : 'offsetHeight';
+  return el[key];
 };
-const observeElementOffset = (instance, cb) => {
-  const onScroll = () => cb(instance.scrollElement[instance.options.horizontal ? 'scrollLeft' : 'scrollTop']);
 
-  if (!instance.scrollElement) {
-    return;
+var defaultRangeExtractor = function defaultRangeExtractor(range) {
+  var start = Math.max(range.start - range.overscan, 0);
+  var end = Math.min(range.end + range.overscan, range.size - 1);
+  var arr = [];
+
+  for (var i = start; i <= end; i++) {
+    arr.push(i);
   }
 
-  onScroll();
-  instance.scrollElement.addEventListener('scroll', onScroll, {
-    capture: false,
-    passive: true
-  });
-  return () => {
-    instance.scrollElement.removeEventListener('scroll', onScroll);
-  };
-};
-const measureElement = (element, instance) => {
-  return element.getBoundingClientRect()[instance.options.horizontal ? 'width' : 'height'];
+  return arr;
 };
-const elementScroll = (offset, canSmooth, instance) => {
-  var _instance$scrollEleme2;
-  (_instance$scrollEleme2 = instance.scrollElement) == null ? void 0 : _instance$scrollEleme2.scrollTo({
-    [instance.options.horizontal ? 'left' : 'top']: offset,
-    behavior: canSmooth ? 'smooth' : undefined
+function useVirtual(_ref) {
+  var _measurements;
+
+  var _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 0 : _ref$size,
+      _ref$estimateSize = _ref.estimateSize,
+      estimateSize = _ref$estimateSize === void 0 ? defaultEstimateSize : _ref$estimateSize,
+      _ref$overscan = _ref.overscan,
+      overscan = _ref$overscan === void 0 ? 1 : _ref$overscan,
+      _ref$paddingStart = _ref.paddingStart,
+      paddingStart = _ref$paddingStart === void 0 ? 0 : _ref$paddingStart,
+      _ref$paddingEnd = _ref.paddingEnd,
+      paddingEnd = _ref$paddingEnd === void 0 ? 0 : _ref$paddingEnd,
+      parentRef = _ref.parentRef,
+      horizontal = _ref.horizontal,
+      scrollToFn = _ref.scrollToFn,
+      useObserver = _ref.useObserver,
+      initialRect = _ref.initialRect,
+      onScrollElement = _ref.onScrollElement,
+      scrollOffsetFn = _ref.scrollOffsetFn,
+      _ref$keyExtractor = _ref.keyExtractor,
+      keyExtractor = _ref$keyExtractor === void 0 ? defaultKeyExtractor : _ref$keyExtractor,
+      _ref$measureSize = _ref.measureSize,
+      measureSize = _ref$measureSize === void 0 ? defaultMeasureSize : _ref$measureSize,
+      _ref$rangeExtractor = _ref.rangeExtractor,
+      rangeExtractor = _ref$rangeExtractor === void 0 ? defaultRangeExtractor : _ref$rangeExtractor;
+  var sizeKey = horizontal ? 'width' : 'height';
+  var scrollKey = horizontal ? 'scrollLeft' : 'scrollTop';
+  var latestRef = React__default.useRef({
+    scrollOffset: 0,
+    measurements: []
   });
-};
-class Virtualizer {
-  constructor(_opts) {
-    var _this = this;
-
-    this.unsubs = [];
-    this.scrollElement = null;
-    this.measurementsCache = [];
-    this.itemMeasurementsCache = {};
-    this.pendingMeasuredCacheIndexes = [];
-
-    this.setOptions = opts => {
-      Object.entries(opts).forEach(_ref => {
-        let [key, value] = _ref;
-        if (typeof value === 'undefined') delete opts[key];
-      });
-      this.options = {
-        debug: false,
-        initialOffset: 0,
-        overscan: 1,
-        paddingStart: 0,
-        paddingEnd: 0,
-        scrollPaddingStart: 0,
-        scrollPaddingEnd: 0,
-        horizontal: false,
-        getItemKey: defaultKeyExtractor,
-        rangeExtractor: defaultRangeExtractor,
-        enableSmoothScroll: true,
-        onChange: () => {},
-        measureElement,
-        initialRect: {
-          width: 0,
-          height: 0
-        },
-        ...opts
-      };
-    };
 
-    this.notify = () => {
-      var _this$options$onChang, _this$options;
+  var _React$useState = React__default.useState(0),
+      scrollOffset = _React$useState[0],
+      setScrollOffset = _React$useState[1];
 
-      (_this$options$onChang = (_this$options = this.options).onChange) == null ? void 0 : _this$options$onChang.call(_this$options, this);
-    };
+  latestRef.current.scrollOffset = scrollOffset;
+  var useMeasureParent = useObserver || useRect;
 
-    this.cleanup = () => {
-      this.unsubs.filter(Boolean).forEach(d => d());
-      this.unsubs = [];
-    };
+  var _useMeasureParent = useMeasureParent(parentRef, initialRect),
+      outerSize = _useMeasureParent[sizeKey];
 
-    this._didMount = () => {
-      return () => {
-        this.cleanup();
-      };
-    };
+  latestRef.current.outerSize = outerSize;
+  var defaultScrollToFn = React__default.useCallback(function (offset) {
+    if (parentRef.current) {
+      parentRef.current[scrollKey] = offset;
+    }
+  }, [parentRef, scrollKey]);
+  var resolvedScrollToFn = scrollToFn || defaultScrollToFn;
+  scrollToFn = React__default.useCallback(function (offset) {
+    resolvedScrollToFn(offset, defaultScrollToFn);
+  }, [defaultScrollToFn, resolvedScrollToFn]);
 
-    this._willUpdate = () => {
-      const scrollElement = this.options.getScrollElement();
-
-      if (this.scrollElement !== scrollElement) {
-        this.cleanup();
-        this.scrollElement = scrollElement;
-        this.unsubs.push(this.options.observeElementRect(this, rect => {
-          this.scrollRect = rect;
-          this.notify();
-        }));
-        this.unsubs.push(this.options.observeElementOffset(this, offset => {
-          this.scrollOffset = offset;
-          this.notify();
-        }));
-      }
-    };
+  var _React$useState2 = React__default.useState({}),
+      measuredCache = _React$useState2[0],
+      setMeasuredCache = _React$useState2[1];
 
-    this.getSize = () => {
-      return this.scrollRect[this.options.horizontal ? 'width' : 'height'];
-    };
-
-    this.getMeasurements = memo(() => [this.options.count, this.options.paddingStart, this.options.getItemKey, this.itemMeasurementsCache], (count, paddingStart, getItemKey, measurementsCache) => {
-      const min = this.pendingMeasuredCacheIndexes.length > 0 ? Math.min(...this.pendingMeasuredCacheIndexes) : 0;
-      this.pendingMeasuredCacheIndexes = [];
-      const measurements = this.measurementsCache.slice(0, min);
-
-      for (let i = min; i < count; i++) {
-        const key = getItemKey(i);
-        const measuredSize = measurementsCache[key];
-        const start = measurements[i - 1] ? measurements[i - 1].end : paddingStart;
-        const size = typeof measuredSize === 'number' ? measuredSize : this.options.estimateSize(i);
-        const end = start + size;
-        measurements[i] = {
-          index: i,
-          start,
-          size,
-          end,
-          key
-        };
-      }
+  var measure = React__default.useCallback(function () {
+    return setMeasuredCache({});
+  }, []);
+  var pendingMeasuredCacheIndexesRef = React__default.useRef([]);
+  var measurements = React__default.useMemo(function () {
+    var min = pendingMeasuredCacheIndexesRef.current.length > 0 ? Math.min.apply(Math, pendingMeasuredCacheIndexesRef.current) : 0;
+    pendingMeasuredCacheIndexesRef.current = [];
+    var measurements = latestRef.current.measurements.slice(0, min);
 
-      this.measurementsCache = measurements;
-      return measurements;
-    }, {
-      key:  'getMeasurements',
-      debug: () => this.options.debug
-    });
-    this.calculateRange = memo(() => [this.getMeasurements(), this.getSize(), this.scrollOffset], (measurements, outerSize, scrollOffset) => {
-      return calculateRange({
-        measurements,
-        outerSize,
-        scrollOffset
-      });
-    }, {
-      key:  'calculateRange',
-      debug: () => this.options.debug
-    });
-    this.getIndexes = memo(() => [this.options.rangeExtractor, this.calculateRange(), this.options.overscan, this.options.count], (rangeExtractor, range, overscan, count) => {
-      return rangeExtractor({ ...range,
-        overscan,
-        count: count
-      });
-    }, {
-      key:  'getIndexes'
-    });
-    this.getVirtualItems = memo(() => [this.getIndexes(), this.getMeasurements(), this.options.measureElement], (indexes, measurements, measureElement) => {
-      const virtualItems = [];
-
-      for (let k = 0, len = indexes.length; k < len; k++) {
-        const i = indexes[k];
-        const measurement = measurements[i];
-        const item = { ...measurement,
-          measureElement: measurableItem => {
-            if (measurableItem) {
-              const measuredItemSize = measureElement(measurableItem, this);
-
-              if (measuredItemSize !== item.size) {
-                if (item.start < this.scrollOffset) {
-                  if ( this.options.debug) console.info('correction', measuredItemSize - item.size);
-
-                  if (!this.destinationOffset) {
-                    this._scrollToOffset(this.scrollOffset + (measuredItemSize - item.size), false);
-                  }
-                }
+    for (var i = min; i < size; i++) {
+      var key = keyExtractor(i);
+      var measuredSize = measuredCache[key];
 
-                this.pendingMeasuredCacheIndexes.push(i);
-                this.itemMeasurementsCache = { ...this.itemMeasurementsCache,
-                  [item.key]: measuredItemSize
-                };
-                this.notify();
-              }
-            }
-          }
-        };
-        virtualItems.push(item);
-      }
+      var _start = measurements[i - 1] ? measurements[i - 1].end : paddingStart;
 
-      return virtualItems;
-    }, {
-      key:  'getIndexes'
-    });
+      var _size = typeof measuredSize === 'number' ? measuredSize : estimateSize(i);
 
-    this.scrollToOffset = function (toOffset, _temp) {
-      let {
-        align
-      } = _temp === void 0 ? {
-        align: 'start'
-      } : _temp;
-
-      const attempt = () => {
-        const offset = _this.scrollOffset;
-
-        const size = _this.getSize();
-
-        if (align === 'auto') {
-          if (toOffset <= offset) {
-            align = 'start';
-          } else if (toOffset >= offset + size) {
-            align = 'end';
-          } else {
-            align = 'start';
-          }
-        }
+      var _end = _start + _size;
 
-        if (align === 'start') {
-          _this._scrollToOffset(toOffset, true);
-        } else if (align === 'end') {
-          _this._scrollToOffset(toOffset - size, true);
-        } else if (align === 'center') {
-          _this._scrollToOffset(toOffset - size / 2, true);
-        }
+      measurements[i] = {
+        index: i,
+        start: _start,
+        size: _size,
+        end: _end,
+        key: key
       };
+    }
 
-      attempt();
-      requestAnimationFrame(() => {
-        attempt();
-      });
-    };
-
-    this.scrollToIndex = function (index, _temp2) {
-      let {
-        align,
-        ...rest
-      } = _temp2 === void 0 ? {
-        align: 'auto'
-      } : _temp2;
-
-      const measurements = _this.getMeasurements();
-
-      const offset = _this.scrollOffset;
+    return measurements;
+  }, [estimateSize, measuredCache, paddingStart, size, keyExtractor]);
+  var totalSize = (((_measurements = measurements[size - 1]) == null ? void 0 : _measurements.end) || paddingStart) + paddingEnd;
+  latestRef.current.measurements = measurements;
+  latestRef.current.totalSize = totalSize;
+  var element = onScrollElement ? onScrollElement.current : parentRef.current;
+  var scrollOffsetFnRef = React__default.useRef(scrollOffsetFn);
+  scrollOffsetFnRef.current = scrollOffsetFn;
+  useIsomorphicLayoutEffect$1(function () {
+    if (!element) {
+      setScrollOffset(0);
+      return;
+    }
 
-      const size = _this.getSize();
+    var onScroll = function onScroll(event) {
+      var offset = scrollOffsetFnRef.current ? scrollOffsetFnRef.current(event) : element[scrollKey];
+      setScrollOffset(offset);
+    };
 
-      const {
-        count
-      } = _this.options;
-      const measurement = measurements[Math.max(0, Math.min(index, count - 1))];
+    onScroll();
+    element.addEventListener('scroll', onScroll, {
+      capture: false,
+      passive: true
+    });
+    return function () {
+      element.removeEventListener('scroll', onScroll);
+    };
+  }, [element, scrollKey]);
+
+  var _calculateRange = calculateRange(latestRef.current),
+      start = _calculateRange.start,
+      end = _calculateRange.end;
+
+  var indexes = React__default.useMemo(function () {
+    return rangeExtractor({
+      start: start,
+      end: end,
+      overscan: overscan,
+      size: measurements.length
+    });
+  }, [start, end, overscan, measurements.length, rangeExtractor]);
+  var measureSizeRef = React__default.useRef(measureSize);
+  measureSizeRef.current = measureSize;
+  var virtualItems = React__default.useMemo(function () {
+    var virtualItems = [];
+
+    var _loop = function _loop(k, len) {
+      var i = indexes[k];
+      var measurement = measurements[i];
+
+      var item = _extends$1(_extends$1({}, measurement), {}, {
+        measureRef: function measureRef(el) {
+          if (el) {
+            var measuredSize = measureSizeRef.current(el, horizontal);
+
+            if (measuredSize !== item.size) {
+              var _scrollOffset = latestRef.current.scrollOffset;
+
+              if (item.start < _scrollOffset) {
+                defaultScrollToFn(_scrollOffset + (measuredSize - item.size));
+              }
 
-      if (!measurement) {
-        return;
-      }
+              pendingMeasuredCacheIndexesRef.current.push(i);
+              setMeasuredCache(function (old) {
+                var _extends2;
 
-      if (align === 'auto') {
-        if (measurement.end >= offset + size - _this.options.scrollPaddingEnd) {
-          align = 'end';
-        } else if (measurement.start <= offset + _this.options.scrollPaddingStart) {
-          align = 'start';
-        } else {
-          return;
+                return _extends$1(_extends$1({}, old), {}, (_extends2 = {}, _extends2[item.key] = measuredSize, _extends2));
+              });
+            }
+          }
         }
-      }
-
-      const toOffset = align === 'end' ? measurement.end + _this.options.scrollPaddingEnd : measurement.start - _this.options.scrollPaddingStart;
-
-      _this.scrollToOffset(toOffset, {
-        align,
-        ...rest
       });
+
+      virtualItems.push(item);
     };
 
-    this.getTotalSize = () => {
-      var _this$getMeasurements;
+    for (var k = 0, len = indexes.length; k < len; k++) {
+      _loop(k);
+    }
 
-      return (((_this$getMeasurements = this.getMeasurements()[this.options.count - 1]) == null ? void 0 : _this$getMeasurements.end) || this.options.paddingStart) + this.options.paddingEnd;
-    };
+    return virtualItems;
+  }, [indexes, defaultScrollToFn, horizontal, measurements]);
+  var mountedRef = React__default.useRef(false);
+  useIsomorphicLayoutEffect$1(function () {
+    if (mountedRef.current) {
+      setMeasuredCache({});
+    }
 
-    this._scrollToOffset = (offset, canSmooth) => {
-      clearTimeout(this.scrollCheckFrame);
-      this.destinationOffset = offset;
-      this.options.scrollToFn(offset, this.options.enableSmoothScroll && canSmooth, this);
-      let scrollCheckFrame;
+    mountedRef.current = true;
+  }, [estimateSize]);
+  var scrollToOffset = React__default.useCallback(function (toOffset, _temp) {
+    var _ref2 = _temp === void 0 ? {} : _temp,
+        _ref2$align = _ref2.align,
+        align = _ref2$align === void 0 ? 'start' : _ref2$align;
 
-      const check = () => {
-        let lastOffset = this.scrollOffset;
-        this.scrollCheckFrame = scrollCheckFrame = setTimeout(() => {
-          if (this.scrollCheckFrame !== scrollCheckFrame) {
-            return;
-          }
+    var _latestRef$current = latestRef.current,
+        scrollOffset = _latestRef$current.scrollOffset,
+        outerSize = _latestRef$current.outerSize;
 
-          if (this.scrollOffset === lastOffset) {
-            this.destinationOffset = undefined;
-            return;
-          }
+    if (align === 'auto') {
+      if (toOffset <= scrollOffset) {
+        align = 'start';
+      } else if (toOffset >= scrollOffset + outerSize) {
+        align = 'end';
+      } else {
+        align = 'start';
+      }
+    }
 
-          lastOffset = this.scrollOffset;
-          check();
-        }, 100);
-      };
+    if (align === 'start') {
+      scrollToFn(toOffset);
+    } else if (align === 'end') {
+      scrollToFn(toOffset - outerSize);
+    } else if (align === 'center') {
+      scrollToFn(toOffset - outerSize / 2);
+    }
+  }, [scrollToFn]);
+  var tryScrollToIndex = React__default.useCallback(function (index, _temp2) {
+    var _ref3 = _temp2 === void 0 ? {} : _temp2,
+        _ref3$align = _ref3.align,
+        align = _ref3$align === void 0 ? 'auto' : _ref3$align,
+        rest = _objectWithoutPropertiesLoose$2(_ref3, ["align"]);
 
-      check();
-    };
+    var _latestRef$current2 = latestRef.current,
+        measurements = _latestRef$current2.measurements,
+        scrollOffset = _latestRef$current2.scrollOffset,
+        outerSize = _latestRef$current2.outerSize;
+    var measurement = measurements[Math.max(0, Math.min(index, size - 1))];
 
-    this.measure = () => {
-      this.itemMeasurementsCache = {};
-      this.notify();
-    };
+    if (!measurement) {
+      return;
+    }
 
-    this.setOptions(_opts);
-    this.scrollRect = this.options.initialRect;
-    this.scrollOffset = this.options.initialOffset;
-  }
+    if (align === 'auto') {
+      if (measurement.end >= scrollOffset + outerSize) {
+        align = 'end';
+      } else if (measurement.start <= scrollOffset) {
+        align = 'start';
+      } else {
+        return;
+      }
+    }
 
+    var toOffset = align === 'center' ? measurement.start + measurement.size / 2 : align === 'end' ? measurement.end : measurement.start;
+    scrollToOffset(toOffset, _extends$1({
+      align: align
+    }, rest));
+  }, [scrollToOffset, size]);
+  var scrollToIndex = React__default.useCallback(function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    // We do a double request here because of
+    // dynamic sizes which can cause offset shift
+    // and end up in the wrong spot. Unfortunately,
+    // we can't know about those dynamic sizes until
+    // we try and render them. So double down!
+    tryScrollToIndex.apply(void 0, args);
+    requestAnimationFrame(function () {
+      tryScrollToIndex.apply(void 0, args);
+    });
+  }, [tryScrollToIndex]);
+  return {
+    virtualItems: virtualItems,
+    totalSize: totalSize,
+    scrollToOffset: scrollToOffset,
+    scrollToIndex: scrollToIndex,
+    measure: measure
+  };
 }
 
-const findNearestBinarySearch = (low, high, getCurrentValue, value) => {
+var findNearestBinarySearch = function findNearestBinarySearch(low, high, getCurrentValue, value) {
   while (low <= high) {
-    const middle = (low + high) / 2 | 0;
-    const currentValue = getCurrentValue(middle);
+    var middle = (low + high) / 2 | 0;
+    var currentValue = getCurrentValue(middle);
 
     if (currentValue < value) {
       low = middle + 1;
@@ -6850,57 +6834,27 @@ const findNearestBinarySearch = (low, high, getCurrentValue, value) => {
   }
 };
 
-function calculateRange(_ref2) {
-  let {
-    measurements,
-    outerSize,
-    scrollOffset
-  } = _ref2;
-  const count = measurements.length - 1;
+function calculateRange(_ref4) {
+  var measurements = _ref4.measurements,
+      outerSize = _ref4.outerSize,
+      scrollOffset = _ref4.scrollOffset;
+  var size = measurements.length - 1;
 
-  const getOffset = index => measurements[index].start;
+  var getOffset = function getOffset(index) {
+    return measurements[index].start;
+  };
 
-  const startIndex = findNearestBinarySearch(0, count, getOffset, scrollOffset);
-  let endIndex = startIndex;
+  var start = findNearestBinarySearch(0, size, getOffset, scrollOffset);
+  var end = start;
 
-  while (endIndex < count && measurements[endIndex].end < scrollOffset + outerSize) {
-    endIndex++;
+  while (end < size && measurements[end].end < scrollOffset + outerSize) {
+    end++;
   }
 
   return {
-    startIndex,
-    endIndex
-  };
-}
-
-const useIsomorphicLayoutEffect$1 = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
-
-function useVirtualizerBase(options) {
-  const rerender = React.useReducer(() => ({}), {})[1];
-  const resolvedOptions = { ...options,
-    onChange: instance => {
-      rerender();
-      options.onChange == null ? void 0 : options.onChange(instance);
-    }
+    start: start,
+    end: end
   };
-  const [instance] = React.useState(() => new Virtualizer(resolvedOptions));
-  instance.setOptions(resolvedOptions);
-  React.useEffect(() => {
-    return instance._didMount();
-  }, []);
-  useIsomorphicLayoutEffect$1(() => {
-    return instance._willUpdate();
-  });
-  return instance;
-}
-
-function useVirtualizer(options) {
-  return useVirtualizerBase({
-    observeElementRect: observeElementRect,
-    observeElementOffset: observeElementOffset,
-    scrollToFn: elementScroll,
-    ...options
-  });
 }
 
 var MRT_EditCellTextField = function MRT_EditCellTextField(_ref) {
@@ -7308,23 +7262,19 @@ var MRT_TableBody = function MRT_TableBody(_ref) {
 
     return enablePagination ? getRowModel().rows : getPrePaginationRowModel().rows;
   }, [enableGlobalFilterRankedResults, enableGlobalFilterRankedResults && globalFilter || !enablePagination ? getPrePaginationRowModel().rows : getRowModel().rows, globalFilter]);
-  var rowVirtualizer = enableRowVirtualization ? useVirtualizer(_extends({
-    count: rows.length,
-    estimateSize: function estimateSize() {
-      return density === 'compact' ? 25 : 50;
-    },
-    getScrollElement: function getScrollElement() {
-      return tableContainerRef.current;
-    },
-    overscan: density === 'compact' ? 30 : 10
+  var rowVirtualizer = enableRowVirtualization ? useVirtual(_extends({
+    // estimateSize: () => (density === 'compact' ? 25 : 50),
+    overscan: density === 'compact' ? 30 : 10,
+    parentRef: tableContainerRef,
+    size: rows.length
   }, virtualizerProps)) : {};
-  var virtualRows = enableRowVirtualization ? rowVirtualizer.getVirtualItems() : [];
+  var virtualRows = enableRowVirtualization ? rowVirtualizer.virtualItems : [];
   var paddingTop = 0;
   var paddingBottom = 0;
 
   if (enableRowVirtualization) {
     paddingTop = virtualRows.length > 0 ? virtualRows[0].start : 0;
-    paddingBottom = virtualRows.length > 0 ? rowVirtualizer.getTotalSize() - virtualRows[virtualRows.length - 1].end : 0;
+    paddingBottom = virtualRows.length > 0 ? rowVirtualizer.totalSize - virtualRows[virtualRows.length - 1].end : 0;
   }
 
   return React__default.createElement(material.TableBody, Object.assign({}, tableBodyProps), enableRowVirtualization && paddingTop > 0 && React__default.createElement("tr", null, React__default.createElement("td", {