primevue 3.22.4 → 3.24.0

package/virtualscroller/virtualscroller.js

@@ -1,5 +1,5 @@
 this.primevue = this.primevue || {};
-this.primevue.virtualscroller = (function (vue) {
+this.primevue.virtualscroller = (function (utils, vue) {
     'use strict';
 
     var script = {
@@ -34,6 +34,10 @@ this.primevue.virtualscroller = (function (vue) {
                 type: Number,
                 default: 0
             },
+            resizeDelay: {
+                type: Number,
+                default: 10
+            },
             lazy: {
                 type: Boolean,
                 default: false
@@ -65,12 +69,29 @@ this.primevue.virtualscroller = (function (vue) {
             tabindex: {
                 type: Number,
                 default: 0
+            },
+            inline: {
+                type: Boolean,
+                default: false
+            },
+            step: {
+                type: Number,
+                default: 0
+            },
+            appendOnly: {
+                type: Boolean,
+                default: false
+            },
+            autoSize: {
+                type: Boolean,
+                default: false
             }
         },
         data() {
             return {
                 first: this.isBoth() ? { rows: 0, cols: 0 } : 0,
                 last: this.isBoth() ? { rows: 0, cols: 0 } : 0,
+                page: this.isBoth() ? { rows: 0, cols: 0 } : 0,
                 numItemsInViewport: this.isBoth() ? { rows: 0, cols: 0 } : 0,
                 lastScrollPos: this.isBoth() ? { top: 0, left: 0 } : 0,
                 d_numToleratedItems: this.numToleratedItems,
@@ -84,6 +105,15 @@ this.primevue.virtualscroller = (function (vue) {
         content: null,
         lastScrollPos: null,
         scrollTimeout: null,
+        resizeTimeout: null,
+        defaultWidth: 0,
+        defaultHeight: 0,
+        defaultContentWidth: 0,
+        defaultContentHeight: 0,
+        isRangeChanged: false,
+        lazyLoadState: {},
+        resizeListener: null,
+        initialized: false,
         watch: {
             numToleratedItems(newValue) {
                 this.d_numToleratedItems = newValue;
@@ -94,22 +124,59 @@ this.primevue.virtualscroller = (function (vue) {
             items(newValue, oldValue) {
                 if (!oldValue || oldValue.length !== (newValue || []).length) {
                     this.init();
+                    this.calculateAutoSize();
                 }
             },
+            itemSize() {
+                this.init();
+                this.calculateAutoSize();
+            },
             orientation() {
                 this.lastScrollPos = this.isBoth() ? { top: 0, left: 0 } : 0;
+            },
+            scrollHeight() {
+                this.init();
+                this.calculateAutoSize();
+            },
+            scrollWidth() {
+                this.init();
+                this.calculateAutoSize();
             }
         },
         mounted() {
-            this.init();
+            this.viewInit();
 
             this.lastScrollPos = this.isBoth() ? { top: 0, left: 0 } : 0;
+            this.lazyLoadState = this.lazyLoadState || {};
+        },
+        updated() {
+            !this.initialized && this.viewInit();
+        },
+        unmounted() {
+            this.unbindResizeListener();
+
+            this.initialized = false;
         },
         methods: {
+            viewInit() {
+                if (utils.DomHandler.isVisible(this.element)) {
+                    this.setContentEl(this.content);
+                    this.init();
+                    this.bindResizeListener();
+
+                    this.defaultWidth = utils.DomHandler.getWidth(this.element);
+                    this.defaultHeight = utils.DomHandler.getHeight(this.element);
+                    this.defaultContentWidth = utils.DomHandler.getWidth(this.content);
+                    this.defaultContentHeight = utils.DomHandler.getHeight(this.content);
+                    this.initialized = true;
+                }
+            },
             init() {
-                this.setSize();
-                this.calculateOptions();
-                this.setSpacerSize();
+                if (!this.disabled) {
+                    this.setSize();
+                    this.calculateOptions();
+                    this.setSpacerSize();
+                }
             },
             isVertical() {
                 return this.orientation === 'vertical';
@@ -121,31 +188,34 @@ this.primevue.virtualscroller = (function (vue) {
                 return this.orientation === 'both';
             },
             scrollTo(options) {
-                this.element && this.element.scrollTo(options);
+                this.lastScrollPos = this.both ? { top: 0, left: 0 } : 0;
+                this.element?.scrollTo(options);
             },
             scrollToIndex(index, behavior = 'auto') {
                 const both = this.isBoth();
                 const horizontal = this.isHorizontal();
                 const first = this.first;
                 const { numToleratedItems } = this.calculateNumItems();
+                const contentPos = this.getContentPosition();
                 const itemSize = this.itemSize;
                 const calculateFirst = (_index = 0, _numT) => (_index <= _numT ? 0 : _index);
-                const calculateCoord = (_first, _size) => _first * _size;
+                const calculateCoord = (_first, _size, _cpos) => _first * _size + _cpos;
                 const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior });
+                let newFirst = both ? { rows: 0, cols: 0 } : 0;
+                let isRangeChanged = false;
 
                 if (both) {
-                    const newFirst = { rows: calculateFirst(index[0], numToleratedItems[0]), cols: calculateFirst(index[1], numToleratedItems[1]) };
-
-                    if (newFirst.rows !== first.rows || newFirst.cols !== first.cols) {
-                        scrollTo(calculateCoord(newFirst.cols, itemSize[1]), calculateCoord(newFirst.rows, itemSize[0]));
-                    }
+                    newFirst = { rows: calculateFirst(index[0], numToleratedItems[0]), cols: calculateFirst(index[1], numToleratedItems[1]) };
+                    scrollTo(calculateCoord(newFirst.cols, itemSize[1], contentPos.left), calculateCoord(newFirst.rows, itemSize[0], contentPos.top));
+                    isRangeChanged = newFirst.rows !== first.rows || newFirst.cols !== first.cols;
                 } else {
-                    const newFirst = calculateFirst(index, numToleratedItems);
-
-                    if (newFirst !== first) {
-                        horizontal ? scrollTo(calculateCoord(newFirst, itemSize), 0) : scrollTo(0, calculateCoord(newFirst, itemSize));
-                    }
+                    newFirst = calculateFirst(index, numToleratedItems);
+                    horizontal ? scrollTo(calculateCoord(newFirst, itemSize, contentPos.left), 0) : scrollTo(0, calculateCoord(newFirst, itemSize, contentPos.top));
+                    isRangeChanged = newFirst !== first;
                 }
+
+                this.isRangeChanged = isRangeChanged;
+                this.first = newFirst;
             },
             scrollInView(index, to, behavior = 'auto') {
                 if (to) {
@@ -198,8 +268,7 @@ this.primevue.virtualscroller = (function (vue) {
                 if (this.element) {
                     const both = this.isBoth();
                     const horizontal = this.isHorizontal();
-                    const scrollTop = this.element.scrollTop;
-                    const scrollLeft = this.element.scrollLeft;
+                    const { scrollTop, scrollLeft } = this.element.scrollTop;
 
                     if (both) {
                         firstInViewport = { rows: calculateFirstInViewport(scrollTop, this.itemSize[0]), cols: calculateFirstInViewport(scrollLeft, this.itemSize[1]) };
@@ -242,7 +311,7 @@ this.primevue.virtualscroller = (function (vue) {
                 const both = this.isBoth();
                 const first = this.first;
                 const { numItemsInViewport, numToleratedItems } = this.calculateNumItems();
-                const calculateLast = (_first, _num, _numT, _isCols) => this.getLast(_first + _num + (_first < _numT ? 2 : 3) * _numT, _isCols);
+                const calculateLast = (_first, _num, _numT, _isCols = false) => this.getLast(_first + _num + (_first < _numT ? 2 : 3) * _numT, _isCols);
                 const last = both
                     ? { rows: calculateLast(first.rows, numItemsInViewport.rows, numToleratedItems[0]), cols: calculateLast(first.cols, numItemsInViewport.cols, numToleratedItems[1], true) }
                     : calculateLast(first, numItemsInViewport, numToleratedItems);
@@ -257,23 +326,55 @@ this.primevue.virtualscroller = (function (vue) {
                 }
 
                 if (this.lazy) {
-                    this.$emit('lazy-load', { first, last });
+                    Promise.resolve().then(() => {
+                        this.lazyLoadState = {
+                            first: this.step ? (both ? { rows: 0, cols: first.cols } : 0) : first,
+                            last: Math.min(this.step ? this.step : last, this.items.length)
+                        };
+
+                        this.$emit('lazy-load', this.lazyLoadState);
+                    });
                 }
             },
-            getLast(last = 0, isCols) {
-                if (this.items) {
-                    return Math.min(isCols ? (this.columns || this.items[0]).length : this.items.length, last);
-                }
+            calculateAutoSize() {
+                if (this.autoSize && !this.d_loading) {
+                    Promise.resolve().then(() => {
+                        if (this.content) {
+                            const both = this.isBoth();
+                            const horizontal = this.isHorizontal();
+                            const vertical = this.isVertical();
+
+                            this.content.style.minHeight = this.content.style.minWidth = 'auto';
+                            this.content.style.position = 'relative';
+                            this.element.style.contain = 'none';
+
+                            const [contentWidth, contentHeight] = [utils.DomHandler.getWidth(this.content), utils.DomHandler.getHeight(this.content)];
+
+                            contentWidth !== this.defaultContentWidth && (this.element.style.width = '');
+                            contentHeight !== this.defaultContentHeight && (this.element.style.height = '');
 
-                return 0;
+                            const [width, height] = [utils.DomHandler.getWidth(this.element), utils.DomHandler.getHeight(this.element)];
+
+                            (both || horizontal) && (this.element.style.width = width < this.defaultWidth ? width + 'px' : this.scrollWidth || this.defaultWidth + 'px');
+                            (both || vertical) && (this.element.style.height = height < this.defaultHeight ? height + 'px' : this.scrollHeight || this.defaultHeight + 'px');
+
+                            this.content.style.minHeight = this.content.style.minWidth = '';
+                            this.content.style.position = '';
+                            this.element.style.contain = '';
+                        }
+                    });
+                }
+            },
+            getLast(last = 0, isCols) {
+                return this.items ? Math.min(isCols ? (this.columns || this.items[0]).length : this.items.length, last) : 0;
             },
             getContentPosition() {
                 if (this.content) {
                     const style = getComputedStyle(this.content);
-                    const left = parseInt(style.paddingLeft, 10) + Math.max(parseInt(style.left, 10), 0);
-                    const right = parseInt(style.paddingRight, 10) + Math.max(parseInt(style.right, 10), 0);
-                    const top = parseInt(style.paddingTop, 10) + Math.max(parseInt(style.top, 10), 0);
-                    const bottom = parseInt(style.paddingBottom, 10) + Math.max(parseInt(style.bottom, 10), 0);
+                    const left = parseFloat(style.paddingLeft) + Math.max(parseFloat(style.left) || 0, 0);
+                    const right = parseFloat(style.paddingRight) + Math.max(parseFloat(style.right) || 0, 0);
+                    const top = parseFloat(style.paddingTop) + Math.max(parseFloat(style.top) || 0, 0);
+                    const bottom = parseFloat(style.paddingBottom) + Math.max(parseFloat(style.bottom) || 0, 0);
 
                     return { left, right, top, bottom, x: left + right, y: top + bottom };
                 }
@@ -315,15 +416,12 @@ this.primevue.virtualscroller = (function (vue) {
                 }
             },
             setContentPosition(pos) {
-                if (this.content) {
+                if (this.content && !this.appendOnly) {
                     const both = this.isBoth();
                     const horizontal = this.isHorizontal();
                     const first = pos ? pos.first : this.first;
                     const calculateTranslateVal = (_first, _size) => _first * _size;
-
-                    const setTransform = (_x = 0, _y = 0) => {
-                        this.contentStyle = { ...this.contentStyle, ...{ transform: `translate3d(${_x}px, ${_y}px, 0)` } };
-                    };
+                    const setTransform = (_x = 0, _y = 0) => (this.contentStyle = { ...this.contentStyle, ...{ transform: `translate3d(${_x}px, ${_y}px, 0)` } });
 
                     if (both) {
                         setTransform(calculateTranslateVal(first.cols, this.itemSize[1]), calculateTranslateVal(first.rows, this.itemSize[0]));
@@ -372,33 +470,39 @@ this.primevue.virtualscroller = (function (vue) {
                 if (both) {
                     const isScrollDown = this.lastScrollPos.top <= scrollTop;
                     const isScrollRight = this.lastScrollPos.left <= scrollLeft;
-                    const currentIndex = { rows: calculateCurrentIndex(scrollTop, this.itemSize[0]), cols: calculateCurrentIndex(scrollLeft, this.itemSize[1]) };
-                    const triggerIndex = {
-                        rows: calculateTriggerIndex(currentIndex.rows, this.first.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0], isScrollDown),
-                        cols: calculateTriggerIndex(currentIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], isScrollRight)
-                    };
-
-                    newFirst = {
-                        rows: calculateFirst(currentIndex.rows, triggerIndex.rows, this.first.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0], isScrollDown),
-                        cols: calculateFirst(currentIndex.cols, triggerIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], isScrollRight)
-                    };
-                    newLast = {
-                        rows: calculateLast(currentIndex.rows, newFirst.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0]),
-                        cols: calculateLast(currentIndex.cols, newFirst.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], true)
-                    };
-
-                    isRangeChanged = newFirst.rows !== this.first.rows || newLast.rows !== this.last.rows || newFirst.cols !== this.first.cols || newLast.cols !== this.last.cols;
-                    newScrollPos = { top: scrollTop, left: scrollLeft };
+
+                    if (!this.appendOnly || (this.appendOnly && (isScrollDown || isScrollRight))) {
+                        const currentIndex = { rows: calculateCurrentIndex(scrollTop, this.itemSize[0]), cols: calculateCurrentIndex(scrollLeft, this.itemSize[1]) };
+                        const triggerIndex = {
+                            rows: calculateTriggerIndex(currentIndex.rows, this.first.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0], isScrollDown),
+                            cols: calculateTriggerIndex(currentIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], isScrollRight)
+                        };
+
+                        newFirst = {
+                            rows: calculateFirst(currentIndex.rows, triggerIndex.rows, this.first.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0], isScrollDown),
+                            cols: calculateFirst(currentIndex.cols, triggerIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], isScrollRight)
+                        };
+                        newLast = {
+                            rows: calculateLast(currentIndex.rows, newFirst.rows, this.last.rows, this.numItemsInViewport.rows, this.d_numToleratedItems[0]),
+                            cols: calculateLast(currentIndex.cols, newFirst.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], true)
+                        };
+
+                        isRangeChanged = newFirst.rows !== this.first.rows || newLast.rows !== this.last.rows || newFirst.cols !== this.first.cols || newLast.cols !== this.last.cols || this.isRangeChanged;
+                        newScrollPos = { top: scrollTop, left: scrollLeft };
+                    }
                 } else {
                     const scrollPos = horizontal ? scrollLeft : scrollTop;
                     const isScrollDownOrRight = this.lastScrollPos <= scrollPos;
-                    const currentIndex = calculateCurrentIndex(scrollPos, this.itemSize);
-                    const triggerIndex = calculateTriggerIndex(currentIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight);
 
-                    newFirst = calculateFirst(currentIndex, triggerIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight);
-                    newLast = calculateLast(currentIndex, newFirst, this.last, this.numItemsInViewport, this.d_numToleratedItems);
-                    isRangeChanged = newFirst !== this.first || newLast !== this.last;
-                    newScrollPos = scrollPos;
+                    if (!this.appendOnly || (this.appendOnly && isScrollDownOrRight)) {
+                        const currentIndex = calculateCurrentIndex(scrollPos, this.itemSize);
+                        const triggerIndex = calculateTriggerIndex(currentIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight);
+
+                        newFirst = calculateFirst(currentIndex, triggerIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight);
+                        newLast = calculateLast(currentIndex, newFirst, this.last, this.numItemsInViewport, this.d_numToleratedItems);
+                        isRangeChanged = newFirst !== this.first || newLast !== this.last || this.isRangeChanged;
+                        newScrollPos = scrollPos;
+                    }
                 }
 
                 return {
@@ -422,21 +526,29 @@ this.primevue.virtualscroller = (function (vue) {
 
                     this.$emit('scroll-index-change', newState);
 
-                    if (this.lazy) {
-                        this.$emit('lazy-load', newState);
+                    if (this.lazy && this.isPageChanged(first)) {
+                        const lazyLoadState = {
+                            first: this.step ? Math.min(this.getPageByFirst(first) * this.step, this.items.length - this.step) : first,
+                            last: Math.min(this.step ? (this.getPageByFirst(first) + 1) * this.step : last, this.items.length)
+                        };
+                        const isLazyStateChanged = this.lazyLoadState.first !== lazyLoadState.first || this.lazyLoadState.last !== lazyLoadState.last;
+
+                        isLazyStateChanged && this.$emit('lazy-load', lazyLoadState);
+                        this.lazyLoadState = lazyLoadState;
                     }
                 }
             },
             onScroll(event) {
                 this.$emit('scroll', event);
 
-                if (this.delay) {
+                if (this.delay && this.isPageChanged()) {
                     if (this.scrollTimeout) {
                         clearTimeout(this.scrollTimeout);
                     }
 
                     if (!this.d_loading && this.showLoader) {
-                        const { isRangeChanged: changed } = this.onScrollPositionChange(event);
+                        const { isRangeChanged } = this.onScrollPositionChange(event);
+                        const changed = isRangeChanged || (this.step ? this.isPageChanged() : false);
 
                         changed && (this.d_loading = true);
                     }
@@ -444,14 +556,56 @@ this.primevue.virtualscroller = (function (vue) {
                     this.scrollTimeout = setTimeout(() => {
                         this.onScrollChange(event);
 
-                        if (this.d_loading && this.showLoader && !this.lazy) {
+                        if (this.d_loading && this.showLoader && (!this.lazy || this.loading === undefined)) {
                             this.d_loading = false;
+                            this.page = this.getPageByFirst();
                         }
                     }, this.delay);
                 } else {
                     this.onScrollChange(event);
                 }
             },
+            onResize() {
+                if (this.resizeTimeout) {
+                    clearTimeout(this.resizeTimeout);
+                }
+
+                this.resizeTimeout = setTimeout(() => {
+                    if (utils.DomHandler.isVisible(this.element)) {
+                        const both = this.isBoth();
+                        const vertical = this.isVertical();
+                        const horizontal = this.isHorizontal();
+                        const [width, height] = [utils.DomHandler.getWidth(this.element), utils.DomHandler.getHeight(this.element)];
+                        const [isDiffWidth, isDiffHeight] = [width !== this.defaultWidth, height !== this.defaultHeight];
+                        const reinit = both ? isDiffWidth || isDiffHeight : horizontal ? isDiffWidth : vertical ? isDiffHeight : false;
+
+                        if (reinit) {
+                            this.d_numToleratedItems = this.numToleratedItems;
+                            this.defaultWidth = width;
+                            this.defaultHeight = height;
+                            this.defaultContentWidth = utils.DomHandler.getWidth(this.content);
+                            this.defaultContentHeight = utils.DomHandler.getHeight(this.content);
+
+                            this.init();
+                        }
+                    }
+                }, this.resizeDelay);
+            },
+            bindResizeListener() {
+                if (!this.resizeListener) {
+                    this.resizeListener = this.onResize.bind(this);
+
+                    window.addEventListener('resize', this.resizeListener);
+                    window.addEventListener('orientationchange', this.resizeListener);
+                }
+            },
+            unbindResizeListener() {
+                if (this.resizeListener) {
+                    window.removeEventListener('resize', this.resizeListener);
+                    window.removeEventListener('orientationchange', this.resizeListener);
+                    this.resizeListener = null;
+                }
+            },
             getOptions(renderedIndex) {
                 const count = (this.items || []).length;
                 const index = this.isBoth() ? this.first.rows + renderedIndex : this.first + renderedIndex;
@@ -478,6 +632,15 @@ this.primevue.virtualscroller = (function (vue) {
                     ...extOptions
                 };
             },
+            getPageByFirst(first) {
+                return Math.floor(((first ?? this.first) + this.d_numToleratedItems * 4) / (this.step || 1));
+            },
+            isPageChanged(first) {
+                return this.step ? this.page !== this.getPageByFirst(first ?? this.first) : true;
+            },
+            setContentEl(el) {
+                this.content = el || this.content || utils.DomHandler.findSingle(this.element, '.p-virtualscroller-content');
+            },
             elementRef(el) {
                 this.element = el;
             },
@@ -490,8 +653,9 @@ this.primevue.virtualscroller = (function (vue) {
                 return [
                     'p-virtualscroller',
                     {
-                        'p-both-scroll': this.isBoth(),
-                        'p-horizontal-scroll': this.isHorizontal()
+                        'p-virtualscroller-inline': this.inline,
+                        'p-virtualscroller-both p-both-scroll': this.isBoth(),
+                        'p-virtualscroller-horizontal p-horizontal-scroll': this.isHorizontal()
                     },
                     this.class
                 ];
@@ -513,13 +677,10 @@ this.primevue.virtualscroller = (function (vue) {
                 ];
             },
             loadedItems() {
-                const items = this.items;
-
-                if (items && !this.d_loading) {
-                    if (this.isBoth()) {
-                        return items.slice(this.first.rows, this.last.rows).map((item) => (this.columns ? item : item.slice(this.first.cols, this.last.cols)));
-                    } else if (this.isHorizontal() && this.columns) return items;
-                    else return items.slice(this.first, this.last);
+                if (this.items && !this.d_loading) {
+                    if (this.isBoth()) return this.items.slice(this.appendOnly ? 0 : this.first.rows, this.last.rows).map((item) => (this.columns ? item : item.slice(this.appendOnly ? 0 : this.first.cols, this.last.cols)));
+                    else if (this.isHorizontal() && this.columns) return this.items;
+                    else return this.items.slice(this.appendOnly ? 0 : this.first, this.last);
                 }
 
                 return [];
@@ -648,11 +809,11 @@ this.primevue.virtualscroller = (function (vue) {
       }
     }
 
-    var css_248z = "\n.p-virtualscroller {\n    position: relative;\n    overflow: auto;\n    contain: strict;\n    transform: translateZ(0);\n    will-change: scroll-position;\n    outline: 0 none;\n}\n.p-virtualscroller-content {\n    position: absolute;\n    top: 0;\n    left: 0;\n    contain: content;\n    min-height: 100%;\n    min-width: 100%;\n    will-change: transform;\n}\n.p-virtualscroller-spacer {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 1px;\n    width: 1px;\n    transform-origin: 0 0;\n    pointer-events: none;\n}\n.p-virtualscroller .p-virtualscroller-loader {\n    position: sticky;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n}\n.p-virtualscroller-loader.p-component-overlay {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n";
+    var css_248z = "\n.p-virtualscroller {\n    position: relative;\n    overflow: auto;\n    contain: strict;\n    transform: translateZ(0);\n    will-change: scroll-position;\n    outline: 0 none;\n}\n.p-virtualscroller-content {\n    position: absolute;\n    top: 0;\n    left: 0;\n    /* contain: content; */\n    min-height: 100%;\n    min-width: 100%;\n    will-change: transform;\n}\n.p-virtualscroller-spacer {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 1px;\n    width: 1px;\n    transform-origin: 0 0;\n    pointer-events: none;\n}\n.p-virtualscroller .p-virtualscroller-loader {\n    position: sticky;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n}\n.p-virtualscroller-loader.p-component-overlay {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.p-virtualscroller-loading-icon {\n    font-size: 2rem;\n}\n.p-virtualscroller-horizontal > .p-virtualscroller-content {\n    display: flex;\n}\n\n/* Inline */\n.p-virtualscroller-inline .p-virtualscroller-content {\n    position: static;\n}\n";
     styleInject(css_248z);
 
     script.render = render;
 
     return script;
 
-})(Vue);
+})(primevue.utils, Vue);

package/virtualscroller/virtualscroller.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.virtualscroller=function(t){"use strict";var s={name:"VirtualScroller",emits:["update:numToleratedItems","scroll","scroll-index-change","lazy-load"],props:{id:{type:String,default:null},style:null,class:null,items:{type:Array,default:null},itemSize:{type:[Number,Array],default:0},scrollHeight:null,scrollWidth:null,orientation:{type:String,default:"vertical"},numToleratedItems:{type:Number,default:null},delay:{type:Number,default:0},lazy:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},loaderDisabled:{type:Boolean,default:!1},columns:{type:Array,default:null},loading:{type:Boolean,default:!1},showSpacer:{type:Boolean,default:!0},showLoader:{type:Boolean,default:!1},tabindex:{type:Number,default:0}},data(){return{first:this.isBoth()?{rows:0,cols:0}:0,last:this.isBoth()?{rows:0,cols:0}:0,numItemsInViewport:this.isBoth()?{rows:0,cols:0}:0,lastScrollPos:this.isBoth()?{top:0,left:0}:0,d_numToleratedItems:this.numToleratedItems,d_loading:this.loading,loaderArr:[],spacerStyle:{},contentStyle:{}}},element:null,content:null,lastScrollPos:null,scrollTimeout:null,watch:{numToleratedItems(t){this.d_numToleratedItems=t},loading(t){this.d_loading=t},items(t,s){s&&s.length===(t||[]).length||this.init()},orientation(){this.lastScrollPos=this.isBoth()?{top:0,left:0}:0}},mounted(){this.init(),this.lastScrollPos=this.isBoth()?{top:0,left:0}:0},methods:{init(){this.setSize(),this.calculateOptions(),this.setSpacerSize()},isVertical(){return"vertical"===this.orientation},isHorizontal(){return"horizontal"===this.orientation},isBoth(){return"both"===this.orientation},scrollTo(t){this.element&&this.element.scrollTo(t)},scrollToIndex(t,s="auto"){const e=this.isBoth(),i=this.isHorizontal(),o=this.first,{numToleratedItems:l}=this.calculateNumItems(),n=this.itemSize,r=(t=0,s)=>t<=s?0:t,a=(t,s)=>t*s,h=(t=0,e=0)=>this.scrollTo({left:t,top:e,behavior:s});if(e){const s={rows:r(t[0],l[0]),cols:r(t[1],l[1])};s.rows===o.rows&&s.cols===o.cols||h(a(s.cols,n[1]),a(s.rows,n[0]))}else{const s=r(t,l);s!==o&&(i?h(a(s,n),0):h(0,a(s,n)))}},scrollInView(t,s,e="auto"){if(s){const i=this.isBoth(),o=this.isHorizontal(),{first:l,viewport:n}=this.getRenderedRange(),r=(t=0,s=0)=>this.scrollTo({left:t,top:s,behavior:e}),a="to-end"===s;if("to-start"===s){if(i)n.first.rows-l.rows>t[0]?r(n.first.cols*this.itemSize[1],(n.first.rows-1)*this.itemSize[0]):n.first.cols-l.cols>t[1]&&r((n.first.cols-1)*this.itemSize[1],n.first.rows*this.itemSize[0]);else if(n.first-l>t){const t=(n.first-1)*this.itemSize;o?r(t,0):r(0,t)}}else if(a)if(i)n.last.rows-l.rows<=t[0]+1?r(n.first.cols*this.itemSize[1],(n.first.rows+1)*this.itemSize[0]):n.last.cols-l.cols<=t[1]+1&&r((n.first.cols+1)*this.itemSize[1],n.first.rows*this.itemSize[0]);else if(n.last-l<=t+1){const t=(n.first+1)*this.itemSize;o?r(t,0):r(0,t)}}else this.scrollToIndex(t,e)},getRenderedRange(){const t=(t,s)=>Math.floor(t/(s||t));let s=this.first,e=0;if(this.element){const i=this.isBoth(),o=this.isHorizontal(),l=this.element.scrollTop,n=this.element.scrollLeft;if(i)s={rows:t(l,this.itemSize[0]),cols:t(n,this.itemSize[1])},e={rows:s.rows+this.numItemsInViewport.rows,cols:s.cols+this.numItemsInViewport.cols};else{s=t(o?n:l,this.itemSize),e=s+this.numItemsInViewport}}return{first:this.first,last:this.last,viewport:{first:s,last:e}}},calculateNumItems(){const t=this.isBoth(),s=this.isHorizontal(),e=this.itemSize,i=this.getContentPosition(),o=this.element?this.element.offsetWidth-i.left:0,l=this.element?this.element.offsetHeight-i.top:0,n=(t,s)=>Math.ceil(t/(s||t)),r=t=>Math.ceil(t/2),a=t?{rows:n(l,e[0]),cols:n(o,e[1])}:n(s?o:l,e);return{numItemsInViewport:a,numToleratedItems:this.d_numToleratedItems||(t?[r(a.rows),r(a.cols)]:r(a))}},calculateOptions(){const t=this.isBoth(),s=this.first,{numItemsInViewport:e,numToleratedItems:i}=this.calculateNumItems(),o=(t,s,e,i)=>this.getLast(t+s+(t<e?2:3)*e,i),l=t?{rows:o(s.rows,e.rows,i[0]),cols:o(s.cols,e.cols,i[1],!0)}:o(s,e,i);this.last=l,this.numItemsInViewport=e,this.d_numToleratedItems=i,this.$emit("update:numToleratedItems",this.d_numToleratedItems),this.showLoader&&(this.loaderArr=t?Array.from({length:e.rows}).map((()=>Array.from({length:e.cols}))):Array.from({length:e})),this.lazy&&this.$emit("lazy-load",{first:s,last:l})},getLast(t=0,s){return this.items?Math.min(s?(this.columns||this.items[0]).length:this.items.length,t):0},getContentPosition(){if(this.content){const t=getComputedStyle(this.content),s=parseInt(t.paddingLeft,10)+Math.max(parseInt(t.left,10),0),e=parseInt(t.paddingRight,10)+Math.max(parseInt(t.right,10),0),i=parseInt(t.paddingTop,10)+Math.max(parseInt(t.top,10),0),o=parseInt(t.paddingBottom,10)+Math.max(parseInt(t.bottom,10),0);return{left:s,right:e,top:i,bottom:o,x:s+e,y:i+o}}return{left:0,right:0,top:0,bottom:0,x:0,y:0}},setSize(){if(this.element){const t=this.isBoth(),s=this.isHorizontal(),e=this.element.parentElement,i=this.scrollWidth||`${this.element.offsetWidth||e.offsetWidth}px`,o=this.scrollHeight||`${this.element.offsetHeight||e.offsetHeight}px`,l=(t,s)=>this.element.style[t]=s;t||s?(l("height",o),l("width",i)):l("height",o)}},setSpacerSize(){const t=this.items;if(t){const s=this.isBoth(),e=this.isHorizontal(),i=this.getContentPosition(),o=(t,s,e,i=0)=>this.spacerStyle={...this.spacerStyle,[`${t}`]:(s||[]).length*e+i+"px"};s?(o("height",t,this.itemSize[0],i.y),o("width",this.columns||t[1],this.itemSize[1],i.x)):e?o("width",this.columns||t,this.itemSize,i.x):o("height",t,this.itemSize,i.y)}},setContentPosition(t){if(this.content){const s=this.isBoth(),e=this.isHorizontal(),i=t?t.first:this.first,o=(t,s)=>t*s,l=(t=0,s=0)=>{this.contentStyle={...this.contentStyle,transform:`translate3d(${t}px, ${s}px, 0)`}};if(s)l(o(i.cols,this.itemSize[1]),o(i.rows,this.itemSize[0]));else{const t=o(i,this.itemSize);e?l(t,0):l(0,t)}}},onScrollPositionChange(t){const s=t.target,e=this.isBoth(),i=this.isHorizontal(),o=this.getContentPosition(),l=(t,s)=>t?t>s?t-s:t:0,n=(t,s)=>Math.floor(t/(s||t)),r=(t,s,e,i,o,l)=>t<=o?o:l?e-i-o:s+o-1,a=(t,s,e,i,o,l,n)=>t<=l?0:Math.max(0,n?t<s?e:t-l:t>s?e:t-2*l),h=(t,s,e,i,o,l)=>{let n=s+i+2*o;return t>=o&&(n+=o+1),this.getLast(n,l)},c=l(s.scrollTop,o.top),m=l(s.scrollLeft,o.left);let d=e?{rows:0,cols:0}:0,u=this.last,p=!1,f=this.lastScrollPos;if(e){const t=this.lastScrollPos.top<=c,s=this.lastScrollPos.left<=m,e={rows:n(c,this.itemSize[0]),cols:n(m,this.itemSize[1])},i={rows:r(e.rows,this.first.rows,this.last.rows,this.numItemsInViewport.rows,this.d_numToleratedItems[0],t),cols:r(e.cols,this.first.cols,this.last.cols,this.numItemsInViewport.cols,this.d_numToleratedItems[1],s)};d={rows:a(e.rows,i.rows,this.first.rows,this.last.rows,this.numItemsInViewport.rows,this.d_numToleratedItems[0],t),cols:a(e.cols,i.cols,this.first.cols,this.last.cols,this.numItemsInViewport.cols,this.d_numToleratedItems[1],s)},u={rows:h(e.rows,d.rows,this.last.rows,this.numItemsInViewport.rows,this.d_numToleratedItems[0]),cols:h(e.cols,d.cols,this.last.cols,this.numItemsInViewport.cols,this.d_numToleratedItems[1],!0)},p=d.rows!==this.first.rows||u.rows!==this.last.rows||d.cols!==this.first.cols||u.cols!==this.last.cols,f={top:c,left:m}}else{const t=i?m:c,s=this.lastScrollPos<=t,e=n(t,this.itemSize);d=a(e,r(e,this.first,this.last,this.numItemsInViewport,this.d_numToleratedItems,s),this.first,this.last,this.numItemsInViewport,this.d_numToleratedItems,s),u=h(e,d,this.last,this.numItemsInViewport,this.d_numToleratedItems),p=d!==this.first||u!==this.last,f=t}return{first:d,last:u,isRangeChanged:p,scrollPos:f}},onScrollChange(t){const{first:s,last:e,isRangeChanged:i,scrollPos:o}=this.onScrollPositionChange(t);if(i){const t={first:s,last:e};this.setContentPosition(t),this.first=s,this.last=e,this.lastScrollPos=o,this.$emit("scroll-index-change",t),this.lazy&&this.$emit("lazy-load",t)}},onScroll(t){if(this.$emit("scroll",t),this.delay){if(this.scrollTimeout&&clearTimeout(this.scrollTimeout),!this.d_loading&&this.showLoader){const{isRangeChanged:s}=this.onScrollPositionChange(t);s&&(this.d_loading=!0)}this.scrollTimeout=setTimeout((()=>{this.onScrollChange(t),this.d_loading&&this.showLoader&&!this.lazy&&(this.d_loading=!1)}),this.delay)}else this.onScrollChange(t)},getOptions(t){const s=(this.items||[]).length,e=this.isBoth()?this.first.rows+t:this.first+t;return{index:e,count:s,first:0===e,last:e===s-1,even:e%2==0,odd:e%2!=0}},getLoaderOptions(t,s){let e=this.loaderArr.length;return{index:t,count:e,first:0===t,last:t===e-1,even:t%2==0,odd:t%2!=0,...s}},elementRef(t){this.element=t},contentRef(t){this.content=t}},computed:{containerClass(){return["p-virtualscroller",{"p-both-scroll":this.isBoth(),"p-horizontal-scroll":this.isHorizontal()},this.class]},contentClass(){return["p-virtualscroller-content",{"p-virtualscroller-loading":this.d_loading}]},loaderClass(){return["p-virtualscroller-loader",{"p-component-overlay":!this.$slots.loader}]},loadedItems(){const t=this.items;return t&&!this.d_loading?this.isBoth()?t.slice(this.first.rows,this.last.rows).map((t=>this.columns?t:t.slice(this.first.cols,this.last.cols))):this.isHorizontal()&&this.columns?t:t.slice(this.first,this.last):[]},loadedRows(){return this.d_loading?this.loaderDisabled?this.loaderArr:[]:this.loadedItems},loadedColumns(){if(this.columns){const t=this.isBoth(),s=this.isHorizontal();if(t||s)return this.d_loading&&this.loaderDisabled?t?this.loaderArr[0]:this.loaderArr:this.columns.slice(t?this.first.cols:this.first,t?this.last.cols:this.last)}return this.columns}}};const e=["tabindex"],i={key:1,class:"p-virtualscroller-loading-icon pi pi-spinner pi-spin"};return function(t,s){void 0===s&&(s={});var e=s.insertAt;if(t&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===e&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=t:o.appendChild(document.createTextNode(t))}}("\n.p-virtualscroller {\n    position: relative;\n    overflow: auto;\n    contain: strict;\n    transform: translateZ(0);\n    will-change: scroll-position;\n    outline: 0 none;\n}\n.p-virtualscroller-content {\n    position: absolute;\n    top: 0;\n    left: 0;\n    contain: content;\n    min-height: 100%;\n    min-width: 100%;\n    will-change: transform;\n}\n.p-virtualscroller-spacer {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 1px;\n    width: 1px;\n    transform-origin: 0 0;\n    pointer-events: none;\n}\n.p-virtualscroller .p-virtualscroller-loader {\n    position: sticky;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n}\n.p-virtualscroller-loader.p-component-overlay {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n"),s.render=function(s,o,l,n,r,a){return l.disabled?(t.openBlock(),t.createElementBlock(t.Fragment,{key:1},[t.renderSlot(s.$slots,"default"),t.renderSlot(s.$slots,"content",{items:l.items,rows:l.items,columns:a.loadedColumns})],64)):(t.openBlock(),t.createElementBlock("div",{key:0,ref:a.elementRef,class:t.normalizeClass(a.containerClass),tabindex:l.tabindex,style:t.normalizeStyle(l.style),onScroll:o[0]||(o[0]=(...t)=>a.onScroll&&a.onScroll(...t))},[t.renderSlot(s.$slots,"content",{styleClass:a.contentClass,items:a.loadedItems,getItemOptions:a.getOptions,loading:r.d_loading,getLoaderOptions:a.getLoaderOptions,itemSize:l.itemSize,rows:a.loadedRows,columns:a.loadedColumns,contentRef:a.contentRef,spacerStyle:r.spacerStyle,contentStyle:r.contentStyle,vertical:a.isVertical(),horizontal:a.isHorizontal(),both:a.isBoth()},(()=>[t.createElementVNode("div",{ref:a.contentRef,class:t.normalizeClass(a.contentClass),style:t.normalizeStyle(r.contentStyle)},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(a.loadedItems,((e,i)=>t.renderSlot(s.$slots,"item",{key:i,item:e,options:a.getOptions(i)}))),128))],6)])),l.showSpacer?(t.openBlock(),t.createElementBlock("div",{key:0,class:"p-virtualscroller-spacer",style:t.normalizeStyle(r.spacerStyle)},null,4)):t.createCommentVNode("",!0),!l.loaderDisabled&&l.showLoader&&r.d_loading?(t.openBlock(),t.createElementBlock("div",{key:1,class:t.normalizeClass(a.loaderClass)},[s.$slots&&s.$slots.loader?(t.openBlock(!0),t.createElementBlock(t.Fragment,{key:0},t.renderList(r.loaderArr,((e,i)=>t.renderSlot(s.$slots,"loader",{key:i,options:a.getLoaderOptions(i,a.isBoth()&&{numCols:s.d_numItemsInViewport.cols})}))),128)):(t.openBlock(),t.createElementBlock("i",i))],2)):t.createCommentVNode("",!0)],46,e))},s}(Vue);
+this.primevue=this.primevue||{},this.primevue.virtualscroller=function(t,e){"use strict";var s={name:"VirtualScroller",emits:["update:numToleratedItems","scroll","scroll-index-change","lazy-load"],props:{id:{type:String,default:null},style:null,class:null,items:{type:Array,default:null},itemSize:{type:[Number,Array],default:0},scrollHeight:null,scrollWidth:null,orientation:{type:String,default:"vertical"},numToleratedItems:{type:Number,default:null},delay:{type:Number,default:0},resizeDelay:{type:Number,default:10},lazy:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},loaderDisabled:{type:Boolean,default:!1},columns:{type:Array,default:null},loading:{type:Boolean,default:!1},showSpacer:{type:Boolean,default:!0},showLoader:{type:Boolean,default:!1},tabindex:{type:Number,default:0},inline:{type:Boolean,default:!1},step:{type:Number,default:0},appendOnly:{type:Boolean,default:!1},autoSize:{type:Boolean,default:!1}},data(){return{first:this.isBoth()?{rows:0,cols:0}:0,last:this.isBoth()?{rows:0,cols:0}:0,page:this.isBoth()?{rows:0,cols:0}:0,numItemsInViewport:this.isBoth()?{rows:0,cols:0}:0,lastScrollPos:this.isBoth()?{top:0,left:0}:0,d_numToleratedItems:this.numToleratedItems,d_loading:this.loading,loaderArr:[],spacerStyle:{},contentStyle:{}}},element:null,content:null,lastScrollPos:null,scrollTimeout:null,resizeTimeout:null,defaultWidth:0,defaultHeight:0,defaultContentWidth:0,defaultContentHeight:0,isRangeChanged:!1,lazyLoadState:{},resizeListener:null,initialized:!1,watch:{numToleratedItems(t){this.d_numToleratedItems=t},loading(t){this.d_loading=t},items(t,e){e&&e.length===(t||[]).length||(this.init(),this.calculateAutoSize())},itemSize(){this.init(),this.calculateAutoSize()},orientation(){this.lastScrollPos=this.isBoth()?{top:0,left:0}:0},scrollHeight(){this.init(),this.calculateAutoSize()},scrollWidth(){this.init(),this.calculateAutoSize()}},mounted(){this.viewInit(),this.lastScrollPos=this.isBoth()?{top:0,left:0}:0,this.lazyLoadState=this.lazyLoadState||{}},updated(){!this.initialized&&this.viewInit()},unmounted(){this.unbindResizeListener(),this.initialized=!1},methods:{viewInit(){t.DomHandler.isVisible(this.element)&&(this.setContentEl(this.content),this.init(),this.bindResizeListener(),this.defaultWidth=t.DomHandler.getWidth(this.element),this.defaultHeight=t.DomHandler.getHeight(this.element),this.defaultContentWidth=t.DomHandler.getWidth(this.content),this.defaultContentHeight=t.DomHandler.getHeight(this.content),this.initialized=!0)},init(){this.disabled||(this.setSize(),this.calculateOptions(),this.setSpacerSize())},isVertical(){return"vertical"===this.orientation},isHorizontal(){return"horizontal"===this.orientation},isBoth(){return"both"===this.orientation},scrollTo(t){this.lastScrollPos=this.both?{top:0,left:0}:0,this.element?.scrollTo(t)},scrollToIndex(t,e="auto"){const s=this.isBoth(),i=this.isHorizontal(),o=this.first,{numToleratedItems:l}=this.calculateNumItems(),n=this.getContentPosition(),r=this.itemSize,h=(t=0,e)=>t<=e?0:t,a=(t,e,s)=>t*e+s,d=(t=0,s=0)=>this.scrollTo({left:t,top:s,behavior:e});let c=s?{rows:0,cols:0}:0,m=!1;s?(c={rows:h(t[0],l[0]),cols:h(t[1],l[1])},d(a(c.cols,r[1],n.left),a(c.rows,r[0],n.top)),m=c.rows!==o.rows||c.cols!==o.cols):(c=h(t,l),i?d(a(c,r,n.left),0):d(0,a(c,r,n.top)),m=c!==o),this.isRangeChanged=m,this.first=c},scrollInView(t,e,s="auto"){if(e){const i=this.isBoth(),o=this.isHorizontal(),{first:l,viewport:n}=this.getRenderedRange(),r=(t=0,e=0)=>this.scrollTo({left:t,top:e,behavior:s}),h="to-end"===e;if("to-start"===e){if(i)n.first.rows-l.rows>t[0]?r(n.first.cols*this.itemSize[1],(n.first.rows-1)*this.itemSize[0]):n.first.cols-l.cols>t[1]&&r((n.first.cols-1)*this.itemSize[1],n.first.rows*this.itemSize[0]);else if(n.first-l>t){const t=(n.first-1)*this.itemSize;o?r(t,0):r(0,t)}}else if(h)if(i)n.last.rows-l.rows<=t[0]+1?r(n.first.cols*this.itemSize[1],(n.first.rows+1)*this.itemSize[0]):n.last.cols-l.cols<=t[1]+1&&r((n.first.cols+1)*this.itemSize[1],n.first.rows*this.itemSize[0]);else if(n.last-l<=t+1){const t=(n.first+1)*this.itemSize;o?r(t,0):r(0,t)}}else this.scrollToIndex(t,s)},getRenderedRange(){const t=(t,e)=>Math.floor(t/(e||t));let e=this.first,s=0;if(this.element){const i=this.isBoth(),o=this.isHorizontal(),{scrollTop:l,scrollLeft:n}=this.element.scrollTop;if(i)e={rows:t(l,this.itemSize[0]),cols:t(n,this.itemSize[1])},s={rows:e.rows+this.numItemsInViewport.rows,cols:e.cols+this.numItemsInViewport.cols};else{e=t(o?n:l,this.itemSize),s=e+this.numItemsInViewport}}return{first:this.first,last:this.last,viewport:{first:e,last:s}}},calculateNumItems(){const t=this.isBoth(),e=this.isHorizontal(),s=this.itemSize,i=this.getContentPosition(),o=this.element?this.element.offsetWidth-i.left:0,l=this.element?this.element.offsetHeight-i.top:0,n=(t,e)=>Math.ceil(t/(e||t)),r=t=>Math.ceil(t/2),h=t?{rows:n(l,s[0]),cols:n(o,s[1])}:n(e?o:l,s);return{numItemsInViewport:h,numToleratedItems:this.d_numToleratedItems||(t?[r(h.rows),r(h.cols)]:r(h))}},calculateOptions(){const t=this.isBoth(),e=this.first,{numItemsInViewport:s,numToleratedItems:i}=this.calculateNumItems(),o=(t,e,s,i=!1)=>this.getLast(t+e+(t<s?2:3)*s,i),l=t?{rows:o(e.rows,s.rows,i[0]),cols:o(e.cols,s.cols,i[1],!0)}:o(e,s,i);this.last=l,this.numItemsInViewport=s,this.d_numToleratedItems=i,this.$emit("update:numToleratedItems",this.d_numToleratedItems),this.showLoader&&(this.loaderArr=t?Array.from({length:s.rows}).map((()=>Array.from({length:s.cols}))):Array.from({length:s})),this.lazy&&Promise.resolve().then((()=>{this.lazyLoadState={first:this.step?t?{rows:0,cols:e.cols}:0:e,last:Math.min(this.step?this.step:l,this.items.length)},this.$emit("lazy-load",this.lazyLoadState)}))},calculateAutoSize(){this.autoSize&&!this.d_loading&&Promise.resolve().then((()=>{if(this.content){const e=this.isBoth(),s=this.isHorizontal(),i=this.isVertical();this.content.style.minHeight=this.content.style.minWidth="auto",this.content.style.position="relative",this.element.style.contain="none";const[o,l]=[t.DomHandler.getWidth(this.content),t.DomHandler.getHeight(this.content)];o!==this.defaultContentWidth&&(this.element.style.width=""),l!==this.defaultContentHeight&&(this.element.style.height="");const[n,r]=[t.DomHandler.getWidth(this.element),t.DomHandler.getHeight(this.element)];(e||s)&&(this.element.style.width=n<this.defaultWidth?n+"px":this.scrollWidth||this.defaultWidth+"px"),(e||i)&&(this.element.style.height=r<this.defaultHeight?r+"px":this.scrollHeight||this.defaultHeight+"px"),this.content.style.minHeight=this.content.style.minWidth="",this.content.style.position="",this.element.style.contain=""}}))},getLast(t=0,e){return this.items?Math.min(e?(this.columns||this.items[0]).length:this.items.length,t):0},getContentPosition(){if(this.content){const t=getComputedStyle(this.content),e=parseFloat(t.paddingLeft)+Math.max(parseFloat(t.left)||0,0),s=parseFloat(t.paddingRight)+Math.max(parseFloat(t.right)||0,0),i=parseFloat(t.paddingTop)+Math.max(parseFloat(t.top)||0,0),o=parseFloat(t.paddingBottom)+Math.max(parseFloat(t.bottom)||0,0);return{left:e,right:s,top:i,bottom:o,x:e+s,y:i+o}}return{left:0,right:0,top:0,bottom:0,x:0,y:0}},setSize(){if(this.element){const t=this.isBoth(),e=this.isHorizontal(),s=this.element.parentElement,i=this.scrollWidth||`${this.element.offsetWidth||s.offsetWidth}px`,o=this.scrollHeight||`${this.element.offsetHeight||s.offsetHeight}px`,l=(t,e)=>this.element.style[t]=e;t||e?(l("height",o),l("width",i)):l("height",o)}},setSpacerSize(){const t=this.items;if(t){const e=this.isBoth(),s=this.isHorizontal(),i=this.getContentPosition(),o=(t,e,s,i=0)=>this.spacerStyle={...this.spacerStyle,[`${t}`]:(e||[]).length*s+i+"px"};e?(o("height",t,this.itemSize[0],i.y),o("width",this.columns||t[1],this.itemSize[1],i.x)):s?o("width",this.columns||t,this.itemSize,i.x):o("height",t,this.itemSize,i.y)}},setContentPosition(t){if(this.content&&!this.appendOnly){const e=this.isBoth(),s=this.isHorizontal(),i=t?t.first:this.first,o=(t,e)=>t*e,l=(t=0,e=0)=>this.contentStyle={...this.contentStyle,transform:`translate3d(${t}px, ${e}px, 0)`};if(e)l(o(i.cols,this.itemSize[1]),o(i.rows,this.itemSize[0]));else{const t=o(i,this.itemSize);s?l(t,0):l(0,t)}}},onScrollPositionChange(t){const e=t.target,s=this.isBoth(),i=this.isHorizontal(),o=this.getContentPosition(),l=(t,e)=>t?t>e?t-e:t:0,n=(t,e)=>Math.floor(t/(e||t)),r=(t,e,s,i,o,l)=>t<=o?o:l?s-i-o:e+o-1,h=(t,e,s,i,o,l,n)=>t<=l?0:Math.max(0,n?t<e?s:t-l:t>e?s:t-2*l),a=(t,e,s,i,o,l)=>{let n=e+i+2*o;return t>=o&&(n+=o+1),this.getLast(n,l)},d=l(e.scrollTop,o.top),c=l(e.scrollLeft,o.left);let m=s?{rows:0,cols:0}:0,u=this.last,p=!1,f=this.lastScrollPos;if(s){const t=this.lastScrollPos.top<=d,e=this.lastScrollPos.left<=c;if(!this.appendOnly||this.appendOnly&&(t||e)){const s={rows:n(d,this.itemSize[0]),cols:n(c,this.itemSize[1])},i={rows:r(s.rows,this.first.rows,this.last.rows,this.numItemsInViewport.rows,this.d_numToleratedItems[0],t),cols:r(s.cols,this.first.cols,this.last.cols,this.numItemsInViewport.cols,this.d_numToleratedItems[1],e)};m={rows:h(s.rows,i.rows,this.first.rows,this.last.rows,this.numItemsInViewport.rows,this.d_numToleratedItems[0],t),cols:h(s.cols,i.cols,this.first.cols,this.last.cols,this.numItemsInViewport.cols,this.d_numToleratedItems[1],e)},u={rows:a(s.rows,m.rows,this.last.rows,this.numItemsInViewport.rows,this.d_numToleratedItems[0]),cols:a(s.cols,m.cols,this.last.cols,this.numItemsInViewport.cols,this.d_numToleratedItems[1],!0)},p=m.rows!==this.first.rows||u.rows!==this.last.rows||m.cols!==this.first.cols||u.cols!==this.last.cols||this.isRangeChanged,f={top:d,left:c}}}else{const t=i?c:d,e=this.lastScrollPos<=t;if(!this.appendOnly||this.appendOnly&&e){const s=n(t,this.itemSize);m=h(s,r(s,this.first,this.last,this.numItemsInViewport,this.d_numToleratedItems,e),this.first,this.last,this.numItemsInViewport,this.d_numToleratedItems,e),u=a(s,m,this.last,this.numItemsInViewport,this.d_numToleratedItems),p=m!==this.first||u!==this.last||this.isRangeChanged,f=t}}return{first:m,last:u,isRangeChanged:p,scrollPos:f}},onScrollChange(t){const{first:e,last:s,isRangeChanged:i,scrollPos:o}=this.onScrollPositionChange(t);if(i){const t={first:e,last:s};if(this.setContentPosition(t),this.first=e,this.last=s,this.lastScrollPos=o,this.$emit("scroll-index-change",t),this.lazy&&this.isPageChanged(e)){const t={first:this.step?Math.min(this.getPageByFirst(e)*this.step,this.items.length-this.step):e,last:Math.min(this.step?(this.getPageByFirst(e)+1)*this.step:s,this.items.length)};(this.lazyLoadState.first!==t.first||this.lazyLoadState.last!==t.last)&&this.$emit("lazy-load",t),this.lazyLoadState=t}}},onScroll(t){if(this.$emit("scroll",t),this.delay&&this.isPageChanged()){if(this.scrollTimeout&&clearTimeout(this.scrollTimeout),!this.d_loading&&this.showLoader){const{isRangeChanged:e}=this.onScrollPositionChange(t);(e||!!this.step&&this.isPageChanged())&&(this.d_loading=!0)}this.scrollTimeout=setTimeout((()=>{this.onScrollChange(t),!this.d_loading||!this.showLoader||this.lazy&&void 0!==this.loading||(this.d_loading=!1,this.page=this.getPageByFirst())}),this.delay)}else this.onScrollChange(t)},onResize(){this.resizeTimeout&&clearTimeout(this.resizeTimeout),this.resizeTimeout=setTimeout((()=>{if(t.DomHandler.isVisible(this.element)){const e=this.isBoth(),s=this.isVertical(),i=this.isHorizontal(),[o,l]=[t.DomHandler.getWidth(this.element),t.DomHandler.getHeight(this.element)],[n,r]=[o!==this.defaultWidth,l!==this.defaultHeight];(e?n||r:i?n:!!s&&r)&&(this.d_numToleratedItems=this.numToleratedItems,this.defaultWidth=o,this.defaultHeight=l,this.defaultContentWidth=t.DomHandler.getWidth(this.content),this.defaultContentHeight=t.DomHandler.getHeight(this.content),this.init())}}),this.resizeDelay)},bindResizeListener(){this.resizeListener||(this.resizeListener=this.onResize.bind(this),window.addEventListener("resize",this.resizeListener),window.addEventListener("orientationchange",this.resizeListener))},unbindResizeListener(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),window.removeEventListener("orientationchange",this.resizeListener),this.resizeListener=null)},getOptions(t){const e=(this.items||[]).length,s=this.isBoth()?this.first.rows+t:this.first+t;return{index:s,count:e,first:0===s,last:s===e-1,even:s%2==0,odd:s%2!=0}},getLoaderOptions(t,e){let s=this.loaderArr.length;return{index:t,count:s,first:0===t,last:t===s-1,even:t%2==0,odd:t%2!=0,...e}},getPageByFirst(t){return Math.floor(((t??this.first)+4*this.d_numToleratedItems)/(this.step||1))},isPageChanged(t){return!this.step||this.page!==this.getPageByFirst(t??this.first)},setContentEl(e){this.content=e||this.content||t.DomHandler.findSingle(this.element,".p-virtualscroller-content")},elementRef(t){this.element=t},contentRef(t){this.content=t}},computed:{containerClass(){return["p-virtualscroller",{"p-virtualscroller-inline":this.inline,"p-virtualscroller-both p-both-scroll":this.isBoth(),"p-virtualscroller-horizontal p-horizontal-scroll":this.isHorizontal()},this.class]},contentClass(){return["p-virtualscroller-content",{"p-virtualscroller-loading":this.d_loading}]},loaderClass(){return["p-virtualscroller-loader",{"p-component-overlay":!this.$slots.loader}]},loadedItems(){return this.items&&!this.d_loading?this.isBoth()?this.items.slice(this.appendOnly?0:this.first.rows,this.last.rows).map((t=>this.columns?t:t.slice(this.appendOnly?0:this.first.cols,this.last.cols))):this.isHorizontal()&&this.columns?this.items:this.items.slice(this.appendOnly?0:this.first,this.last):[]},loadedRows(){return this.d_loading?this.loaderDisabled?this.loaderArr:[]:this.loadedItems},loadedColumns(){if(this.columns){const t=this.isBoth(),e=this.isHorizontal();if(t||e)return this.d_loading&&this.loaderDisabled?t?this.loaderArr[0]:this.loaderArr:this.columns.slice(t?this.first.cols:this.first,t?this.last.cols:this.last)}return this.columns}}};const i=["tabindex"],o={key:1,class:"p-virtualscroller-loading-icon pi pi-spinner pi-spin"};return function(t,e){void 0===e&&(e={});var s=e.insertAt;if(t&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===s&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=t:o.appendChild(document.createTextNode(t))}}("\n.p-virtualscroller {\n    position: relative;\n    overflow: auto;\n    contain: strict;\n    transform: translateZ(0);\n    will-change: scroll-position;\n    outline: 0 none;\n}\n.p-virtualscroller-content {\n    position: absolute;\n    top: 0;\n    left: 0;\n    /* contain: content; */\n    min-height: 100%;\n    min-width: 100%;\n    will-change: transform;\n}\n.p-virtualscroller-spacer {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 1px;\n    width: 1px;\n    transform-origin: 0 0;\n    pointer-events: none;\n}\n.p-virtualscroller .p-virtualscroller-loader {\n    position: sticky;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n}\n.p-virtualscroller-loader.p-component-overlay {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.p-virtualscroller-loading-icon {\n    font-size: 2rem;\n}\n.p-virtualscroller-horizontal > .p-virtualscroller-content {\n    display: flex;\n}\n\n/* Inline */\n.p-virtualscroller-inline .p-virtualscroller-content {\n    position: static;\n}\n"),s.render=function(t,s,l,n,r,h){return l.disabled?(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(t.$slots,"default"),e.renderSlot(t.$slots,"content",{items:l.items,rows:l.items,columns:h.loadedColumns})],64)):(e.openBlock(),e.createElementBlock("div",{key:0,ref:h.elementRef,class:e.normalizeClass(h.containerClass),tabindex:l.tabindex,style:e.normalizeStyle(l.style),onScroll:s[0]||(s[0]=(...t)=>h.onScroll&&h.onScroll(...t))},[e.renderSlot(t.$slots,"content",{styleClass:h.contentClass,items:h.loadedItems,getItemOptions:h.getOptions,loading:r.d_loading,getLoaderOptions:h.getLoaderOptions,itemSize:l.itemSize,rows:h.loadedRows,columns:h.loadedColumns,contentRef:h.contentRef,spacerStyle:r.spacerStyle,contentStyle:r.contentStyle,vertical:h.isVertical(),horizontal:h.isHorizontal(),both:h.isBoth()},(()=>[e.createElementVNode("div",{ref:h.contentRef,class:e.normalizeClass(h.contentClass),style:e.normalizeStyle(r.contentStyle)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(h.loadedItems,((s,i)=>e.renderSlot(t.$slots,"item",{key:i,item:s,options:h.getOptions(i)}))),128))],6)])),l.showSpacer?(e.openBlock(),e.createElementBlock("div",{key:0,class:"p-virtualscroller-spacer",style:e.normalizeStyle(r.spacerStyle)},null,4)):e.createCommentVNode("",!0),!l.loaderDisabled&&l.showLoader&&r.d_loading?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(h.loaderClass)},[t.$slots&&t.$slots.loader?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(r.loaderArr,((s,i)=>e.renderSlot(t.$slots,"loader",{key:i,options:h.getLoaderOptions(i,h.isBoth()&&{numCols:t.d_numItemsInViewport.cols})}))),128)):(e.openBlock(),e.createElementBlock("i",o))],2)):e.createCommentVNode("",!0)],46,i))},s}(primevue.utils,Vue);