primereact 9.1.1 → 9.2.1

package/virtualscroller/virtualscroller.js

@@ -139,14 +139,18 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       id: null,
       style: null,
       className: null,
+      tabIndex: 0,
       items: null,
       itemSize: 0,
       scrollHeight: null,
       scrollWidth: null,
       orientation: 'vertical',
+      step: 0,
       numToleratedItems: null,
       delay: 0,
       resizeDelay: 10,
+      appendOnly: false,
+      inline: false,
       lazy: false,
       disabled: false,
       loaderDisabled: false,
@@ -176,6 +180,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
   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 VirtualScroller = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
     var props = VirtualScrollerBase.getProps(inProps);
+    var prevProps = hooks.usePrevious(inProps) || {};
     var vertical = props.orientation === 'vertical';
     var horizontal = props.orientation === 'horizontal';
     var both = props.orientation === 'both';
@@ -193,25 +198,29 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       _React$useState4 = _slicedToArray(_React$useState3, 2),
       lastState = _React$useState4[0],
       setLastState = _React$useState4[1];
-    var _React$useState5 = React__namespace.useState(both ? {
+    var _React$useState5 = React__namespace.useState(0),
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      pageState = _React$useState6[0],
+      setPageState = _React$useState6[1];
+    var _React$useState7 = React__namespace.useState(both ? {
         rows: 0,
         cols: 0
       } : 0),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      numItemsInViewportState = _React$useState6[0],
-      setNumItemsInViewportState = _React$useState6[1];
-    var _React$useState7 = React__namespace.useState(props.numToleratedItems),
       _React$useState8 = _slicedToArray(_React$useState7, 2),
-      numToleratedItemsState = _React$useState8[0],
-      setNumToleratedItemsState = _React$useState8[1];
-    var _React$useState9 = React__namespace.useState(props.loading || false),
+      numItemsInViewportState = _React$useState8[0],
+      setNumItemsInViewportState = _React$useState8[1];
+    var _React$useState9 = React__namespace.useState(props.numToleratedItems),
       _React$useState10 = _slicedToArray(_React$useState9, 2),
-      loadingState = _React$useState10[0],
-      setLoadingState = _React$useState10[1];
-    var _React$useState11 = React__namespace.useState([]),
+      numToleratedItemsState = _React$useState10[0],
+      setNumToleratedItemsState = _React$useState10[1];
+    var _React$useState11 = React__namespace.useState(props.loading || false),
       _React$useState12 = _slicedToArray(_React$useState11, 2),
-      loaderArrState = _React$useState12[0],
-      setLoaderArrState = _React$useState12[1];
+      loadingState = _React$useState12[0],
+      setLoadingState = _React$useState12[1];
+    var _React$useState13 = React__namespace.useState([]),
+      _React$useState14 = _slicedToArray(_React$useState13, 2),
+      loaderArrState = _React$useState14[0],
+      setLoaderArrState = _React$useState14[1];
     var elementRef = React__namespace.useRef(null);
     var _contentRef = React__namespace.useRef(null);
     var _spacerRef = React__namespace.useRef(null);
@@ -222,14 +231,19 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     } : 0);
     var scrollTimeout = React__namespace.useRef(null);
     var resizeTimeout = React__namespace.useRef(null);
+    var contentStyle = React__namespace.useRef({});
+    var spacerStyle = React__namespace.useRef({});
     var defaultWidth = React__namespace.useRef(null);
     var defaultHeight = React__namespace.useRef(null);
-    var prevItems = hooks.usePrevious(props.items);
-    var prevLoading = hooks.usePrevious(props.loading);
+    var defaultContentWidth = React__namespace.useRef(null);
+    var defaultContentHeight = React__namespace.useRef(null);
+    var isItemRangeChanged = React__namespace.useRef(false);
+    var lazyLoadState = React__namespace.useRef(null);
     var _useResizeListener = hooks.useResizeListener({
         listener: function listener(event) {
           return onResize();
-        }
+        },
+        when: !props.disabled
       }),
       _useResizeListener2 = _slicedToArray(_useResizeListener, 1),
       bindWindowResizeListener = _useResizeListener2[0];
@@ -238,13 +252,23 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         type: 'orientationchange',
         listener: function listener(event) {
           return onResize();
-        }
+        },
+        when: !props.disabled
       }),
       _useEventListener2 = _slicedToArray(_useEventListener, 1),
       bindOrientationChangeListener = _useEventListener2[0];
     var getElementRef = function getElementRef() {
       return elementRef;
     };
+    var getPageByFirst = function getPageByFirst(first) {
+      return Math.floor((first + numToleratedItemsState * 4) / (props.step || 1));
+    };
+    var setContentElement = function setContentElement(element) {
+      _contentRef.current = element || _contentRef.current || utils.DomHandler.findSingle(elementRef.current, '.p-virtualscroller-content');
+    };
+    var isPageChanged = function isPageChanged(first) {
+      return props.step ? pageState !== getPageByFirst(first) : true;
+    };
     var scrollTo = function scrollTo(options) {
       lastScrollPos.current = both ? {
         top: 0,
@@ -256,13 +280,14 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       var behavior = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'auto';
       var _calculateNumItems = calculateNumItems(),
         numToleratedItems = _calculateNumItems.numToleratedItems;
+      var contentPos = getContentPosition();
       var calculateFirst = function calculateFirst() {
         var _index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
         var _numT = arguments.length > 1 ? arguments[1] : undefined;
         return _index <= _numT ? 0 : _index;
       };
-      var calculateCoord = function calculateCoord(_first, _size) {
-        return _first * _size;
+      var calculateCoord = function calculateCoord(_first, _size, _cpos) {
+        return _first * _size + _cpos;
       };
       var scrollToItem = function scrollToItem() {
         var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
@@ -273,20 +298,25 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
           behavior: behavior
         });
       };
+      var newFirst = both ? {
+        rows: 0,
+        cols: 0
+      } : 0;
+      var isRangeChanged = false;
       if (both) {
-        var newFirst = {
+        newFirst = {
           rows: calculateFirst(index[0], numToleratedItems[0]),
           cols: calculateFirst(index[1], numToleratedItems[1])
         };
-        if (newFirst.rows !== firstState.rows || newFirst.cols !== firstState.cols) {
-          scrollToItem(calculateCoord(newFirst.cols, props.itemSize[1]), calculateCoord(newFirst.rows, props.itemSize[0]));
-        }
+        scrollToItem(calculateCoord(newFirst.cols, props.itemSize[1], contentPos.left), calculateCoord(newFirst.rows, props.itemSize[0], contentPos.top));
+        isRangeChanged = firstState.rows !== newFirst.rows || firstState.cols !== newFirst.cols;
       } else {
-        var _newFirst = calculateFirst(index, numToleratedItems);
-        if (_newFirst !== firstState) {
-          horizontal ? scrollToItem(calculateCoord(_newFirst, props.itemSize), 0) : scrollToItem(0, calculateCoord(_newFirst, props.itemSize));
-        }
+        newFirst = calculateFirst(index, numToleratedItems);
+        horizontal ? scrollToItem(calculateCoord(newFirst, props.itemSize, contentPos.left), 0) : scrollToItem(0, calculateCoord(newFirst, props.itemSize, contentPos.top));
+        isRangeChanged = firstState !== newFirst;
       }
+      isItemRangeChanged.current = isRangeChanged;
+      setFirstState(newFirst);
     };
     var scrollInView = function scrollInView(index, to) {
       var behavior = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'auto';
@@ -403,7 +433,8 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       var _calculateNumItems2 = calculateNumItems(),
         numItemsInViewport = _calculateNumItems2.numItemsInViewport,
         numToleratedItems = _calculateNumItems2.numToleratedItems;
-      var calculateLast = function calculateLast(_first, _num, _numT, _isCols) {
+      var calculateLast = function calculateLast(_first, _num, _numT) {
+        var _isCols = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
         return getLast(_first + _num + (_first < _numT ? 2 : 3) * _numT, _isCols);
       };
       var last = both ? {
@@ -425,9 +456,15 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         }));
       }
       if (props.lazy) {
-        props.onLazyLoad && props.onLazyLoad({
-          first: firstState,
-          last: last
+        Promise.resolve().then(function () {
+          lazyLoadState.current = {
+            first: props.step ? both ? {
+              rows: 0,
+              cols: firstState.cols
+            } : 0 : firstState,
+            last: Math.min(props.step ? props.step : last, props.items.length)
+          };
+          props.onLazyLoad && props.onLazyLoad(lazyLoadState.current);
         });
       }
     };
@@ -436,12 +473,21 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         Promise.resolve().then(function () {
           if (_contentRef.current) {
             _contentRef.current.style.minHeight = _contentRef.current.style.minWidth = 'auto';
-            var _contentRef$current = _contentRef.current,
-              offsetWidth = _contentRef$current.offsetWidth,
-              offsetHeight = _contentRef$current.offsetHeight;
-            (both || horizontal) && (elementRef.current.style.width = (offsetWidth < defaultWidth.current ? offsetWidth : defaultWidth.current) + 'px');
-            (both || vertical) && (elementRef.current.style.height = (offsetHeight < defaultHeight.current ? offsetHeight : defaultHeight.current) + 'px');
+            _contentRef.current.style.position = 'relative';
+            elementRef.current.style.contain = 'none';
+
+            /*const [contentWidth, contentHeight] = [DomHandler.getWidth(contentRef.current), DomHandler.getHeight(contentRef.current)];
+             contentWidth !== defaultContentWidth.current && (elementRef.current.style.width = '');
+            contentHeight !== defaultContentHeight.current && (elementRef.current.style.height = '');*/
+
+            var _ref = [utils.DomHandler.getWidth(elementRef.current), utils.DomHandler.getHeight(elementRef.current)],
+              width = _ref[0],
+              height = _ref[1];
+            (both || horizontal) && (elementRef.current.style.width = (width < defaultWidth.current ? width : props.scrollWidth || defaultWidth.current) + 'px');
+            (both || vertical) && (elementRef.current.style.height = (height < defaultHeight.current ? height : props.scrollHeight || defaultHeight.current) + 'px');
             _contentRef.current.style.minHeight = _contentRef.current.style.minWidth = '';
+            _contentRef.current.style.position = '';
+            elementRef.current.style.contain = '';
           }
         });
       }
