primereact 8.0.1 → 8.2.0

package/core/core.js

@@ -997,6 +997,21 @@ this.primereact.utils = (function (exports, React) {
         var focusableElements = DomHandler.getFocusableElements(element, selector);
         return focusableElements.length > 0 ? focusableElements[focusableElements.length - 1] : null;
       }
+      /**
+       * Focus an input element if it does not already have focus.
+       *
+       * @param {HTMLElement} el a HTML element
+       * @param {boolean} scrollTo flag to control whether to scroll to the element, false by default
+       */
+
+    }, {
+      key: "focus",
+      value: function focus(el, scrollTo) {
+        var preventScroll = scrollTo === undefined ? true : !scrollTo;
+        el && document.activeElement !== el && el.focus({
+          preventScroll: preventScroll
+        });
+      }
     }, {
       key: "getCursorOffset",
       value: function getCursorOffset(el, prevText, nextText, currentText) {
@@ -1407,12 +1422,9 @@ this.primereact.utils = (function (exports, React) {
 
     var onBlur = function onBlur(e) {
       checkVal();
+      options.onBlur && options.onBlur(e);
       updateModel(e);
 
-      if (options.onBlur) {
-        options.onBlur(e);
-      }
-
       if (el.value !== focusText) {
         var event = document.createEvent('HTMLEvents');
         event.initEvent('change', true, false);
@@ -1948,7 +1960,11 @@ this.primereact.utils = (function (exports, React) {
         var order = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
         var locale = arguments.length > 3 ? arguments[3] : undefined;
         var result = null;
-        if (value1 == null && value2 != null) result = -1;else if (value1 != null && value2 == null) result = 1;else if (value1 == null && value2 == null) result = 0;else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, locale, {
+        var emptyValue1 = this.isEmpty(value1);
+        var emptyValue2 = this.isEmpty(value2);
+        if (emptyValue1 && emptyValue2) result = 0;else if (emptyValue1) result = order; // sort nulls at bottom like Excel
+        else if (emptyValue2) result = -order; // sort nulls at bottom like Excel
+        else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, locale, {
           numeric: true
         });else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
         return order * result;
@@ -2254,7 +2270,17 @@ this.primereact.api = (function (exports, utils) {
       strong: 'Strong',
       passwordPrompt: 'Enter a password',
       emptyFilterMessage: 'No available options',
-      emptyMessage: 'No results found'
+      emptyMessage: 'No results found',
+      aria: {
+        trueLabel: 'True',
+        falseLabel: 'False',
+        nullLabel: 'Not Selected',
+        pageLabel: 'Page',
+        firstPageLabel: 'First Page',
+        lastPageLabel: 'Last Page',
+        nextPageLabel: 'Next Page',
+        previousPageLabel: 'Previous Page'
+      }
     }
   };
 
@@ -2290,6 +2316,16 @@ this.primereact.api = (function (exports, utils) {
     }
   }
 
+  function ariaLabel(key) {
+    var _locale = PrimeReact.locale;
+
+    try {
+      return localeOptions(_locale)['aria'][key];
+    } catch (error) {
+      throw new Error("The ".concat(key, " option is not found in the current locale('").concat(_locale, "')."));
+    }
+  }
+
   function localeOptions(locale) {
     var _locale = locale || PrimeReact.locale;
 
@@ -2791,6 +2827,7 @@ this.primereact.api = (function (exports, utils) {
   exports.MessageSeverity = MessageSeverity;
   exports.PrimeIcons = PrimeIcons;
   exports.addLocale = addLocale;
+  exports.ariaLabel = ariaLabel;
   exports["default"] = PrimeReact;
   exports.locale = locale;
   exports.localeOption = localeOption;
@@ -3186,9 +3223,25 @@ this.primereact.hooks = (function (exports, React, utils) {
 
     var useStorage = function useStorage(initialValue, key) {
       var storage = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'local';
-      // Since the local storage API isn't available in server-rendering environments, 
+      // Since the local storage API isn't available in server-rendering environments,
       // we check that typeof window !== 'undefined' to make SSR and SSG work properly.
-      var storageAvailable = typeof window !== 'undefined';
+      var storageAvailable = typeof window !== 'undefined'; // subscribe to window storage event so changes in one tab to a stored value
+      // are properly reflected in all tabs
+
+      var _useEventListener = useEventListener({
+        target: 'window',
+        type: 'storage',
+        listener: function listener(event) {
+          var area = storage === 'local' ? window.localStorage : window.sessionStorage;
+
+          if (event.storageArea === area && event.key === key) {
+            setStoredValue(event.newValue || undefined);
+          }
+        }
+      }),
+          _useEventListener2 = _slicedToArray(_useEventListener, 2),
+          bindWindowStorageListener = _useEventListener2[0],
+          unbindWindowStorageListener = _useEventListener2[1];
 
       var _React$useState = React__namespace.useState(function () {
         if (!storageAvailable) {
@@ -3222,8 +3275,36 @@ this.primereact.hooks = (function (exports, React, utils) {
         }
       };
 
+      React__namespace.useEffect(function () {
+        bindWindowStorageListener();
+        return function () {
+          return unbindWindowStorageListener();
+        };
+      }, []);
       return [storedValue, setValue];
     };
+    /**
+     * Hook to wrap around useState that stores the value in the browser local storage.
+     *
+     * @param {any} initialValue the initial value to store
+     * @param {string} key the key to store the value in local storage
+     * @returns a stateful value, and a function to update it.
+     */
+
+    var useLocalStorage = function useLocalStorage(initialValue, key) {
+      return useStorage(initialValue, key, 'local');
+    };
+    /**
+     * Hook to wrap around useState that stores the value in the browser session storage.
+     *
+     * @param {any} initialValue the initial value to store
+     * @param {string} key the key to store the value in session storage
+     * @returns a stateful value, and a function to update it.
+     */
+
+    var useSessionStorage = function useSessionStorage(initialValue, key) {
+      return useStorage(initialValue, key, 'session');
+    };
     /* eslint-enable */
 
     /* eslint-disable */
@@ -3259,11 +3340,13 @@ this.primereact.hooks = (function (exports, React, utils) {
 
     exports.useEventListener = useEventListener;
     exports.useInterval = useInterval;
+    exports.useLocalStorage = useLocalStorage;
     exports.useMountEffect = useMountEffect;
     exports.useOverlayListener = useOverlayListener;
     exports.useOverlayScrollListener = useOverlayScrollListener;
     exports.usePrevious = usePrevious;
     exports.useResizeListener = useResizeListener;
+    exports.useSessionStorage = useSessionStorage;
     exports.useStorage = useStorage;
     exports.useTimeout = useTimeout;
     exports.useUnmountEffect = useUnmountEffect;
@@ -3969,6 +4052,11 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
         positionState = _React$useState4[0],
         setPositionState = _React$useState4[1];
 
+    var _React$useState5 = React__namespace.useState(''),
+        _React$useState6 = _slicedToArray(_React$useState5, 2),
+        classNameState = _React$useState6[0],
+        setClassNameState = _React$useState6[1];
+
     var elementRef = React__namespace.useRef(null);
     var textRef = React__namespace.useRef(null);
     var currentTargetRef = React__namespace.useRef(null);
@@ -4087,7 +4175,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
         return;
       }
 
-      var updateTooltipState = function updateTooltipState() {
+      var updateTooltipState = function updateTooltipState(position) {
         updateText(currentTargetRef.current, function () {
           if (props.autoZIndex && !utils.ZIndexUtils.get(elementRef.current)) {
             utils.ZIndexUtils.set('tooltip', elementRef.current, PrimeReact__default["default"].autoZIndex, props.baseZIndex || PrimeReact__default["default"].zIndex['tooltip']);
@@ -4110,7 +4198,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
           align(currentTargetRef.current, {
             x: e.pageX,
             y: e.pageY
-          });
+          }, position);
         });
       };
 
@@ -4125,16 +4213,16 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
 
         if (success) {
           applyDelay('showDelay', function () {
+            var position = getPosition(currentTargetRef.current);
+            var classname = getTargetOption(currentTargetRef.current, 'classname');
             setVisibleState(true);
-            setPositionState(getPosition(currentTargetRef.current));
-            setTimeout(function () {
-              return updateTooltipState();
-            }, 0);
+            setPositionState(position);
+            setClassNameState(classname);
+            updateTooltipState(position);
             sendCallback(props.onShow, {
               originalEvent: e,
               target: currentTargetRef.current
             });
-            utils.DomHandler.addClass(currentTargetRef.current, getTargetOption(currentTargetRef.current, 'classname'));
           });
         }
       }
@@ -4144,7 +4232,6 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
       clearTimeouts();
 
       if (visibleState) {
-        utils.DomHandler.removeClass(currentTargetRef.current, getTargetOption(currentTargetRef.current, 'classname'));
         var success = sendCallback(props.onBeforeHide, {
           originalEvent: e,
           target: currentTargetRef.current
@@ -4160,6 +4247,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
             utils.DomHandler.removeClass(elementRef.current, 'p-tooltip-active');
             setVisibleState(false);
             setPositionState(props.position);
+            setClassNameState('');
             currentTargetRef.current = null;
             containerSize.current = null;
             allowHide.current = true;
@@ -4172,9 +4260,10 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
       }
     };
 
-    var align = function align(target, coordinate) {
+    var align = function align(target, coordinate, position) {
       var left = 0,
-          top = 0;
+          top = 0,
+          currentPosition = position || positionState;
 
       if (isMouseTrack(target) && coordinate) {
         var _containerSize = {
@@ -4188,7 +4277,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
             mouseTrackTop = _getMouseTrackPositio.top,
             mouseTrackLeft = _getMouseTrackPositio.left;
 
-        switch (positionState) {
+        switch (currentPosition) {
           case 'left':
             left -= _containerSize.width + mouseTrackLeft;
             top -= _containerSize.height / 2 - mouseTrackTop;
@@ -4221,28 +4310,28 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
         elementRef.current.style.top = top + 'px';
         utils.DomHandler.addClass(elementRef.current, 'p-tooltip-active');
       } else {
-        var pos = utils.DomHandler.findCollisionPosition(positionState);
+        var pos = utils.DomHandler.findCollisionPosition(currentPosition);
         var my = getTargetOption(target, 'my') || props.my || pos.my;
         var at = getTargetOption(target, 'at') || props.at || pos.at;
         elementRef.current.style.padding = '0px';
-        utils.DomHandler.flipfitCollision(elementRef.current, target, my, at, function (currentPosition) {
-          var _currentPosition$at = currentPosition.at,
-              atX = _currentPosition$at.x,
-              atY = _currentPosition$at.y;
-          var myX = currentPosition.my.x;
-          var newPosition = props.at ? atX !== 'center' && atX !== myX ? atX : atY : currentPosition.at["".concat(pos.axis)];
+        utils.DomHandler.flipfitCollision(elementRef.current, target, my, at, function (calculatedPosition) {
+          var _calculatedPosition$a = calculatedPosition.at,
+              atX = _calculatedPosition$a.x,
+              atY = _calculatedPosition$a.y;
+          var myX = calculatedPosition.my.x;
+          var newPosition = props.at ? atX !== 'center' && atX !== myX ? atX : atY : calculatedPosition.at["".concat(pos.axis)];
           elementRef.current.style.padding = '';
           setPositionState(newPosition);
-          updateContainerPosition();
+          updateContainerPosition(newPosition);
           utils.DomHandler.addClass(elementRef.current, 'p-tooltip-active');
         });
       }
     };
 
-    var updateContainerPosition = function updateContainerPosition() {
+    var updateContainerPosition = function updateContainerPosition(position) {
       if (elementRef.current) {
         var style = getComputedStyle(elementRef.current);
-        if (positionState === 'left') elementRef.current.style.left = parseFloat(style.left) - parseFloat(style.paddingLeft) * 2 + 'px';else if (positionState === 'top') elementRef.current.style.top = parseFloat(style.top) - parseFloat(style.paddingTop) * 2 + 'px';
+        if (position === 'left') elementRef.current.style.left = parseFloat(style.left) - parseFloat(style.paddingLeft) * 2 + 'px';else if (position === 'top') elementRef.current.style.top = parseFloat(style.top) - parseFloat(style.paddingTop) * 2 + 'px';
       }
     };
 
@@ -4428,7 +4517,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, hooks, portal,
 
     var createElement = function createElement() {
       var otherProps = utils.ObjectUtils.findDiffKeys(props, Tooltip.defaultProps);
-      var tooltipClassName = utils.classNames('p-tooltip p-component', _defineProperty({}, "p-tooltip-".concat(positionState), true), props.className);
+      var tooltipClassName = utils.classNames('p-tooltip p-component', _defineProperty({}, "p-tooltip-".concat(positionState), true), props.className, classNameState);
       var empty = isTargetContentEmpty(currentTargetRef.current);
       return /*#__PURE__*/React__namespace.createElement("div", _extends({
         id: props.id,
@@ -4654,7 +4743,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         numToleratedItemsState = _React$useState8[0],
         setNumToleratedItemsState = _React$useState8[1];
 
-    var _React$useState9 = React__namespace.useState(props.loading),
+    var _React$useState9 = React__namespace.useState(props.loading || false),
         _React$useState10 = _slicedToArray(_React$useState9, 2),
         loadingState = _React$useState10[0],
         setLoadingState = _React$useState10[1];
@@ -4677,10 +4766,39 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       left: 0
     } : 0);
     var scrollTimeout = React__namespace.useRef(null);
+    var resizeTimeout = React__namespace.useRef(null);
+    var defaultWidth = React__namespace.useRef(null);
+    var defaultHeight = React__namespace.useRef(null);
     var prevItems = hooks.usePrevious(props.items);
     var prevLoading = hooks.usePrevious(props.loading);
 
+    var _useResizeListener = hooks.useResizeListener({
+      listener: function listener(event) {
+        return onResize(event);
+      }
+    }),
+        _useResizeListener2 = _slicedToArray(_useResizeListener, 1),
+        bindWindowResizeListener = _useResizeListener2[0];
+
+    var _useEventListener = hooks.useEventListener({
+      target: 'window',
+      type: 'orientationchange',
+      listener: function listener(event) {
+        return onResize(event);
+      }
+    }),
+        _useEventListener2 = _slicedToArray(_useEventListener, 1),
+        bindOrientationChangeListener = _useEventListener2[0];
+
+    var getElementRef = function getElementRef() {
+      return elementRef;
+    };
+
     var scrollTo = function scrollTo(options) {
+      lastScrollPos.current = both ? {
+        top: 0,
+        left: 0
+      } : 0;
       elementRef.current && elementRef.current.scrollTo(options);
     };
 
@@ -4690,9 +4808,6 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       var _calculateNumItems = calculateNumItems(),
           numToleratedItems = _calculateNumItems.numToleratedItems;
 
-      var itemSize = props.itemSize;
-      var contentPos = getContentPosition();
-
       var calculateFirst = function calculateFirst() {
         var _index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
 
@@ -4701,8 +4816,8 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         return _index <= _numT ? 0 : _index;
       };
 
-      var calculateCoord = function calculateCoord(_first, _size, _cpos) {
-        return _first * _size + _cpos;
+      var calculateCoord = function calculateCoord(_first, _size) {
+        return _first * _size;
       };
 
       var scrollToItem = function scrollToItem() {
@@ -4722,15 +4837,13 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         };
 
         if (newFirst.rows !== firstState.rows || newFirst.cols !== firstState.cols) {
-          scrollToItem(calculateCoord(newFirst.cols, itemSize[1], contentPos.left), calculateCoord(newFirst.rows, itemSize[0], contentPos.top));
-          setFirstState(newFirst);
+          scrollToItem(calculateCoord(newFirst.cols, props.itemSize[1]), calculateCoord(newFirst.rows, props.itemSize[0]));
         }
       } else {
         var _newFirst = calculateFirst(index, numToleratedItems);
 
         if (_newFirst !== firstState) {
-          horizontal ? scrollToItem(calculateCoord(_newFirst, itemSize, contentPos.left), 0) : scrollToItem(0, calculateCoord(_newFirst, itemSize, contentPos.top));
-          setFirstState(_newFirst);
+          horizontal ? scrollToItem(calculateCoord(_newFirst, props.itemSize), 0) : scrollToItem(0, calculateCoord(_newFirst, props.itemSize));
         }
       }
     };
@@ -4743,8 +4856,6 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
             first = _getRenderedRange.first,
             viewport = _getRenderedRange.viewport;
 
-        var itemSize = props.itemSize;
-
         var scrollToItem = function scrollToItem() {
           var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
           var top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
@@ -4761,26 +4872,26 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         if (isToStart) {
           if (both) {
             if (viewport.first.rows - first.rows > index[0]) {
-              scrollToItem(viewport.first.cols * itemSize, (viewport.first.rows - 1) * itemSize);
+              scrollToItem(viewport.first.cols * props.itemSize[1], (viewport.first.rows - 1) * props.itemSize[0]);
             } else if (viewport.first.cols - first.cols > index[1]) {
-              scrollToItem((viewport.first.cols - 1) * itemSize, viewport.first.rows * itemSize);
+              scrollToItem((viewport.first.cols - 1) * props.itemSize[1], viewport.first.rows * props.itemSize[0]);
             }
           } else {
             if (viewport.first - first > index) {
-              var pos = (viewport.first - 1) * itemSize;
+              var pos = (viewport.first - 1) * props.itemSize;
               horizontal ? scrollToItem(pos, 0) : scrollToItem(0, pos);
             }
           }
         } else if (isToEnd) {
           if (both) {
             if (viewport.last.rows - first.rows <= index[0] + 1) {
-              scrollToItem(viewport.first.cols * itemSize, (viewport.first.rows + 1) * itemSize);
+              scrollToItem(viewport.first.cols * props.itemSize[1], (viewport.first.rows + 1) * props.itemSize[0]);
             } else if (viewport.last.cols - first.cols <= index[1] + 1) {
-              scrollToItem((viewport.first.cols + 1) * itemSize, viewport.first.rows * itemSize);
+              scrollToItem((viewport.first.cols + 1) * props.itemSize[1], viewport.first.rows * props.itemSize[0]);
             }
           } else {
             if (viewport.last - first <= index + 1) {
-              var _pos2 = (viewport.first + 1) * itemSize;
+              var _pos2 = (viewport.first + 1) * props.itemSize;
 
               horizontal ? scrollToItem(_pos2, 0) : scrollToItem(0, _pos2);
             }
@@ -4796,18 +4907,14 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     };
 
     var getColumns = function getColumns() {
-      if (props.columns) {
-        if (both || horizontal) {
-          return loadingState && props.loaderDisabled ? both ? loaderArrState[0] : loaderArrState : props.columns.slice(both ? firstState.cols : firstState, both ? lastState.cols : lastState);
-        }
+      if (props.columns && both || horizontal) {
+        return loadingState && props.loaderDisabled ? both ? loaderArrState[0] : loaderArrState : props.columns.slice(both ? firstState.cols : firstState, both ? lastState.cols : lastState);
       }
 
       return props.columns;
     };
 
     var getRenderedRange = function getRenderedRange() {
-      var itemSize = props.itemSize;
-
       var calculateFirstInViewport = function calculateFirstInViewport(_pos, _size) {
         return Math.floor(_pos / (_size || _pos));
       };
@@ -4816,13 +4923,14 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       var lastInViewport = 0;
 
       if (elementRef.current) {
-        var scrollTop = elementRef.current.scrollTop;
-        var scrollLeft = elementRef.current.scrollLeft;
+        var _elementRef$current = elementRef.current,
+            scrollTop = _elementRef$current.scrollTop,
+            scrollLeft = _elementRef$current.scrollLeft;
 
         if (both) {
           firstInViewport = {
-            rows: calculateFirstInViewport(scrollTop, itemSize[0]),
-            cols: calculateFirstInViewport(scrollLeft, itemSize[1])
+            rows: calculateFirstInViewport(scrollTop, props.itemSize[0]),
+            cols: calculateFirstInViewport(scrollLeft, props.itemSize[1])
           };
           lastInViewport = {
             rows: firstInViewport.rows + numItemsInViewportState.rows,
@@ -4830,7 +4938,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
           };
         } else {
           var scrollPos = horizontal ? scrollLeft : scrollTop;
-          firstInViewport = calculateFirstInViewport(scrollPos, itemSize);
+          firstInViewport = calculateFirstInViewport(scrollPos, props.itemSize);
           lastInViewport = firstInViewport + numItemsInViewportState;
         }
       }
@@ -4846,7 +4954,6 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     };
 
     var calculateNumItems = function calculateNumItems() {
-      var itemSize = props.itemSize;
       var contentPos = getContentPosition();
       var contentWidth = elementRef.current ? elementRef.current.offsetWidth - contentPos.left : 0;
       var contentHeight = elementRef.current ? elementRef.current.offsetHeight - contentPos.top : 0;
@@ -4860,9 +4967,9 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       };
 
       var numItemsInViewport = both ? {
-        rows: calculateNumItemsInViewport(contentHeight, itemSize[0]),
-        cols: calculateNumItemsInViewport(contentWidth, itemSize[1])
-      } : calculateNumItemsInViewport(horizontal ? contentWidth : contentHeight, itemSize);
+        rows: calculateNumItemsInViewport(contentHeight, props.itemSize[0]),
+        cols: calculateNumItemsInViewport(contentWidth, props.itemSize[1])
+      } : calculateNumItemsInViewport(horizontal ? contentWidth : contentHeight, props.itemSize);
       var numToleratedItems = numToleratedItemsState || (both ? [calculateNumToleratedItems(numItemsInViewport.rows), calculateNumToleratedItems(numItemsInViewport.cols)] : calculateNumToleratedItems(numItemsInViewport));
       return {
         numItemsInViewport: numItemsInViewport,
@@ -4907,15 +5014,26 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       }
     };
 
+    var calculateAutoSize = function calculateAutoSize(loading) {
+      if (props.autoSize && !loading) {
+        Promise.resolve().then(function () {
+          if (_contentRef.current) {
+            _contentRef.current.style.minHeight = _contentRef.current.style.minWidth = 'auto';
+            var _contentRef$current = _contentRef.current,
+                offsetWidth = _contentRef$current.offsetWidth,
+                offsetHeight = _contentRef$current.offsetHeight;
+            (both || horizontal) && (elementRef.current.style.width = (offsetWidth < defaultWidth.current ? offsetWidth : defaultWidth.current) + 'px');
+            (both || vertical) && (elementRef.current.style.height = (offsetHeight < defaultHeight.current ? offsetHeight : defaultHeight.current) + 'px');
+            _contentRef.current.style.minHeight = _contentRef.current.style.minWidth = '';
+          }
+        });
+      }
+    };
+
     var getLast = function getLast() {
       var last = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
       var isCols = arguments.length > 1 ? arguments[1] : undefined;
-
-      if (props.items) {
-        return Math.min(isCols ? (props.columns || props.items[0]).length : props.items.length, last);
-      }
-
-      return 0;
+      return props.items ? Math.min(isCols ? (props.columns || props.items[0]).length : props.items.length, last) : 0;
     };
 
     var getContentPosition = function getContentPosition() {
@@ -4968,7 +5086,6 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       var items = props.items;
 
       if (_spacerRef.current && items) {
-        var itemSize = props.itemSize;
         var contentPos = getContentPosition();
 
         var setProp = function setProp(_name, _value, _size) {
@@ -4978,10 +5095,10 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         };
 
         if (both) {
-          setProp('height', items, itemSize[0], contentPos.y);
-          setProp('width', props.columns || items[1], itemSize[1], contentPos.x);
+          setProp('height', items, props.itemSize[0], contentPos.y);
+          setProp('width', props.columns || items[1], props.itemSize[1], contentPos.x);
         } else {
-          horizontal ? setProp('width', props.columns || items, itemSize, contentPos.x) : setProp('height', items, itemSize, contentPos.y);
+          horizontal ? setProp('width', props.columns || items, props.itemSize, contentPos.x) : setProp('height', items, props.itemSize, contentPos.y);
         }
       }
     };
@@ -4989,7 +5106,6 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     var setContentPosition = function setContentPosition(pos) {
       if (_contentRef.current) {
         var first = pos ? pos.first : firstState;
-        var itemSize = props.itemSize;
 
         var calculateTranslateVal = function calculateTranslateVal(_first, _size) {
           return _first * _size;
@@ -5005,9 +5121,9 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         };
 
         if (both) {
-          setTransform(calculateTranslateVal(first.cols, itemSize[1]), calculateTranslateVal(first.rows, itemSize[0]));
+          setTransform(calculateTranslateVal(first.cols, props.itemSize[1]), calculateTranslateVal(first.rows, props.itemSize[0]));
         } else {
-          var translateVal = calculateTranslateVal(first, itemSize);
+          var translateVal = calculateTranslateVal(first, props.itemSize);
           horizontal ? setTransform(translateVal, 0) : setTransform(0, translateVal);
         }
       }
@@ -5015,7 +5131,6 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
 
     var onScrollPositionChange = function onScrollPositionChange(event) {
       var target = event.target;
-      var itemSize = props.itemSize;
       var contentPos = getContentPosition();
 
       var calculateScrollPos = function calculateScrollPos(_pos, _cpos) {
@@ -5046,16 +5161,20 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
 
       var scrollTop = calculateScrollPos(target.scrollTop, contentPos.top);
       var scrollLeft = calculateScrollPos(target.scrollLeft, contentPos.left);
-      var newFirst = 0;
+      var newFirst = both ? {
+        rows: 0,
+        cols: 0
+      } : 0;
       var newLast = lastState;
       var isRangeChanged = false;
+      var newScrollPos = lastScrollPos.current;
 
       if (both) {
         var isScrollDown = lastScrollPos.current.top <= scrollTop;
         var isScrollRight = lastScrollPos.current.left <= scrollLeft;
         var currentIndex = {
-          rows: calculateCurrentIndex(scrollTop, itemSize[0]),
-          cols: calculateCurrentIndex(scrollLeft, itemSize[1])
+          rows: calculateCurrentIndex(scrollTop, props.itemSize[0]),
+          cols: calculateCurrentIndex(scrollLeft, props.itemSize[1])
         };
         var triggerIndex = {
           rows: calculateTriggerIndex(currentIndex.rows, firstState.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0], isScrollDown),
@@ -5069,8 +5188,8 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
           rows: calculateLast(currentIndex.rows, newFirst.rows, lastState.rows, numItemsInViewportState.rows, numToleratedItemsState[0]),
           cols: calculateLast(currentIndex.cols, newFirst.cols, lastState.cols, numItemsInViewportState.cols, numToleratedItemsState[1], true)
         };
-        isRangeChanged = newFirst.rows !== firstState.rows && newLast.rows !== lastState.rows || newFirst.cols !== firstState.cols && newLast.cols !== lastState.cols;
-        lastScrollPos.current = {
+        isRangeChanged = newFirst.rows !== firstState.rows || newLast.rows !== lastState.rows || newFirst.cols !== firstState.cols || newLast.cols !== lastState.cols;
+        newScrollPos = {
           top: scrollTop,
           left: scrollLeft
         };
@@ -5078,20 +5197,21 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         var scrollPos = horizontal ? scrollLeft : scrollTop;
         var isScrollDownOrRight = lastScrollPos.current <= scrollPos;
 
-        var _currentIndex2 = calculateCurrentIndex(scrollPos, itemSize);
+        var _currentIndex2 = calculateCurrentIndex(scrollPos, props.itemSize);
 
         var _triggerIndex2 = calculateTriggerIndex(_currentIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
 
         newFirst = calculateFirst(_currentIndex2, _triggerIndex2, firstState, lastState, numItemsInViewportState, numToleratedItemsState, isScrollDownOrRight);
         newLast = calculateLast(_currentIndex2, newFirst, lastState, numItemsInViewportState, numToleratedItemsState);
-        isRangeChanged = newFirst !== firstState && newLast !== lastState;
-        lastScrollPos.current = scrollPos;
+        isRangeChanged = newFirst !== firstState || newLast !== lastState;
+        newScrollPos = scrollPos;
       }
 
       return {
         first: newFirst,
         last: newLast,
-        isRangeChanged: isRangeChanged
+        isRangeChanged: isRangeChanged,
+        scrollPos: newScrollPos
       };
     };
 
@@ -5099,7 +5219,8 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       var _onScrollPositionChan = onScrollPositionChange(event),
           first = _onScrollPositionChan.first,
           last = _onScrollPositionChan.last,
-          isRangeChanged = _onScrollPositionChan.isRangeChanged;
+          isRangeChanged = _onScrollPositionChan.isRangeChanged,
+          scrollPos = _onScrollPositionChan.scrollPos;
 
       if (isRangeChanged) {
         var newState = {
@@ -5109,6 +5230,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         setContentPosition(newState);
         setFirstState(first);
         setLastState(last);
+        lastScrollPos.current = scrollPos;
         props.onScrollIndexChange && props.onScrollIndexChange(newState);
 
         if (props.lazy) {
@@ -5135,7 +5257,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
         scrollTimeout.current = setTimeout(function () {
           onScrollChange(event);
 
-          if (loadingState && props.showLoader && !props.lazy) {
+          if (loadingState && props.showLoader && (!props.lazy || props.loading === undefined)) {
             setLoadingState(false);
           }
         }, props.delay);
@@ -5144,10 +5266,32 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
       }
     };
 
+    var onResize = function onResize() {
+      if (resizeTimeout.current) {
+        clearTimeout(resizeTimeout.current);
+      }
+
+      resizeTimeout.current = setTimeout(function () {
+        if (elementRef.current) {
+          var _ref = [utils.DomHandler.getWidth(elementRef.current), utils.DomHandler.getHeight(elementRef.current)],
+              width = _ref[0],
+              height = _ref[1];
+          var isDiffWidth = width !== defaultWidth.current,
+              isDiffHeight = height !== defaultHeight.current;
+          var reinit = both ? isDiffWidth || isDiffHeight : horizontal ? isDiffWidth : vertical ? isDiffHeight : false;
+
+          if (reinit) {
+            setNumToleratedItemsState(props.numToleratedItems);
+            defaultWidth.current = width;
+            defaultHeight.current = height;
+          }
+        }
+      }, props.resizeDelay);
+    };
+
     var getOptions = function getOptions(renderedIndex) {
-      var first = firstState;
       var count = (props.items || []).length;
-      var index = both ? first.rows + renderedIndex : first + renderedIndex;
+      var index = both ? firstState.rows + renderedIndex : firstState + renderedIndex;
       return {
         index: index,
         count: count,
@@ -5185,25 +5329,48 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     };
 
     var init = function init() {
-      setSize();
-      calculateOptions();
-      setSpacerSize();
+      if (!props.disabled) {
+        setSize();
+        calculateOptions();
+        setSpacerSize();
+      }
     };
 
     hooks.useMountEffect(function () {
-      init();
+      if (!props.disabled) {
+        init();
+        bindWindowResizeListener();
+        bindOrientationChangeListener();
+        defaultWidth.current = utils.DomHandler.getWidth(elementRef.current);
+        defaultHeight.current = utils.DomHandler.getHeight(elementRef.current);
+      }
     });
     hooks.useUpdateEffect(function () {
       init();
     }, [props.itemSize, props.scrollHeight]);
+    hooks.useUpdateEffect(function () {
+      if (props.numToleratedItems !== numToleratedItemsState) {
+        setNumToleratedItemsState(props.numToleratedItems);
+      }
+    }, [props.numToleratedItems]);
+    hooks.useUpdateEffect(function () {
+      if (props.numToleratedItems === numToleratedItemsState) {
+        init(); // reinit after resizing
+      }
+    }, [numToleratedItemsState]);
     hooks.useUpdateEffect(function () {
       if (!prevItems || prevItems.length !== (props.items || []).length) {
         init();
       }
 
+      var loading = loadingState;
+
       if (props.lazy && prevLoading !== props.loading && props.loading !== loadingState) {
         setLoadingState(props.loading);
+        loading = props.loading;
       }
+
+      calculateAutoSize(loading);
     });
     hooks.useUpdateEffect(function () {
       lastScrollPos.current = both ? {
@@ -5213,6 +5380,7 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     }, [props.orientation]);
     React__namespace.useImperativeHandle(ref, function () {
       return {
+        getElementRef: getElementRef,
         scrollTo: scrollTo,
         scrollToIndex: scrollToIndex,
         scrollInView: scrollInView,
@@ -5244,6 +5412,13 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
               numCols: numItemsInViewportState.cols
             });
           });
+        } else if (props.loaderIconTemplate) {
+          var defaultContentOptions = {
+            className: 'p-virtualscroller-loading-icon',
+            element: content,
+            props: props
+          };
+          content = utils.ObjectUtils.getJSXElement(props.loaderIconTemplate, defaultContentOptions);
         }
 
         return /*#__PURE__*/React__namespace.createElement("div", {
@@ -5366,14 +5541,17 @@ this.primereact.virtualscroller = (function (exports, React, hooks, utils) {
     orientation: 'vertical',
     numToleratedItems: null,
     delay: 0,
+    resizeDelay: 10,
     lazy: false,
     disabled: false,
     loaderDisabled: false,
     columns: null,
-    loading: false,
+    loading: undefined,
+    autoSize: false,
     showSpacer: true,
     showLoader: false,
     loadingTemplate: null,
+    loaderIconTemplate: null,
     itemTemplate: null,
     contentTemplate: null,
     onScroll: null,
@@ -5549,8 +5727,7 @@ this.primereact.checkbox = (function (exports, React, hooks, tooltip, utils) {
           }
         });
         inputRef.current.checked = !_checked;
-        inputRef.current.focus();
-        event.preventDefault();
+        utils.DomHandler.focus(inputRef.current);
       }
     };
 
@@ -5772,7 +5949,7 @@ this.primereact.button = (function (exports, React, ripple, tooltip, utils) {
     var icon = createIcon();
     var label = createLabel();
     var badge = createBadge();
-    var defaultAriaLabel = props.label ? props.label + (props.badge ? ' ' + props.badge : '') : '';
+    var defaultAriaLabel = props.label ? props.label + (props.badge ? ' ' + props.badge : '') : props['aria-label'];
     return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("button", _extends({
       ref: elementRef,
       "aria-label": defaultAriaLabel
@@ -6264,21 +6441,36 @@ this.primereact.inputnumber = (function (exports, React, hooks, inputtext, rippl
       if (inputRef.current) {
         var step = props.step * dir;
         var currentValue = parseValue(inputRef.current.value) || 0;
-        var newValue = validateValue(currentValue + step);
-        updateInput(newValue, null, 'spin');
+        var newValue = validateValue(currentValue + step); // touch devices trigger the keyboard to display because of setSelectionRange
+
+        !utils.DomHandler.isTouchDevice() && updateInput(newValue, null, 'spin');
         updateModel(event, newValue);
         handleOnChange(event, currentValue, newValue);
       }
     };
 
+    var onUpButtonTouchStart = function onUpButtonTouchStart(event) {
+      if (!props.disabled && !props.readOnly) {
+        repeat(event, null, 1);
+        event.preventDefault();
+      }
+    };
+
     var onUpButtonMouseDown = function onUpButtonMouseDown(event) {
       if (!props.disabled && !props.readOnly) {
-        inputRef.current.focus();
+        props.autoFocus && utils.DomHandler.focus(inputRef.current, props.autoFocus);
         repeat(event, null, 1);
         event.preventDefault();
       }
     };
 
+    var onUpButtonTouchEnd = function onUpButtonTouchEnd() {
+      if (!props.disabled && !props.readOnly) {
+        clearTimer();
+        event.preventDefault();
+      }
+    };
+
     var onUpButtonMouseUp = function onUpButtonMouseUp() {
       if (!props.disabled && !props.readOnly) {
         clearTimer();
@@ -6303,9 +6495,23 @@ this.primereact.inputnumber = (function (exports, React, hooks, inputtext, rippl
       }
     };
 
+    var onDownButtonTouchStart = function onDownButtonTouchStart(event) {
+      if (!props.disabled && !props.readOnly) {
+        repeat(event, null, -1);
+        event.preventDefault();
+      }
+    };
+
+    var onDownButtonTouchEnd = function onDownButtonTouchEnd() {
+      if (!props.disabled && !props.readOnly) {
+        clearTimer();
+        event.preventDefault();
+      }
+    };
+
     var onDownButtonMouseDown = function onDownButtonMouseDown(event) {
       if (!props.disabled && !props.readOnly) {
-        inputRef.current.focus();
+        props.autoFocus && utils.DomHandler.focus(inputRef.current, props.autoFocus);
         repeat(event, null, -1);
         event.preventDefault();
       }
@@ -7049,6 +7255,8 @@ this.primereact.inputnumber = (function (exports, React, hooks, inputtext, rippl
         onMouseUp: onUpButtonMouseUp,
         onKeyDown: onUpButtonKeyDown,
         onKeyUp: onUpButtonKeyUp,
+        onTouchStart: onUpButtonTouchStart,
+        onTouchEnd: onUpButtonTouchEnd,
         disabled: props.disabled,
         tabIndex: -1
       }, /*#__PURE__*/React__namespace.createElement("span", {
@@ -7069,6 +7277,8 @@ this.primereact.inputnumber = (function (exports, React, hooks, inputtext, rippl
         onMouseUp: onDownButtonMouseUp,
         onKeyDown: onDownButtonKeyDown,
         onKeyUp: onDownButtonKeyUp,
+        onTouchStart: onDownButtonTouchStart,
+        onTouchEnd: onDownButtonTouchEnd,
         disabled: props.disabled,
         tabIndex: -1
       }, /*#__PURE__*/React__namespace.createElement("span", {
@@ -7376,7 +7586,7 @@ this.primereact.messages = (function (exports, React, reactTransitionGroup, csst
 
     var show = function show(value) {
       if (value) {
-        var messages = [];
+        var messages;
 
         if (Array.isArray(value)) {
           for (var i = 0; i < value.length; i++) {
@@ -7397,7 +7607,8 @@ this.primereact.messages = (function (exports, React, reactTransitionGroup, csst
     };
 
     var replace = function replace(value) {
-      setMessagesState(value);
+      var replaced = Array.isArray(value) ? value : [value];
+      setMessagesState(replaced);
     };
 
     var onClose = function onClose(message) {
@@ -7523,8 +7734,7 @@ this.primereact.progressbar = (function (exports, React, utils) {
         style: props.style,
         "aria-valuemin": "0",
         "aria-valuenow": props.value,
-        "aria-valuemax": "100",
-        "aria-label": props.value
+        "aria-valuemax": "100"
       }, otherProps), /*#__PURE__*/React__namespace.createElement("div", {
         className: "p-progressbar-value p-progressbar-value-animate",
         style: {
@@ -7716,6 +7926,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
     var content = props.template ? utils.ObjectUtils.getJSXElement(props.template, props.option) : props.label;
     return /*#__PURE__*/React__namespace.createElement("li", {
       className: className,
+      style: props.style,
       onClick: onClick,
       "aria-label": props.label,
       key: props.label,
@@ -7750,7 +7961,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
     var onEntered = function onEntered() {
       props.onEntered(function () {
         if (props.filter && props.filterInputAutoFocus) {
-          filterInputRef.current.focus();
+          utils.DomHandler.focus(filterInputRef.current, false);
         }
       });
     };
@@ -7760,7 +7971,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
       props.onFilterInputChange && props.onFilterInputChange(event);
     };
 
-    var createGroupChildren = function createGroupChildren(optionGroup) {
+    var createGroupChildren = function createGroupChildren(optionGroup, style) {
       var groupChildren = props.getOptionGroupChildren(optionGroup);
       return groupChildren.map(function (option, j) {
         var optionLabel = props.getOptionLabel(option);
@@ -7770,6 +7981,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
           key: optionKey,
           label: optionLabel,
           option: option,
+          style: style,
           template: props.itemTemplate,
           selected: props.isSelected(option),
           disabled: disabled,
@@ -7786,14 +7998,20 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
     };
 
     var createItem = function createItem(option, index) {
+      var scrollerOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+      var style = {
+        height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
+      };
+
       if (props.optionGroupLabel) {
         var groupContent = props.optionGroupTemplate ? utils.ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : props.getOptionGroupLabel(option);
-        var groupChildrenContent = createGroupChildren(option);
+        var groupChildrenContent = createGroupChildren(option, style);
         var key = index + '_' + props.getOptionGroupRenderKey(option);
         return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
           key: key
         }, /*#__PURE__*/React__namespace.createElement("li", {
-          className: "p-dropdown-item-group"
+          className: "p-dropdown-item-group",
+          style: style
         }, groupContent), groupChildrenContent);
       } else {
         var optionLabel = props.getOptionLabel(option);
@@ -7803,6 +8021,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
           key: optionKey,
           label: optionLabel,
           option: option,
+          style: style,
           template: props.itemTemplate,
           selected: props.isSelected(option),
           disabled: disabled,
@@ -7827,7 +8046,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
           className: "p-dropdown-filter-clear-icon pi pi-times",
           onClick: function onClick() {
             return props.onFilterClearIconClick(function () {
-              return filterInputRef.current.focus();
+              return utils.DomHandler.focus(filterInputRef.current);
             });
           }
         });
@@ -7871,13 +8090,14 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
           }),
           className: utils.classNames('p-dropdown-items-wrapper', props.virtualScrollerOptions.className),
           items: props.visibleOptions,
+          autoSize: true,
           onLazyLoad: function onLazyLoad(event) {
             return props.virtualScrollerOptions.onLazyLoad(_objectSpread$1(_objectSpread$1({}, event), {
               filter: props.filterValue
             }));
           },
           itemTemplate: function itemTemplate(item, options) {
-            return item && createItem(item, options.index);
+            return item && createItem(item, options.index, options);
           },
           contentTemplate: function contentTemplate(options) {
             var className = utils.classNames('p-dropdown-items', options.className);
@@ -8044,7 +8264,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
       if (utils.DomHandler.hasClass(event.target, 'p-dropdown-clear-icon') || event.target.tagName === 'INPUT') {
         return;
       } else if (!overlayRef.current || !(overlayRef.current && overlayRef.current.contains(event.target))) {
-        focusInputRef.current.focus();
+        utils.DomHandler.focus(focusInputRef.current);
         overlayVisibleState ? hide() : show();
       }
     };
@@ -8081,16 +8301,11 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
         case 38:
           onUpKey(event);
           break;
-        //space
+        //space and enter
 
         case 32:
-          overlayVisibleState ? hide() : show();
-          event.preventDefault();
-          break;
-        //enter
-
         case 13:
-          hide();
+          overlayVisibleState ? hide() : show();
           event.preventDefault();
           break;
         //escape and tab
@@ -8322,7 +8537,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
 
       if (!option.disabled) {
         selectItem(event);
-        focusInputRef.current.focus();
+        utils.DomHandler.focus(focusInputRef.current);
       }
 
       hide();
@@ -8391,11 +8606,13 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
       }
     };
 
-    var getSelectedOptionIndex = function getSelectedOptionIndex() {
-      if (props.value != null && visibleOptions) {
+    var getSelectedOptionIndex = function getSelectedOptionIndex(options) {
+      options = options || visibleOptions;
+
+      if (props.value != null && options) {
         if (props.optionGroupLabel) {
-          for (var i = 0; i < visibleOptions.length; i++) {
-            var selectedOptionIndex = findOptionIndexInList(props.value, getOptionGroupChildren(visibleOptions[i]));
+          for (var i = 0; i < options.length; i++) {
+            var selectedOptionIndex = findOptionIndexInList(props.value, getOptionGroupChildren(options[i]));
 
             if (selectedOptionIndex !== -1) {
               return {
@@ -8405,7 +8622,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
             }
           }
         } else {
-          return findOptionIndexInList(props.value, visibleOptions);
+          return findOptionIndexInList(props.value, options);
         }
       }
 
@@ -8470,7 +8687,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
       if (highlightItem && highlightItem.scrollIntoView) {
         highlightItem.scrollIntoView({
           block: 'nearest',
-          inline: 'start'
+          inline: 'nearest'
         });
       }
     };
@@ -8522,16 +8739,16 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, hooks, overlay
     };
 
     var getSelectedOption = function getSelectedOption() {
-      var index = getSelectedOptionIndex();
-      return index !== -1 ? props.optionGroupLabel ? getOptionGroupChildren(visibleOptions[index.group])[index.option] : visibleOptions[index] : null;
+      var index = getSelectedOptionIndex(props.options);
+      return index !== -1 ? props.optionGroupLabel ? getOptionGroupChildren(props.options[index.group])[index.option] : props.options[index] : null;
     };
 
     React__namespace.useEffect(function () {
       utils.ObjectUtils.combinedRefs(inputRef, props.inputRef);
     }, [inputRef, props.inputRef]);
     hooks.useMountEffect(function () {
-      if (props.autoFocus && focusInputRef.current) {
-        focusInputRef.current.focus();
+      if (props.autoFocus) {
+        utils.DomHandler.focus(focusInputRef.current, props.autoFocus);
       }
     });
     hooks.useUpdateEffect(function () {
@@ -9245,7 +9462,7 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
           return param.hasBlockScroll;
         });
 
-        if (!hasBlockScroll) {
+        if (hasBlockScroll) {
           utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
         }
       } else if (props.blockScroll || props.maximizable && maximized) {
@@ -9391,9 +9608,11 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         var icons = utils.ObjectUtils.getJSXElement(props.icons, props);
         var header = utils.ObjectUtils.getJSXElement(props.header, props);
         var headerId = idState + '_header';
+        var headerClassName = utils.classNames('p-dialog-header', props.headerClassName);
         return /*#__PURE__*/React__namespace.createElement("div", {
           ref: headerRef,
-          className: "p-dialog-header",
+          style: props.headerStyle,
+          className: headerClassName,
           onMouseDown: onDragStart
         }, /*#__PURE__*/React__namespace.createElement("div", {
           id: headerId,
@@ -9427,7 +9646,7 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
 
     var createResizer = function createResizer() {
       if (props.resizable) {
-        return /*#__PURE__*/React__namespace.createElement("div", {
+        return /*#__PURE__*/React__namespace.createElement("span", {
           className: "p-resizable-handle",
           style: {
             zIndex: 90
@@ -9515,6 +9734,8 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
     modal: true,
     onHide: null,
     onShow: null,
+    headerStyle: null,
+    headerClassName: null,
     contentStyle: null,
     contentClassName: null,
     closeOnEscape: true,
@@ -9559,7 +9780,7 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
 })({}, React, primereact.api, primereact.csstransition, primereact.hooks, primereact.portal, primereact.ripple, primereact.utils);
 
 this.primereact = this.primereact || {};
-this.primereact.paginator = (function (exports, React, hooks, utils, ripple, inputnumber, dropdown) {
+this.primereact.paginator = (function (exports, React, hooks, utils, api, button, inputnumber, dropdown) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -9738,14 +9959,14 @@ this.primereact.paginator = (function (exports, React, hooks, utils, ripple, inp
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon pi pi-angle-double-left';
-    var element = /*#__PURE__*/React__namespace.createElement("button", {
+    var element = /*#__PURE__*/React__namespace.createElement(button.Button, {
       type: "button",
       className: className,
+      icon: iconClassName,
       onClick: props.onClick,
-      disabled: props.disabled
-    }, /*#__PURE__*/React__namespace.createElement("span", {
-      className: iconClassName
-    }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
+      disabled: props.disabled,
+      "aria-label": api.ariaLabel('firstPageLabel')
+    });
 
     if (props.template) {
       var defaultOptions = {
@@ -9814,14 +10035,14 @@ this.primereact.paginator = (function (exports, React, hooks, utils, ripple, inp
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon pi pi-angle-double-right';
-    var element = /*#__PURE__*/React__namespace.createElement("button", {
+    var element = /*#__PURE__*/React__namespace.createElement(button.Button, {
       type: "button",
       className: className,
+      icon: iconClassName,
       onClick: props.onClick,
-      disabled: props.disabled
-    }, /*#__PURE__*/React__namespace.createElement("span", {
-      className: iconClassName
-    }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
+      disabled: props.disabled,
+      "aria-label": api.ariaLabel('lastPageLabel')
+    });
 
     if (props.template) {
       var defaultOptions = {
@@ -9850,14 +10071,14 @@ this.primereact.paginator = (function (exports, React, hooks, utils, ripple, inp
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon pi pi-angle-right';
-    var element = /*#__PURE__*/React__namespace.createElement("button", {
+    var element = /*#__PURE__*/React__namespace.createElement(button.Button, {
       type: "button",
       className: className,
+      icon: iconClassName,
       onClick: props.onClick,
-      disabled: props.disabled
-    }, /*#__PURE__*/React__namespace.createElement("span", {
-      className: iconClassName
-    }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
+      disabled: props.disabled,
+      "aria-label": api.ariaLabel('nextPageLabel')
+    });
 
     if (props.template) {
       var defaultOptions = {
@@ -9904,13 +10125,14 @@ this.primereact.paginator = (function (exports, React, hooks, utils, ripple, inp
           'p-paginator-page-end': pageLink === endPageInView,
           'p-highlight': pageLink - 1 === props.page
         });
-        var element = /*#__PURE__*/React__namespace.createElement("button", {
+        var element = /*#__PURE__*/React__namespace.createElement(button.Button, {
           type: "button",
           className: className,
           onClick: function onClick(e) {
             return onPageLinkClick(e, pageLink);
-          }
-        }, pageLink, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
+          },
+          "aria-label": "".concat(api.ariaLabel('pageLabel'), " ").concat(pageLink + 1)
+        }, pageLink);
 
         if (props.template) {
           var defaultOptions = {
@@ -9957,14 +10179,14 @@ this.primereact.paginator = (function (exports, React, hooks, utils, ripple, inp
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon pi pi-angle-left';
-    var element = /*#__PURE__*/React__namespace.createElement("button", {
+    var element = /*#__PURE__*/React__namespace.createElement(button.Button, {
       type: "button",
       className: className,
+      icon: iconClassName,
       onClick: props.onClick,
-      disabled: props.disabled
-    }, /*#__PURE__*/React__namespace.createElement("span", {
-      className: iconClassName
-    }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
+      disabled: props.disabled,
+      "aria-label": api.ariaLabel('previousPageLabel')
+    });
 
     if (props.template) {
       var defaultOptions = {
@@ -10300,7 +10522,7 @@ this.primereact.paginator = (function (exports, React, hooks, utils, ripple, inp
 
   return exports;
 
-})({}, React, primereact.hooks, primereact.utils, primereact.ripple, primereact.inputnumber, primereact.dropdown);
+})({}, React, primereact.hooks, primereact.utils, primereact.api, primereact.button, primereact.inputnumber, primereact.dropdown);
 
 this.primereact = this.primereact || {};
 this.primereact.tree = (function (exports, React, utils, ripple) {
@@ -10521,6 +10743,14 @@ this.primereact.tree = (function (exports, React, utils, ripple) {
           } else {
             var nextNodeElement = nodeElement.nextElementSibling;
 
+            while (nextNodeElement) {
+              if (!utils.DomHandler.hasClass(nextNodeElement, 'p-treenode-droppoint')) {
+                break;
+              }
+
+              nextNodeElement = nextNodeElement.nextElementSibling;
+            }
+
             if (nextNodeElement) {
               focusNode(nextNodeElement);
             } else {
@@ -10592,7 +10822,7 @@ this.primereact.tree = (function (exports, React, utils, ripple) {
     };
 
     var focusNode = function focusNode(element) {
-      element.children[0].focus();
+      element && element.children[0] && element.children[0].focus();
     };
 
     var onClick = function onClick(event) {