primevue 3.8.2 → 3.11.0

package/core/core.js

@@ -492,10 +492,10 @@ this.primevue.utils = (function (exports) {
 
         applyStyle(element, style) {
             if (typeof style === 'string') {
-                element.style.cssText = this.style;
+                element.style.cssText = style;
             }
             else {
-                for (let prop in this.style) {
+                for (let prop in style) {
                     element.style[prop] = style[prop];
                 }
             }
@@ -511,6 +511,31 @@ this.primevue.utils = (function (exports) {
 
         isTouchDevice() {
             return (('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0));
+        },
+
+        exportCSV(csv, filename) {
+            let blob = new Blob([csv], {
+                type: 'application/csv;charset=utf-8;'
+            });
+
+            if (window.navigator.msSaveOrOpenBlob) {
+                navigator.msSaveOrOpenBlob(blob, filename + '.csv');
+            }
+            else {
+                let link = document.createElement("a");
+                if (link.download !== undefined) {
+                    link.setAttribute('href', URL.createObjectURL(blob));
+                    link.setAttribute('download', filename + '.csv');
+                    link.style.display = 'none';
+                    document.body.appendChild(link);
+                    link.click();
+                    document.body.removeChild(link);
+                }
+                else {
+                    csv = 'data:text/csv;charset=utf-8,' + csv;
+                    window.open(encodeURI(csv));
+                }
+            }
         }
     };
 
@@ -744,11 +769,23 @@ this.primevue.utils = (function (exports) {
                 let kebapProp = prop.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
                 let propName = Object.prototype.hasOwnProperty.call(props, kebapProp) ? kebapProp : prop;
 
-                return ((vnode.type.props[prop].type === Boolean && props[propName] === '') ? true : props[propName]);            
+                return ((vnode.type.props[prop].type === Boolean && props[propName] === '') ? true : props[propName]);
             }
 
             return null;
-        }  
+        },
+
+        isEmpty(value) {
+            return (
+                value === null || value === undefined || value === '' ||
+                (Array.isArray(value) && value.length === 0) ||
+                (!(value instanceof Date) && typeof value === 'object' && Object.keys(value).length === 0)
+            );
+        },
+
+        isNotEmpty(value) {
+            return !this.isEmpty(value);
+        }
 
     };
 
@@ -842,7 +879,7 @@ this.primevue.utils = (function (exports) {
 
     return exports;
 
-}({}));
+})({});
 
 this.primevue = this.primevue || {};
 this.primevue.api = (function (exports, utils) {
@@ -1130,30 +1167,43 @@ this.primevue.api = (function (exports, utils) {
         ARROW_CIRCLE_RIGHT:'pi pi-arrow-circle-right',
         ARROW_CIRCLE_UP:'pi pi-arrow-circle-up',
         ARROW_DOWN:'pi pi-arrow-down',
+        ARROW_DOWN_LEFT:'pi pi-arrow-down-left',
+        ARROW_DOWN_RIGHT:'pi pi-arrow-down-right',
         ARROW_LEFT:'pi pi-arrow-left',
         ARROW_RIGHT:'pi pi-arrow-right',
         ARROW_UP:'pi pi-arrow-up',
+        ARROW_UP_LEFT:'pi pi-arrow-up-left',
+        ARROW_UP_RIGHT:'pi pi-arrow-up-right',
+        ARROW_H:'pi pi-arrow-h',
+        ARROW_V:'pi pi-arrow-v',
+        AT:'pi pi-at',
         BACKWARD:'pi pi-backward',
         BAN:'pi pi-ban',
         BARS:'pi pi-bars',
         BELL:'pi pi-bell',
+        BOLT:'pi pi-bolt',
         BOOK:'pi pi-book',
         BOOKMARK:'pi pi-bookmark',
+        BOOKMARK_FILL:'pi pi-bookmark-fill',
+        BOX:'pi pi-box',
         BRIEFCASE:'pi pi-briefcase',
+        BUILDING:'pi pi-building',
+        CALENDAR:'pi pi-calendar',
         CALENDAR_MINUS:'pi pi-calendar-minus',
         CALENDAR_PLUS:'pi pi-calendar-plus',
         CALENDAR_TIMES:'pi pi-calendar-times',
-        CALENDAR:'pi pi-calendar',
         CAMERA:'pi pi-camera',
+        CAR:'pi pi-car',
         CARET_DOWN:'pi pi-caret-down',
         CARET_LEFT:'pi pi-caret-left',
         CARET_RIGHT:'pi pi-caret-right',
         CARET_UP:'pi pi-caret-up',
         CHART_BAR:'pi pi-chart-bar',
         CHART_LINE:'pi pi-chart-line',
+        CHART_PIE:'pi pi-chart-pie',
+        CHECK:'pi pi-check',
         CHECK_CIRCLE:'pi pi-check-circle',
         CHECK_SQUARE:'pi pi-check-square',
-        CHECK:'pi pi-check',
         CHEVRON_CIRCLE_DOWN:'pi pi-chevron-circle-down',
         CHEVRON_CIRCLE_LEFT:'pi pi-chevron-circle-left',
         CHEVRON_CIRCLE_RIGHT:'pi pi-chevron-circle-right',
@@ -1162,66 +1212,77 @@ this.primevue.api = (function (exports, utils) {
         CHEVRON_LEFT:'pi pi-chevron-left',
         CHEVRON_RIGHT:'pi pi-chevron-right',
         CHEVRON_UP:'pi pi-chevron-up',
+        CIRCLE:'pi pi-circle',
+        CIRCLE_FILL:'pi pi-circle-fill',
         CLOCK:'pi pi-clock',
         CLONE:'pi pi-clone',
+        CLOUD:'pi pi-cloud',
         CLOUD_DOWNLOAD:'pi pi-cloud-download',
         CLOUD_UPLOAD:'pi pi-cloud-upload',
-        CLOUD:'pi pi-cloud',
+        CODE:'pi pi-code',
         COG:'pi pi-cog',
         COMMENT:'pi pi-comment',
         COMMENTS:'pi pi-comments',
         COMPASS:'pi pi-compass',
         COPY:'pi pi-copy',
         CREDIT_CARD:'pi pi-credit-card',
+        DATABASE:'pi pi-database',
         DESKTOP:'pi pi-desktop',
-        DISCORD:'pi pi-discord',
-        DIRECTIONS_ALT:'pi pi-directions-alt',
         DIRECTIONS:'pi pi-directions',
+        DIRECTIONS_ALT:'pi pi-directions-alt',
+        DISCORD:'pi pi-discord',
         DOLLAR:'pi pi-dollar',
         DOWNLOAD:'pi pi-download',
         EJECT:'pi pi-eject',
         ELLIPSIS_H:'pi pi-ellipsis-h',
         ELLIPSIS_V:'pi pi-ellipsis-v',
         ENVELOPE:'pi pi-envelope',
+        EURO:'pi pi-euro',
         EXCLAMATION_CIRCLE:'pi pi-exclamation-circle',
-        EXCLAMATION_TRIANGLE :'pi pi-exclamation-triangle ',
+        EXCLAMATION_TRIANGLE :'pi pi-exclamation-triangle',
         EXTERNAL_LINK:'pi pi-external-link',
-        EYE_SLASH:'pi pi-eye-slash',
         EYE:'pi pi-eye',
+        EYE_SLASH:'pi pi-eye-slash',
         FACEBOOK:'pi pi-facebook',
         FAST_BACKWARD:'pi pi-fast-backward',
         FAST_FORWARD:'pi pi-fast-forward',
+        FILE:'pi pi-file',
         FILE_EXCEL:'pi pi-file-excel',
-        FILE_O:'pi pi-file-o',
         FILE_PDF:'pi pi-file-pdf',
-        FILE:'pi pi-file',
         FILTER:'pi pi-filter',
+        FILTER_FILL:'pi pi-filter-fill',
         FILTER_SLASH:'pi pi-filter-slash',
         FLAG:'pi pi-flag',
-        FOLDER_OPEN:'pi pi-folder-open',
+        FLAG_FILL:'pi pi-flag-fill',
         FOLDER:'pi pi-folder',
+        FOLDER_OPEN:'pi pi-folder-open',
         FORWARD:'pi pi-forward',
         GITHUB:'pi pi-github',
         GLOBE:'pi pi-globe',
         GOOGLE:'pi pi-google',
+        HASHTAG:'pi pi-hashtag',
         HEART:'pi pi-heart',
+        HEART_FILL:'pi pi-heart-fill',
+        HISTORY:'pi pi-history',
         HOME:'pi pi-home',
         ID_CARD:'pi pi-id-card',
         IMAGE:'pi pi-image',
         IMAGES:'pi pi-images',
         INBOX:'pi pi-inbox',
-        INFO_CIRCLE:'pi pi-info-circle',
         INFO:'pi pi-info',
+        INFO_CIRCLE:'pi pi-info-circle',
+        INSTAGRAM:'pi pi-instagram',
         KEY:'pi pi-key',
         LINK:'pi pi-link',
+        LINKEDIN:'pi pi-linkedin',
         LIST:'pi pi-list',
-        LOCK_OPEN:'pi pi-lock-open',
         LOCK:'pi pi-lock',
+        LOCK_OPEN:'pi pi-lock-open',
         MAP:'pi pi-map',
         MAP_MARKER:'pi pi-map-marker',
         MICROSOFT:'pi pi-microsoft',
-        MINUS_CIRCLE:'pi pi-minus-circle',
         MINUS:'pi pi-minus',
+        MINUS_CIRCLE:'pi pi-minus-circle',
         MOBILE:'pi pi-mobile',
         MONEY_BILL:'pi pi-money-bill',
         MOON:'pi pi-moon',
@@ -1233,24 +1294,28 @@ this.primevue.api = (function (exports, utils) {
         PERCENTAGE:'pi pi-percentage',
         PHONE:'pi pi-phone',
         PLAY:'pi pi-play',
-        PLUS_CIRCLE:'pi pi-plus-circle',
         PLUS:'pi pi-plus',
+        PLUS_CIRCLE:'pi pi-plus-circle',
+        POUND:'pi pi-pound',
         POWER_OFF:'pi pi-power-off',
+        PRIME:'pi pi-prime',
         PRINT:'pi pi-print',
-        QUESTION_CIRCLE:'pi pi-question-circle',
+        QRCODE:'pi pi-qrcode',
         QUESTION:'pi pi-question',
-        RADIO_OFF:'pi pi-radio-off',
-        RADIO_ON:'pi pi-radio-on',
+        QUESTION_CIRCLE:'pi pi-question-circle',
+        REDDIT:'pi pi-reddit',
         REFRESH:'pi pi-refresh',
         REPLAY:'pi pi-replay',
         REPLY:'pi pi-reply',
         SAVE:'pi pi-save',
+        SEARCH:'pi pi-search',
         SEARCH_MINUS:'pi pi-search-minus',
         SEARCH_PLUS:'pi pi-search-plus',
-        SEARCH:'pi pi-search',
         SEND:'pi pi-send',
+        SERVER:'pi pi-server',
         SHARE_ALT:'pi pi-share-alt',
         SHIELD:'pi pi-shield',
+        SHOPPING_BAG:'pi pi-shopping-bag',
         SHOPPING_CART:'pi pi-shopping-cart',
         SIGN_IN:'pi pi-sign-in',
         SIGN_OUT:'pi pi-sign-out',
@@ -1258,60 +1323,66 @@ this.primevue.api = (function (exports, utils) {
         SLACK:'pi pi-slack',
         SLIDERS_H:'pi pi-sliders-h',
         SLIDERS_V:'pi pi-sliders-v',
-        SORT_ALPHA_ALT_DOWN:'pi pi-sort-alpha-alt-down',
-        SORT_ALPHA_ALT_UP:'pi pi-sort-alpha-alt-up',
+        SORT:'pi pi-sort',
         SORT_ALPHA_DOWN:'pi pi-sort-alpha-down',
+        SORT_ALPHA_ALT_DOWN:'pi pi-sort-alpha-alt-down',
         SORT_ALPHA_UP:'pi pi-sort-alpha-up',
+        SORT_ALPHA_ALT_UP:'pi pi-sort-alpha-alt-up',
         SORT_ALT:'pi pi-sort-alt',
-        SORT_AMOUNT_DOWN_ALT:'pi pi-sort-amount-down-alt',
+        SORT_ALT_SLASH:'pi pi-sort-slash',
         SORT_AMOUNT_DOWN:'pi pi-sort-amount-down',
-        SORT_AMOUNT_UP_ALT:'pi pi-sort-amount-up-alt',
+        SORT_AMOUNT_DOWN_ALT:'pi pi-sort-amount-down-alt',
         SORT_AMOUNT_UP:'pi pi-sort-amount-up',
+        SORT_AMOUNT_UP_ALT:'pi pi-sort-amount-up-alt',
         SORT_DOWN:'pi pi-sort-down',
-        SORT_NUMERIC_ALT_DOWN:'pi pi-sort-numeric-alt-down',
-        SORT_NUMERIC_ALT_UP:'pi pi-sort-numeric-alt-up',
         SORT_NUMERIC_DOWN:'pi pi-sort-numeric-down',
+        SORT_NUMERIC_ALT_DOWN:'pi pi-sort-numeric-alt-down',
         SORT_NUMERIC_UP:'pi pi-sort-numeric-up',
+        SORT_NUMERIC_ALT_UP:'pi pi-sort-numeric-alt-up',
         SORT_UP:'pi pi-sort-up',
-        SORT:'pi pi-sort',
         SPINNER:'pi pi-spinner',
-        STAR_O:'pi pi-star-o',
         STAR:'pi pi-star',
-        STEP_BACKWARD_ALT:'pi pi-step-backward-alt',
+        STAR_FILL:'pi pi-star-fill',
         STEP_BACKWARD:'pi pi-step-backward',
-        STEP_FORWARD_ALT:'pi pi-step-forward-alt',
+        STEP_BACKWARD_ALT:'pi pi-step-backward-alt',
         STEP_FORWARD:'pi pi-step-forward',
+        STEP_FORWARD_ALT:'pi pi-step-forward-alt',
+        STOP:'pi pi-stop',
+        STOP_CIRCLE:'pi pi-stop-circle',
         SUN:'pi pi-sun',
+        SYNC:'pi pi-sync',
         TABLE:'pi pi-table',
         TABLET:'pi pi-tablet',
         TAG:'pi pi-tag',
         TAGS:'pi pi-tags',
+        TELEGRAM:'pi pi-telegram',
         TH_LARGE:'pi pi-th-large',
         THUMBS_DOWN:'pi pi-thumbs-down',
         THUMBS_UP:'pi pi-thumbs-up',
         TICKET:'pi pi-ticket',
-        TIMES_CIRCLE:'pi pi-times-circle',
         TIMES:'pi pi-times',
+        TIMES_CIRCLE:'pi pi-times-circle',
         TRASH:'pi pi-trash',
         TWITTER:'pi pi-twitter',
         UNDO:'pi pi-undo',
         UNLOCK:'pi pi-unlock',
         UPLOAD:'pi pi-upload',
+        USER:'pi pi-user',
         USER_EDIT:'pi pi-user-edit',
         USER_MINUS:'pi pi-user-minus',
         USER_PLUS:'pi pi-user-plus',
-        USER:'pi pi-user',
         USERS:'pi pi-users',
         VIDEO:'pi pi-video',
         VIMEO:'pi pi-vimeo',
         VOLUME_DOWN:'pi pi-volume-down',
         VOLUME_OFF:'pi pi-volume-off',
         VOLUME_UP:'pi pi-volume-up',
-        YOUTUBE:'pi pi-youtube',
         WALLET:'pi pi-wallet',
+        WHATSAPP:'pi pi-whatsapp',
         WIFI:'pi pi-wifi',
         WINDOW_MAXIMIZE:'pi pi-window-maximize',
-        WINDOW_MINIMIZE:'pi pi-window-minimize'
+        WINDOW_MINIMIZE:'pi pi-window-minimize',
+        YOUTUBE:'pi pi-youtube'
     };
 
     const ToastSeverities = {
@@ -1331,7 +1402,7 @@ this.primevue.api = (function (exports, utils) {
 
     return exports;
 
-}({}, primevue.utils));
+})({}, primevue.utils);
 
 this.primevue = this.primevue || {};
 this.primevue.config = (function (exports, vue, api) {
@@ -1437,14 +1508,14 @@ this.primevue.config = (function (exports, vue, api) {
         }
     };
 
-    exports.default = PrimeVue;
+    exports["default"] = PrimeVue;
     exports.usePrimeVue = usePrimeVue;
 
     Object.defineProperty(exports, '__esModule', { value: true });
 
     return exports;
 
-}({}, Vue, primevue.api));
+})({}, Vue, primevue.api);
 
 this.primevue = this.primevue || {};
 this.primevue.ripple = (function (utils) {
@@ -1525,7 +1596,323 @@ this.primevue.ripple = (function (utils) {
 
     return Ripple;
 
-}(primevue.utils));
+})(primevue.utils);
+
+this.primevue = this.primevue || {};
+this.primevue.tooltip = (function (utils) {
+    'use strict';
+
+    function bindEvents(el) {
+        const modifiers = el.$_ptooltipModifiers;
+        if (modifiers.focus) {
+            el.addEventListener('focus', onFocus);
+            el.addEventListener('blur', onBlur);
+        }
+        else {
+            el.addEventListener('mouseenter', onMouseEnter);
+            el.addEventListener('mouseleave', onMouseLeave);
+            el.addEventListener('click', onClick);
+        }
+    }
+
+    function unbindEvents(el) {
+        const modifiers = el.$_ptooltipModifiers;
+        if (modifiers.focus) {
+            el.removeEventListener('focus', onFocus);
+            el.removeEventListener('blur', onBlur);
+        }
+        else {
+            el.removeEventListener('mouseenter', onMouseEnter);
+            el.removeEventListener('mouseleave', onMouseLeave);
+            el.removeEventListener('click', onClick);
+        }
+    }
+
+    function bindScrollListener(el) {
+        if (!el.$_ptooltipScrollHandler) {
+            el.$_ptooltipScrollHandler = new utils.ConnectedOverlayScrollHandler(el, function() {
+                hide(el);
+            });
+        }
+
+        el.$_ptooltipScrollHandler.bindScrollListener();
+    }
+
+    function unbindScrollListener(el) {
+        if (el.$_ptooltipScrollHandler) {
+            el.$_ptooltipScrollHandler.unbindScrollListener();
+        }
+    }
+
+    function onMouseEnter(event) {
+        show(event.currentTarget);
+    }
+
+    function onMouseLeave(event) {
+        hide(event.currentTarget);
+    }
+
+    function onFocus(event) {
+        show(event.currentTarget);
+    }
+
+    function onBlur(event) {
+        hide(event.currentTarget);
+    }
+
+    function onClick(event) {
+        hide(event.currentTarget);
+    }
+
+    function show(el) {
+        if (el.$_ptooltipDisabled) {
+            return;
+        }
+
+        let tooltipElement = create(el);
+        align(el);
+        utils.DomHandler.fadeIn(tooltipElement, 250);
+
+        window.addEventListener('resize', function onWindowResize() {
+            if (!utils.DomHandler.isAndroid()) {
+                hide(el);
+            }
+            this.removeEventListener('resize', onWindowResize);
+        });
+
+        bindScrollListener(el);
+        utils.ZIndexUtils.set('tooltip', tooltipElement, el.$_ptooltipZIndex);
+    }
+
+    function hide(el) {
+        remove(el);
+        unbindScrollListener(el);
+        utils.ZIndexUtils.clear(el);
+    }
+
+    function getTooltipElement(el) {
+        return document.getElementById(el.$_ptooltipId);
+    }
+
+    function create(el) {
+        const id = utils.UniqueComponentId() + '_tooltip';
+        el.$_ptooltipId = id;
+
+        let container = document.createElement('div');
+        container.id = id;
+
+        let tooltipArrow = document.createElement('div');
+        tooltipArrow.className = 'p-tooltip-arrow';
+        container.appendChild(tooltipArrow);
+
+        let tooltipText = document.createElement('div');
+        tooltipText.className = 'p-tooltip-text';
+        tooltipText.innerHTML = el.$_ptooltipValue;
+
+        container.appendChild(tooltipText);
+        document.body.appendChild(container);
+
+        container.style.display = 'inline-block';
+
+        return container;
+    }
+
+    function remove(el) {
+        if (el) {
+            let tooltipElement = getTooltipElement(el);
+            if (tooltipElement && tooltipElement.parentElement) {
+                document.body.removeChild(tooltipElement);
+            }
+            el.$_ptooltipId = null;
+        }
+    }
+
+    function align(el) {
+        const modifiers = el.$_ptooltipModifiers;
+
+        if (modifiers.top) {
+            alignTop(el);
+            if (isOutOfBounds(el)) {
+                alignBottom(el);
+            }
+        }
+        else if (modifiers.left) {
+            alignLeft(el);
+            if (isOutOfBounds(el)) {
+                alignRight(el);
+
+                if (isOutOfBounds(el)) {
+                    alignTop(el);
+
+                    if (isOutOfBounds(el)) {
+                        alignBottom(el);
+                    }
+                }
+            }
+        }
+        else if (modifiers.bottom) {
+            alignBottom(el);
+            if (isOutOfBounds(el)) {
+                alignTop(el);
+            }
+        }
+        else {
+            alignRight(el);
+            if (isOutOfBounds(el)) {
+                alignLeft(el);
+
+                if (isOutOfBounds(el)) {
+                    alignTop(el);
+
+                    if (isOutOfBounds(el)) {
+                        alignBottom(el);
+                    }
+                }
+            }
+        }
+    }
+
+    function getHostOffset(el) {
+        let offset = el.getBoundingClientRect();
+        let targetLeft = offset.left + utils.DomHandler.getWindowScrollLeft();
+        let targetTop = offset.top + utils.DomHandler.getWindowScrollTop();
+
+        return {left: targetLeft, top: targetTop};
+    }
+
+    function alignRight(el) {
+        preAlign(el, 'right');
+        let tooltipElement = getTooltipElement(el);
+        let hostOffset = getHostOffset(el);
+        let left = hostOffset.left + utils.DomHandler.getOuterWidth(el);
+        let top = hostOffset.top + (utils.DomHandler.getOuterHeight(el) - utils.DomHandler.getOuterHeight(tooltipElement)) / 2;
+        tooltipElement.style.left = left + 'px';
+        tooltipElement.style.top = top + 'px';
+    }
+
+    function alignLeft(el) {
+        preAlign(el, 'left');
+        let tooltipElement = getTooltipElement(el);
+        let hostOffset = getHostOffset(el);
+        let left = hostOffset.left - utils.DomHandler.getOuterWidth(tooltipElement);
+        let top = hostOffset.top + (utils.DomHandler.getOuterHeight(el) - utils.DomHandler.getOuterHeight(tooltipElement)) / 2;
+        tooltipElement.style.left = left + 'px';
+        tooltipElement.style.top = top + 'px';
+    }
+
+    function alignTop(el) {
+        preAlign(el, 'top');
+        let tooltipElement = getTooltipElement(el);
+        let hostOffset = getHostOffset(el);
+        let left = hostOffset.left + (utils.DomHandler.getOuterWidth(el) - utils.DomHandler.getOuterWidth(tooltipElement)) / 2;
+        let top = hostOffset.top - utils.DomHandler.getOuterHeight(tooltipElement);
+        tooltipElement.style.left = left + 'px';
+        tooltipElement.style.top = top + 'px';
+    }
+
+    function alignBottom(el) {
+        preAlign(el, 'bottom');
+        let tooltipElement = getTooltipElement(el);
+        let hostOffset = getHostOffset(el);
+        let left = hostOffset.left + (utils.DomHandler.getOuterWidth(el) - utils.DomHandler.getOuterWidth(tooltipElement)) / 2;
+        let top = hostOffset.top + utils.DomHandler.getOuterHeight(el);
+        tooltipElement.style.left = left + 'px';
+        tooltipElement.style.top = top + 'px';
+    }
+
+    function preAlign(el, position) {
+        let tooltipElement = getTooltipElement(el);
+        tooltipElement.style.left = -999 + 'px';
+        tooltipElement.style.top = -999 + 'px';
+        tooltipElement.className = `p-tooltip p-component p-tooltip-${position} ${el.$_ptooltipClass||''}`;
+    }
+
+    function isOutOfBounds(el) {
+        let tooltipElement = getTooltipElement(el);
+        let offset = tooltipElement.getBoundingClientRect();
+        let targetTop = offset.top;
+        let targetLeft = offset.left;
+        let width = utils.DomHandler.getOuterWidth(tooltipElement);
+        let height = utils.DomHandler.getOuterHeight(tooltipElement);
+        let viewport = utils.DomHandler.getViewport();
+
+        return (targetLeft + width > viewport.width) || (targetLeft < 0) || (targetTop < 0) || (targetTop + height > viewport.height);
+    }
+
+    function getTarget(el) {
+        return utils.DomHandler.hasClass(el, 'p-inputwrapper') ? utils.DomHandler.findSingle(el, 'input'): el;
+    }
+
+    function getModifiers(options) {
+        // modifiers
+        if (options.modifiers && Object.keys(options.modifiers).length) {
+            return options.modifiers;
+        }
+
+        // arg
+        if (options.arg && typeof options.arg === 'object') {
+            return Object.entries(options.arg).reduce((acc, [key, val]) => {
+                if (key === 'event' || key === 'position') acc[val] = true;
+                return acc;
+            }, {});
+        }
+
+        return {};
+    }
+
+    const Tooltip = {
+        beforeMount(el, options) {
+            let target = getTarget(el);
+            target.$_ptooltipModifiers = getModifiers(options);
+
+            if (!options.value) return;
+            else if (typeof options.value === 'string') {
+                target.$_ptooltipValue = options.value;
+                target.$_ptooltipDisabled = false;
+                target.$_ptooltipClass = null;
+            }
+            else {
+                target.$_ptooltipValue = options.value.value;
+                target.$_ptooltipDisabled = options.value.disabled || false;
+                target.$_ptooltipClass = options.value.class;
+            }
+
+            target.$_ptooltipZIndex = options.instance.$primevue && options.instance.$primevue.config && options.instance.$primevue.config.zIndex.tooltip;
+            bindEvents(target);
+        },
+        unmounted(el) {
+            let target = getTarget(el);
+            remove(target);
+            unbindEvents(target);
+
+            if (target.$_ptooltipScrollHandler) {
+                target.$_ptooltipScrollHandler.destroy();
+                target.$_ptooltipScrollHandler = null;
+            }
+
+            utils.ZIndexUtils.clear(el);
+        },
+        updated(el, options) {
+            let target = getTarget(el);
+            target.$_ptooltipModifiers = getModifiers(options);
+
+            if (!options.value) return;
+            if (typeof options.value === 'string') {
+                target.$_ptooltipValue = options.value;
+                target.$_ptooltipDisabled = false;
+                target.$_ptooltipClass = null;
+            }
+            else {
+                target.$_ptooltipValue = options.value.value;
+                target.$_ptooltipDisabled = options.value.disabled || false;
+                target.$_ptooltipClass = options.value.class;
+            }
+        }
+    };
+
+    return Tooltip;
+
+})(primevue.utils);
 
 this.primevue = this.primevue || {};
 this.primevue.virtualscroller = (function (vue) {
@@ -1533,15 +1920,21 @@ this.primevue.virtualscroller = (function (vue) {
 
     var script = {
         name: 'VirtualScroller',
-        emits: ['update:numToleratedItems', 'scroll-index-change', 'lazy-load'],
+        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: null
+                default: 0
             },
             scrollHeight: null,
             scrollWidth: null,
@@ -1561,17 +1954,27 @@ this.primevue.virtualscroller = (function (vue) {
                 type: Boolean,
                 default: false
             },
-            showLoader: {
+            disabled: {
                 type: Boolean,
                 default: false
             },
+            loaderDisabled: {
+                type: Boolean,
+                default: false
+            },
+            columns: {
+                type: Array,
+                default: null
+            },
             loading: {
                 type: Boolean,
                 default: false
             },
-            style: null,
-            class: null,
-            disabled: {
+            showSpacer: {
+                type: Boolean,
+                default: true
+            },
+            showLoader: {
                 type: Boolean,
                 default: false
             }
@@ -1584,15 +1987,19 @@ this.primevue.virtualscroller = (function (vue) {
                 lastScrollPos: this.isBoth() ? { top: 0, left: 0 } : 0,
                 d_numToleratedItems: this.numToleratedItems,
                 d_loading: this.loading,
-                loaderArr: null
+                loaderArr: [],
+                spacerStyle: {},
+                contentStyle: {}
             }
         },
         element: null,
         content: null,
-        spacer: null,
+        lastScrollPos: null,
         scrollTimeout: null,
         mounted() {
             this.init();
+
+            this.lastScrollPos = this.isBoth() ? { top: 0, left: 0 } : 0;
         },
         watch: {
             numToleratedItems(newValue) {
@@ -1601,67 +2008,185 @@ this.primevue.virtualscroller = (function (vue) {
             loading(newValue) {
                 this.d_loading = newValue;
             },
-            items(newValue, oldVal) {
-                if (!oldVal || oldVal.length !== (newValue || []).length) {
+            items(newValue, oldValue) {
+                if (!oldValue || oldValue.length !== (newValue || []).length) {
                     this.init();
                 }
+            },
+            orientation() {
+                this.lastScrollPos = this.isBoth() ? { top: 0, left: 0 } : 0;
             }
         },
         methods: {
             init() {
-                if (!this.disabled) {
-                    this.setSize();
-                    this.calculateOptions();
-                    this.setSpacerSize();
+                this.setSize();
+                this.calculateOptions();
+                this.setSpacerSize();
+            },
+            isVertical() {
+                return this.orientation === 'vertical';
+            },
+            isHorizontal() {
+                return this.orientation === 'horizontal';
+            },
+            isBoth() {
+                return this.orientation === 'both';
+            },
+            scrollTo(options) {
+                this.element && this.element.scrollTo(options);
+            },
+            scrollToIndex(index, behavior = 'auto') {
+                const both = this.isBoth();
+                const horizontal = this.isHorizontal();
+                const contentPos = this.getContentPosition();
+                const calculateFirst = (_index = 0, _numT) => (_index <= _numT ? 0 : _index);
+                const calculateCoord = (_first, _size, _cpos) => (_first * _size) + _cpos;
+                const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior });
+
+                if (both) {
+                    const newFirst = { rows: calculateFirst(index[0], this.d_numToleratedItems[0]), cols: calculateFirst(index[1], this.d_numToleratedItems[1]) };
+                    if (newFirst.rows !== this.first.rows || newFirst.cols !== this.first.cols) {
+                        scrollTo(calculateCoord(newFirst.cols, this.itemSize[1], contentPos.left), calculateCoord(newFirst.rows, this.itemSize[0], contentPos.top));
+                        this.first = newFirst;
+                    }
+                }
+                else {
+                    const newFirst = calculateFirst(index, this.d_numToleratedItems);
+
+                    if (newFirst !== this.first) {
+                        horizontal ? scrollTo(calculateCoord(newFirst, this.itemSize, contentPos.left), 0) : scrollTo(0, calculateCoord(newFirst, this.itemSize, contentPos.top));
+                        this.first = newFirst;
+                    }
+                }
+            },
+            scrollInView(index, to, behavior = 'auto') {
+                if (to) {
+                    const both = this.isBoth();
+                    const horizontal = this.isHorizontal();
+                    const { first, viewport } = this.getRenderedRange();
+                    const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior });
+                    const isToStart = to === 'to-start';
+                    const isToEnd = to === 'to-end';
+
+                    if (isToStart) {
+                        if (both) {
+                            if (viewport.first.rows - first.rows > index[0]) {
+                                scrollTo(viewport.first.cols * this.itemSize[1], (viewport.first.rows - 1) * this.itemSize[0]);
+                            }
+                            else if (viewport.first.cols - first.cols > index[1]) {
+                                scrollTo((viewport.first.cols - 1) * this.itemSize[1], viewport.first.rows * this.itemSize[0]);
+                            }
+                        }
+                        else {
+                            if (viewport.first - first > index) {
+                                const pos = (viewport.first - 1) * this.itemSize;
+                                horizontal ? scrollTo(pos, 0) : scrollTo(0, pos);
+                            }
+                        }
+                    }
+                    else if (isToEnd) {
+                        if (both) {
+                            if (viewport.last.rows - first.rows <= index[0] + 1) {
+                                scrollTo(viewport.first.cols * this.itemSize[1], (viewport.first.rows + 1) * this.itemSize[0]);
+                            }
+                            else if (viewport.last.cols - first.cols <= index[1] + 1) {
+                                scrollTo((viewport.first.cols + 1) * this.itemSize[1], viewport.first.rows * this.itemSize[0]);
+                            }
+                        }
+                        else {
+                            if (viewport.last - first <= index + 1) {
+                                const pos = (viewport.first + 1) * this.itemSize;
+                                horizontal ? scrollTo(pos, 0) : scrollTo(0, pos);
+                            }
+                        }
+                    }
+                }
+                else {
+                    this.scrollToIndex(index, behavior);
                 }
             },
-            getLast(last, isCols) {
-                return this.items ? Math.min((isCols ? this.items[0].length : this.items.length), last) : 0;
+            getRenderedRange() {
+                const calculateFirstInViewport = (_pos, _size) => Math.floor(_pos / (_size || _pos));
+
+                let firstInViewport = this.first;
+                let lastInViewport = 0;
+
+                if (this.element) {
+                    const both = this.isBoth();
+                    const horizontal = this.isHorizontal();
+                    const scrollTop = this.element.scrollTop;
+                    const scrollLeft = this.element.scrollLeft;
+
+                    if (both) {
+                        firstInViewport = { rows: calculateFirstInViewport(scrollTop, this.itemSize[0]), cols: calculateFirstInViewport(scrollLeft, this.itemSize[1]) };
+                        lastInViewport = { rows: firstInViewport.rows + this.numItemsInViewport.rows, cols: firstInViewport.cols + this.numItemsInViewport.cols };
+                    }
+                    else {
+                        const scrollPos = horizontal ? scrollLeft : scrollTop;
+                        firstInViewport = calculateFirstInViewport(scrollPos, this.itemSize);
+                        lastInViewport = firstInViewport + this.numItemsInViewport;
+                    }
+                }
+
+                return {
+                    first: this.first,
+                    last: this.last,
+                    viewport: {
+                        first: firstInViewport,
+                        last: lastInViewport
+                    }
+                };
             },
             calculateOptions() {
-                const isBoth = this.isBoth();
-                const isHorizontal = this.isHorizontal();
-                const first = this.first;
-                const itemSize = this.itemSize;
-                const contentPadding = this.getContentPadding();
-                const contentWidth = this.element ? this.element.offsetWidth - contentPadding.left : 0;
-                const contentHeight = this.element ? this.element.offsetHeight - contentPadding.top : 0;
+                const both = this.isBoth();
+                const horizontal = this.isHorizontal();
+                const contentPos = this.getContentPosition();
+                const contentWidth = this.element ? this.element.offsetWidth - contentPos.left : 0;
+                const contentHeight = this.element ? this.element.offsetHeight - contentPos.top : 0;
                 const calculateNumItemsInViewport = (_contentSize, _itemSize) => Math.ceil(_contentSize / (_itemSize || _contentSize));
-                const numItemsInViewport = isBoth ?
-                    { rows: calculateNumItemsInViewport(contentHeight, itemSize[0]), cols: calculateNumItemsInViewport(contentWidth, itemSize[1]) } :
-                    calculateNumItemsInViewport((isHorizontal ? contentWidth : contentHeight), itemSize);
+                const calculateNumToleratedItems = (_numItems) => Math.ceil(_numItems / 2);
+                const numItemsInViewport = both ?
+                    { rows: calculateNumItemsInViewport(contentHeight, this.itemSize[0]), cols: calculateNumItemsInViewport(contentWidth, this.itemSize[1]) } :
+                    calculateNumItemsInViewport((horizontal ? contentWidth : contentHeight), this.itemSize);
 
-                let numToleratedItems = this.d_numToleratedItems || Math.ceil((isBoth ? numItemsInViewport.rows : numItemsInViewport) / 2);
-                const calculateLast = (_first, _num, _isCols) => this.getLast(_first + _num + ((_first < numToleratedItems ? 2 : 3) * numToleratedItems), _isCols);
-                const last = isBoth ?
-                    { rows: calculateLast(first.rows, numItemsInViewport.rows), cols: calculateLast(first.cols, numItemsInViewport.cols, true) } :
-                    calculateLast(first, numItemsInViewport);
+                let numToleratedItems = this.d_numToleratedItems || (both ?
+                    [calculateNumToleratedItems(numItemsInViewport.rows), calculateNumToleratedItems(numItemsInViewport.cols)] :
+                    calculateNumToleratedItems(numItemsInViewport));
+
+                const calculateLast = (_first, _num, _numT, _isCols) => this.getLast(_first + _num + ((_first < _numT ? 2 : 3) * _numT), _isCols);
+                const last = both ?
+                    { rows: calculateLast(this.first.rows, numItemsInViewport.rows, numToleratedItems[0]), cols: calculateLast(this.first.cols, numItemsInViewport.cols, numToleratedItems[1], true) } :
+                    calculateLast(this.first, numItemsInViewport, numToleratedItems);
 
-                this.d_numToleratedItems = numToleratedItems;
-                this.$emit('update:numToleratedItems', this.d_numToleratedItems);
                 this.last = last;
                 this.numItemsInViewport = numItemsInViewport;
+                this.d_numToleratedItems = numToleratedItems;
+                this.$emit('update:numToleratedItems', this.d_numToleratedItems);
 
                 if (this.showLoader) {
-                    if (this.$slots && this.$slots.loader) {
-                        this.loaderArr = Array.from({ length: (isBoth ? numItemsInViewport.rows : numItemsInViewport) });
-                    }
-                    else {
-                        this.loaderArr = Array.from({ length: 1});
-                    }
+                    this.loaderArr = both ?
+                        Array.from({ length: numItemsInViewport.rows }).map(() => Array.from({ length: numItemsInViewport.cols })) :
+                        Array.from({ length: numItemsInViewport });
                 }
 
                 if (this.lazy) {
-                    this.$emit('lazy-load', { first, last });
+                    this.$emit('lazy-load', { first: this.first, last });
+                }
+            },
+            getLast(last = 0, isCols) {
+                 if (this.items) {
+                    return Math.min((isCols ? (this.columns || this.items[0]).length : this.items.length), last);
                 }
+
+                return 0;
             },
-            getContentPadding() {
+            getContentPosition() {
                 if (this.content) {
                     const style = getComputedStyle(this.content);
-                    const left = parseInt(parseFloat(style.paddingLeft.slice(0, -2)), 10);
-                    const right = parseInt(parseFloat(style.paddingRight.slice(0, -2)), 10);
-                    const top = parseInt(parseFloat(style.paddingTop.slice(0, -2)), 10);
-                    const bottom = parseInt(parseFloat(style.paddingBottom.slice(0, -2)), 10);
+                    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);
 
                     return { left, right, top, bottom, x: left + right, y: top + bottom };
                 }
@@ -1670,126 +2195,125 @@ this.primevue.virtualscroller = (function (vue) {
             },
             setSize() {
                 if (this.element) {
-                    const isBoth = this.isBoth();
-                    const isHorizontal = this.isHorizontal();
+                    const both = this.isBoth();
+                    const horizontal = this.isHorizontal();
                     const parentElement = this.element.parentElement;
                     const width = this.scrollWidth || `${(this.element.offsetWidth || parentElement.offsetWidth)}px`;
                     const height = this.scrollHeight || `${(this.element.offsetHeight || parentElement.offsetHeight)}px`;
                     const setProp = (_name, _value) => this.element.style[_name] = _value;
 
-                    if (isBoth) {
+                    if (both || horizontal) {
                         setProp('height', height);
                         setProp('width', width);
                     }
                     else {
-                        isHorizontal ? setProp('width', width) : setProp('height', height);
+                        setProp('height', height);
                     }
                 }
             },
             setSpacerSize() {
                 const items = this.items;
 
-                if (this.spacer && items) {
-                    const isBoth = this.isBoth();
-                    const isHorizontal = this.isHorizontal();
-                    const itemSize = this.itemSize;
-                    const contentPadding = this.getContentPadding();
-                    const setProp = (_name, _value, _size, _padding = 0) => this.spacer.style[_name] = (((_value || []).length * _size) + _padding) + 'px';
+                if (items) {
+                    const both = this.isBoth();
+                    const horizontal = this.isHorizontal();
+                    const contentPos = this.getContentPosition();
+                    const setProp = (_name, _value, _size, _cpos = 0) => this.spacerStyle = { ...this.spacerStyle, ...{ [`${_name}`]: (((_value || []).length * _size) + _cpos) + 'px' } };
 
-                    if (isBoth) {
-                        setProp('height', items[0], itemSize[0], contentPadding.y);
-                        setProp('width', items[1], itemSize[1], contentPadding.x);
+                    if (both) {
+                        setProp('height', items, this.itemSize[0], contentPos.y);
+                        setProp('width', (this.columns || items[1]), this.itemSize[1], contentPos.x);
                     }
                     else {
-                        isHorizontal ? setProp('width', items, itemSize, contentPadding.x) : setProp('height', items, itemSize, contentPadding.y);
+                        horizontal ? setProp('width', (this.columns || items), this.itemSize, contentPos.x) : setProp('height', items, this.itemSize, contentPos.y);
                     }
                 }
             },
             setContentPosition(pos) {
                 if (this.content) {
-                    const isBoth = this.isBoth();
-                    const isHorizontal = this.isHorizontal();
-                    const content = this.content;
+                    const both = this.isBoth();
+                    const horizontal = this.isHorizontal();
                     const first = pos ? pos.first : this.first;
-                    const itemSize = this.itemSize;
                     const calculateTranslateVal = (_first, _size) => (_first * _size);
-                    const setTransform = (_x = 0, _y = 0) => content.style.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 (isBoth) {
-                        setTransform(calculateTranslateVal(first.cols, itemSize[1]), calculateTranslateVal(first.rows, itemSize[0]));
+                    if (both) {
+                        setTransform(calculateTranslateVal(first.cols, this.itemSize[1]), calculateTranslateVal(first.rows, this.itemSize[0]));
                     }
                     else {
-                        const translateVal = calculateTranslateVal(first, itemSize);
-                        isHorizontal ? setTransform(translateVal, 0) : setTransform(0, translateVal);
+                        const translateVal = calculateTranslateVal(first, this.itemSize);
+                        horizontal ? setTransform(translateVal, 0) : setTransform(0, translateVal);
                     }
                 }
             },
             onScrollPositionChange(event) {
                 const target = event.target;
-                const isBoth = this.isBoth();
-                const isHorizontal = this.isHorizontal();
-                const itemSize = this.itemSize;
-                const contentPadding = this.getContentPadding();
-                const calculateScrollPos = (_pos, _padding) => _pos ? (_pos > _padding ? _pos - _padding : _pos) : 0;
+                const both = this.isBoth();
+                const horizontal = this.isHorizontal();
+                const contentPos = this.getContentPosition();
+                const calculateScrollPos = (_pos, _cpos) => _pos ? (_pos > _cpos ? _pos - _cpos : _pos) : 0;
                 const calculateCurrentIndex = (_pos, _size) => Math.floor(_pos / (_size || _pos));
-                const calculateTriggerIndex = (_currentIndex, _first, _last, _num, _isScrollDownOrRight) => {
-                    return (_currentIndex <= this.d_numToleratedItems ? this.d_numToleratedItems : (_isScrollDownOrRight ? (_last - _num - this.d_numToleratedItems) : (_first + this.d_numToleratedItems - 1)))
+                const calculateTriggerIndex = (_currentIndex, _first, _last, _num, _numT, _isScrollDownOrRight) => {
+                    return (_currentIndex <= _numT ? _numT : (_isScrollDownOrRight ? (_last - _num - _numT) : (_first + _numT - 1)))
                 };
-                const calculateFirst = (_currentIndex, _triggerIndex, _first, _last, _num, _isScrollDownOrRight) => {
-                    if (_currentIndex <= this.d_numToleratedItems)
+                const calculateFirst = (_currentIndex, _triggerIndex, _first, _last, _num, _numT, _isScrollDownOrRight) => {
+                    if (_currentIndex <= _numT)
                         return 0;
                     else
-                        return _isScrollDownOrRight ?
-                            (_currentIndex < _triggerIndex ? _first : _currentIndex - this.d_numToleratedItems) :
-                            (_currentIndex > _triggerIndex ? _first : _currentIndex - (2 * this.d_numToleratedItems));
+                        return Math.max(0, _isScrollDownOrRight ?
+                                (_currentIndex < _triggerIndex ? _first : _currentIndex - _numT) :
+                                (_currentIndex > _triggerIndex ? _first : _currentIndex - (2 * _numT)));
                 };
-                const calculateLast = (_currentIndex, _first, _last, _num, _isCols) => {
-                    let lastValue = _first + _num + (2 * this.d_numToleratedItems);
+                const calculateLast = (_currentIndex, _first, _last, _num, _numT, _isCols) => {
+                    let lastValue = _first + _num + (2 * _numT);
 
-                    if (_currentIndex >= this.d_numToleratedItems) {
-                        lastValue += (this.d_numToleratedItems + 1);
+                    if (_currentIndex >= _numT) {
+                        lastValue += (_numT + 1);
                     }
 
                     return this.getLast(lastValue, _isCols);
                 };
 
-                const scrollTop = calculateScrollPos(target.scrollTop, contentPadding.top);
-                const scrollLeft = calculateScrollPos(target.scrollLeft, contentPadding.left);
+                const scrollTop = calculateScrollPos(target.scrollTop, contentPos.top);
+                const scrollLeft = calculateScrollPos(target.scrollLeft, contentPos.left);
 
                 let newFirst = 0;
                 let newLast = this.last;
                 let isRangeChanged = false;
 
-                if (isBoth) {
+                if (both) {
                     const isScrollDown = this.lastScrollPos.top <= scrollTop;
                     const isScrollRight = this.lastScrollPos.left <= scrollLeft;
-                    const currentIndex = { rows: calculateCurrentIndex(scrollTop, itemSize[0]), cols: calculateCurrentIndex(scrollLeft, itemSize[1]) };
+                    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, isScrollDown),
-                        cols: calculateTriggerIndex(currentIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, isScrollRight)
+                        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, isScrollDown),
-                        cols: calculateFirst(currentIndex.cols, triggerIndex.cols, this.first.cols, this.last.cols, this.numItemsInViewport.cols, isScrollRight)
+                        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),
-                        cols: calculateLast(currentIndex.cols, newFirst.cols, this.last.cols, this.numItemsInViewport.cols, true)
+                        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 || newFirst.cols !== this.first.cols) || (newLast.rows !== this.last.rows || newLast.cols !== this.last.cols);
+
+                    isRangeChanged = (newFirst.rows !== this.first.rows && newLast.rows !== this.last.rows) || (newFirst.cols !== this.first.cols && newLast.cols !== this.last.cols);
 
                     this.lastScrollPos = { top: scrollTop, left: scrollLeft };
                 }
                 else {
-                    const scrollPos = isHorizontal ? scrollLeft : scrollTop;
+                    const scrollPos = horizontal ? scrollLeft : scrollTop;
                     const isScrollDownOrRight = this.lastScrollPos <= scrollPos;
-                    const currentIndex = calculateCurrentIndex(scrollPos, itemSize);
-                    const triggerIndex = calculateTriggerIndex(currentIndex, this.first, this.last, this.numItemsInViewport, 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, isScrollDownOrRight);
-                    newLast = calculateLast(currentIndex, newFirst, this.last, this.numItemsInViewport);
-                    isRangeChanged = newFirst !== this.first || newLast !== this.last;
+                    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.lastScrollPos = scrollPos;
                 }
@@ -1808,27 +2332,27 @@ this.primevue.virtualscroller = (function (vue) {
 
                     this.setContentPosition(newState);
 
-                    if (this.lazy) {
-                        this.$emit('lazy-load', { first, last });
-                    }
                     this.first = first;
                     this.last = last;
 
-                    this.$emit('scroll-index-change', { first, last });
+                    this.$emit('scroll-index-change', newState);
+
+                    if (this.lazy) {
+                        this.$emit('lazy-load', newState);
+                    }
                 }
             },
             onScroll(event) {
-                if (this.delay && !this.lazy) {
+                this.$emit('scroll', event);
+
+                if (this.delay) {
                     if (this.scrollTimeout) {
                         clearTimeout(this.scrollTimeout);
                     }
 
                     if (!this.d_loading && this.showLoader) {
                         const { isRangeChanged: changed } = this.onScrollPositionChange(event);
-
-                        if (changed) {
-                            this.d_loading = true;
-                        }
+                        changed && (this.d_loading = true);
                     }
 
                     this.scrollTimeout = setTimeout(() => {
@@ -1844,8 +2368,8 @@ this.primevue.virtualscroller = (function (vue) {
                 }
             },
             getOptions(renderedIndex) {
-                let count = this.items.length;
-                let index = this.isBoth() ? this.first.rows + renderedIndex : this.first + renderedIndex;
+                const count = (this.items || []).length;
+                const index = this.isBoth() ? this.first.rows + renderedIndex : this.first + renderedIndex;
                 return {
                     index,
                     count,
@@ -1855,139 +2379,23 @@ this.primevue.virtualscroller = (function (vue) {
                     odd: index % 2 !== 0
                 };
             },
-            getLoaderOptions(index) {
+            getLoaderOptions(index, extOptions) {
                 let count = this.loaderArr.length;
                 return {
-                    loading: this.d_loading,
+                    index,
+                    count,
                     first: index === 0,
                     last: index === (count - 1),
                     even: index % 2 === 0,
-                    odd: index % 2 !== 0
-                }
-            },
-            isHorizontal() {
-                return this.orientation === 'horizontal';
-            },
-            isBoth() {
-                return this.orientation === 'both';
-            },
-            scrollTo(options) {
-                if (this.element) {
-                    this.element.scrollTo(options);
-                }
-            },
-            scrollToIndex(index, behavior = 'auto') {
-                const isBoth = this.isBoth();
-                const isHorizontal = this.isHorizontal();
-                const itemSize = this.itemSize;
-                const contentPadding = this.getContentPadding();
-                const calculateFirst = (_index = 0) => (_index <= this.d_numToleratedItems ? 0 : _index);
-                const calculateCoord = (_first, _size, _padding) => (_first * _size) + _padding;
-                const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior });
-
-                if (isBoth) {
-                    const newFirst = { rows: calculateFirst(index[0]), cols: calculateFirst(index[1]) };
-                    if (newFirst.rows !== this.first.rows || newFirst.cols !== this.first.cols)
-                        scrollTo(calculateCoord(newFirst.cols, itemSize[1], contentPadding.left),calculateCoord(newFirst.rows, itemSize[0], contentPadding.top));
-                }
-                else {
-                    const newFirst = calculateFirst(index);
-
-                    if (newFirst !== this.first) {
-                        isHorizontal ? scrollTo(calculateCoord(newFirst, itemSize, contentPadding.left), 0) : scrollTo(0, calculateCoord(newFirst, itemSize, contentPadding.top));
-                    }
-
-                    this.first = newFirst;
-                }
-            },
-            scrollInView(index, to, behavior = 'auto') {
-                if (to) {
-                    const isBoth = this.isBoth();
-                    const isHorizontal = this.isHorizontal();
-                    const { first, viewport } = this.getRenderedRange();
-                    const itemSize = this.itemSize;
-                    const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior });
-                    const isToStart = to === 'to-start';
-                    const isToEnd = to === 'to-end';
-
-                    if (isToStart) {
-                        if (isBoth) {
-                            if (viewport.first.rows - first.rows > index[0]) {
-                                scrollTo(viewport.first.cols * itemSize[1], (viewport.first.rows - 1) * itemSize[0]);
-                            }
-                            else if (viewport.first.cols - first.cols > index[1]) {
-                                scrollTo((viewport.first.cols - 1) * itemSize[1], viewport.first.rows * itemSize[0]);
-                            }
-                        }
-                        else {
-                            if (viewport.first - first > index) {
-                                const pos = (viewport.first - 1) * itemSize;
-                                isHorizontal ? scrollTo(pos, 0) : scrollTo(0, pos);
-                            }
-                        }
-                    }
-                    else if (isToEnd) {
-                        if (isBoth) {
-                            if (viewport.last.rows - first.rows <= index[0] + 1) {
-                                scrollTo(viewport.first.cols * itemSize[1], (viewport.first.rows + 1) * itemSize[0]);
-                            }
-                            else if (viewport.last.cols - first.cols <= index[1] + 1) {
-                                scrollTo((viewport.first.cols + 1) * itemSize[1], viewport.first.rows * itemSize[0]);
-                            }
-                        }
-                        else {
-                            if (viewport.last - first <= index + 1) {
-                                const pos = (viewport.first + 1) * itemSize;
-                                isHorizontal ? scrollTo(pos, 0) : scrollTo(0, pos);
-                            }
-                        }
-                    }
-                }
-                else {
-                    this.scrollToIndex(index, behavior);
-                }
-            },
-            getRenderedRange() {
-                const isBoth = this.isBoth();
-                const isHorizontal = this.isHorizontal();
-                const itemSize = this.itemSize;
-                const calculateFirstInViewport = (_pos, _size) => Math.floor(_pos / (_size || _pos));
-
-                let firstInViewport = this.first;
-                let lastInViewport = 0;
-
-                if (this.element) {
-                    const scrollTop = this.element.scrollTop;
-                    const scrollLeft = this.element.scrollLeft;
-
-                    if (isBoth) {
-                        firstInViewport = { rows: calculateFirstInViewport(scrollTop, itemSize[0]), cols: calculateFirstInViewport(scrollLeft, itemSize[1]) };
-                        lastInViewport = { rows: firstInViewport.rows + this.numItemsInViewport.rows, cols: firstInViewport.cols + this.numItemsInViewport.cols };
-                    }
-                    else {
-                        const scrollPos = isHorizontal ? scrollLeft : scrollTop;
-                        firstInViewport = calculateFirstInViewport(scrollPos, itemSize);
-                        lastInViewport = firstInViewport + this.numItemsInViewport;
-                    }
+                    odd: index % 2 !== 0,
+                    ...extOptions
                 }
-
-                return {
-                    first: this.first,
-                    last: this.last,
-                    viewport: {
-                        first: firstInViewport,
-                        last: lastInViewport
-                    }
-                };
             },
             elementRef(el) {
                 this.element = el;
             },
             contentRef(el) {
                 this.content = el;
-            },
-            spacerRef(el) {
-                this.spacer = el;
             }
         },
         computed: {
@@ -1997,6 +2405,11 @@ this.primevue.virtualscroller = (function (vue) {
                     '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
@@ -2005,27 +2418,41 @@ this.primevue.virtualscroller = (function (vue) {
             loadedItems() {
                 const items = this.items;
                 if (items && !this.d_loading) {
-                    const isBoth = this.isBoth();
-
-                    if (isBoth) {
-                        return items.slice(this.first.rows, this.last.rows).map((item) => {
-                            const items = item.slice(this.first.cols, this.last.cols);
-                            return items;
-                        });
-                    }
-                    else {
-                        return items.slice(this.first, this.last).map((item) => {
-                            return item;
-                        });
+                    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);
                 }
 
                 return [];
+            },
+            loadedRows() {
+                return this.d_loading ? (this.loaderDisabled ? this.loaderArr : []) : this.loadedItems;
+            },
+            loadedColumns() {
+                if (this.columns) {
+                    const both = this.isBoth();
+                    const horizontal = this.isHorizontal();
+
+                    if (both || horizontal) {
+                        return this.d_loading && this.loaderDisabled ?
+                        (both ? this.loaderArr[0] : this.loaderArr):
+                        this.columns.slice((both ? this.first.cols : this.first), (both ? this.last.cols : this.last));
+                    }
+                }
+
+                return this.columns;
             }
         }
     };
 
-    const _hoisted_1 = /*#__PURE__*/vue.createVNode("i", { class: "p-virtualscroller-loading-icon pi pi-spinner pi-spin" }, null, -1);
+    const _hoisted_1 = {
+      key: 1,
+      class: "p-virtualscroller-loading-icon pi pi-spinner pi-spin"
+    };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return (!$props.disabled)
@@ -2033,18 +2460,30 @@ this.primevue.virtualscroller = (function (vue) {
             key: 0,
             ref: $options.elementRef,
             class: $options.containerClass,
+            tabindex: 0,
             style: $props.style,
             onScroll: _cache[1] || (_cache[1] = (...args) => ($options.onScroll && $options.onScroll(...args)))
           }, [
             vue.renderSlot(_ctx.$slots, "content", {
-              styleClass: "p-virtualscroller-content",
-              contentRef: $options.contentRef,
+              styleClass: $options.contentClass,
               items: $options.loadedItems,
-              getItemOptions: $options.getOptions
+              getItemOptions: $options.getOptions,
+              loading: $data.d_loading,
+              getLoaderOptions: $options.getLoaderOptions,
+              itemSize: $props.itemSize,
+              rows: $options.loadedRows,
+              columns: $options.loadedColumns,
+              contentRef: $options.contentRef,
+              spacerStyle: $data.spacerStyle,
+              contentStyle: $data.contentStyle,
+              vertical: $options.isVertical(),
+              horizontal: $options.isHorizontal(),
+              both: $options.isBoth()
             }, () => [
               vue.createVNode("div", {
                 ref: $options.contentRef,
-                class: "p-virtualscroller-content"
+                class: $options.contentClass,
+                style: $data.contentStyle
               }, [
                 (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($options.loadedItems, (item, index) => {
                   return vue.renderSlot(_ctx.$slots, "item", {
@@ -2053,31 +2492,38 @@ this.primevue.virtualscroller = (function (vue) {
                     options: $options.getOptions(index)
                   })
                 }), 128))
-              ], 512)
+              ], 6)
             ]),
-            vue.createVNode("div", {
-              ref: $options.spacerRef,
-              class: "p-virtualscroller-spacer"
-            }, null, 512),
-            ($data.d_loading)
+            ($props.showSpacer)
               ? (vue.openBlock(), vue.createBlock("div", {
                   key: 0,
+                  class: "p-virtualscroller-spacer",
+                  style: $data.spacerStyle
+                }, null, 4))
+              : vue.createCommentVNode("", true),
+            (!$props.loaderDisabled && $props.showLoader && $data.d_loading)
+              ? (vue.openBlock(), vue.createBlock("div", {
+                  key: 1,
                   class: $options.loaderClass
                 }, [
-                  (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($data.loaderArr, (loadItem, index) => {
-                    return vue.renderSlot(_ctx.$slots, "loader", {
-                      key: index,
-                      options: $options.getLoaderOptions(index)
-                    }, () => [
-                      _hoisted_1
-                    ])
-                  }), 128))
+                  (_ctx.$slots && _ctx.$slots.loader)
+                    ? (vue.openBlock(true), vue.createBlock(vue.Fragment, { key: 0 }, vue.renderList($data.loaderArr, (_, index) => {
+                        return vue.renderSlot(_ctx.$slots, "loader", {
+                          key: index,
+                          options: $options.getLoaderOptions(index, $options.isBoth() && { numCols: _ctx.d_numItemsInViewport.cols })
+                        })
+                      }), 128))
+                    : (vue.openBlock(), vue.createBlock("i", _hoisted_1))
                 ], 2))
               : vue.createCommentVNode("", true)
           ], 38))
         : (vue.openBlock(), vue.createBlock(vue.Fragment, { key: 1 }, [
             vue.renderSlot(_ctx.$slots, "default"),
-            vue.renderSlot(_ctx.$slots, "content", { items: $props.items })
+            vue.renderSlot(_ctx.$slots, "content", {
+              items: $props.items,
+              rows: $props.items,
+              columns: $options.loadedColumns
+            })
           ], 64))
     }
 
@@ -2108,14 +2554,14 @@ this.primevue.virtualscroller = (function (vue) {
       }
     }
 
-    var css_248z = "\n.p-virtualscroller {\n    position: relative;\n    overflow: auto;\n    contain: strict;\n    -webkit-transform: translateZ(0);\n            transform: translateZ(0);\n    will-change: scroll-position;\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    -webkit-transform-origin: 0 0;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n";
+    var css_248z = "\n.p-virtualscroller {\n    position: relative;\n    overflow: auto;\n    contain: strict;\n    -webkit-transform: translateZ(0);\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    -webkit-transform-origin: 0 0;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n";
     styleInject(css_248z);
 
     script.render = render;
 
     return script;
 
-}(Vue));
+})(Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.confirmationeventbus = (function (utils) {
@@ -2125,7 +2571,7 @@ this.primevue.confirmationeventbus = (function (utils) {
 
 	return ConfirmationEventBus;
 
-}(primevue.utils));
+})(primevue.utils);
 
 this.primevue = this.primevue || {};
 this.primevue.toasteventbus = (function (utils) {
@@ -2135,7 +2581,7 @@ this.primevue.toasteventbus = (function (utils) {
 
 	return ToastEventBus;
 
-}(primevue.utils));
+})(primevue.utils);
 
 this.primevue = this.primevue || {};
 this.primevue.overlayeventbus = (function (utils) {
@@ -2145,7 +2591,7 @@ this.primevue.overlayeventbus = (function (utils) {
 
 	return OverlayEventBus;
 
-}(primevue.utils));
+})(primevue.utils);
 
 this.primevue = this.primevue || {};
 this.primevue.terminalservice = (function (utils) {
@@ -2155,7 +2601,7 @@ this.primevue.terminalservice = (function (utils) {
 
 	return TerminalService;
 
-}(primevue.utils));
+})(primevue.utils);
 
 this.primevue = this.primevue || {};
 this.primevue.useconfirm = (function (exports, vue) {
@@ -2179,7 +2625,7 @@ this.primevue.useconfirm = (function (exports, vue) {
 
     return exports;
 
-}({}, Vue));
+})({}, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.usetoast = (function (exports, vue) {
@@ -2203,7 +2649,7 @@ this.primevue.usetoast = (function (exports, vue) {
 
     return exports;
 
-}({}, Vue));
+})({}, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.button = (function (Ripple, vue) {
@@ -2276,7 +2722,7 @@ this.primevue.button = (function (Ripple, vue) {
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         }
     };
 
@@ -2320,7 +2766,7 @@ this.primevue.button = (function (Ripple, vue) {
 
     return script;
 
-}(primevue.ripple, Vue));
+})(primevue.ripple, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.inputtext = (function (vue) {
@@ -2345,18 +2791,18 @@ this.primevue.inputtext = (function (vue) {
     };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
-      return (vue.openBlock(), vue.createBlock("input", {
+      return (vue.openBlock(), vue.createBlock("input", vue.mergeProps({
         class: ['p-inputtext p-component', {'p-filled': $options.filled}],
         value: $props.modelValue,
         onInput: _cache[1] || (_cache[1] = (...args) => ($options.onInput && $options.onInput(...args)))
-      }, null, 42, ["value"]))
+      }, _ctx.$attrs), null, 16, ["value"]))
     }
 
     script.render = render;
 
     return script;
 
-}(Vue));
+})(Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.inputnumber = (function (InputText, Button, vue) {
@@ -2481,10 +2927,14 @@ this.primevue.inputnumber = (function (InputText, Button, vue) {
         timer: null,
         data() {
             return {
+                d_modelValue: this.modelValue,
                 focused: false
             }
         },
         watch: {
+            modelValue(newValue) {
+                this.d_modelValue = newValue;
+            },
     		locale(newValue, oldValue) {
                 this.updateConstructParser(newValue, oldValue);
             },
@@ -3240,6 +3690,7 @@ this.primevue.inputnumber = (function (InputText, Button, vue) {
                 return 0;
             },
             updateModel(event, value) {
+                this.d_modelValue = value;
                 this.$emit('update:modelValue', value);
             },
             onInputFocus() {
@@ -3258,7 +3709,13 @@ this.primevue.inputnumber = (function (InputText, Button, vue) {
                 if (this.timer) {
                     clearInterval(this.timer);
                 }
-            }
+            },
+            maxBoundry() {
+                return this.d_modelValue >= this.max;
+            },
+            minBoundry() {
+                return this.d_modelValue <= this.min;
+            },
         },
         computed: {
             containerClass() {
@@ -3270,11 +3727,16 @@ this.primevue.inputnumber = (function (InputText, Button, vue) {
                     'p-inputnumber-buttons-vertical': this.showButtons && this.buttonLayout === 'vertical'
                 }];
             },
+            
             upButtonClass() {
-                return ['p-inputnumber-button p-inputnumber-button-up', this.incrementButtonClass];
+                return ['p-inputnumber-button p-inputnumber-button-up', this.incrementButtonClass, {
+                    'p-disabled': this.showButtons && this.max !== null && this.maxBoundry()
+                }];
             },
             downButtonClass() {
-                return ['p-inputnumber-button p-inputnumber-button-down', this.decrementButtonClass];
+                return ['p-inputnumber-button p-inputnumber-button-down', this.decrementButtonClass, {
+                    'p-disabled': this.showButtons && this.min !== null && this.minBoundry()
+                }];
             },
             filled() {
                 return (this.modelValue != null && this.modelValue.toString().length > 0)
@@ -3306,8 +3768,8 @@ this.primevue.inputnumber = (function (InputText, Button, vue) {
             }
         },
         components: {
-            'INInputText': InputText__default['default'],
-            'INButton': Button__default['default']
+            'INInputText': InputText__default["default"],
+            'INButton': Button__default["default"]
         }
     };
 
@@ -3411,7 +3873,7 @@ this.primevue.inputnumber = (function (InputText, Button, vue) {
 
     return script;
 
-}(primevue.inputtext, primevue.button, Vue));
+})(primevue.inputtext, primevue.button, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.message = (function (Ripple, vue) {
@@ -3440,7 +3902,11 @@ this.primevue.message = (function (Ripple, vue) {
             life: {
                 type: Number,
                 default: 3000
-            }
+            },
+            icon: {
+                type: String,
+                default: null
+            },
         },
         timeout: null,
         data() {
@@ -3466,7 +3932,7 @@ this.primevue.message = (function (Ripple, vue) {
                 return 'p-message p-component p-message-' + this.severity;
             },
             iconClass() {
-                return ['p-message-icon pi', {
+                return ['p-message-icon pi', this.icon ? this.icon : {
                     'pi-info-circle': this.severity === 'info',
                     'pi-check': this.severity === 'success',
                     'pi-exclamation-triangle': this.severity === 'warn',
@@ -3475,7 +3941,7 @@ this.primevue.message = (function (Ripple, vue) {
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         }
     };
 
@@ -3555,7 +4021,7 @@ this.primevue.message = (function (Ripple, vue) {
 
     return script;
 
-}(primevue.ripple, Vue));
+})(primevue.ripple, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.progressbar = (function (vue) {
@@ -3590,7 +4056,7 @@ this.primevue.progressbar = (function (vue) {
             progressStyle() {
                 return {
                     width: this.value + '%',
-                    display: 'block'
+                    display: 'flex'
                 };
             },
             indeterminate() {
@@ -3603,11 +4069,11 @@ this.primevue.progressbar = (function (vue) {
     };
 
     const _hoisted_1 = {
-      key: 1,
+      key: 0,
       class: "p-progressbar-label"
     };
     const _hoisted_2 = {
-      key: 2,
+      key: 1,
       class: "p-progressbar-indeterminate-container"
     };
     const _hoisted_3 = /*#__PURE__*/vue.createVNode("div", { class: "p-progressbar-value p-progressbar-value-animate" }, null, -1);
@@ -3625,14 +4091,15 @@ this.primevue.progressbar = (function (vue) {
               key: 0,
               class: "p-progressbar-value p-progressbar-value-animate",
               style: $options.progressStyle
-            }, null, 4))
-          : vue.createCommentVNode("", true),
-        ($options.determinate && ($props.value !== null) && $props.showValue)
-          ? (vue.openBlock(), vue.createBlock("div", _hoisted_1, [
-              vue.renderSlot(_ctx.$slots, "default", {}, () => [
-                vue.createTextVNode(vue.toDisplayString($props.value + '%'), 1)
-              ])
-            ]))
+            }, [
+              (($props.value != null && $props.value !== 0) && $props.showValue)
+                ? (vue.openBlock(), vue.createBlock("div", _hoisted_1, [
+                    vue.renderSlot(_ctx.$slots, "default", {}, () => [
+                      vue.createTextVNode(vue.toDisplayString($props.value + '%'), 1)
+                    ])
+                  ]))
+                : vue.createCommentVNode("", true)
+            ], 4))
           : vue.createCommentVNode("", true),
         ($options.indeterminate)
           ? (vue.openBlock(), vue.createBlock("div", _hoisted_2, [
@@ -3669,14 +4136,14 @@ this.primevue.progressbar = (function (vue) {
       }
     }
 
-    var css_248z = "\n.p-progressbar {\n    position: relative;\n    overflow: hidden;\n}\n.p-progressbar-determinate .p-progressbar-value {\n    height: 100%;\n    width: 0%;\n    position: absolute;\n    display: none;\n    border: 0 none;\n}\n.p-progressbar-determinate .p-progressbar-value-animate {\n    -webkit-transition: width 1s ease-in-out;\n    transition: width 1s ease-in-out;\n}\n.p-progressbar-determinate .p-progressbar-label {\n    text-align: center;\n    height: 100%;\n    width: 100%;\n    position: absolute;\n    font-weight: bold;\n}\n.p-progressbar-indeterminate .p-progressbar-value::before {\n      content: '';\n      position: absolute;\n      background-color: inherit;\n      top: 0;\n      left: 0;\n      bottom: 0;\n      will-change: left, right;\n      -webkit-animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n              animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n}\n.p-progressbar-indeterminate .p-progressbar-value::after {\n    content: '';\n    position: absolute;\n    background-color: inherit;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    will-change: left, right;\n    -webkit-animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n            animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n    -webkit-animation-delay: 1.15s;\n            animation-delay: 1.15s;\n}\n@-webkit-keyframes p-progressbar-indeterminate-anim {\n0% {\n    left: -35%;\n    right: 100%;\n}\n60% {\n    left: 100%;\n    right: -90%;\n}\n100% {\n    left: 100%;\n    right: -90%;\n}\n}\n@keyframes p-progressbar-indeterminate-anim {\n0% {\n    left: -35%;\n    right: 100%;\n}\n60% {\n    left: 100%;\n    right: -90%;\n}\n100% {\n    left: 100%;\n    right: -90%;\n}\n}\n@-webkit-keyframes p-progressbar-indeterminate-anim-short {\n0% {\n    left: -200%;\n    right: 100%;\n}\n60% {\n    left: 107%;\n    right: -8%;\n}\n100% {\n    left: 107%;\n    right: -8%;\n}\n}\n@keyframes p-progressbar-indeterminate-anim-short {\n0% {\n    left: -200%;\n    right: 100%;\n}\n60% {\n    left: 107%;\n    right: -8%;\n}\n100% {\n    left: 107%;\n    right: -8%;\n}\n}\n";
+    var css_248z = "\n.p-progressbar {\n    position: relative;\n    overflow: hidden;\n}\n.p-progressbar-determinate .p-progressbar-value {\n    height: 100%;\n    width: 0%;\n    position: absolute;\n    display: none;\n    border: 0 none;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n}\n.p-progressbar-determinate .p-progressbar-label {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n}\n.p-progressbar-determinate .p-progressbar-value-animate {\n    -webkit-transition: width 1s ease-in-out;\n    transition: width 1s ease-in-out;\n}\n.p-progressbar-indeterminate .p-progressbar-value::before {\n      content: '';\n      position: absolute;\n      background-color: inherit;\n      top: 0;\n      left: 0;\n      bottom: 0;\n      will-change: left, right;\n      -webkit-animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n              animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n}\n.p-progressbar-indeterminate .p-progressbar-value::after {\n    content: '';\n    position: absolute;\n    background-color: inherit;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    will-change: left, right;\n    -webkit-animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n            animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n    -webkit-animation-delay: 1.15s;\n            animation-delay: 1.15s;\n}\n@-webkit-keyframes p-progressbar-indeterminate-anim {\n0% {\n    left: -35%;\n    right: 100%;\n}\n60% {\n    left: 100%;\n    right: -90%;\n}\n100% {\n    left: 100%;\n    right: -90%;\n}\n}\n@keyframes p-progressbar-indeterminate-anim {\n0% {\n    left: -35%;\n    right: 100%;\n}\n60% {\n    left: 100%;\n    right: -90%;\n}\n100% {\n    left: 100%;\n    right: -90%;\n}\n}\n@-webkit-keyframes p-progressbar-indeterminate-anim-short {\n0% {\n    left: -200%;\n    right: 100%;\n}\n60% {\n    left: 107%;\n    right: -8%;\n}\n100% {\n    left: 107%;\n    right: -8%;\n}\n}\n@keyframes p-progressbar-indeterminate-anim-short {\n0% {\n    left: -200%;\n    right: 100%;\n}\n60% {\n    left: 107%;\n    right: -8%;\n}\n100% {\n    left: 107%;\n    right: -8%;\n}\n}\n";
     styleInject(css_248z);
 
     script.render = render;
 
     return script;
 
-}(Vue));
+})(Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.dropdown = (function (utils, OverlayEventBus, api, Ripple, VirtualScroller, vue) {
@@ -4245,7 +4712,7 @@ this.primevue.dropdown = (function (utils, OverlayEventBus, api, Ripple, Virtual
                 }
             },
             onOverlayClick(event) {
-                OverlayEventBus__default['default'].emit('overlay-click', {
+                OverlayEventBus__default["default"].emit('overlay-click', {
                     originalEvent: event,
                     target: this.$el
                 });
@@ -4303,7 +4770,7 @@ this.primevue.dropdown = (function (utils, OverlayEventBus, api, Ripple, Virtual
             },
             label() {
                 let selectedOption = this.getSelectedOption();
-                if (selectedOption)
+                if (selectedOption !== null)
                     return this.getOptionLabel(selectedOption);
                 else
                     return this.placeholder||'p-emptylabel';
@@ -4341,10 +4808,10 @@ this.primevue.dropdown = (function (utils, OverlayEventBus, api, Ripple, Virtual
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         },
         components: {
-            'VirtualScroller': VirtualScroller__default['default']
+            'VirtualScroller': VirtualScroller__default["default"]
         }
     };
 
@@ -4620,7 +5087,7 @@ this.primevue.dropdown = (function (utils, OverlayEventBus, api, Ripple, Virtual
 
     return script;
 
-}(primevue.utils, primevue.overlayeventbus, primevue.api, primevue.ripple, primevue.virtualscroller, Vue));
+})(primevue.utils, primevue.overlayeventbus, primevue.api, primevue.ripple, primevue.virtualscroller, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.dialog = (function (utils, Ripple, vue) {
@@ -5012,7 +5479,7 @@ this.primevue.dialog = (function (utils, Ripple, vue) {
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         }
     };
 
@@ -5092,8 +5559,7 @@ this.primevue.dialog = (function (utils, Ripple, vue) {
                                       class: "p-dialog-header-icon p-dialog-header-close p-link",
                                       onClick: _cache[2] || (_cache[2] = (...args) => ($options.close && $options.close(...args))),
                                       "aria-label": $props.ariaCloseLabel,
-                                      type: "button",
-                                      tabindex: "-1"
+                                      type: "button"
                                     }, [
                                       _hoisted_2
                                     ], 8, ["aria-label"])), [
@@ -5160,7 +5626,7 @@ this.primevue.dialog = (function (utils, Ripple, vue) {
 
     return script;
 
-}(primevue.utils, primevue.ripple, Vue));
+})(primevue.utils, primevue.ripple, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
@@ -5238,7 +5704,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             directives: {
-                'ripple': Ripple__default['default']
+                'ripple': Ripple__default["default"]
             }
         };
 
@@ -5269,7 +5735,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             directives: {
-                'ripple': Ripple__default['default']
+                'ripple': Ripple__default["default"]
             }
         };
 
@@ -5300,7 +5766,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             directives: {
-                'ripple': Ripple__default['default']
+                'ripple': Ripple__default["default"]
             }
         };
 
@@ -5338,7 +5804,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             directives: {
-                'ripple': Ripple__default['default']
+                'ripple': Ripple__default["default"]
             }
         };
 
@@ -5375,7 +5841,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             directives: {
-                'ripple': Ripple__default['default']
+                'ripple': Ripple__default["default"]
             }
         };
 
@@ -5422,7 +5888,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             components: {
-                'RPPDropdown': Dropdown__default['default']
+                'RPPDropdown': Dropdown__default["default"]
             }
         };
 
@@ -5466,7 +5932,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             components: {
-                'JTPDropdown': Dropdown__default['default']
+                'JTPDropdown': Dropdown__default["default"]
             }
         };
 
@@ -5501,7 +5967,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                 }
             },
             components: {
-                'JTPInput': InputNumber__default['default']
+                'JTPInput': InputNumber__default["default"]
             }
         };
 
@@ -5722,9 +6188,9 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
 
           return ($props.alwaysShow ? true : ($options.pageLinks && $options.pageLinks.length > 1))
             ? (vue.openBlock(), vue.createBlock("div", _hoisted_1, [
-                (_ctx.$slots.left)
+                (_ctx.$slots.start)
                   ? (vue.openBlock(), vue.createBlock("div", _hoisted_2, [
-                      vue.renderSlot(_ctx.$slots, "left", { state: $options.currentState })
+                      vue.renderSlot(_ctx.$slots, "start", { state: $options.currentState })
                     ]))
                   : vue.createCommentVNode("", true),
                 (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($options.templateItems, (item) => {
@@ -5797,9 +6263,9 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
                                       : vue.createCommentVNode("", true)
                   ], 64))
                 }), 128)),
-                (_ctx.$slots.right)
+                (_ctx.$slots.end)
                   ? (vue.openBlock(), vue.createBlock("div", _hoisted_3, [
-                      vue.renderSlot(_ctx.$slots, "right", { state: $options.currentState })
+                      vue.renderSlot(_ctx.$slots, "end", { state: $options.currentState })
                     ]))
                   : vue.createCommentVNode("", true)
               ]))
@@ -5840,7 +6306,7 @@ this.primevue.paginator = (function (vue, Ripple, Dropdown, InputNumber) {
 
         return script;
 
-}(Vue, primevue.ripple, primevue.dropdown, primevue.inputnumber));
+})(Vue, primevue.ripple, primevue.dropdown, primevue.inputnumber);
 
 this.primevue = this.primevue || {};
 this.primevue.tree = (function (utils, Ripple, vue) {
@@ -5880,6 +6346,9 @@ this.primevue.tree = (function (utils, Ripple, vue) {
             toggle() {
                 this.$emit('node-toggle', this.node);
             },
+            label(node) {
+                return (typeof node.label === 'function' ? node.label() : node.label);
+            },
             onChildNodeToggle(node) {
                 this.$emit('node-toggle', node);
             },
@@ -6109,7 +6578,7 @@ this.primevue.tree = (function (utils, Ripple, vue) {
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         }
     };
 
@@ -6168,7 +6637,7 @@ this.primevue.tree = (function (utils, Ripple, vue) {
                   node: $props.node
                 }, null, 8, ["node"]))
               : (vue.openBlock(), vue.createBlock(vue.Fragment, { key: 1 }, [
-                  vue.createTextVNode(vue.toDisplayString($props.node.label), 1)
+                  vue.createTextVNode(vue.toDisplayString($options.label($props.node)), 1)
                 ], 64))
           ])
         ], 46, ["aria-expanded"]),
@@ -6544,14 +7013,14 @@ this.primevue.tree = (function (utils, Ripple, vue) {
       }
     }
 
-    var css_248z = "\n.p-tree-container {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    overflow: auto;\n}\n.p-treenode-children {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n}\n.p-tree-wrapper {\n    overflow: auto;\n}\n.p-treenode-selectable {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-tree-toggler {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-treenode-leaf > .p-treenode-content .p-tree-toggler {\n    visibility: hidden;\n}\n.p-treenode-content {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-tree-filter {\n    width: 100%;\n}\n.p-tree-filter-container {\n    position: relative;\n    display: block;\n    width: 100%;\n}\n.p-tree-filter-icon {\n    position: absolute;\n    top: 50%;\n    margin-top: -.5rem;\n}\n.p-tree-loading {\n    position: relative;\n    min-height: 4rem;\n}\n.p-tree .p-tree-loading-overlay {\n    position: absolute;\n    z-index: 1;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-tree-flex-scrollable {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    height: 100%;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-tree-flex-scrollable .p-tree-wrapper {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n";
+    var css_248z = "\n.p-tree-container {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    overflow: auto;\n}\n.p-treenode-children {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n}\n.p-tree-wrapper {\n    overflow: auto;\n}\n.p-treenode-selectable {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-tree-toggler {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n}\n.p-treenode-leaf > .p-treenode-content .p-tree-toggler {\n    visibility: hidden;\n}\n.p-treenode-content {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-tree-filter {\n    width: 100%;\n}\n.p-tree-filter-container {\n    position: relative;\n    display: block;\n    width: 100%;\n}\n.p-tree-filter-icon {\n    position: absolute;\n    top: 50%;\n    margin-top: -.5rem;\n}\n.p-tree-loading {\n    position: relative;\n    min-height: 4rem;\n}\n.p-tree .p-tree-loading-overlay {\n    position: absolute;\n    z-index: 1;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-tree-flex-scrollable {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    height: 100%;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-tree-flex-scrollable .p-tree-wrapper {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n";
     styleInject(css_248z);
 
     script.render = render;
 
     return script;
 
-}(primevue.utils, primevue.ripple, Vue));
+})(primevue.utils, primevue.ripple, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
@@ -6591,6 +7060,9 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
             },
             disabled(item) {
                 return (typeof item.disabled === 'function' ? item.disabled() : item.disabled);
+            },
+            label() {
+                return (typeof this.item.label === 'function' ? this.item.label() : this.item.label);
             }
         },
         computed: {
@@ -6599,7 +7071,7 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         }
     };
 
@@ -6635,7 +7107,7 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
                             vue.createVNode("span", {
                               class: ['p-menuitem-icon', $props.item.icon]
                             }, null, 2),
-                            vue.createVNode("span", _hoisted_1$1, vue.toDisplayString($props.item.label), 1)
+                            vue.createVNode("span", _hoisted_1$1, vue.toDisplayString($options.label()), 1)
                           ], 10, ["href", "onClick"]), [
                             [_directive_ripple]
                           ])
@@ -6654,7 +7126,7 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
                         vue.createVNode("span", {
                           class: ['p-menuitem-icon', $props.item.icon]
                         }, null, 2),
-                        vue.createVNode("span", _hoisted_2$1, vue.toDisplayString($props.item.label), 1)
+                        vue.createVNode("span", _hoisted_2$1, vue.toDisplayString($options.label()), 1)
                       ], 10, ["href", "target", "tabindex"])), [
                         [_directive_ripple]
                       ])
@@ -6836,11 +7308,14 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
             visible(item) {
                 return (typeof item.visible === 'function' ? item.visible() : item.visible !== false);
             },
+            label(item) {
+                return (typeof item.label === 'function' ? item.label() : item.label);
+            },
             containerRef(el) {
                 this.container = el;
             },
             onOverlayClick(event) {
-                OverlayEventBus__default['default'].emit('overlay-click', {
+                OverlayEventBus__default["default"].emit('overlay-click', {
                     originalEvent: event,
                     target: this.target
                 });
@@ -6894,14 +7369,14 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
                   vue.createVNode("ul", _hoisted_1, [
                     (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.model, (item, i) => {
                       return (vue.openBlock(), vue.createBlock(vue.Fragment, {
-                        key: item.label + i.toString()
+                        key: $options.label(item) + i.toString()
                       }, [
                         (item.items && $options.visible(item) && !item.separator)
                           ? (vue.openBlock(), vue.createBlock(vue.Fragment, { key: 0 }, [
                               (item.items)
                                 ? (vue.openBlock(), vue.createBlock("li", _hoisted_2, [
                                     vue.renderSlot(_ctx.$slots, "item", { item: item }, () => [
-                                      vue.createTextVNode(vue.toDisplayString(item.label), 1)
+                                      vue.createTextVNode(vue.toDisplayString($options.label(item)), 1)
                                     ])
                                   ]))
                                 : vue.createCommentVNode("", true),
@@ -6936,7 +7411,7 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
                                 role: "separator"
                               }, null, 6))
                             : (vue.openBlock(), vue.createBlock(_component_Menuitem, {
-                                key: item.label + i.toString(),
+                                key: $options.label(item) + i.toString(),
                                 item: item,
                                 onClick: $options.itemClick,
                                 template: _ctx.$slots.item,
@@ -6987,7 +7462,7 @@ this.primevue.menu = (function (utils, OverlayEventBus, Ripple, vue) {
 
     return script;
 
-}(primevue.utils, primevue.overlayeventbus, primevue.ripple, Vue));
+})(primevue.utils, primevue.overlayeventbus, primevue.ripple, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
@@ -7199,6 +7674,9 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
             },
             disabled(item) {
                 return (typeof item.disabled === 'function' ? item.disabled() : item.disabled);
+            },
+            label(item) {
+                return (typeof item.label === 'function' ? item.label() : item.label);
             }
         },
         computed: {
@@ -7207,7 +7685,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         }
     };
 
@@ -7231,7 +7709,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
       }, [
         (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.model, (item, i) => {
           return (vue.openBlock(), vue.createBlock(vue.Fragment, {
-            key: item.label + i.toString()
+            key: $options.label(item) + i.toString()
           }, [
             ($options.visible(item) && !item.separator)
               ? (vue.openBlock(), vue.createBlock("li", {
@@ -7260,7 +7738,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                                   vue.createVNode("span", {
                                     class: ['p-menuitem-icon', item.icon]
                                   }, null, 2),
-                                  vue.createVNode("span", _hoisted_1, vue.toDisplayString(item.label), 1)
+                                  vue.createVNode("span", _hoisted_1, vue.toDisplayString($options.label(item)), 1)
                                 ], 42, ["href", "onClick", "onKeydown"]), [
                                   [_directive_ripple]
                                 ])
@@ -7282,7 +7760,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                               vue.createVNode("span", {
                                 class: ['p-menuitem-icon', item.icon]
                               }, null, 2),
-                              vue.createVNode("span", _hoisted_2, vue.toDisplayString(item.label), 1),
+                              vue.createVNode("span", _hoisted_2, vue.toDisplayString($options.label(item)), 1),
                               (item.items)
                                 ? (vue.openBlock(), vue.createBlock("span", _hoisted_3))
                                 : vue.createCommentVNode("", true)
@@ -7297,7 +7775,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                   ($options.visible(item) && item.items)
                     ? (vue.openBlock(), vue.createBlock(_component_TieredMenuSub, {
                         model: item.items,
-                        key: item.label + '_sub_',
+                        key: $options.label(item) + '_sub_',
                         template: $props.template,
                         onLeafClick: $options.onLeafClick,
                         onKeydownItem: $options.onChildItemKeyDown,
@@ -7481,7 +7959,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                 this.container = el;
             },
             onOverlayClick(event) {
-                OverlayEventBus__default['default'].emit('overlay-click', {
+                OverlayEventBus__default["default"].emit('overlay-click', {
                     originalEvent: event,
                     target: this.target
                 });
@@ -7573,5 +8051,5 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
 
     return script;
 
-}(primevue.utils, primevue.overlayeventbus, primevue.ripple, Vue));
+})(primevue.utils, primevue.overlayeventbus, primevue.ripple, Vue);