@@ -454,10 +500,10 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     var getContentPosition = function getContentPosition() {
       if (_contentRef.current) {
         var style = getComputedStyle(_contentRef.current);
-        var left = parseInt(style.paddingLeft, 10) + Math.max(parseInt(style.left, 10), 0);
-        var right = parseInt(style.paddingRight, 10) + Math.max(parseInt(style.right, 10), 0);
-        var top = parseInt(style.paddingTop, 10) + Math.max(parseInt(style.top, 10), 0);
-        var bottom = parseInt(style.paddingBottom, 10) + Math.max(parseInt(style.bottom, 10), 0);
+        var left = parseFloat(style.paddingLeft) + Math.max(parseFloat(style.left) || 0, 0);
+        var right = parseFloat(style.paddingRight) + Math.max(parseFloat(style.right) || 0, 0);
+        var top = parseFloat(style.paddingTop) + Math.max(parseFloat(style.top) || 0, 0);
+        var bottom = parseFloat(style.paddingBottom) + Math.max(parseFloat(style.bottom) || 0, 0);
         return {
           left: left,
           right: right,
@@ -494,11 +540,11 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     };
     var setSpacerSize = function setSpacerSize() {
       var items = props.items;
-      if (_spacerRef.current && items) {
+      if (items) {
         var contentPos = getContentPosition();
         var setProp = function setProp(_name, _value, _size) {
           var _cpos = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-          return _spacerRef.current.style[_name] = (_value || []).length * _size + _cpos + 'px';
+          return spacerStyle.current = _objectSpread(_objectSpread({}, spacerStyle.current), _defineProperty({}, "".concat(_name), (_value || []).length * _size + _cpos + 'px'));
         };
         if (both) {
           setProp('height', items, props.itemSize[0], contentPos.y);
@@ -509,7 +555,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       }
     };
     var setContentPosition = function setContentPosition(pos) {
-      if (_contentRef.current) {
+      if (_contentRef.current && !props.appendOnly) {
         var first = pos ? pos.first : firstState;
         var calculateTranslateVal = function calculateTranslateVal(_first, _size) {
           return _first * _size;
@@ -518,7 +564,9 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
           var _x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
           var _y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
           _stickyRef.current && (_stickyRef.current.style.top = "-".concat(_y, "px"));
-          _contentRef.current.style.transform = "translate3d(".concat(_x, "px, ").concat(_y, "px, 0)");
+          contentStyle.current = _objectSpread(_objectSpread({}, contentStyle.current), {
+            transform: "translate3d(".concat(_x, "px, ").concat(_y, "px, 0)")
+          });
         };
         if (both) {
           setTransform(calculateTranslateVal(first.cols, props.itemSize[1]), calculateTranslateVal(first.rows, props.itemSize[0]));
@@ -562,36 +610,40 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       if (both) {
         var isScrollDown = lastScrollPos.current.top <= scrollTop;
         var isScrollRight = lastScrollPos.current.left <= scrollLeft;
-        var currentIndex = {
-          rows: calculateCurrentIndex(scrollTop, props.itemSize[0]),
-          cols: calculateCurrentIndex(scrollLeft, props.itemSize[1])
-        };
-        var triggerIndex = {
-          rows: calculateTriggerIndex(currentIndex.rows, firstState.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0], isScrollDown),
-          cols: calculateTriggerIndex(currentIndex.cols, firstState.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], isScrollRight)
-        };
-        newFirst = {
-          rows: calculateFirst(currentIndex.rows, triggerIndex.rows, firstState.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0], isScrollDown),
-          cols: calculateFirst(currentIndex.cols, triggerIndex.cols, firstState.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], isScrollRight)
-        };
-        newLast = {
-          rows: calculateLast(currentIndex.rows, newFirst.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0]),
-          cols: calculateLast(currentIndex.cols, newFirst.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], true)
-        };
-        isRangeChanged = newFirst.rows !== firstState.rows || newLast.rows !== lastState.rows || newFirst.cols !== firstState.cols || newLast.cols !== lastState.cols;
-        newScrollPos = {
-          top: scrollTop,
-          left: scrollLeft
-        };
+        if (!props.appendOnly || props.appendOnly && (isScrollDown || isScrollRight)) {
+          var currentIndex = {
+            rows: calculateCurrentIndex(scrollTop, props.itemSize[0]),
+            cols: calculateCurrentIndex(scrollLeft, props.itemSize[1])
+          };
+          var triggerIndex = {
+            rows: calculateTriggerIndex(currentIndex.rows, firstState.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0], isScrollDown),
+            cols: calculateTriggerIndex(currentIndex.cols, firstState.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], isScrollRight)
+          };
+          newFirst = {
+            rows: calculateFirst(currentIndex.rows, triggerIndex.rows, firstState.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0], isScrollDown),
+            cols: calculateFirst(currentIndex.cols, triggerIndex.cols, firstState.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], isScrollRight)
+          };
+          newLast = {
+            rows: calculateLast(currentIndex.rows, newFirst.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0]),
+            cols: calculateLast(currentIndex.cols, newFirst.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], true)
+          };
+          isRangeChanged = newFirst.rows !== firstState.rows || newLast.rows !== lastState.rows || newFirst.cols !== firstState.cols || newLast.cols !== lastState.cols || isItemRangeChanged.current;
+          newScrollPos = {
+            top: scrollTop,
+            left: scrollLeft
+          };
+        }
       } else {
         var scrollPos = horizontal ? scrollLeft : scrollTop;
         var isScrollDownOrRight = lastScrollPos.current <= scrollPos;
-        var _currentIndex2 = calculateCurrentIndex(scrollPos, props.itemSize);
-        var _triggerIndex2 = calculateTriggerIndex(_currentIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
-        newFirst = calculateFirst(_currentIndex2, _triggerIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
-        newLast = calculateLast(_currentIndex2, newFirst, lastState, numItemsInViewportState, numToleratedItemsState);
-        isRangeChanged = newFirst !== firstState || newLast !== lastState;
-        newScrollPos = scrollPos;
+        if (!props.appendOnly || props.appendOnly && isScrollDownOrRight) {
+          var _currentIndex2 = calculateCurrentIndex(scrollPos, props.itemSize);
+          var _triggerIndex2 = calculateTriggerIndex(_currentIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
+          newFirst = calculateFirst(_currentIndex2, _triggerIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
+          newLast = calculateLast(_currentIndex2, newFirst, lastState, numItemsInViewportState, numToleratedItemsState);
+          isRangeChanged = newFirst !== firstState || newLast !== lastState || isItemRangeChanged.current;
+          newScrollPos = scrollPos;
+        }
       }
       return {
         first: newFirst,
@@ -616,8 +668,14 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         setLastState(last);
         lastScrollPos.current = scrollPos;
         props.onScrollIndexChange && props.onScrollIndexChange(newState);
-        if (props.lazy) {
-          props.onLazyLoad && props.onLazyLoad(newState);
+        if (props.lazy && isPageChanged(first)) {
+          var newLazyLoadState = {
+            first: props.step ? Math.min(getPageByFirst(first) * props.step, props.items.length - props.step) : first,
+            last: Math.min(props.step ? (getPageByFirst(first) + 1) * props.step : last, props.items.length)
+          };
+          var isLazyStateChanged = !lazyLoadState.current || lazyLoadState.current.first !== newLazyLoadState.first || lazyLoadState.current.last !== newLazyLoadState.last;
+          isLazyStateChanged && props.onLazyLoad && props.onLazyLoad(newLazyLoadState);
+          lazyLoadState.current = newLazyLoadState;
         }
       }
     };
@@ -627,17 +685,21 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         if (scrollTimeout.current) {
           clearTimeout(scrollTimeout.current);
         }
-        if (!loadingState && props.showLoader) {
-          var _onScrollPositionChan2 = onScrollPositionChange(event),
-            changed = _onScrollPositionChan2.isRangeChanged;
-          changed && setLoadingState(true);
-        }
-        scrollTimeout.current = setTimeout(function () {
-          onScrollChange(event);
-          if (loadingState && props.showLoader && (!props.lazy || props.loading === undefined)) {
-            setLoadingState(false);
+        if (isPageChanged(firstState)) {
+          if (!loadingState && props.showLoader) {
+            var _onScrollPositionChan2 = onScrollPositionChange(event),
+              isRangeChanged = _onScrollPositionChan2.isRangeChanged;
+            var changed = isRangeChanged || (props.step ? isPageChanged(firstState) : false);
+            changed && setLoadingState(true);
           }
-        }, props.delay);
+          scrollTimeout.current = setTimeout(function () {
+            onScrollChange(event);
+            if (loadingState && props.showLoader && (!props.lazy || props.loading === undefined)) {
+              setLoadingState(false);
+              setPageState(getPageByFirst(firstState));
+            }
+          }, props.delay);
+        }
       } else {
         onScrollChange(event);
       }
@@ -648,9 +710,9 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       }
       resizeTimeout.current = setTimeout(function () {
         if (elementRef.current) {
-          var _ref = [utils.DomHandler.getWidth(elementRef.current), utils.DomHandler.getHeight(elementRef.current)],
-            width = _ref[0],
-            height = _ref[1];
+          var _ref2 = [utils.DomHandler.getWidth(elementRef.current), utils.DomHandler.getHeight(elementRef.current)],
+            width = _ref2[0],
+            height = _ref2[1];
           var isDiffWidth = width !== defaultWidth.current,
             isDiffHeight = height !== defaultHeight.current;
           var reinit = both ? isDiffWidth || isDiffHeight : horizontal ? isDiffWidth : vertical ? isDiffHeight : false;
@@ -658,6 +720,8 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
             setNumToleratedItemsState(props.numToleratedItems);
             defaultWidth.current = width;
             defaultHeight.current = height;
+            defaultContentWidth.current = utils.DomHandler.getWidth(_contentRef.current);
+            defaultContentHeight.current = utils.DomHandler.getHeight(_contentRef.current);
           }
         }
       }, props.resizeDelay);
@@ -690,12 +754,24 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     var loadedItems = function loadedItems() {
       var items = props.items;
       if (items && !loadingState) {
-        if (both) return items.slice(firstState.rows, lastState.rows).map(function (item) {
-          return props.columns ? item : item.slice(firstState.cols, lastState.cols);
-        });else if (horizontal && props.columns) return items;else return items.slice(firstState, lastState);
+        if (both) return items.slice(props.appendOnly ? 0 : firstState.rows, lastState.rows).map(function (item) {
+          return props.columns ? item : item.slice(props.appendOnly ? 0 : firstState.cols, lastState.cols);
+        });else if (horizontal && props.columns) return items;else return items.slice(props.appendOnly ? 0 : firstState, lastState);
       }
       return [];
     };
+    var viewInit = function viewInit() {
+      if (elementRef.current && utils.DomHandler.isVisible(elementRef.current)) {
+        setContentElement(_contentRef.current);
+        init();
+        bindWindowResizeListener();
+        bindOrientationChangeListener();
+        defaultWidth.current = utils.DomHandler.getWidth(elementRef.current);
+        defaultHeight.current = utils.DomHandler.getHeight(elementRef.current);
+        defaultContentWidth.current = utils.DomHandler.getWidth(_contentRef.current);
+        defaultContentHeight.current = utils.DomHandler.getHeight(_contentRef.current);
+      }
+    };
     var init = function init() {
       if (!props.disabled) {
         setSize();
@@ -704,17 +780,11 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       }
     };
     hooks.useMountEffect(function () {
-      if (!props.disabled) {
-        init();
-        bindWindowResizeListener();
-        bindOrientationChangeListener();
-        defaultWidth.current = utils.DomHandler.getWidth(elementRef.current);
-        defaultHeight.current = utils.DomHandler.getHeight(elementRef.current);
-      }
+      viewInit();
     });
     hooks.useUpdateEffect(function () {
       init();
-    }, [props.itemSize, props.scrollHeight]);
+    }, [props.itemSize, props.scrollHeight, props.scrollWidth]);
     hooks.useUpdateEffect(function () {
       if (props.numToleratedItems !== numToleratedItemsState) {
         setNumToleratedItemsState(props.numToleratedItems);
@@ -726,11 +796,11 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       }
     }, [numToleratedItemsState]);
     hooks.useUpdateEffect(function () {
-      if (!prevItems || prevItems.length !== (props.items || []).length) {
+      if (!prevProps.items || prevProps.items.length !== (props.items || []).length) {
         init();
       }
       var loading = loadingState;
-      if (props.lazy && prevLoading !== props.loading && props.loading !== loadingState) {
+      if (props.lazy && prevProps.loading !== props.loading && props.loading !== loadingState) {
         setLoadingState(props.loading);
         loading = props.loading;
       }
@@ -792,6 +862,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       if (props.showSpacer) {
         return /*#__PURE__*/React__namespace.createElement("div", {
           ref: _spacerRef,
+          style: spacerStyle.current,
           className: "p-virtualscroller-spacer"
         });
       }
@@ -815,11 +886,14 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       });
       var content = /*#__PURE__*/React__namespace.createElement("div", {
         ref: _contentRef,
+        style: contentStyle.current,
         className: className
       }, items);
       if (props.contentTemplate) {
         var defaultOptions = {
+          style: contentStyle.current,
           className: className,
+          spacerStyle: spacerStyle.current,
           contentRef: function contentRef(el) {
             return _contentRef.current = utils.ObjectUtils.getRefElement(el);
           },
@@ -862,10 +936,9 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     } else {
       var otherProps = VirtualScrollerBase.getOtherProps(props);
       var className = utils.classNames('p-virtualscroller', {
-        'p-both-scroll': both,
-        'p-virtualscroller-both': both,
-        'p-virtualscroller-horizontal': horizontal,
-        'p-horizontal-scroll': horizontal
+        'p-virtualscroller-inline': props.inline,
+        'p-virtualscroller-both p-both-scroll': both,
+        'p-virtualscroller-horizontal p-horizontal-scroll': horizontal
       }, props.className);
       var loader = createLoader();
       var _content = createContent();
@@ -873,7 +946,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       return /*#__PURE__*/React__namespace.createElement("div", _extends({
         ref: elementRef,
         className: className,
-        tabIndex: 0,
+        tabIndex: props.tabIndex,
         style: props.style
       }, otherProps, {
         onScroll: onScroll

package/virtualscroller/virtualscroller.min.css

@@ -1 +1 @@
-.p-virtualscroller{position:relative;overflow:auto;contain:strict;transform:translateZ(0);will-change:scroll-position;outline:0 none}.p-virtualscroller-content{position:absolute;top:0;left:0;min-height:100%;min-width:100%;will-change:transform}.p-virtualscroller-spacer{position:absolute;top:0;left:0;height:1px;width:1px;transform-origin:0 0;pointer-events:none}.p-virtualscroller-loader{position:sticky;top:0;left:0;width:100%;height:100%}.p-virtualscroller-loader.p-component-overlay{display:flex;align-items:center;justify-content:center}.p-virtualscroller-loading-icon{font-size:2rem}.p-horizontal-scroll>.p-virtualscroller-content{display:flex}
+.p-virtualscroller{position:relative;overflow:auto;contain:strict;transform:translateZ(0);will-change:scroll-position;outline:0 none}.p-virtualscroller-content{position:absolute;top:0;left:0;min-height:100%;min-width:100%;will-change:transform}.p-virtualscroller-spacer{position:absolute;top:0;left:0;height:1px;width:1px;transform-origin:0 0;pointer-events:none}.p-virtualscroller-loader{position:sticky;top:0;left:0;width:100%;height:100%}.p-virtualscroller-loader.p-component-overlay{display:flex;align-items:center;justify-content:center}.p-virtualscroller-loading-icon{font-size:2rem}.p-virtualscroller-horizontal>.p-virtualscroller-content{display:flex}.p-virtualscroller-inline .p-virtualscroller-content{position:static}

package/virtualscroller/virtualscroller.min.js

@@ -1 +1 @@
-this.primereact=this.primereact||{},this.primereact.virtualscroller=function(e,t,r,n){"use strict";function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var l=o(t);function i(){return i=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},i.apply(this,arguments)}function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function c(e,t){if("object"!==s(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==s(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function a(e){var t=c(e,"string");return"symbol"===s(t)?t:String(t)}function u(e,t,r){return(t=a(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function f(e){if(Array.isArray(e))return e}function m(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,l,i,s=[],c=!0,a=!1;try{if(l=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;c=!1}else for(;!(c=(n=l.call(r)).done)&&(s.push(n.value),s.length!==t);c=!0);}catch(e){a=!0,o=e}finally{try{if(!c&&null!=r.return&&(i=r.return(),Object(i)!==i))return}finally{if(a)throw o}}return s}}function d(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function p(e,t){if(e){if("string"==typeof e)return d(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?d(e,t):void 0}}function g(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function h(e,t){return f(e)||m(e,t)||p(e,t)||g()}var v={defaultProps:{__TYPE:"VirtualScroller",id:null,style:null,className:null,items:null,itemSize:0,scrollHeight:null,scrollWidth:null,orientation:"vertical",numToleratedItems:null,delay:0,resizeDelay:10,lazy:!1,disabled:!1,loaderDisabled:!1,columns:null,loading:void 0,autoSize:!1,showSpacer:!0,showLoader:!1,loadingTemplate:null,loaderIconTemplate:null,itemTemplate:null,contentTemplate:null,onScroll:null,onScrollIndexChange:null,onLazyLoad:null,children:void 0},getProps:function(e){return n.ObjectUtils.getMergedProps(e,v.defaultProps)},getOtherProps:function(e){return n.ObjectUtils.getDiffProps(e,v.defaultProps)}};function y(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function w(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?y(Object(r),!0).forEach((function(t){u(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):y(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var b=l.memo(l.forwardRef((function(e,t){var o=v.getProps(e),s="vertical"===o.orientation,c="horizontal"===o.orientation,a="both"===o.orientation,u=h(l.useState(a?{rows:0,cols:0}:0),2),f=u[0],m=u[1],d=h(l.useState(a?{rows:0,cols:0}:0),2),p=d[0],g=d[1],y=h(l.useState(a?{rows:0,cols:0}:0),2),b=y[0],S=y[1],z=h(l.useState(o.numToleratedItems),2),O=z[0],j=z[1],T=h(l.useState(o.loading||!1),2),I=T[0],E=T[1],P=h(l.useState([]),2),x=P[0],R=P[1],L=l.useRef(null),D=l.useRef(null),H=l.useRef(null),U=l.useRef(null),M=l.useRef(a?{top:0,left:0}:0),N=l.useRef(null),W=l.useRef(null),A=l.useRef(null),C=l.useRef(null),k=r.usePrevious(o.items),V=r.usePrevious(o.loading),_=h(r.useResizeListener({listener:function(e){return oe()}}),1)[0],J=h(r.useEventListener({target:"window",type:"orientationchange",listener:function(e){return oe()}}),1)[0],X=function(){return L},F=function(e){M.current=a?{top:0,left:0}:0,L.current&&L.current.scrollTo(e)},B=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"auto",r=q(),n=r.numToleratedItems,l=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1?arguments[1]:void 0;return e<=t?0:e},i=function(e,t){return e*t},s=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;return F({left:e,top:r,behavior:t})};if(a){var u={rows:l(e[0],n[0]),cols:l(e[1],n[1])};u.rows===f.rows&&u.cols===f.cols||s(i(u.cols,o.itemSize[1]),i(u.rows,o.itemSize[0]))}else{var m=l(e,n);m!==f&&(c?s(i(m,o.itemSize),0):s(0,i(m,o.itemSize)))}},Y=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"auto";if(t){var n=$(),l=n.first,i=n.viewport,s=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;return F({left:e,top:t,behavior:r})},u="to-start"===t,f="to-end"===t;if(u){if(a)i.first.rows-l.rows>e[0]?s(i.first.cols*o.itemSize[1],(i.first.rows-1)*o.itemSize[0]):i.first.cols-l.cols>e[1]&&s((i.first.cols-1)*o.itemSize[1],i.first.rows*o.itemSize[0]);else if(i.first-l>e){var m=(i.first-1)*o.itemSize;c?s(m,0):s(0,m)}}else if(f)if(a)i.last.rows-l.rows<=e[0]+1?s(i.first.cols*o.itemSize[1],(i.first.rows+1)*o.itemSize[0]):i.last.cols-l.cols<=e[1]+1&&s((i.first.cols+1)*o.itemSize[1],i.first.rows*o.itemSize[0]);else if(i.last-l<=e+1){var d=(i.first+1)*o.itemSize;c?s(d,0):s(0,d)}}else B(e,r)},$=function(){var e=function(e,t){return Math.floor(e/(t||e))},t=f,r=0;if(L.current){var n=L.current,l=n.scrollTop,i=n.scrollLeft;if(a)r={rows:(t={rows:e(l,o.itemSize[0]),cols:e(i,o.itemSize[1])}).rows+b.rows,cols:t.cols+b.cols};else r=(t=e(c?i:l,o.itemSize))+b}return{first:f,last:p,viewport:{first:t,last:r}}},q=function(){var e=Q(),t=L.current?L.current.offsetWidth-e.left:0,r=L.current?L.current.offsetHeight-e.top:0,n=function(e,t){return Math.ceil(e/(t||e))},l=function(e){return Math.ceil(e/2)},i=a?{rows:n(r,o.itemSize[0]),cols:n(t,o.itemSize[1])}:n(c?t:r,o.itemSize);return{numItemsInViewport:i,numToleratedItems:O||(a?[l(i.rows),l(i.cols)]:l(i))}},G=function(e){o.autoSize&&!e&&Promise.resolve().then((function(){if(D.current){D.current.style.minHeight=D.current.style.minWidth="auto";var e=D.current,t=e.offsetWidth,r=e.offsetHeight;(a||c)&&(L.current.style.width=(t<A.current?t:A.current)+"px"),(a||s)&&(L.current.style.height=(r<C.current?r:C.current)+"px"),D.current.style.minHeight=D.current.style.minWidth=""}}))},K=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1?arguments[1]:void 0;return o.items?Math.min(t?(o.columns||o.items[0]).length:o.items.length,e):0},Q=function(){if(D.current){var e=getComputedStyle(D.current),t=parseInt(e.paddingLeft,10)+Math.max(parseInt(e.left,10),0),r=parseInt(e.paddingRight,10)+Math.max(parseInt(e.right,10),0),n=parseInt(e.paddingTop,10)+Math.max(parseInt(e.top,10),0),o=parseInt(e.paddingBottom,10)+Math.max(parseInt(e.bottom,10),0);return{left:t,right:r,top:n,bottom:o,x:t+r,y:n+o}}return{left:0,right:0,top:0,bottom:0,x:0,y:0}},Z=function(){if(L.current){var e=L.current.parentElement,t=o.scrollWidth||"".concat(L.current.offsetWidth||e.offsetWidth,"px"),r=o.scrollHeight||"".concat(L.current.offsetHeight||e.offsetHeight,"px"),n=function(e,t){return L.current.style[e]=t};a||c?(n("height",r),n("width",t)):n("height",r)}},ee=function(){var e=o.items;if(H.current&&e){var t=Q(),r=function(e,t,r){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:0;return H.current.style[e]=(t||[]).length*r+n+"px"};a?(r("height",e,o.itemSize[0],t.y),r("width",o.columns||e[1],o.itemSize[1],t.x)):c?r("width",o.columns||e,o.itemSize,t.x):r("height",e,o.itemSize,t.y)}},te=function(e){if(D.current){var t=e?e.first:f,r=function(e,t){return e*t},n=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;U.current&&(U.current.style.top="-".concat(t,"px")),D.current.style.transform="translate3d(".concat(e,"px, ").concat(t,"px, 0)")};if(a)n(r(t.cols,o.itemSize[1]),r(t.rows,o.itemSize[0]));else{var l=r(t,o.itemSize);c?n(l,0):n(0,l)}}},re=function(e){var t=e.target,r=Q(),n=function(e,t){return e?e>t?e-t:e:0},l=function(e,t){return Math.floor(e/(t||e))},i=function(e,t,r,n,o,l){return e<=o?o:l?r-n-o:t+o-1},s=function(e,t,r,n,o,l,i){return e<=l?0:Math.max(0,i?e<t?r:e-l:e>t?r:e-2*l)},u=function(e,t,r,n,o,l){var i=t+n+2*o;return e>=o&&(i+=o+1),K(i,l)},m=n(t.scrollTop,r.top),d=n(t.scrollLeft,r.left),g=a?{rows:0,cols:0}:0,h=p,v=!1,y=M.current;if(a){var w=M.current.top<=m,S=M.current.left<=d,z={rows:l(m,o.itemSize[0]),cols:l(d,o.itemSize[1])},j={rows:i(z.rows,f.rows,p.rows,b.rows,O[0],w),cols:i(z.cols,f.cols,p.cols,b.cols,O[1],S)};g={rows:s(z.rows,j.rows,f.rows,0,0,O[0],w),cols:s(z.cols,j.cols,f.cols,0,0,O[1],S)},h={rows:u(z.rows,g.rows,0,b.rows,O[0]),cols:u(z.cols,g.cols,0,b.cols,O[1],!0)},v=g.rows!==f.rows||h.rows!==p.rows||g.cols!==f.cols||h.cols!==p.cols,y={top:m,left:d}}else{var T=c?d:m,I=M.current<=T,E=l(T,o.itemSize);h=u(E,g=s(E,i(E,f,p,b,O,I),f,0,0,O,I),0,b,O),v=g!==f||h!==p,y=T}return{first:g,last:h,isRangeChanged:v,scrollPos:y}},ne=function(e){var t=re(e),r=t.first,n=t.last,l=t.scrollPos;if(t.isRangeChanged){var i={first:r,last:n};te(i),m(r),g(n),M.current=l,o.onScrollIndexChange&&o.onScrollIndexChange(i),o.lazy&&o.onLazyLoad&&o.onLazyLoad(i)}},oe=function(){W.current&&clearTimeout(W.current),W.current=setTimeout((function(){if(L.current){var e=[n.DomHandler.getWidth(L.current),n.DomHandler.getHeight(L.current)],t=e[0],r=e[1],l=t!==A.current,i=r!==C.current;(a?l||i:c?l:!!s&&i)&&(j(o.numToleratedItems),A.current=t,C.current=r)}}),o.resizeDelay)},le=function(e){var t=(o.items||[]).length,r=a?f.rows+e:f+e;return{index:r,count:t,first:0===r,last:r===t-1,even:r%2==0,odd:r%2!=0,props:o}},ie=function(e,t){var r=x.length;return w({index:e,count:r,first:0===e,last:e===r-1,even:e%2==0,odd:e%2!=0,props:o},t)},se=function(){var e=o.items;return e&&!I?a?e.slice(f.rows,p.rows).map((function(e){return o.columns?e:e.slice(f.cols,p.cols)})):c&&o.columns?e:e.slice(f,p):[]},ce=function(){var e,t,r,n,l;o.disabled||(Z(),e=q(),t=e.numItemsInViewport,r=e.numToleratedItems,n=function(e,t,r,n){return K(e+t+(e<r?2:3)*r,n)},l=a?{rows:n(f.rows,t.rows,r[0]),cols:n(f.cols,t.cols,r[1],!0)}:n(f,t,r),S(t),j(r),g(l),o.showLoader&&R(a?Array.from({length:t.rows}).map((function(){return Array.from({length:t.cols})})):Array.from({length:t})),o.lazy&&o.onLazyLoad&&o.onLazyLoad({first:f,last:l}),ee())};r.useMountEffect((function(){o.disabled||(ce(),_(),J(),A.current=n.DomHandler.getWidth(L.current),C.current=n.DomHandler.getHeight(L.current))})),r.useUpdateEffect((function(){ce()}),[o.itemSize,o.scrollHeight]),r.useUpdateEffect((function(){o.numToleratedItems!==O&&j(o.numToleratedItems)}),[o.numToleratedItems]),r.useUpdateEffect((function(){o.numToleratedItems===O&&ce()}),[O]),r.useUpdateEffect((function(){k&&k.length===(o.items||[]).length||ce();var e=I;o.lazy&&V!==o.loading&&o.loading!==I&&(E(o.loading),e=o.loading),G(e)})),r.useUpdateEffect((function(){M.current=a?{top:0,left:0}:0}),[o.orientation]),l.useImperativeHandle(t,(function(){return{props:o,getElementRef:X,scrollTo:F,scrollToIndex:B,scrollInView:Y,getRenderedRange:$}}));var ae=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=ie(e,t),i=n.ObjectUtils.getJSXElement(o.loadingTemplate,r);return l.createElement(l.Fragment,{key:e},i)},ue=function(e,t){var r=le(t),i=n.ObjectUtils.getJSXElement(o.itemTemplate,e,r);return l.createElement(l.Fragment,{key:r.index},i)};if(o.disabled){var fe=n.ObjectUtils.getJSXElement(o.contentTemplate,{items:o.items,rows:o.items,columns:o.columns});return l.createElement(l.Fragment,null,o.children,fe)}var me=v.getOtherProps(o),de=n.classNames("p-virtualscroller",{"p-both-scroll":a,"p-virtualscroller-both":a,"p-virtualscroller-horizontal":c,"p-horizontal-scroll":c},o.className),pe=function(){if(!o.loaderDisabled&&o.showLoader&&I){var e=n.classNames("p-virtualscroller-loader",{"p-component-overlay":!o.loadingTemplate}),t=l.createElement("i",{className:"p-virtualscroller-loading-icon pi pi-spinner pi-spin"});return o.loadingTemplate?t=x.map((function(e,t){return ae(t,a&&{numCols:b.cols})})):o.loaderIconTemplate&&(t=n.ObjectUtils.getJSXElement(o.loaderIconTemplate,{className:"p-virtualscroller-loading-icon",element:t,props:o})),l.createElement("div",{className:e},t)}return null}(),ge=function(){var e=se().map(ue),t=n.classNames("p-virtualscroller-content",{"p-virtualscroller-loading":I}),r=l.createElement("div",{ref:D,className:t},e);if(o.contentTemplate){var i={className:t,contentRef:function(e){return D.current=n.ObjectUtils.getRefElement(e)},spacerRef:function(e){return H.current=n.ObjectUtils.getRefElement(e)},stickyRef:function(e){return U.current=n.ObjectUtils.getRefElement(e)},items:se(),getItemOptions:function(e){return le(e)},children:e,element:r,props:o,loading:I,getLoaderOptions:function(e,t){return ie(e,t)},loadingTemplate:o.loadingTemplate,itemSize:o.itemSize,rows:I?o.loaderDisabled?x:[]:se(),columns:o.columns&&a||c?I&&o.loaderDisabled?a?x[0]:x:o.columns.slice(a?f.cols:f,a?p.cols:p):o.columns,vertical:s,horizontal:c,both:a};return n.ObjectUtils.getJSXElement(o.contentTemplate,i)}return r}(),he=o.showSpacer?l.createElement("div",{ref:H,className:"p-virtualscroller-spacer"}):null;return l.createElement("div",i({ref:L,className:de,tabIndex:0,style:o.style},me,{onScroll:function(e){o.onScroll&&o.onScroll(e),o.delay?(N.current&&clearTimeout(N.current),!I&&o.showLoader&&re(e).isRangeChanged&&E(!0),N.current=setTimeout((function(){ne(e),!I||!o.showLoader||o.lazy&&void 0!==o.loading||E(!1)}),o.delay)):ne(e)}}),ge,he,pe)})));return b.displayName="VirtualScroller",e.VirtualScroller=b,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.hooks,primereact.utils);
+this.primereact=this.primereact||{},this.primereact.virtualscroller=function(e,t,r,n){"use strict";function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var l=o(t);function i(){return i=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},i.apply(this,arguments)}function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function c(e,t){if("object"!==s(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==s(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function u(e){var t=c(e,"string");return"symbol"===s(t)?t:String(t)}function a(e,t,r){return(t=u(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function f(e){if(Array.isArray(e))return e}function m(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,l,i,s=[],c=!0,u=!1;try{if(l=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;c=!1}else for(;!(c=(n=l.call(r)).done)&&(s.push(n.value),s.length!==t);c=!0);}catch(e){u=!0,o=e}finally{try{if(!c&&null!=r.return&&(i=r.return(),Object(i)!==i))return}finally{if(u)throw o}}return s}}function p(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function d(e,t){if(e){if("string"==typeof e)return p(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?p(e,t):void 0}}function g(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function h(e,t){return f(e)||m(e,t)||d(e,t)||g()}var v={defaultProps:{__TYPE:"VirtualScroller",id:null,style:null,className:null,tabIndex:0,items:null,itemSize:0,scrollHeight:null,scrollWidth:null,orientation:"vertical",step:0,numToleratedItems:null,delay:0,resizeDelay:10,appendOnly:!1,inline:!1,lazy:!1,disabled:!1,loaderDisabled:!1,columns:null,loading:void 0,autoSize:!1,showSpacer:!0,showLoader:!1,loadingTemplate:null,loaderIconTemplate:null,itemTemplate:null,contentTemplate:null,onScroll:null,onScrollIndexChange:null,onLazyLoad:null,children:void 0},getProps:function(e){return n.ObjectUtils.getMergedProps(e,v.defaultProps)},getOtherProps:function(e){return n.ObjectUtils.getDiffProps(e,v.defaultProps)}};function y(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function w(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?y(Object(r),!0).forEach((function(t){a(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):y(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var b=l.memo(l.forwardRef((function(e,t){var o=v.getProps(e),s=r.usePrevious(e)||{},c="vertical"===o.orientation,u="horizontal"===o.orientation,f="both"===o.orientation,m=h(l.useState(f?{rows:0,cols:0}:0),2),p=m[0],d=m[1],g=h(l.useState(f?{rows:0,cols:0}:0),2),y=g[0],b=g[1],S=h(l.useState(0),2),O=S[0],z=S[1],j=h(l.useState(f?{rows:0,cols:0}:0),2),T=j[0],E=j[1],R=h(l.useState(o.numToleratedItems),2),I=R[0],P=R[1],x=h(l.useState(o.loading||!1),2),H=x[0],D=x[1],L=h(l.useState([]),2),M=L[0],U=L[1],N=l.useRef(null),W=l.useRef(null),F=l.useRef(null),A=l.useRef(null),C=l.useRef(f?{top:0,left:0}:0),V=l.useRef(null),k=l.useRef(null),_=l.useRef({}),J=l.useRef({}),X=l.useRef(null),B=l.useRef(null),Y=l.useRef(null),$=l.useRef(null),q=l.useRef(!1),G=l.useRef(null),K=h(r.useResizeListener({listener:function(e){return ge()},when:!o.disabled}),1)[0],Q=h(r.useEventListener({target:"window",type:"orientationchange",listener:function(e){return ge()},when:!o.disabled}),1)[0],Z=function(){return N},ee=function(e){return Math.floor((e+4*I)/(o.step||1))},te=function(e){return!o.step||O!==ee(e)},re=function(e){C.current=f?{top:0,left:0}:0,N.current&&N.current.scrollTo(e)},ne=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"auto",r=ie().numToleratedItems,n=ue(),l=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0;return e<=(arguments.length>1?arguments[1]:void 0)?0:e},i=function(e,t,r){return e*t+r},s=function(){return re({left:arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,top:arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,behavior:t})},c=f?{rows:0,cols:0}:0,a=!1;f?(s(i((c={rows:l(e[0],r[0]),cols:l(e[1],r[1])}).cols,o.itemSize[1],n.left),i(c.rows,o.itemSize[0],n.top)),a=p.rows!==c.rows||p.cols!==c.cols):(c=l(e,r),u?s(i(c,o.itemSize,n.left),0):s(0,i(c,o.itemSize,n.top)),a=p!==c),q.current=a,d(c)},oe=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"auto";if(t){var n=le(),l=n.first,i=n.viewport,s=function(){return re({left:arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,top:arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,behavior:r})},c="to-end"===t;if("to-start"===t){if(f)i.first.rows-l.rows>e[0]?s(i.first.cols*o.itemSize[1],(i.first.rows-1)*o.itemSize[0]):i.first.cols-l.cols>e[1]&&s((i.first.cols-1)*o.itemSize[1],i.first.rows*o.itemSize[0]);else if(i.first-l>e){var a=(i.first-1)*o.itemSize;u?s(a,0):s(0,a)}}else if(c)if(f)i.last.rows-l.rows<=e[0]+1?s(i.first.cols*o.itemSize[1],(i.first.rows+1)*o.itemSize[0]):i.last.cols-l.cols<=e[1]+1&&s((i.first.cols+1)*o.itemSize[1],i.first.rows*o.itemSize[0]);else if(i.last-l<=e+1){var m=(i.first+1)*o.itemSize;u?s(m,0):s(0,m)}}else ne(e,r)},le=function(){var e=function(e,t){return Math.floor(e/(t||e))},t=p,r=0;if(N.current){var n=N.current,l=n.scrollTop,i=n.scrollLeft;if(f)r={rows:(t={rows:e(l,o.itemSize[0]),cols:e(i,o.itemSize[1])}).rows+T.rows,cols:t.cols+T.cols};else r=(t=e(u?i:l,o.itemSize))+T}return{first:p,last:y,viewport:{first:t,last:r}}},ie=function(){var e=ue(),t=N.current?N.current.offsetWidth-e.left:0,r=N.current?N.current.offsetHeight-e.top:0,n=function(e,t){return Math.ceil(e/(t||e))},l=function(e){return Math.ceil(e/2)},i=f?{rows:n(r,o.itemSize[0]),cols:n(t,o.itemSize[1])}:n(u?t:r,o.itemSize);return{numItemsInViewport:i,numToleratedItems:I||(f?[l(i.rows),l(i.cols)]:l(i))}},se=function(e){o.autoSize&&!e&&Promise.resolve().then((function(){if(W.current){W.current.style.minHeight=W.current.style.minWidth="auto",W.current.style.position="relative",N.current.style.contain="none";var e=[n.DomHandler.getWidth(N.current),n.DomHandler.getHeight(N.current)],t=e[0],r=e[1];(f||u)&&(N.current.style.width=(t<X.current?t:o.scrollWidth||X.current)+"px"),(f||c)&&(N.current.style.height=(r<B.current?r:o.scrollHeight||B.current)+"px"),W.current.style.minHeight=W.current.style.minWidth="",W.current.style.position="",N.current.style.contain=""}}))},ce=function(){return o.items?Math.min((arguments.length>1?arguments[1]:void 0)?(o.columns||o.items[0]).length:o.items.length,arguments.length>0&&void 0!==arguments[0]?arguments[0]:0):0},ue=function(){if(W.current){var e=getComputedStyle(W.current),t=parseFloat(e.paddingLeft)+Math.max(parseFloat(e.left)||0,0),r=parseFloat(e.paddingRight)+Math.max(parseFloat(e.right)||0,0),n=parseFloat(e.paddingTop)+Math.max(parseFloat(e.top)||0,0),o=parseFloat(e.paddingBottom)+Math.max(parseFloat(e.bottom)||0,0);return{left:t,right:r,top:n,bottom:o,x:t+r,y:n+o}}return{left:0,right:0,top:0,bottom:0,x:0,y:0}},ae=function(){if(N.current){var e=N.current.parentElement,t=o.scrollWidth||"".concat(N.current.offsetWidth||e.offsetWidth,"px"),r=o.scrollHeight||"".concat(N.current.offsetHeight||e.offsetHeight,"px"),n=function(e,t){return N.current.style[e]=t};f||u?(n("height",r),n("width",t)):n("height",r)}},fe=function(){var e=o.items;if(e){var t=ue(),r=function(e,t,r){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:0;return J.current=w(w({},J.current),a({},"".concat(e),(t||[]).length*r+n+"px"))};f?(r("height",e,o.itemSize[0],t.y),r("width",o.columns||e[1],o.itemSize[1],t.x)):u?r("width",o.columns||e,o.itemSize,t.x):r("height",e,o.itemSize,t.y)}},me=function(e){if(W.current&&!o.appendOnly){var t=e?e.first:p,r=function(e,t){return e*t},n=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;A.current&&(A.current.style.top="-".concat(t,"px")),_.current=w(w({},_.current),{transform:"translate3d(".concat(e,"px, ").concat(t,"px, 0)")})};if(f)n(r(t.cols,o.itemSize[1]),r(t.rows,o.itemSize[0]));else{var l=r(t,o.itemSize);u?n(l,0):n(0,l)}}},pe=function(e){var t=e.target,r=ue(),n=function(e,t){return e?e>t?e-t:e:0},l=function(e,t){return Math.floor(e/(t||e))},i=function(e,t,r,n,o,l){return e<=o?o:l?r-n-o:t+o-1},s=function(e,t,r,n,o,l,i){return e<=l?0:Math.max(0,i?e<t?r:e-l:e>t?r:e-2*l)},c=function(e,t,r,n,o,l){var i=t+n+2*o;return e>=o&&(i+=o+1),ce(i,l)},a=n(t.scrollTop,r.top),m=n(t.scrollLeft,r.left),d=f?{rows:0,cols:0}:0,g=y,h=!1,v=C.current;if(f){var w=C.current.top<=a,b=C.current.left<=m;if(!o.appendOnly||o.appendOnly&&(w||b)){var S={rows:l(a,o.itemSize[0]),cols:l(m,o.itemSize[1])},O={rows:i(S.rows,p.rows,y.rows,T.rows,I[0],w),cols:i(S.cols,p.cols,y.cols,T.cols,I[1],b)};d={rows:s(S.rows,O.rows,p.rows,0,0,I[0],w),cols:s(S.cols,O.cols,p.cols,0,0,I[1],b)},g={rows:c(S.rows,d.rows,0,T.rows,I[0]),cols:c(S.cols,d.cols,0,T.cols,I[1],!0)},h=d.rows!==p.rows||g.rows!==y.rows||d.cols!==p.cols||g.cols!==y.cols||q.current,v={top:a,left:m}}}else{var z=u?m:a,j=C.current<=z;if(!o.appendOnly||o.appendOnly&&j){var E=l(z,o.itemSize);g=c(E,d=s(E,i(E,p,y,T,I,j),p,0,0,I,j),0,T,I),h=d!==p||g!==y||q.current,v=z}}return{first:d,last:g,isRangeChanged:h,scrollPos:v}},de=function(e){var t=pe(e),r=t.first,n=t.last,l=t.scrollPos;if(t.isRangeChanged){var i={first:r,last:n};if(me(i),d(r),b(n),C.current=l,o.onScrollIndexChange&&o.onScrollIndexChange(i),o.lazy&&te(r)){var s={first:o.step?Math.min(ee(r)*o.step,o.items.length-o.step):r,last:Math.min(o.step?(ee(r)+1)*o.step:n,o.items.length)};(!G.current||G.current.first!==s.first||G.current.last!==s.last)&&o.onLazyLoad&&o.onLazyLoad(s),G.current=s}}},ge=function(){k.current&&clearTimeout(k.current),k.current=setTimeout((function(){if(N.current){var e=[n.DomHandler.getWidth(N.current),n.DomHandler.getHeight(N.current)],t=e[0],r=e[1],l=t!==X.current,i=r!==B.current;(f?l||i:u?l:!!c&&i)&&(P(o.numToleratedItems),X.current=t,B.current=r,Y.current=n.DomHandler.getWidth(W.current),$.current=n.DomHandler.getHeight(W.current))}}),o.resizeDelay)},he=function(e){var t=(o.items||[]).length,r=f?p.rows+e:p+e;return{index:r,count:t,first:0===r,last:r===t-1,even:r%2==0,odd:r%2!=0,props:o}},ve=function(e,t){var r=M.length;return w({index:e,count:r,first:0===e,last:e===r-1,even:e%2==0,odd:e%2!=0,props:o},t)},ye=function(){var e=o.items;return e&&!H?f?e.slice(o.appendOnly?0:p.rows,y.rows).map((function(e){return o.columns?e:e.slice(o.appendOnly?0:p.cols,y.cols)})):u&&o.columns?e:e.slice(o.appendOnly?0:p,y):[]},we=function(){var e,t,r,n,l;o.disabled||(ae(),e=ie(),t=e.numItemsInViewport,r=e.numToleratedItems,n=function(e,t,r){return ce(e+t+(e<r?2:3)*r,arguments.length>3&&void 0!==arguments[3]&&arguments[3])},l=f?{rows:n(p.rows,t.rows,r[0]),cols:n(p.cols,t.cols,r[1],!0)}:n(p,t,r),E(t),P(r),b(l),o.showLoader&&U(f?Array.from({length:t.rows}).map((function(){return Array.from({length:t.cols})})):Array.from({length:t})),o.lazy&&Promise.resolve().then((function(){G.current={first:o.step?f?{rows:0,cols:p.cols}:0:p,last:Math.min(o.step?o.step:l,o.items.length)},o.onLazyLoad&&o.onLazyLoad(G.current)})),fe())};r.useMountEffect((function(){N.current&&n.DomHandler.isVisible(N.current)&&(W.current=W.current||W.current||n.DomHandler.findSingle(N.current,".p-virtualscroller-content"),we(),K(),Q(),X.current=n.DomHandler.getWidth(N.current),B.current=n.DomHandler.getHeight(N.current),Y.current=n.DomHandler.getWidth(W.current),$.current=n.DomHandler.getHeight(W.current))})),r.useUpdateEffect((function(){we()}),[o.itemSize,o.scrollHeight,o.scrollWidth]),r.useUpdateEffect((function(){o.numToleratedItems!==I&&P(o.numToleratedItems)}),[o.numToleratedItems]),r.useUpdateEffect((function(){o.numToleratedItems===I&&we()}),[I]),r.useUpdateEffect((function(){s.items&&s.items.length===(o.items||[]).length||we();var e=H;o.lazy&&s.loading!==o.loading&&o.loading!==H&&(D(o.loading),e=o.loading),se(e)})),r.useUpdateEffect((function(){C.current=f?{top:0,left:0}:0}),[o.orientation]),l.useImperativeHandle(t,(function(){return{props:o,getElementRef:Z,scrollTo:re,scrollToIndex:ne,scrollInView:oe,getRenderedRange:le}}));var be=function(e){var t=ve(e,arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),r=n.ObjectUtils.getJSXElement(o.loadingTemplate,t);return l.createElement(l.Fragment,{key:e},r)},Se=function(e,t){var r=he(t),i=n.ObjectUtils.getJSXElement(o.itemTemplate,e,r);return l.createElement(l.Fragment,{key:r.index},i)};if(o.disabled){var Oe=n.ObjectUtils.getJSXElement(o.contentTemplate,{items:o.items,rows:o.items,columns:o.columns});return l.createElement(l.Fragment,null,o.children,Oe)}var ze=v.getOtherProps(o),je=n.classNames("p-virtualscroller",{"p-virtualscroller-inline":o.inline,"p-virtualscroller-both p-both-scroll":f,"p-virtualscroller-horizontal p-horizontal-scroll":u},o.className),Te=function(){if(!o.loaderDisabled&&o.showLoader&&H){var e=n.classNames("p-virtualscroller-loader",{"p-component-overlay":!o.loadingTemplate}),t=l.createElement("i",{className:"p-virtualscroller-loading-icon pi pi-spinner pi-spin"});return o.loadingTemplate?t=M.map((function(e,t){return be(t,f&&{numCols:T.cols})})):o.loaderIconTemplate&&(t=n.ObjectUtils.getJSXElement(o.loaderIconTemplate,{className:"p-virtualscroller-loading-icon",element:t,props:o})),l.createElement("div",{className:e},t)}return null}(),Ee=function(){var e=ye().map(Se),t=n.classNames("p-virtualscroller-content",{"p-virtualscroller-loading":H}),r=l.createElement("div",{ref:W,style:_.current,className:t},e);if(o.contentTemplate){var i={style:_.current,className:t,spacerStyle:J.current,contentRef:function(e){return W.current=n.ObjectUtils.getRefElement(e)},spacerRef:function(e){return F.current=n.ObjectUtils.getRefElement(e)},stickyRef:function(e){return A.current=n.ObjectUtils.getRefElement(e)},items:ye(),getItemOptions:function(e){return he(e)},children:e,element:r,props:o,loading:H,getLoaderOptions:function(e,t){return ve(e,t)},loadingTemplate:o.loadingTemplate,itemSize:o.itemSize,rows:H?o.loaderDisabled?M:[]:ye(),columns:o.columns&&f||u?H&&o.loaderDisabled?f?M[0]:M:o.columns.slice(f?p.cols:p,f?y.cols:y):o.columns,vertical:c,horizontal:u,both:f};return n.ObjectUtils.getJSXElement(o.contentTemplate,i)}return r}(),Re=o.showSpacer?l.createElement("div",{ref:F,style:J.current,className:"p-virtualscroller-spacer"}):null;return l.createElement("div",i({ref:N,className:je,tabIndex:o.tabIndex,style:o.style},ze,{onScroll:function(e){o.onScroll&&o.onScroll(e),o.delay?(V.current&&clearTimeout(V.current),te(p)&&(!H&&o.showLoader&&(pe(e).isRangeChanged||o.step&&te(p))&&D(!0),V.current=setTimeout((function(){de(e),!H||!o.showLoader||o.lazy&&void 0!==o.loading||(D(!1),z(ee(p)))}),o.delay))):de(e)}}),Ee,Re,Te)})));return b.displayName="VirtualScroller",e.VirtualScroller=b,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.hooks,primereact.utils);

package/web-types.json

@@ -1,7 +1,7 @@
 {
     "framework": "React",
     "name": "PrimeReact",
-    "version": "9.1.1",
+    "version": "9.2.1",
     "tags": [
         {
             "name": "Accordion",
@@ -4668,7 +4668,7 @@
                     "name": "itemTemplate",
                     "type": "function",
                     "default": "null",
-                    "description": "Function that gets the option along with the layout mdoe and returns the content."
+                    "description": "Function that gets the option along with the layout mode and returns the content."
                 }
             ],
             "events": [