primereact 10.3.0 → 10.3.2

package/core/core.js

@@ -1221,10 +1221,13 @@ this.primereact.utils = (function (exports, React) {
       }
     }, {
       key: "createInlineStyle",
-      value: function createInlineStyle(nonce) {
+      value: function createInlineStyle(nonce, styleContainer) {
         var styleElement = document.createElement('style');
         DomHandler.addNonce(styleElement, nonce);
-        document.head.appendChild(styleElement);
+        if (!styleContainer) {
+          styleContainer = document.head;
+        }
+        styleContainer.appendChild(styleElement);
         return styleElement;
       }
     }, {
@@ -1232,7 +1235,7 @@ this.primereact.utils = (function (exports, React) {
       value: function removeInlineStyle(styleElement) {
         if (this.isExist(styleElement)) {
           try {
-            document.head.removeChild(styleElement);
+            styleElement.parentNode.removeChild(styleElement);
           } catch (error) {
             // style element may have already been removed in a fast refresh
           }
@@ -1752,7 +1755,7 @@ this.primereact.utils = (function (exports, React) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -2355,11 +2358,10 @@ this.primereact.utils = (function (exports, React) {
 
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-  function mergeProps() {
-    for (var _len = arguments.length, props = new Array(_len), _key = 0; _key < _len; _key++) {
-      props[_key] = arguments[_key];
-    }
+  function _mergeProps(props) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     if (props) {
+      var classNameMergeFunction = options.classNameMergeFunction;
       var isFn = function isFn(o) {
         return !!(o && o.constructor && o.call && o.apply);
       };
@@ -2369,7 +2371,12 @@ this.primereact.utils = (function (exports, React) {
           if (key === 'style') {
             merged['style'] = _objectSpread(_objectSpread({}, merged['style']), ps['style']);
           } else if (key === 'className') {
-            var newClassname = [merged['className'], ps['className']].join(' ').trim();
+            var newClassname = '';
+            if (classNameMergeFunction && classNameMergeFunction instanceof Function) {
+              newClassname = classNameMergeFunction(merged['className'], ps['className']);
+            } else {
+              newClassname = [merged['className'], ps['className']].join(' ').trim();
+            }
             var isEmpty = newClassname === null || newClassname === undefined || newClassname === '';
             merged['className'] = isEmpty ? undefined : newClassname;
           } else if (isFn(value)) {
@@ -2391,6 +2398,41 @@ this.primereact.utils = (function (exports, React) {
     return undefined;
   }
 
+  // @todo - Update this function and remove _mergeProps
+  function mergeProps() {
+    for (var _len = arguments.length, props = new Array(_len), _key = 0; _key < _len; _key++) {
+      props[_key] = arguments[_key];
+    }
+    if (props) {
+      var isFn = function isFn(o) {
+        return !!(o && o.constructor && o.call && o.apply);
+      };
+      return props.reduce(function (merged, ps) {
+        var _loop2 = function _loop2() {
+          var value = ps[key];
+          if (key === 'style') {
+            merged['style'] = _objectSpread(_objectSpread({}, merged['style']), ps['style']);
+          } else if (key === 'className') {
+            merged['className'] = [merged['className'], ps['className']].join(' ').trim();
+          } else if (isFn(value)) {
+            var fn = merged[key];
+            merged[key] = fn ? function () {
+              fn.apply(void 0, arguments);
+              value.apply(void 0, arguments);
+            } : value;
+          } else {
+            merged[key] = value;
+          }
+        };
+        for (var key in ps) {
+          _loop2();
+        }
+        return merged;
+      }, {});
+    }
+    return undefined;
+  }
+
   var lastId = 0;
   function UniqueComponentId() {
     var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'pr_id_';
@@ -2456,6 +2498,7 @@ this.primereact.utils = (function (exports, React) {
   exports.ObjectUtils = ObjectUtils;
   exports.UniqueComponentId = UniqueComponentId;
   exports.ZIndexUtils = ZIndexUtils;
+  exports._mergeProps = _mergeProps;
   exports.classNames = classNames;
   exports.mask = mask;
   exports.mergeProps = mergeProps;
@@ -3333,59 +3376,63 @@ this.primereact.api = (function (exports, utils, React) {
         _useState8 = _slicedToArray(_useState7, 2),
         appendTo = _useState8[0],
         setAppendTo = _useState8[1];
-      var _useState9 = React.useState(propsValue.cssTransition || true),
+      var _useState9 = React.useState(propsValue.styleContainer || null),
         _useState10 = _slicedToArray(_useState9, 2),
-        cssTransition = _useState10[0],
-        setCssTransition = _useState10[1];
-      var _useState11 = React.useState(propsValue.autoZIndex || true),
+        styleContainer = _useState10[0],
+        setStyleContainer = _useState10[1];
+      var _useState11 = React.useState(propsValue.cssTransition || true),
         _useState12 = _slicedToArray(_useState11, 2),
-        autoZIndex = _useState12[0],
-        setAutoZIndex = _useState12[1];
-      var _useState13 = React.useState(propsValue.hideOverlaysOnDocumentScrolling || false),
+        cssTransition = _useState12[0],
+        setCssTransition = _useState12[1];
+      var _useState13 = React.useState(propsValue.autoZIndex || true),
         _useState14 = _slicedToArray(_useState13, 2),
-        hideOverlaysOnDocumentScrolling = _useState14[0],
-        setHideOverlaysOnDocumentScrolling = _useState14[1];
-      var _useState15 = React.useState(propsValue.nonce || null),
+        autoZIndex = _useState14[0],
+        setAutoZIndex = _useState14[1];
+      var _useState15 = React.useState(propsValue.hideOverlaysOnDocumentScrolling || false),
         _useState16 = _slicedToArray(_useState15, 2),
-        nonce = _useState16[0],
-        setNonce = _useState16[1];
-      var _useState17 = React.useState(propsValue.nullSortOrder || 1),
+        hideOverlaysOnDocumentScrolling = _useState16[0],
+        setHideOverlaysOnDocumentScrolling = _useState16[1];
+      var _useState17 = React.useState(propsValue.nonce || null),
         _useState18 = _slicedToArray(_useState17, 2),
-        nullSortOrder = _useState18[0],
-        setNullSortOrder = _useState18[1];
-      var _useState19 = React.useState(propsValue.zIndex || {
+        nonce = _useState18[0],
+        setNonce = _useState18[1];
+      var _useState19 = React.useState(propsValue.nullSortOrder || 1),
+        _useState20 = _slicedToArray(_useState19, 2),
+        nullSortOrder = _useState20[0],
+        setNullSortOrder = _useState20[1];
+      var _useState21 = React.useState(propsValue.zIndex || {
           modal: 1100,
           overlay: 1000,
           menu: 1000,
           tooltip: 1100,
           toast: 1200
         }),
-        _useState20 = _slicedToArray(_useState19, 2),
-        zIndex = _useState20[0],
-        setZIndex = _useState20[1];
-      var _useState21 = React.useState(propsValue.ptOptions || {
+        _useState22 = _slicedToArray(_useState21, 2),
+        zIndex = _useState22[0],
+        setZIndex = _useState22[1];
+      var _useState23 = React.useState(propsValue.ptOptions || {
           mergeSections: true,
           mergeProps: true
         }),
-        _useState22 = _slicedToArray(_useState21, 2),
-        ptOptions = _useState22[0],
-        setPtOptions = _useState22[1];
-      var _useState23 = React.useState(propsValue.pt || undefined),
         _useState24 = _slicedToArray(_useState23, 2),
-        pt = _useState24[0],
-        setPt = _useState24[1];
-      var _useState25 = React.useState(propsValue.unstyled || false),
+        ptOptions = _useState24[0],
+        setPtOptions = _useState24[1];
+      var _useState25 = React.useState(propsValue.pt || undefined),
         _useState26 = _slicedToArray(_useState25, 2),
-        unstyled = _useState26[0],
-        setUnstyled = _useState26[1];
-      var _useState27 = React.useState(propsValue.filterMatchModeOptions || {
+        pt = _useState26[0],
+        setPt = _useState26[1];
+      var _useState27 = React.useState(propsValue.unstyled || false),
+        _useState28 = _slicedToArray(_useState27, 2),
+        unstyled = _useState28[0],
+        setUnstyled = _useState28[1];
+      var _useState29 = React.useState(propsValue.filterMatchModeOptions || {
           text: [FilterMatchMode.STARTS_WITH, FilterMatchMode.CONTAINS, FilterMatchMode.NOT_CONTAINS, FilterMatchMode.ENDS_WITH, FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS],
           numeric: [FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS, FilterMatchMode.LESS_THAN, FilterMatchMode.LESS_THAN_OR_EQUAL_TO, FilterMatchMode.GREATER_THAN, FilterMatchMode.GREATER_THAN_OR_EQUAL_TO],
           date: [FilterMatchMode.DATE_IS, FilterMatchMode.DATE_IS_NOT, FilterMatchMode.DATE_BEFORE, FilterMatchMode.DATE_AFTER]
         }),
-        _useState28 = _slicedToArray(_useState27, 2),
-        filterMatchModeOptions = _useState28[0],
-        setFilterMatchModeOptions = _useState28[1];
+        _useState30 = _slicedToArray(_useState29, 2),
+        filterMatchModeOptions = _useState30[0],
+        setFilterMatchModeOptions = _useState30[1];
       var changeTheme = function changeTheme(currentTheme, newTheme, linkElementId, callback) {
         var _linkElement$parentNo;
         var linkElement = document.getElementById(linkElementId);
@@ -3433,6 +3480,8 @@ this.primereact.api = (function (exports, utils, React) {
         setLocale: setLocale,
         appendTo: appendTo,
         setAppendTo: setAppendTo,
+        styleContainer: styleContainer,
+        setStyleContainer: setStyleContainer,
         cssTransition: cssTransition,
         setCssTransition: setCssTransition,
         autoZIndex: autoZIndex,
@@ -3492,6 +3541,37 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
 
   var PrimeReact__default = /*#__PURE__*/_interopDefaultLegacy(PrimeReact);
 
+  function _arrayLikeToArray(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+    return arr2;
+  }
+
+  function _arrayWithoutHoles(arr) {
+    if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+  }
+
+  function _iterableToArray(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+  }
+
+  function _unsupportedIterableToArray(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(o);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+  }
+
+  function _nonIterableSpread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  }
+
+  function _toConsumableArray(arr) {
+    return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+  }
+
   function _typeof(o) {
     "@babel/helpers - typeof";
 
@@ -3533,44 +3613,6 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
     return obj;
   }
 
-  function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-  function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-  function mergeProps() {
-    for (var _len = arguments.length, props = new Array(_len), _key = 0; _key < _len; _key++) {
-      props[_key] = arguments[_key];
-    }
-    if (props) {
-      var isFn = function isFn(o) {
-        return !!(o && o.constructor && o.call && o.apply);
-      };
-      return props.reduce(function (merged, ps) {
-        var _loop = function _loop() {
-          var value = ps[key];
-          if (key === 'style') {
-            merged['style'] = _objectSpread$1(_objectSpread$1({}, merged['style']), ps['style']);
-          } else if (key === 'className') {
-            var newClassname = [merged['className'], ps['className']].join(' ').trim();
-            var isEmpty = newClassname === null || newClassname === undefined || newClassname === '';
-            merged['className'] = isEmpty ? undefined : newClassname;
-          } else if (isFn(value)) {
-            var fn = merged[key];
-            merged[key] = fn ? function () {
-              fn.apply(void 0, arguments);
-              value.apply(void 0, arguments);
-            } : value;
-          } else {
-            merged[key] = value;
-          }
-        };
-        for (var key in ps) {
-          _loop();
-        }
-        return merged;
-      }, {});
-    }
-    return undefined;
-  }
-
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var baseStyle = "\n.p-hidden-accessible {\n    border: 0;\n    clip: rect(0 0 0 0);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    width: 1px;\n}\n\n.p-hidden-accessible input,\n.p-hidden-accessible select {\n    transform: scale(0);\n}\n\n.p-overflow-hidden {\n    overflow: hidden;\n    padding-right: var(--scrollbar-width);\n}\n";
@@ -3578,7 +3620,7 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
   var checkboxStyles = "\n.p-checkbox {\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    vertical-align: bottom;\n    position: relative;\n}\n\n.p-checkbox.p-checkbox-disabled {\n    cursor: auto;\n}\n\n.p-checkbox-box {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n";
   var inputTextStyles = "\n.p-inputtext {\n    margin: 0;\n}\n\n.p-fluid .p-inputtext {\n    width: 100%;\n}\n\n/* InputGroup */\n.p-inputgroup {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup-addon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-inputgroup .p-float-label {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-fluid .p-inputgroup .p-inputtext,\n.p-inputgroup .p-inputwrapper,\n.p-fluid .p-inputgroup .p-input {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n/* Floating Label */\n.p-float-label {\n    display: block;\n    position: relative;\n}\n\n.p-float-label label {\n    position: absolute;\n    pointer-events: none;\n    top: 50%;\n    margin-top: -0.5rem;\n    transition-property: all;\n    transition-timing-function: ease;\n    line-height: 1;\n}\n\n.p-float-label textarea ~ label,\n.p-float-label .p-mention ~ label {\n    top: 1rem;\n}\n\n.p-float-label input:focus ~ label,\n.p-float-label input:-webkit-autofill ~ label,\n.p-float-label input.p-filled ~ label,\n.p-float-label textarea:focus ~ label,\n.p-float-label textarea.p-filled ~ label,\n.p-float-label .p-inputwrapper-focus ~ label,\n.p-float-label .p-inputwrapper-filled ~ label,\n.p-float-label .p-tooltip-target-wrapper ~ label {\n    top: -0.75rem;\n    font-size: 12px;\n}\n\n.p-float-label .p-placeholder,\n.p-float-label input::placeholder,\n.p-float-label .p-inputtext::placeholder {\n    opacity: 0;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-float-label .p-focus .p-placeholder,\n.p-float-label input:focus::placeholder,\n.p-float-label .p-inputtext:focus::placeholder {\n    opacity: 1;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-input-icon-left,\n.p-input-icon-right {\n    position: relative;\n    display: inline-block;\n}\n\n.p-input-icon-left > i,\n.p-input-icon-right > i,\n.p-input-icon-left > svg,\n.p-input-icon-right > svg,\n.p-input-icon-left > .p-input-prefix,\n.p-input-icon-right > .p-input-suffix {\n    position: absolute;\n    top: 50%;\n    margin-top: -0.5rem;\n}\n\n.p-fluid .p-input-icon-left,\n.p-fluid .p-input-icon-right {\n    display: block;\n    width: 100%;\n}\n";
   var radioButtonStyles = "\n.p-radiobutton {\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    vertical-align: bottom;\n}\n\n.p-radiobutton-box {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.p-radiobutton-icon {\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    transform: translateZ(0) scale(.1);\n    border-radius: 50%;\n    visibility: hidden;\n}\n\n.p-radiobutton-box.p-highlight .p-radiobutton-icon {\n    transform: translateZ(0) scale(1.0, 1.0);\n    visibility: visible;\n}\n\n";
-  var iconStyles = "\n.p-icon {\n    display: inline-block;\n}\n\n.p-icon-spin {\n    -webkit-animation: p-icon-spin 2s infinite linear;\n    animation: p-icon-spin 2s infinite linear;\n}\n\nsvg.p-icon {\n    pointer-events: auto;\n}\n\nsvg.p-icon g {\n    pointer-events: none;\n}\n\n@-webkit-keyframes p-icon-spin {\n    0% {\n        -webkit-transform: rotate(0deg);\n        transform: rotate(0deg);\n    }\n    100% {\n        -webkit-transform: rotate(359deg);\n        transform: rotate(359deg);\n    }\n}\n\n@keyframes p-icon-spin {\n    0% {\n        -webkit-transform: rotate(0deg);\n        transform: rotate(0deg);\n    }\n    100% {\n        -webkit-transform: rotate(359deg);\n        transform: rotate(359deg);\n    }\n}\n";
+  var iconStyles = "\n.p-icon {\n    display: inline-block;\n}\n\n.p-icon-spin {\n    -webkit-animation: p-icon-spin 2s infinite linear;\n    animation: p-icon-spin 2s infinite linear;\n}\n\nsvg.p-icon {\n    pointer-events: auto;\n}\n\nsvg.p-icon g,\n.p-disabled svg.p-icon {\n    pointer-events: none;\n}\n\n@-webkit-keyframes p-icon-spin {\n    0% {\n        -webkit-transform: rotate(0deg);\n        transform: rotate(0deg);\n    }\n    100% {\n        -webkit-transform: rotate(359deg);\n        transform: rotate(359deg);\n    }\n}\n\n@keyframes p-icon-spin {\n    0% {\n        -webkit-transform: rotate(0deg);\n        transform: rotate(0deg);\n    }\n    100% {\n        -webkit-transform: rotate(359deg);\n        transform: rotate(359deg);\n    }\n}\n";
   var commonStyle = "\n@layer primereact {\n    .p-component, .p-component * {\n        box-sizing: border-box;\n    }\n\n    .p-hidden {\n        display: none;\n    }\n\n    .p-hidden-space {\n        visibility: hidden;\n    }\n\n    .p-reset {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        outline: 0;\n        text-decoration: none;\n        font-size: 100%;\n        list-style: none;\n    }\n\n    .p-disabled, .p-disabled * {\n        cursor: default;\n        pointer-events: none;\n        user-select: none;\n    }\n\n    .p-component-overlay {\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n    }\n\n    .p-unselectable-text {\n        user-select: none;\n    }\n\n    .p-scrollbar-measure {\n        width: 100px;\n        height: 100px;\n        overflow: scroll;\n        position: absolute;\n        top: -9999px;\n    }\n\n    @-webkit-keyframes p-fadein {\n      0%   { opacity: 0; }\n      100% { opacity: 1; }\n    }\n    @keyframes p-fadein {\n      0%   { opacity: 0; }\n      100% { opacity: 1; }\n    }\n\n    .p-link {\n        text-align: left;\n        background-color: transparent;\n        margin: 0;\n        padding: 0;\n        border: none;\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-link:disabled {\n        cursor: default;\n    }\n\n    /* Non react overlay animations */\n    .p-connected-overlay {\n        opacity: 0;\n        transform: scaleY(0.8);\n        transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-connected-overlay-visible {\n        opacity: 1;\n        transform: scaleY(1);\n    }\n\n    .p-connected-overlay-hidden {\n        opacity: 0;\n        transform: scaleY(1);\n        transition: opacity .1s linear;\n    }\n\n    /* React based overlay animations */\n    .p-connected-overlay-enter {\n        opacity: 0;\n        transform: scaleY(0.8);\n    }\n\n    .p-connected-overlay-enter-active {\n        opacity: 1;\n        transform: scaleY(1);\n        transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-connected-overlay-enter-done {\n        transform: none;\n    }\n\n    .p-connected-overlay-exit {\n        opacity: 1;\n    }\n\n    .p-connected-overlay-exit-active {\n        opacity: 0;\n        transition: opacity .1s linear;\n    }\n\n    /* Toggleable Content */\n    .p-toggleable-content-enter {\n        max-height: 0;\n    }\n\n    .p-toggleable-content-enter-active {\n        overflow: hidden;\n        max-height: 1000px;\n        transition: max-height 1s ease-in-out;\n    }\n\n    .p-toggleable-content-enter-done {\n        transform: none;\n    }\n\n    .p-toggleable-content-exit {\n        max-height: 1000px;\n    }\n\n    .p-toggleable-content-exit-active {\n        overflow: hidden;\n        max-height: 0;\n        transition: max-height 0.45s cubic-bezier(0, 1, 0, 1);\n    }\n\n    .p-sr-only {\n        border: 0;\n        clip: rect(1px, 1px, 1px, 1px);\n        clip-path: inset(50%);\n        height: 1px;\n        margin: -1px;\n        overflow: hidden;\n        padding: 0;\n        position: absolute;\n        width: 1px;\n        word-wrap: normal;\n    }\n\n    /* @todo Refactor */\n    .p-menu .p-menuitem-link {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    ".concat(buttonStyles, "\n    ").concat(checkboxStyles, "\n    ").concat(inputTextStyles, "\n    ").concat(radioButtonStyles, "\n    ").concat(iconStyles, "\n}\n");
   var ComponentBase = {
     cProps: undefined,
@@ -3608,6 +3650,7 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
         return utils.ObjectUtils.getDiffProps(props, defaultProps);
       };
       var getPTValue = function getPTValue() {
+        var _ComponentBase$contex;
         var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
         var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
         var params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
@@ -3616,12 +3659,13 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
         if (obj.hasOwnProperty('pt') && obj.pt !== undefined) {
           obj = obj.pt;
         }
+        var originalkey = key;
+        var isNestedParam = /./g.test(originalkey) && !!params[originalkey.split('.')[0]];
+        var fkey = isNestedParam ? utils.ObjectUtils.toFlatCase(originalkey.split('.')[1]) : utils.ObjectUtils.toFlatCase(originalkey);
         var hostName = params.hostName && utils.ObjectUtils.toFlatCase(params.hostName);
         var componentName = hostName || params.props && params.props.__TYPE && utils.ObjectUtils.toFlatCase(params.props.__TYPE) || '';
-        var isNestedParam = /./g.test(key) && !!params[key.split('.')[0]];
-        var isTransition = key === 'transition' || /./g.test(key) && !!(key.split('.')[1] === 'transition');
+        var isTransition = fkey === 'transition';
         var datasetPrefix = 'data-pc-';
-        var fkey = isNestedParam ? utils.ObjectUtils.toFlatCase(key.split('.')[1]) : utils.ObjectUtils.toFlatCase(key);
         var getHostInstance = function getHostInstance(params) {
           return params !== null && params !== void 0 && params.props ? params.hostName ? params.props.__TYPE === params.hostName ? params.props : getHostInstance(params.parent) : params.parent : undefined;
         };
@@ -3638,14 +3682,25 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
           useMergeProps = _ref$mergeProps === void 0 ? false : _ref$mergeProps;
         var getPTClassValue = function getPTClassValue() {
           var value = getOptionValue.apply(void 0, arguments);
-          return utils.ObjectUtils.isString(value) ? {
+          if (Array.isArray(value)) return {
+            className: utils.classNames.apply(void 0, _toConsumableArray(value))
+          };
+          if (utils.ObjectUtils.isString(value)) return {
             className: value
-          } : value;
+          };
+          if (value !== null && value !== void 0 && value.hasOwnProperty('className') && Array.isArray(value.className)) {
+            return {
+              className: utils.classNames.apply(void 0, _toConsumableArray(value.className))
+            };
+          }
+          return value;
         };
-        var globalPT = searchInDefaultPT ? isNestedParam ? _useGlobalPT(getPTClassValue, key, params) : _useDefaultPT(getPTClassValue, key, params) : undefined;
-        var self = isNestedParam ? undefined : _usePT(_getPT(obj, componentName), getPTClassValue, key, params);
+        var globalPT = searchInDefaultPT ? isNestedParam ? _useGlobalPT(getPTClassValue, originalkey, params) : _useDefaultPT(getPTClassValue, originalkey, params) : undefined;
+        var self = isNestedParam ? undefined : _usePT(_getPT(obj, componentName), getPTClassValue, originalkey, params);
         var datasetProps = !isTransition && _objectSpread(_objectSpread({}, fkey === 'root' && _defineProperty({}, "".concat(datasetPrefix, "name"), params.props && params.props.__parentMetadata ? utils.ObjectUtils.toFlatCase(params.props.__TYPE) : componentName)), {}, _defineProperty({}, "".concat(datasetPrefix, "section"), fkey));
-        return mergeSections || !mergeSections && self ? useMergeProps ? mergeProps(globalPT, self, Object.keys(datasetProps).length ? datasetProps : {}) : _objectSpread(_objectSpread(_objectSpread({}, globalPT), self), Object.keys(datasetProps).length ? datasetProps : {}) : _objectSpread(_objectSpread({}, self), Object.keys(datasetProps).length ? datasetProps : {});
+        return mergeSections || !mergeSections && self ? useMergeProps ? utils._mergeProps([globalPT, self, Object.keys(datasetProps).length ? datasetProps : {}], {
+          classNameMergeFunction: (_ComponentBase$contex = ComponentBase.context.ptOptions) === null || _ComponentBase$contex === void 0 ? void 0 : _ComponentBase$contex.classNameMergeFunction
+        }) : _objectSpread(_objectSpread(_objectSpread({}, globalPT), self), Object.keys(datasetProps).length ? datasetProps : {}) : _objectSpread(_objectSpread({}, self), Object.keys(datasetProps).length ? datasetProps : {});
       };
       var setMetaData = function setMetaData() {
         var metadata = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -3678,6 +3733,7 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
           var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
           var when = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
           if (when) {
+            var _ComponentBase$contex2;
             var self = getOptionValue(css && css.inlineStyles, key, _objectSpread({
               props: props,
               state: state
@@ -3686,7 +3742,9 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
               props: props,
               state: state
             }, params));
-            return mergeProps(base, self);
+            return utils._mergeProps([base, self], {
+              classNameMergeFunction: (_ComponentBase$contex2 = ComponentBase.context.ptOptions) === null || _ComponentBase$contex2 === void 0 ? void 0 : _ComponentBase$contex2.classNameMergeFunction
+            });
           }
           return undefined;
         };
@@ -3743,11 +3801,14 @@ this.primereact.componentbase = (function (exports, PrimeReact, hooks, utils) {
         _ref4$mergeSections = _ref4.mergeSections,
         mergeSections = _ref4$mergeSections === void 0 ? true : _ref4$mergeSections,
         _ref4$mergeProps = _ref4.mergeProps,
-        useMergeProps = _ref4$mergeProps === void 0 ? false : _ref4$mergeProps;
+        useMergeProps = _ref4$mergeProps === void 0 ? false : _ref4$mergeProps,
+        classNameMergeFunction = _ref4.classNameMergeFunction;
       var originalValue = fn(pt.originalValue);
       var value = fn(pt.value);
       if (originalValue === undefined && value === undefined) return undefined;else if (utils.ObjectUtils.isString(value)) return value;else if (utils.ObjectUtils.isString(originalValue)) return originalValue;
-      return mergeSections || !mergeSections && value ? useMergeProps ? mergeProps(originalValue, value) : _objectSpread(_objectSpread({}, originalValue), value) : value;
+      return mergeSections || !mergeSections && value ? useMergeProps ? utils._mergeProps([originalValue, value], {
+        classNameMergeFunction: classNameMergeFunction
+      }) : _objectSpread(_objectSpread({}, originalValue), value) : value;
     }
     return fn(pt);
   };
@@ -4047,36 +4108,6 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
     };
   };
 
-  /* eslint-disable */
-  var useTimeout = function useTimeout(fn) {
-    var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-    var when = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-    var timeout = React__namespace.useRef(null);
-    var savedCallback = React__namespace.useRef(null);
-    var clear = React__namespace.useCallback(function () {
-      return clearTimeout(timeout.current);
-    }, [timeout.current]);
-    React__namespace.useEffect(function () {
-      savedCallback.current = fn;
-    });
-    React__namespace.useEffect(function () {
-      function callback() {
-        savedCallback.current();
-      }
-      if (when) {
-        timeout.current = setTimeout(callback, delay);
-        return clear;
-      } else {
-        clear();
-      }
-    }, [delay, when]);
-    useUnmountEffect(function () {
-      clear();
-    });
-    return [clear];
-  };
-  /* eslint-enable */
-
   var useDebounce = function useDebounce(initialValue, delay) {
     var _React$useState = React__namespace.useState(initialValue),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -4086,12 +4117,64 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
       _React$useState4 = _slicedToArray(_React$useState3, 2),
       debouncedValue = _React$useState4[0],
       setDebouncedValue = _React$useState4[1];
-    useTimeout(function () {
-      setDebouncedValue(inputValue);
-    }, delay, inputValue !== debouncedValue);
+    var mountedRef = React__namespace.useRef(false);
+    var timeoutRef = React__namespace.useRef(null);
+    var cancelTimer = function cancelTimer() {
+      return window.clearTimeout(timeoutRef.current);
+    };
+    useMountEffect(function () {
+      mountedRef.current = true;
+    });
+    useUnmountEffect(function () {
+      cancelTimer();
+    });
+    React__namespace.useEffect(function () {
+      if (!mountedRef.current) {
+        return;
+      }
+      cancelTimer();
+      timeoutRef.current = window.setTimeout(function () {
+        setDebouncedValue(inputValue);
+      }, delay);
+    }, [inputValue, delay]);
     return [inputValue, debouncedValue, setInputValue];
   };
 
+  var groupToDisplayedElements = {};
+  var useDisplayOrder = function useDisplayOrder(group) {
+    var isVisible = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+    var _React$useState = React__namespace.useState(function () {
+        return utils.UniqueComponentId();
+      }),
+      _React$useState2 = _slicedToArray(_React$useState, 1),
+      uid = _React$useState2[0];
+    var _React$useState3 = React__namespace.useState(0),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      displayOrder = _React$useState4[0],
+      setDisplayOrder = _React$useState4[1];
+    React__namespace.useEffect(function () {
+      if (isVisible) {
+        if (!(group in groupToDisplayedElements)) {
+          groupToDisplayedElements[group] = [];
+        }
+        var newDisplayOrder = groupToDisplayedElements[group].length + 1;
+        groupToDisplayedElements[group].push(uid);
+        setDisplayOrder(newDisplayOrder);
+        return function () {
+          delete groupToDisplayedElements[group][newDisplayOrder];
+          var lastOrder = groupToDisplayedElements[group].findLastIndex(function (el) {
+            return el !== undefined;
+          });
+
+          // Reduce array length, by removing undefined elements at the end of array:
+          groupToDisplayedElements[group].splice(lastOrder + 1);
+          setDisplayOrder(undefined);
+        };
+      }
+    }, [group, uid, isVisible]);
+    return displayOrder;
+  };
+
   var TYPE_MAP = {
     ico: 'image/x-icon',
     png: 'image/png',
@@ -4116,6 +4199,121 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
     }, [newIcon, rel]);
   };
 
+  function _arrayWithoutHoles(arr) {
+    if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+  }
+
+  function _iterableToArray(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+  }
+
+  function _nonIterableSpread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  }
+
+  function _toConsumableArray(arr) {
+    return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+  }
+
+  /**
+   * Priorities of different components (bigger number handled first)
+   */
+  var ESC_KEY_HANDLING_PRIORITIES = {
+    SIDEBAR: 100,
+    SLIDE_MENU: 200,
+    DIALOG: 300,
+    IMAGE: 400,
+    MENU: 500,
+    OVERLAY_PANEL: 600,
+    PASSWORD: 700,
+    CASCADE_SELECT: 800,
+    SPLIT_BUTTON: 900,
+    SPEED_DIAL: 1000
+  };
+
+  /**
+   * Object, that manages global escape key handling logic
+   */
+  var globalEscKeyHandlingLogic = {
+    /**
+     * Mapping from ESC_KEY_HANDLING_PRIORITY to array of related listeners, grouped by priority
+     * @example
+     * Map<{
+     *     [ESC_KEY_HANDLING_PRIORITIES.SIDEBAR]: Map<{
+     *         1: () => {...},
+     *         2: () => {...}
+     *     }>,
+     *     [ESC_KEY_HANDLING_PRIORITIES.DIALOG]: Map<{
+     *         1: () => {...},
+     *         2: () => {...}
+     *     }>
+     * }>;
+     */
+    escKeyListeners: new Map(),
+    /**
+     * Keydown handler (attached to any keydown)
+     */
+    onGlobalKeyDown: function onGlobalKeyDown(event) {
+      // Do nothing if not an "esc" key is pressed:
+      if (event.code !== 'Escape') return;
+      var escKeyListeners = globalEscKeyHandlingLogic.escKeyListeners;
+      var maxPrimaryPriority = Math.max.apply(Math, _toConsumableArray(escKeyListeners.keys()));
+      var theMostImportantEscHandlersSet = escKeyListeners.get(maxPrimaryPriority);
+      var maxSecondaryPriority = Math.max.apply(Math, _toConsumableArray(theMostImportantEscHandlersSet.keys()));
+      var theMostImportantEscHandler = theMostImportantEscHandlersSet.get(maxSecondaryPriority);
+      theMostImportantEscHandler(event);
+    },
+    /**
+     * Attach global keydown listener if there are any "esc" key handlers assigned,
+     * otherwise detach.
+     */
+    refreshGlobalKeyDownListener: function refreshGlobalKeyDownListener() {
+      var document = utils.DomHandler.getTargetElement('document');
+      if (this.escKeyListeners.size > 0) {
+        document.addEventListener('keydown', this.onGlobalKeyDown);
+      } else {
+        document.removeEventListener('keydown', this.onGlobalKeyDown);
+      }
+    },
+    /**
+     * Add "Esc" key handler
+     */
+    addListener: function addListener(callback, _ref) {
+      var _this = this;
+      var _ref2 = _slicedToArray(_ref, 2),
+        primaryPriority = _ref2[0],
+        secondaryPriority = _ref2[1];
+      var escKeyListeners = this.escKeyListeners;
+      if (!escKeyListeners.has(primaryPriority)) {
+        escKeyListeners.set(primaryPriority, new Map());
+      }
+      var primaryPriorityListeners = escKeyListeners.get(primaryPriority);
+
+      // To prevent unexpected override of callback:
+      if (primaryPriorityListeners.has(secondaryPriority)) {
+        throw new Error("Unexpected: global esc key listener with priority [".concat(primaryPriority, ", ").concat(secondaryPriority, "] already exists."));
+      }
+      primaryPriorityListeners.set(secondaryPriority, callback);
+      this.refreshGlobalKeyDownListener();
+      return function () {
+        primaryPriorityListeners["delete"](secondaryPriority);
+        if (primaryPriorityListeners.size === 0) {
+          escKeyListeners["delete"](primaryPriority);
+        }
+        _this.refreshGlobalKeyDownListener();
+      };
+    }
+  };
+  var useGlobalOnEscapeKey = function useGlobalOnEscapeKey(_ref3) {
+    var callback = _ref3.callback,
+      when = _ref3.when,
+      priority = _ref3.priority;
+    React.useEffect(function () {
+      if (!when) return;
+      return globalEscKeyHandlingLogic.addListener(callback, priority);
+    }, [callback, when, priority]);
+  };
+
   var useIntersectionObserver = function useIntersectionObserver(ref) {
     var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     var _React$useState = React__namespace.useState(false),
@@ -4195,24 +4393,6 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
   };
   /* eslint-enable */
 
-  /* eslint-disable */
-
-  /**
-   * Custom hook to run a mount effect only once.
-   * @param {*} fn the callback function
-   * @returns the hook
-   */
-  var useMountEffect = function useMountEffect(fn) {
-    var mounted = React__namespace.useRef(false);
-    return React__namespace.useEffect(function () {
-      if (!mounted.current) {
-        mounted.current = true;
-        return fn && fn();
-      }
-    }, []);
-  };
-  /* eslint-enable */
-
   function _typeof(o) {
     "@babel/helpers - typeof";
 
@@ -4254,6 +4434,44 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
     return obj;
   }
 
+  function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+  function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+
+  /**
+   * Hook to merge properties including custom merge function for things like Tailwind merge.
+   */
+  var useMergeProps = function useMergeProps() {
+    var context = React.useContext(PrimeReact.PrimeReactContext);
+    return function () {
+      var _context$ptOptions;
+      var options = _objectSpread$2({}, (context === null || context === void 0 || (_context$ptOptions = context.ptOptions) === null || _context$ptOptions === void 0 ? void 0 : _context$ptOptions.classNameMergeFunction) && {
+        classNameMergeFunction: context.classNameMergeFunction
+      });
+      for (var _len = arguments.length, props = new Array(_len), _key = 0; _key < _len; _key++) {
+        props[_key] = arguments[_key];
+      }
+      return utils._mergeProps(props, options);
+    };
+  };
+
+  /* eslint-disable */
+
+  /**
+   * Custom hook to run a mount effect only once.
+   * @param {*} fn the callback function
+   * @returns the hook
+   */
+  var useMountEffect = function useMountEffect(fn) {
+    var mounted = React__namespace.useRef(false);
+    return React__namespace.useEffect(function () {
+      if (!mounted.current) {
+        mounted.current = true;
+        return fn && fn();
+      }
+    }, []);
+  };
+  /* eslint-enable */
+
   function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var useMouse = function useMouse() {
@@ -4774,19 +4992,6 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
   };
   /* eslint-enable */
 
-  /* eslint-disable */
-  var useUpdateEffect = function useUpdateEffect(fn, deps) {
-    var mounted = React__namespace.useRef(false);
-    return React__namespace.useEffect(function () {
-      if (!mounted.current) {
-        mounted.current = true;
-        return;
-      }
-      return fn && fn();
-    }, deps);
-  };
-  /* eslint-enable */
-
   var _id = 0;
   var useStyle = function useStyle(css) {
     var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
@@ -4811,17 +5016,17 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
       isLoaded && css !== newCSS && (styleRef.current.textContent = newCSS);
     };
     var load = function load() {
-      if (!document) return;
-      styleRef.current = document.querySelector("style[data-primereact-style-id=\"".concat(name, "\"]")) || document.getElementById(id) || document.createElement('style');
+      if (!document || isLoaded) return;
+      var styleContainer = (context === null || context === void 0 ? void 0 : context.styleContainer) || document.head;
+      styleRef.current = styleContainer.querySelector("style[data-primereact-style-id=\"".concat(name, "\"]")) || document.getElementById(id) || document.createElement('style');
       if (!styleRef.current.isConnected) {
         styleRef.current.type = 'text/css';
         id && (styleRef.current.id = id);
         media && (styleRef.current.media = media);
         utils.DomHandler.addNonce(styleRef.current, context && context.nonce || PrimeReact__default["default"].nonce);
-        document.head.appendChild(styleRef.current);
+        styleContainer.appendChild(styleRef.current);
         name && styleRef.current.setAttribute('data-primereact-style-id', name);
       }
-      if (isLoaded) return;
       styleRef.current.textContent = css;
       setIsLoaded(true);
     };
@@ -4835,7 +5040,7 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
 
       // return () => {if (!manual) unload()}; /* @todo */
       // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }, [manual]);
     return {
       id: id,
       name: name,
@@ -4846,49 +5051,65 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
     };
   };
 
-  var useOnEscapeKey = function useOnEscapeKey(ref, condition, callback) {
-    var handleEsc = function handleEsc(event) {
-      if (event.key === 'Esc' || event.key === 'Escape') {
-        event.stopImmediatePropagation();
-        callback(event);
-      }
-      return;
-    };
-    var _useEventListener = useEventListener({
-        type: 'keydown',
-        listener: handleEsc
-      }),
-      _useEventListener2 = _slicedToArray(_useEventListener, 2),
-      bindKeyDownListener = _useEventListener2[0],
-      unbindKeyDownListener = _useEventListener2[1];
+  /* eslint-disable */
+  var useTimeout = function useTimeout(fn) {
+    var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    var when = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+    var timeout = React__namespace.useRef(null);
+    var savedCallback = React__namespace.useRef(null);
+    var clear = React__namespace.useCallback(function () {
+      return clearTimeout(timeout.current);
+    }, [timeout.current]);
     React__namespace.useEffect(function () {
-      if (!condition) {
-        return;
+      savedCallback.current = fn;
+    });
+    React__namespace.useEffect(function () {
+      function callback() {
+        savedCallback.current();
       }
-      if (!ref.current) {
-        return;
+      if (when) {
+        timeout.current = setTimeout(callback, delay);
+        return clear;
+      } else {
+        clear();
       }
-      bindKeyDownListener();
-      return function () {
-        unbindKeyDownListener();
-      };
+    }, [delay, when]);
+    useUnmountEffect(function () {
+      clear();
     });
-    return [ref, callback];
+    return [clear];
+  };
+  /* eslint-enable */
+
+  /* eslint-disable */
+  var useUpdateEffect = function useUpdateEffect(fn, deps) {
+    var mounted = React__namespace.useRef(false);
+    return React__namespace.useEffect(function () {
+      if (!mounted.current) {
+        mounted.current = true;
+        return;
+      }
+      return fn && fn();
+    }, deps);
   };
+  /* eslint-enable */
 
+  exports.ESC_KEY_HANDLING_PRIORITIES = ESC_KEY_HANDLING_PRIORITIES;
   exports.useClickOutside = useClickOutside;
   exports.useCounter = useCounter;
   exports.useDebounce = useDebounce;
+  exports.useDisplayOrder = useDisplayOrder;
   exports.useEventListener = useEventListener;
   exports.useFavicon = useFavicon;
+  exports.useGlobalOnEscapeKey = useGlobalOnEscapeKey;
   exports.useIntersectionObserver = useIntersectionObserver;
   exports.useInterval = useInterval;
   exports.useLocalStorage = useLocalStorage;
   exports.useMatchMedia = useMatchMedia;
+  exports.useMergeProps = useMergeProps;
   exports.useMountEffect = useMountEffect;
   exports.useMouse = useMouse;
   exports.useMove = useMove;
-  exports.useOnEscapeKey = useOnEscapeKey;
   exports.useOverlayListener = useOverlayListener;
   exports.useOverlayScrollListener = useOverlayScrollListener;
   exports.usePrevious = usePrevious;
@@ -5074,13 +5295,16 @@ this.primereact.ripple = (function (exports, React, PrimeReact, hooks, utils, co
       setMounted = _React$useState2[1];
     var inkRef = React__namespace.useRef(null);
     var targetRef = React__namespace.useRef(null);
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(PrimeReact.PrimeReactContext);
     var props = RippleBase.getProps(inProps, context);
+    var isRippleActive = context && context.ripple || PrimeReact__default["default"].ripple;
     var metaData = {
       props: props
     };
     hooks.useStyle(RippleBase.css.styles, {
-      name: 'ripple'
+      name: 'ripple',
+      manual: !isRippleActive
     });
     var _RippleBase$setMetaDa = RippleBase.setMetaData(_objectSpread({}, metaData)),
       ptm = _RippleBase$setMetaDa.ptm,
@@ -5159,16 +5383,17 @@ this.primereact.ripple = (function (exports, React, PrimeReact, hooks, utils, co
         unbindEvents();
       }
     });
-    var rootProps = utils.mergeProps({
+    if (!isRippleActive) return null;
+    var rootProps = mergeProps({
       'aria-hidden': true,
       className: utils.classNames(cx('root'))
     }, RippleBase.getOtherProps(props), ptm('root'));
-    return context && context.ripple || PrimeReact__default["default"].ripple ? /*#__PURE__*/React__namespace.createElement("span", _extends({
+    return /*#__PURE__*/React__namespace.createElement("span", _extends({
       role: "presentation",
       ref: inkRef
     }, rootProps, {
       onAnimationEnd: onAnimationEnd
-    })) : null;
+    }));
   }));
   Ripple.displayName = 'Ripple';
 
@@ -5466,7 +5691,13 @@ this.primereact.portal = (function (exports, React, ReactDOM, PrimeReact, hooks,
     });
     var element = props.element || props.children;
     if (element && mountedState) {
-      var appendTo = props.appendTo || context && context.appendTo || PrimeReact__default["default"].appendTo || document.body;
+      var appendTo = props.appendTo || context && context.appendTo || PrimeReact__default["default"].appendTo;
+      if (utils.ObjectUtils.isFunction(appendTo)) {
+        appendTo = appendTo();
+      }
+      if (!appendTo) {
+        appendTo = document.body;
+      }
       return appendTo === 'self' ? element : /*#__PURE__*/ReactDOM__default["default"].createPortal(element, appendTo);
     }
     return null;
@@ -6664,7 +6895,7 @@ this.primereact.icons.arrowdown = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -7370,7 +7601,7 @@ this.primereact.icons.arrowup = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -8076,7 +8307,7 @@ this.primereact.icons.ban = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -9230,7 +9461,7 @@ this.primereact.icons.exclamationtriangle = (function (exports, React, iconbase)
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -10006,7 +10237,7 @@ this.primereact.icons.eyeslash = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -10712,7 +10943,7 @@ this.primereact.icons.filter = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -11416,7 +11647,7 @@ this.primereact.icons.filterslash = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -12122,7 +12353,7 @@ this.primereact.icons.infocircle = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -12892,7 +13123,7 @@ this.primereact.icons.pencil = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -13596,7 +13827,7 @@ this.primereact.icons.plus = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -14300,7 +14531,7 @@ this.primereact.icons.refresh = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -15006,7 +15237,7 @@ this.primereact.icons.search = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -15712,7 +15943,7 @@ this.primereact.icons.searchminus = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -16418,7 +16649,7 @@ this.primereact.icons.searchplus = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -17124,7 +17355,7 @@ this.primereact.icons.sortalt = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -17837,7 +18068,7 @@ this.primereact.icons.sortamountdown = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -18556,7 +18787,7 @@ this.primereact.icons.sortamountupalt = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -19275,7 +19506,7 @@ this.primereact.icons.spinner = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -19979,7 +20210,7 @@ this.primereact.icons.star = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -20683,7 +20914,7 @@ this.primereact.icons.starfill = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -21387,7 +21618,7 @@ this.primereact.icons.thlarge = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -22157,7 +22388,7 @@ this.primereact.icons.timescircle = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -22863,7 +23094,7 @@ this.primereact.icons.trash = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -23569,7 +23800,7 @@ this.primereact.icons.undo = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -24275,7 +24506,7 @@ this.primereact.icons.upload = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -24981,7 +25212,7 @@ this.primereact.icons.windowmaximize = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -25687,7 +25918,7 @@ this.primereact.icons.windowminimize = (function (exports, React, iconbase) {
     }, {
       key: "isLetter",
       value: function isLetter(_char2) {
-        return _char2 && (_char2.toUpperCase() != _char2.toLowerCase() || _char2.codePointAt(0) > 127);
+        return /^[a-zA-Z\u00C0-\u017F]$/.test(_char2);
       }
 
       /**
@@ -26102,6 +26333,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var Tooltip = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(PrimeReact.PrimeReactContext);
     var props = TooltipBase.getProps(inProps, context);
     var _React$useState = React__namespace.useState(false),
@@ -26562,7 +26794,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
     });
     var createElement = function createElement() {
       var empty = isTargetContentEmpty(currentTargetRef.current);
-      var rootProps = utils.mergeProps({
+      var rootProps = mergeProps({
         id: props.id,
         className: utils.classNames(props.className, cx('root', {
           positionState: positionState,
@@ -26578,11 +26810,11 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
           return _onMouseLeave(e);
         }
       }, TooltipBase.getOtherProps(props), ptm('root'));
-      var arrowProps = utils.mergeProps({
+      var arrowProps = mergeProps({
         className: cx('arrow'),
         style: sx('arrow', _objectSpread({}, metaData))
       }, ptm('arrow'));
-      var textProps = utils.mergeProps({
+      var textProps = mergeProps({
         className: cx('text')
       }, ptm('text'));
       return /*#__PURE__*/React__namespace.createElement("div", _extends({
@@ -27634,7 +27866,7 @@ this.primereact.overlayservice = (function (exports, utils) {
 })({}, primereact.utils);
 
 this.primereact = this.primereact || {};
-this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip, utils, componentbase) {
+this.primereact.checkbox = (function (exports, React, api, componentbase, hooks, check, tooltip, utils) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -27828,6 +28060,7 @@ this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var Checkbox = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = CheckboxBase.getProps(inProps, context);
     var _React$useState = React__namespace.useState(false),
@@ -27862,32 +28095,32 @@ this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip
         var checkboxClicked = event.target instanceof HTMLDivElement || event.target instanceof HTMLSpanElement || event.target instanceof Object;
         var isInputToggled = event.target === inputRef.current;
         var isCheckboxToggled = checkboxClicked && event.target.checked !== _checked;
-        if (isInputToggled || isCheckboxToggled) {
-          var value = _checked ? props.falseValue : props.trueValue;
-          var eventData = {
-            originalEvent: event,
+        var value = _checked ? props.falseValue : props.trueValue;
+        var eventData = {
+          originalEvent: event,
+          value: props.value,
+          checked: value,
+          stopPropagation: function stopPropagation() {
+            event.stopPropagation();
+          },
+          preventDefault: function preventDefault() {
+            event.preventDefault();
+          },
+          target: {
+            type: 'checkbox',
+            name: props.name,
+            id: props.id,
             value: props.value,
-            checked: value,
-            stopPropagation: function stopPropagation() {
-              event.stopPropagation();
-            },
-            preventDefault: function preventDefault() {
-              event.preventDefault();
-            },
-            target: {
-              type: 'checkbox',
-              name: props.name,
-              id: props.id,
-              value: props.value,
-              checked: value
-            }
-          };
-          props.onClick && props.onClick(eventData);
-
-          // do not continue if the user defined click wants to prevent
-          if (event.defaultPrevented) {
-            return;
+            checked: value
           }
+        };
+        props.onClick && props.onClick(eventData);
+
+        // do not continue if the user defined click wants to prevent
+        if (event.defaultPrevented) {
+          return;
+        }
+        if (isInputToggled || isCheckboxToggled) {
           props.onChange && props.onChange(eventData);
         }
         utils.DomHandler.focus(inputRef.current);
@@ -27938,7 +28171,7 @@ this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip
     var hasTooltip = utils.ObjectUtils.isNotEmpty(props.tooltip);
     var otherProps = CheckboxBase.getOtherProps(props);
     var ariaProps = utils.ObjectUtils.reduceKeys(otherProps, utils.DomHandler.ARIA_PROPS);
-    var iconProps = utils.mergeProps({
+    var iconProps = mergeProps({
       className: cx('icon')
     }, ptm('icon'));
     var icon = checked ? props.icon || /*#__PURE__*/React__namespace.createElement(check.CheckIcon, iconProps) : null;
@@ -27946,7 +28179,7 @@ this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip
       props: props,
       checked: checked
     });
-    var rootProps = utils.mergeProps({
+    var rootProps = mergeProps({
       id: props.id,
       className: utils.classNames(props.className, cx('root', {
         checked: checked,
@@ -27959,10 +28192,10 @@ this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip
       onContextMenu: props.onContextMenu,
       onMouseDown: props.onMouseDown
     }, otherProps, ptm('root'));
-    var hiddenInputWrapperProps = utils.mergeProps({
+    var hiddenInputWrapperProps = mergeProps({
       className: 'p-hidden-accessible'
     }, ptm('hiddenInputWrapper'));
-    var hiddenInputProps = utils.mergeProps(_objectSpread({
+    var hiddenInputProps = mergeProps(_objectSpread({
       id: props.inputId,
       type: 'checkbox',
       name: props.name,
@@ -27981,7 +28214,7 @@ this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip
       readOnly: props.readOnly,
       required: props.required
     }, ariaProps), ptm('hiddenInput'));
-    var inputProps = utils.mergeProps({
+    var inputProps = mergeProps({
       className: cx('input', {
         checked: checked,
         focusedState: focusedState
@@ -28009,10 +28242,10 @@ this.primereact.checkbox = (function (exports, React, api, hooks, check, tooltip
 
   return exports;
 
-})({}, React, primereact.api, primereact.hooks, primereact.icons.check, primereact.tooltip, primereact.utils, primereact.componentbase);
+})({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.icons.check, primereact.tooltip, primereact.utils);
 
 this.primereact = this.primereact || {};
-this.primereact.button = (function (exports, React, api, componentbase, utils, spinner, ripple, tooltip) {
+this.primereact.button = (function (exports, React, api, componentbase, hooks, utils, spinner, ripple, tooltip) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -28123,6 +28356,7 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
   function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var Badge = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = BadgeBase.getProps(inProps, context);
     var _BadgeBase$setMetaDat = BadgeBase.setMetaData(_objectSpread$1({
@@ -28143,7 +28377,7 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
         }
       };
     });
-    var rootProps = utils.mergeProps({
+    var rootProps = mergeProps({
       ref: elementRef,
       style: props.style,
       className: utils.classNames(props.className, cx('root'))
@@ -28217,6 +28451,7 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var Button = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = ButtonBase.getProps(inProps, context);
     var disabled = props.disabled || props.loading;
@@ -28244,13 +28479,13 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
     }
     var createIcon = function createIcon() {
       var className = utils.classNames('p-button-icon p-c', _defineProperty({}, "p-button-icon-".concat(props.iconPos), props.label));
-      var iconsProps = utils.mergeProps({
+      var iconsProps = mergeProps({
         className: cx('icon')
       }, ptm('icon'));
       className = utils.classNames(className, {
         'p-button-loading-icon': props.loading
       });
-      var loadingIconProps = utils.mergeProps({
+      var loadingIconProps = mergeProps({
         className: cx('loadingIcon', {
           className: className
         })
@@ -28263,7 +28498,7 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
       });
     };
     var createLabel = function createLabel() {
-      var labelProps = utils.mergeProps({
+      var labelProps = mergeProps({
         className: cx('label')
       }, ptm('label'));
       if (props.label) {
@@ -28277,7 +28512,7 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
     };
     var createBadge = function createBadge() {
       if (props.badge) {
-        var badgeProps = utils.mergeProps({
+        var badgeProps = mergeProps({
           className: utils.classNames(props.badgeClassName),
           value: props.badge,
           unstyled: props.unstyled,
@@ -28300,7 +28535,7 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
     var label = createLabel();
     var badge = createBadge();
     var defaultAriaLabel = props.label ? props.label + (props.badge ? ' ' + props.badge : '') : props['aria-label'];
-    var rootProps = utils.mergeProps({
+    var rootProps = mergeProps({
       ref: elementRef,
       'aria-label': defaultAriaLabel,
       className: utils.classNames(props.className, cx('root', {
@@ -28324,10 +28559,10 @@ this.primereact.button = (function (exports, React, api, componentbase, utils, s
 
   return exports;
 
-})({}, React, primereact.api, primereact.componentbase, primereact.utils, primereact.icons.spinner, primereact.ripple, primereact.tooltip);
+})({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.utils, primereact.icons.spinner, primereact.ripple, primereact.tooltip);
 
 this.primereact = this.primereact || {};
-this.primereact.inputtext = (function (exports, React, api, componentbase, keyfilter, tooltip, utils) {
+this.primereact.inputtext = (function (exports, React, api, componentbase, hooks, keyfilter, tooltip, utils) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -28420,15 +28655,16 @@ this.primereact.inputtext = (function (exports, React, api, componentbase, keyfi
     defaultProps: {
       __TYPE: 'InputText',
       __parentMetadata: null,
+      children: undefined,
+      className: null,
       keyfilter: null,
-      validateOnly: false,
-      tooltip: null,
-      tooltipOptions: null,
       onBeforeInput: null,
       onInput: null,
       onKeyDown: null,
       onPaste: null,
-      children: undefined
+      tooltip: null,
+      tooltipOptions: null,
+      validateOnly: false
     },
     css: {
       classes: classes
@@ -28438,6 +28674,7 @@ this.primereact.inputtext = (function (exports, React, api, componentbase, keyfi
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var InputText = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = InputTextBase.getProps(inProps, context);
     var _InputTextBase$setMet = InputTextBase.setMetaData(_objectSpread(_objectSpread({
@@ -28491,10 +28728,10 @@ this.primereact.inputtext = (function (exports, React, api, componentbase, keyfi
       return utils.ObjectUtils.isNotEmpty(props.value) || utils.ObjectUtils.isNotEmpty(props.defaultValue);
     }, [props.value, props.defaultValue]);
     var hasTooltip = utils.ObjectUtils.isNotEmpty(props.tooltip);
-    var rootProps = utils.mergeProps({
-      className: cx('root', {
+    var rootProps = mergeProps({
+      className: utils.classNames(props.className, cx('root', {
         isFilled: isFilled
-      }),
+      })),
       onBeforeInput: onBeforeInput,
       onInput: onInput,
       onKeyDown: onKeyDown,
@@ -28517,7 +28754,7 @@ this.primereact.inputtext = (function (exports, React, api, componentbase, keyfi
 
   return exports;
 
-})({}, React, primereact.api, primereact.componentbase, primereact.keyfilter, primereact.tooltip, primereact.utils);
+})({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.keyfilter, primereact.tooltip, primereact.utils);
 
 this.primereact = this.primereact || {};
 this.primereact.inputnumber = (function (exports, React, PrimeReact, componentbase, hooks, angledown, angleup, inputtext, ripple, tooltip, utils) {
@@ -28748,6 +28985,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       prefix: null,
       readOnly: false,
       required: false,
+      roundingMode: undefined,
       showButtons: false,
       size: null,
       step: 1,
@@ -28770,6 +29008,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var InputNumber = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(PrimeReact.PrimeReactContext);
     var props = InputNumberBase.getProps(inProps, context);
     var _React$useState = React__namespace.useState(false),
@@ -28804,9 +29043,11 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     var _minusSign = React__namespace.useRef(null);
     var _currency = React__namespace.useRef(null);
     var _decimal = React__namespace.useRef(null);
+    var _decimalSeparator = React__namespace.useRef(null);
     var _suffix = React__namespace.useRef(null);
     var _prefix = React__namespace.useRef(null);
     var _index = React__namespace.useRef(null);
+    var isFocusedByClick = React__namespace.useRef(false);
     var _locale = props.locale || context && context.locale || PrimeReact__default["default"].locale;
     var stacked = props.showButtons && props.buttonLayout === 'stacked';
     var horizontal = props.showButtons && props.buttonLayout === 'horizontal';
@@ -28820,7 +29061,8 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
         currencyDisplay: props.currencyDisplay,
         useGrouping: props.useGrouping,
         minimumFractionDigits: props.minFractionDigits,
-        maximumFractionDigits: props.maxFractionDigits
+        maximumFractionDigits: props.maxFractionDigits,
+        roundingMode: props.roundingMode
       };
     };
     var constructParser = function constructParser() {
@@ -28832,12 +29074,13 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
         return [d, i];
       }));
       _numeral.current = new RegExp("[".concat(numerals.join(''), "]"), 'g');
-      _group.current = getGroupingExpression();
-      _minusSign.current = getMinusSignExpression();
-      _currency.current = getCurrencyExpression();
-      _decimal.current = getDecimalExpression();
-      _suffix.current = getSuffixExpression();
-      _prefix.current = getPrefixExpression();
+      _group.current = getGroupingExpression(); // regular expression /[,]/g, /[.]/g
+      _minusSign.current = getMinusSignExpression(); // regular expression /[-]/g
+      _currency.current = getCurrencyExpression(); // regular expression for currency (e.g. /[$]/g, /[€]/g, /[]/g and more)
+      _decimal.current = getDecimalExpression(); // regular expression /[,]/g, /[.]/g, /[]/g
+      _decimalSeparator.current = getDecimalSeparator(); // current decimal separator  '.', ','
+      _suffix.current = getSuffixExpression(); // regular expression for suffix (e.g. /℃/g)
+      _prefix.current = getPrefixExpression(); // regular expression for prefix (e.g. /\ days/g)
       _index.current = function (d) {
         return index.get(d);
       };
@@ -28845,6 +29088,15 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     var escapeRegExp = function escapeRegExp(text) {
       return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
     };
+
+    /**
+     * get decimal separator in current locale
+     */
+    var getDecimalSeparator = function getDecimalSeparator() {
+      return new Intl.NumberFormat(_locale, {
+        useGrouping: false
+      }).format(1.1).trim().replace(_numeral.current, '');
+    };
     var getDecimalExpression = function getDecimalExpression() {
       var formatter = new Intl.NumberFormat(_locale, _objectSpread(_objectSpread({}, getOptions()), {}, {
         useGrouping: false
@@ -28871,7 +29123,8 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
           currency: props.currency,
           currencyDisplay: props.currencyDisplay,
           minimumFractionDigits: 0,
-          maximumFractionDigits: 0
+          maximumFractionDigits: 0,
+          roundingMode: props.roundingMode
         });
         return new RegExp("[".concat(formatter.format(1).replace(/\s/g, '').replace(_numeral.current, '').replace(_group.current, ''), "]"), 'g');
       }
@@ -28899,7 +29152,8 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
           currency: props.currency,
           currencyDisplay: props.currencyDisplay,
           minimumFractionDigits: 0,
-          maximumFractionDigits: 0
+          maximumFractionDigits: 0,
+          roundingMode: props.roundingMode
         });
         suffixChar.current = formatter.format(1).split('1')[1];
       }
@@ -29164,6 +29418,14 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
             updateValue(event, newValueStr, null, 'delete-range');
           }
           break;
+
+        // End
+        case 35:
+        // Home/Pos1
+        case 36:
+          setTimeout(function () {
+            initCursor();
+          });
       }
     };
     var onInputKeyUp = function onInputKeyUp(event) {
@@ -29216,8 +29478,14 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       }
       return false;
     };
+    var replaceDecimalSeparator = function replaceDecimalSeparator(val) {
+      if (isFloat(val)) {
+        return val.toString().replace(/\.(?=[^.]*$)/, _decimalSeparator.current);
+      }
+      return val;
+    };
     var isDecimalSign = function isDecimalSign(_char3) {
-      if (_decimal.current.test(_char3)) {
+      if (_decimal.current.test(_char3) || isFloat(_char3)) {
         _decimal.current.lastIndex = 0;
         return true;
       }
@@ -29226,6 +29494,12 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     var isDecimalMode = function isDecimalMode() {
       return props.mode === 'decimal';
     };
+    var isFloat = function isFloat(val) {
+      var formatter = new Intl.NumberFormat(_locale, getOptions());
+      var parseVal = parseValue(formatter.format(val));
+      if (parseVal === null) return false;
+      return parseVal % 1 !== 0;
+    };
     var getDecimalCharIndexes = function getDecimalCharIndexes(val) {
       var decimalCharIndex = val.search(_decimal.current);
       _decimal.current.lastIndex = 0;
@@ -29309,12 +29583,15 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
         }
       }
     };
+    var replaceSuffix = function replaceSuffix(value) {
+      return value ? value.replace(_suffix.current, '').trim().replace(/\s/g, '').replace(_currency.current, '') : value;
+    };
     var insertText = function insertText(value, text, start, end) {
       var textSplit = text === '.' ? text : text.split('.');
       if (textSplit.length === 2) {
         var decimalCharIndex = value.slice(start, end).search(_decimal.current);
         _decimal.current.lastIndex = 0;
-        return decimalCharIndex > 0 ? value.slice(0, start) + formatValue(text) + value.slice(end) : value || formatValue(text);
+        return decimalCharIndex > 0 ? value.slice(0, start) + formatValue(text) + replaceSuffix(value).slice(end) : value || formatValue(text);
       } else if (end - start === value.length) {
         return formatValue(text);
       } else if (start === 0) {
@@ -29323,7 +29600,10 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       } else if (end === value.length) {
         return value.slice(0, start) + text;
       } else {
-        return value.slice(0, start) + text + value.slice(end);
+        var selectionValue = value.slice(start, end);
+        // Fix: if the suffix starts with a space, the input will be cleared after pasting
+        var space = /\s$/.test(selectionValue) ? ' ' : '';
+        return value.slice(0, start) + text + space + value.slice(end);
       }
     };
     var deleteRange = function deleteRange(value, start, end) {
@@ -29376,6 +29656,9 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       }
       return index || 0;
     };
+    var onInputPointerDown = function onInputPointerDown() {
+      isFocusedByClick.current = true;
+    };
     var onInputClick = function onInputClick() {
       initCursor();
     };
@@ -29477,7 +29760,12 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
           inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
         } else if (newLength === currentLength) {
           if (operation === 'insert' || operation === 'delete-back-single') {
-            var newSelectionEnd = _selectionEnd + Number(isDecimalSign(value) || isDecimalSign(insertedValueStr));
+            var newSelectionEnd = _selectionEnd;
+            if (insertedValueStr === '0') {
+              newSelectionEnd = _selectionEnd + 1;
+            } else {
+              newSelectionEnd = newSelectionEnd + Number(isDecimalSign(value) || isDecimalSign(insertedValueStr));
+            }
             inputEl.setSelectionRange(newSelectionEnd, newSelectionEnd);
           } else if (operation === 'delete-single') {
             inputEl.setSelectionRange(_selectionEnd - 1, _selectionEnd - 1);
@@ -29525,7 +29813,8 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       if (val1 && val2) {
         var decimalCharIndex = val2.search(_decimal.current);
         _decimal.current.lastIndex = 0;
-        return decimalCharIndex !== -1 ? val1.split(_decimal.current)[0] + val2.slice(decimalCharIndex) : val1;
+        var newVal1 = replaceDecimalSeparator(val1).split(_decimal.current)[0].replace(_suffix.current, '').trim();
+        return decimalCharIndex !== -1 ? newVal1 + val2.slice(decimalCharIndex) : val1;
       }
       return val1;
     };
@@ -29533,7 +29822,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       if (value) {
         var valueSplit = value.split(_decimal.current);
         if (valueSplit.length === 2) {
-          return valueSplit[1].replace(_suffix.current, '').trim().replace(/\s/g, '').replace(_currency.current, '').length;
+          return replaceSuffix(valueSplit[1]).length;
         }
       }
       return 0;
@@ -29560,14 +29849,18 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     var onInputFocus = function onInputFocus(event) {
       setFocusedState(true);
       props.onFocus && props.onFocus(event);
-      if ((props.suffix || props.currency || props.prefix) && inputRef.current) {
-        // GitHub #1866 Cursor must be placed before/after symbol or arrow keys don't work
-        var selectionEnd = initCursor();
-        inputRef.current.setSelectionRange(selectionEnd, selectionEnd);
+      if ((props.suffix || props.currency || props.prefix) && inputRef.current && !isFocusedByClick.current) {
+        // GitHub #1866,#5537
+        var inputValue = inputRef.current.value;
+        var prefixLength = (prefixChar.current || '').length;
+        var suffixLength = (suffixChar.current || '').length;
+        var end = inputValue.length === 0 ? 0 : inputValue.length - suffixLength;
+        inputRef.current.setSelectionRange(prefixLength, end);
       }
     };
     var onInputBlur = function onInputBlur(event) {
       setFocusedState(false);
+      isFocusedByClick.current = false;
       if (inputRef.current) {
         var currentValue = inputRef.current.value;
         if (isValueChanged(currentValue, props.value)) {
@@ -29584,7 +29877,8 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       }
     };
     var changeValue = function changeValue() {
-      updateInputValue(validateValueByLimit(props.value));
+      var val = validateValueByLimit(props.value);
+      updateInputValue(props.format ? val : replaceDecimalSeparator(val));
       var newValue = validateValue(props.value);
       if (props.value !== null && props.value !== newValue) {
         updateModel(null, newValue);
@@ -29657,6 +29951,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
         onKeyPress: onInputKeyUp,
         onInput: onInput,
         onClick: onInputClick,
+        onPointerDown: onInputPointerDown,
         onBlur: onInputBlur,
         onFocus: onInputFocus,
         onPaste: onPaste,
@@ -29673,14 +29968,14 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       }));
     };
     var createUpButton = function createUpButton() {
-      var incrementIconProps = utils.mergeProps({
+      var incrementIconProps = mergeProps({
         className: cx('incrementIcon')
       }, ptm('incrementIcon'));
       var icon = props.incrementButtonIcon || /*#__PURE__*/React__namespace.createElement(angleup.AngleUpIcon, incrementIconProps);
       var upButton = utils.IconUtils.getJSXIcon(icon, _objectSpread({}, incrementIconProps), {
         props: props
       });
-      var incrementButtonProps = utils.mergeProps({
+      var incrementButtonProps = mergeProps({
         type: 'button',
         className: utils.classNames(props.incrementButtonClassName, cx('incrementButton')),
         onPointerLeave: onUpButtonMouseLeave,
@@ -29699,14 +29994,14 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       return /*#__PURE__*/React__namespace.createElement("button", incrementButtonProps, upButton, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
     };
     var createDownButton = function createDownButton() {
-      var decrementIconProps = utils.mergeProps({
+      var decrementIconProps = mergeProps({
         className: cx('decrementIcon')
       }, ptm('decrementIcon'));
       var icon = props.decrementButtonIcon || /*#__PURE__*/React__namespace.createElement(angledown.AngleDownIcon, decrementIconProps);
       var downButton = utils.IconUtils.getJSXIcon(icon, _objectSpread({}, decrementIconProps), {
         props: props
       });
-      var decrementButtonProps = utils.mergeProps({
+      var decrementButtonProps = mergeProps({
         type: 'button',
         className: utils.classNames(props.decrementButtonClassName, cx('decrementButton')),
         onPointerLeave: onDownButtonMouseLeave,
@@ -29727,7 +30022,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     var createButtonGroup = function createButtonGroup() {
       var upButton = props.showButtons && createUpButton();
       var downButton = props.showButtons && createDownButton();
-      var buttonGroupProps = utils.mergeProps({
+      var buttonGroupProps = mergeProps({
         className: cx('buttonGroup')
       }, ptm('buttonGroup'));
       if (stacked) {
@@ -29741,7 +30036,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     var ariaProps = utils.ObjectUtils.reduceKeys(otherProps, utils.DomHandler.ARIA_PROPS);
     var inputElement = createInputElement();
     var buttonGroup = createButtonGroup();
-    var rootProps = utils.mergeProps({
+    var rootProps = mergeProps({
       id: props.id,
       className: utils.classNames(props.className, cx('root', {
         focusedState: focusedState,
@@ -29771,7 +30066,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
 })({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.icons.angledown, primereact.icons.angleup, primereact.inputtext, primereact.ripple, primereact.tooltip, primereact.utils);
 
 this.primereact = this.primereact || {};
-this.primereact.messages = (function (exports, React, reactTransitionGroup, api, componentbase, csstransition, utils, hooks, check, exclamationtriangle, infocircle, times, timescircle, ripple) {
+this.primereact.messages = (function (exports, React, reactTransitionGroup, api, componentbase, csstransition, hooks, utils, check, exclamationtriangle, infocircle, times, timescircle, ripple) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -30099,6 +30394,7 @@ this.primereact.messages = (function (exports, React, reactTransitionGroup, api,
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var messageIdx = 0;
   var Messages = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = MessagesBase.getProps(inProps, context);
     var _React$useState = React__namespace.useState([]),
@@ -30185,13 +30481,13 @@ this.primereact.messages = (function (exports, React, reactTransitionGroup, api,
         }
       };
     });
-    var rootProps = utils.mergeProps({
+    var rootProps = mergeProps({
       id: props.id,
       className: props.className,
       style: props.style
     }, MessagesBase.getOtherProps(props), ptCallbacks.ptm('root'));
-    var transitionProps = utils.mergeProps({
-      classNames: ptCallbacks.cx('transition'),
+    var transitionProps = mergeProps({
+      classNames: ptCallbacks.cx('uimessage.transition'),
       unmountOnExit: true,
       timeout: {
         enter: 300,
@@ -30226,10 +30522,10 @@ this.primereact.messages = (function (exports, React, reactTransitionGroup, api,
 
   return exports;
 
-})({}, React, ReactTransitionGroup, primereact.api, primereact.componentbase, primereact.csstransition, primereact.utils, primereact.hooks, primereact.icons.check, primereact.icons.exclamationtriangle, primereact.icons.infocircle, primereact.icons.times, primereact.icons.timescircle, primereact.ripple);
+})({}, React, ReactTransitionGroup, primereact.api, primereact.componentbase, primereact.csstransition, primereact.hooks, primereact.utils, primereact.icons.check, primereact.icons.exclamationtriangle, primereact.icons.infocircle, primereact.icons.times, primereact.icons.timescircle, primereact.ripple);
 
 this.primereact = this.primereact || {};
-this.primereact.progressbar = (function (exports, React, api, componentbase, utils) {
+this.primereact.progressbar = (function (exports, React, api, componentbase, hooks, utils) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -30357,6 +30653,7 @@ this.primereact.progressbar = (function (exports, React, api, componentbase, uti
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var ProgressBar = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = ProgressBarBase.getProps(inProps, context);
     var _ProgressBarBase$setM = ProgressBarBase.setMetaData(_objectSpread({
@@ -30378,7 +30675,7 @@ this.primereact.progressbar = (function (exports, React, api, componentbase, uti
     };
     var createDeterminate = function createDeterminate() {
       var label = createLabel();
-      var rootProps = utils.mergeProps({
+      var rootProps = mergeProps({
         className: utils.classNames(props.className, cx('root')),
         style: props.style,
         role: 'progressbar',
@@ -30386,7 +30683,7 @@ this.primereact.progressbar = (function (exports, React, api, componentbase, uti
         'aria-valuenow': props.value,
         'aria-valuemax': '100'
       }, ProgressBarBase.getOtherProps(props), ptm('root'));
-      var valueProps = utils.mergeProps({
+      var valueProps = mergeProps({
         className: cx('value'),
         style: {
           width: props.value + '%',
@@ -30394,7 +30691,7 @@ this.primereact.progressbar = (function (exports, React, api, componentbase, uti
           backgroundColor: props.color
         }
       }, ptm('value'));
-      var labelProps = utils.mergeProps({
+      var labelProps = mergeProps({
         className: cx('label')
       }, ptm('label'));
       return /*#__PURE__*/React__namespace.createElement("div", _extends({
@@ -30403,7 +30700,7 @@ this.primereact.progressbar = (function (exports, React, api, componentbase, uti
       }, rootProps), /*#__PURE__*/React__namespace.createElement("div", valueProps, label != null && /*#__PURE__*/React__namespace.createElement("div", labelProps, label)));
     };
     var createIndeterminate = function createIndeterminate() {
-      var rootProps = utils.mergeProps({
+      var rootProps = mergeProps({
         className: utils.classNames(props.className, cx('root')),
         style: props.style,
         role: 'progressbar',
@@ -30411,10 +30708,10 @@ this.primereact.progressbar = (function (exports, React, api, componentbase, uti
         'aria-valuenow': props.value,
         'aria-valuemax': '100'
       }, ProgressBarBase.getOtherProps(props), ptm('root'));
-      var containerProps = utils.mergeProps({
+      var containerProps = mergeProps({
         className: cx('container')
       }, ptm('container'));
-      var valueProps = utils.mergeProps({
+      var valueProps = mergeProps({
         className: cx('value'),
         style: {
           backgroundColor: props.color
@@ -30443,10 +30740,10 @@ this.primereact.progressbar = (function (exports, React, api, componentbase, uti
 
   return exports;
 
-})({}, React, primereact.api, primereact.componentbase, primereact.utils);
+})({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.utils);
 
 this.primereact = this.primereact || {};
-this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase, hooks, chevrondown, times, overlayservice, tooltip, utils, csstransition, search, portal, virtualscroller, ripple, spinner) {
+this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase, hooks, chevrondown, spinner, times, overlayservice, tooltip, utils, csstransition, search, portal, virtualscroller, ripple) {
   'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -30616,6 +30913,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
     loadingIcon: 'p-dropdown-trigger-icon p-clickable',
     clearIcon: 'p-dropdown-clear-icon p-clickable',
     filterIcon: 'p-dropdown-filter-icon',
+    filterClearIcon: 'p-dropdown-filter-clear-icon',
     filterContainer: function filterContainer(_ref4) {
       var clearIcon = _ref4.clearIcon;
       return utils.classNames('p-dropdown-filter-container', {
@@ -30737,6 +31035,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
   });
 
   var DropdownItem = /*#__PURE__*/React__namespace.memo(function (props) {
+    var mergeProps = hooks.useMergeProps();
     var ptm = props.ptm,
       cx = props.cx,
       selected = props.selected,
@@ -30760,7 +31059,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       }
     };
     var content = props.template ? utils.ObjectUtils.getJSXElement(props.template, props.option) : props.label;
-    var itemProps = utils.mergeProps({
+    var itemProps = mergeProps({
       role: 'option',
       key: props.label,
       className: utils.classNames(option.className, cx('item', {
@@ -30784,6 +31083,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
   function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var DropdownPanel = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
+    var mergeProps = hooks.useMergeProps();
     var ptm = props.ptm,
       cx = props.cx,
       sx = props.sx;
@@ -30830,7 +31130,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
     var createFooter = function createFooter() {
       if (props.panelFooterTemplate) {
         var content = utils.ObjectUtils.getJSXElement(props.panelFooterTemplate, props, props.onOverlayHide);
-        var footerProps = utils.mergeProps({
+        var footerProps = mergeProps({
           className: cx('footer')
         }, getPTOptions('footer'));
         return /*#__PURE__*/React__namespace.createElement("div", footerProps, content);
@@ -30859,7 +31159,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
     };
     var createEmptyMessage = function createEmptyMessage(emptyMessage, isFilter) {
       var message = utils.ObjectUtils.getJSXElement(emptyMessage, props) || PrimeReact.localeOption(isFilter ? 'emptyFilterMessage' : 'emptyMessage');
-      var emptyMessageProps = utils.mergeProps({
+      var emptyMessageProps = mergeProps({
         className: cx('emptyMessage')
       }, getPTOptions('emptyMessage'));
       return /*#__PURE__*/React__namespace.createElement("li", emptyMessageProps, message);
@@ -30875,11 +31175,12 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         var groupContent = props.optionGroupTemplate ? utils.ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : props.getOptionGroupLabel(option);
         var groupChildrenContent = createGroupChildren(option, style);
         var key = index + '_' + props.getOptionGroupRenderKey(option);
-        var itemGroupProps = utils.mergeProps({
+        var itemGroupProps = mergeProps({
           className: cx('itemGroup', {
             optionGroupLabel: optionGroupLabel
           }),
-          style: style
+          style: style,
+          'data-p-highlight': props.selected
         }, getPTOptions('itemGroup'));
         return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
           key: key
@@ -30913,15 +31214,15 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
     var createFilterClearIcon = function createFilterClearIcon() {
       if (props.showFilterClear && props.filterValue) {
         var ariaLabel = PrimeReact.localeOption('clear');
-        var clearIconProps = utils.mergeProps({
-          className: cx('clearIcon'),
+        var clearIconProps = mergeProps({
+          className: cx('filterClearIcon'),
           'aria-label': ariaLabel,
           onClick: function onClick() {
             return props.onFilterClearIconClick(function () {
               return utils.DomHandler.focus(filterInputRef.current);
             });
           }
-        }, getPTOptions('clearIcon'));
+        }, getPTOptions('filterClearIcon'));
         var icon = props.filterClearIcon || /*#__PURE__*/React__namespace.createElement(times.TimesIcon, clearIconProps);
         var filterClearIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$1({}, clearIconProps), {
           props: props
@@ -30933,19 +31234,19 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
     var createFilter = function createFilter() {
       if (props.filter) {
         var clearIcon = createFilterClearIcon();
-        var filterIconProps = utils.mergeProps({
+        var filterIconProps = mergeProps({
           className: cx('filterIcon')
         }, getPTOptions('filterIcon'));
         var icon = props.filterIcon || /*#__PURE__*/React__namespace.createElement(search.SearchIcon, filterIconProps);
         var filterIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$1({}, filterIconProps), {
           props: props
         });
-        var filterContainerProps = utils.mergeProps({
+        var filterContainerProps = mergeProps({
           className: cx('filterContainer', {
             clearIcon: clearIcon
           })
         }, getPTOptions('filterContainer'));
-        var filterInputProps = utils.mergeProps({
+        var filterInputProps = mergeProps({
           ref: filterInputRef,
           type: 'text',
           autoComplete: 'off',
@@ -30973,7 +31274,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
           };
           content = utils.ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
         }
-        var headerProps = utils.mergeProps({
+        var headerProps = mergeProps({
           className: cx('header')
         }, getPTOptions('header'));
         return /*#__PURE__*/React__namespace.createElement("div", headerProps, content);
@@ -31000,7 +31301,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
           contentTemplate: function contentTemplate(options) {
             var emptyMessage = props.hasFilter ? props.emptyFilterMessage : props.emptyMessage;
             var content = isEmptyFilter ? createEmptyMessage(emptyMessage) : options.children;
-            var listProps = utils.mergeProps({
+            var listProps = mergeProps({
               ref: options.contentRef,
               style: options.style,
               className: utils.classNames(options.className, cx('list', {
@@ -31018,11 +31319,11 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         }));
       } else {
         var items = createItems();
-        var wrapperProps = utils.mergeProps({
+        var wrapperProps = mergeProps({
           className: cx('wrapper'),
           style: sx('wrapper')
         }, getPTOptions('wrapper'));
-        var listProps = utils.mergeProps({
+        var listProps = mergeProps({
           className: cx('list'),
           role: 'listbox'
         }, getPTOptions('list'));
@@ -31033,14 +31334,14 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       var filter = createFilter();
       var content = createContent();
       var footer = createFooter();
-      var panelProps = utils.mergeProps({
+      var panelProps = mergeProps({
         className: utils.classNames(props.panelClassName, cx('panel', {
           context: context
         })),
         style: sx('panel'),
         onClick: props.onClick
       }, getPTOptions('panel'));
-      var transitionProps = utils.mergeProps({
+      var transitionProps = mergeProps({
         classNames: cx('transition'),
         "in": props["in"],
         timeout: {
@@ -31074,6 +31375,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var Dropdown = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(PrimeReact.PrimeReactContext);
     var props = DropdownBase.getProps(inProps, context);
     var _React$useState = React__namespace.useState(''),
@@ -31160,7 +31462,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       }
     };
     var isClearClicked = function isClearClicked(event) {
-      return utils.DomHandler.hasClass(event.target, 'p-dropdown-clear-icon') || utils.DomHandler.hasClass(event.target, 'p-dropdown-filter-clear-icon');
+      return utils.DomHandler.isAttributeEquals(event.target, 'data-pc-section', 'clearicon') || utils.DomHandler.isAttributeEquals(event.target.parentElement || event.target, 'data-pc-section', 'filterclearicon');
     };
     var _onClick = function onClick(event) {
       if (props.disabled || props.loading) {
@@ -31172,7 +31474,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       if (event.defaultPrevented) {
         return;
       }
-      if (utils.DomHandler.hasClass(event.target, 'p-dropdown-clear-icon') || event.target.tagName === 'INPUT') {
+      if (isClearClicked(event) || event.target.tagName === 'INPUT') {
         return;
       } else if (!overlayRef.current || !(overlayRef.current && overlayRef.current.contains(event.target))) {
         utils.DomHandler.focus(focusInputRef.current);
@@ -31475,6 +31777,9 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
           }
         });
       }
+      if (props.filter) {
+        resetFilter();
+      }
       updateEditableLabel();
     };
     var selectItem = function selectItem(event) {
@@ -31566,7 +31871,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       utils.DomHandler.alignOverlay(overlayRef.current, inputRef.current.parentElement, props.appendTo || context && context.appendTo || PrimeReact__default["default"].appendTo);
     };
     var scrollInView = function scrollInView() {
-      var highlightItem = utils.DomHandler.findSingle(overlayRef.current, 'li.p-highlight');
+      var highlightItem = utils.DomHandler.findSingle(overlayRef.current, 'li[data-p-highlight="true"]');
       if (highlightItem && highlightItem.scrollIntoView) {
         highlightItem.scrollIntoView({
           block: 'nearest',
@@ -31686,10 +31991,10 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
           label: getOptionLabel(selectedOption)
         };
       }
-      var hiddenSelectedMessageProps = utils.mergeProps({
+      var hiddenSelectedMessageProps = mergeProps({
         className: 'p-hidden-accessible p-dropdown-hidden-select'
       }, ptm('hiddenSelectedMessage'));
-      var selectProps = utils.mergeProps({
+      var selectProps = mergeProps({
         ref: inputRef,
         required: props.required,
         defaultValue: option.value,
@@ -31697,16 +32002,16 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         tabIndex: -1,
         'aria-hidden': 'true'
       }, ptm('select'));
-      var optionProps = utils.mergeProps({
+      var optionProps = mergeProps({
         value: option.value
       }, ptm('option'));
       return /*#__PURE__*/React__namespace.createElement("div", hiddenSelectedMessageProps, /*#__PURE__*/React__namespace.createElement("select", selectProps, /*#__PURE__*/React__namespace.createElement("option", optionProps, option.label)));
     };
     var createKeyboardHelper = function createKeyboardHelper() {
-      var hiddenSelectedMessageProps = utils.mergeProps({
+      var hiddenSelectedMessageProps = mergeProps({
         className: 'p-hidden-accessible'
       }, ptm('hiddenSelectedMessage'));
-      var inputProps = utils.mergeProps(_objectSpread({
+      var inputProps = mergeProps(_objectSpread({
         ref: focusInputRef,
         id: props.inputId,
         type: 'text',
@@ -31716,7 +32021,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         onBlur: onInputBlur,
         onKeyDown: onInputKeyDown,
         disabled: props.disabled,
-        tabIndex: props.tabIndex
+        tabIndex: props.tabIndex || 0
       }, ariaProps), ptm('input'));
       return /*#__PURE__*/React__namespace.createElement("div", hiddenSelectedMessageProps, /*#__PURE__*/React__namespace.createElement("input", inputProps));
     };
@@ -31724,7 +32029,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       var label = utils.ObjectUtils.isNotEmpty(selectedOption) ? getOptionLabel(selectedOption) : null;
       if (props.editable) {
         var value = label || props.value || '';
-        var inputProps = utils.mergeProps(_objectSpread({
+        var inputProps = mergeProps(_objectSpread({
           ref: inputRef,
           type: 'text',
           defaultValue: value,
@@ -31737,23 +32042,25 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
           onInput: onEditableInputChange,
           onFocus: onEditableInputFocus,
           onBlur: onInputBlur,
+          tabIndex: props.tabIndex || 0,
           'aria-haspopup': 'listbox'
         }, ariaProps), ptm('input'));
         return /*#__PURE__*/React__namespace.createElement("input", inputProps);
       } else {
         var content = props.valueTemplate ? utils.ObjectUtils.getJSXElement(props.valueTemplate, selectedOption, props) : label || props.placeholder || 'empty';
-        var _inputProps = utils.mergeProps({
+        var _inputProps = mergeProps({
           ref: inputRef,
           className: cx('input', {
             label: label
-          })
+          }),
+          tabIndex: '-1'
         }, ptm('input'));
         return /*#__PURE__*/React__namespace.createElement("span", _inputProps, content);
       }
     };
     var createClearIcon = function createClearIcon() {
       if (props.value != null && props.showClear && !props.disabled) {
-        var clearIconProps = utils.mergeProps({
+        var clearIconProps = mergeProps({
           className: cx('clearIcon'),
           onPointerUp: clear
         }, ptm('clearIcon'));
@@ -31765,7 +32072,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       return null;
     };
     var createLoadingIcon = function createLoadingIcon() {
-      var loadingIconProps = utils.mergeProps({
+      var loadingIconProps = mergeProps({
         className: cx('loadingIcon'),
         'data-pr-overlay-visible': overlayVisibleState
       }, ptm('loadingIcon'));
@@ -31776,7 +32083,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         props: props
       });
       var ariaLabel = props.placeholder || props.ariaLabel;
-      var loadingButtonProps = utils.mergeProps({
+      var loadingButtonProps = mergeProps({
         className: cx('trigger'),
         role: 'button',
         'aria-haspopup': 'listbox',
@@ -31786,7 +32093,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       return /*#__PURE__*/React__namespace.createElement("div", loadingButtonProps, loadingIcon);
     };
     var createDropdownIcon = function createDropdownIcon() {
-      var dropdownIconProps = utils.mergeProps({
+      var dropdownIconProps = mergeProps({
         className: cx('dropdownIcon'),
         'data-pr-overlay-visible': overlayVisibleState
       }, ptm('dropdownIcon'));
@@ -31795,7 +32102,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         props: props
       });
       var ariaLabel = props.placeholder || props.ariaLabel;
-      var triggerProps = utils.mergeProps({
+      var triggerProps = mergeProps({
         className: cx('trigger'),
         role: 'button',
         'aria-haspopup': 'listbox',
@@ -31814,7 +32121,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
     var labelElement = createLabel();
     var dropdownIcon = props.loading ? createLoadingIcon() : createDropdownIcon();
     var clearIcon = createClearIcon();
-    var rootProps = utils.mergeProps({
+    var rootProps = mergeProps({
       id: props.id,
       ref: elementRef,
       className: utils.classNames(props.className, cx('root', {
@@ -31876,10 +32183,10 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
 
   return exports;
 
-})({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.icons.chevrondown, primereact.icons.times, primereact.overlayservice, primereact.tooltip, primereact.utils, primereact.csstransition, primereact.icons.search, primereact.portal, primereact.virtualscroller, primereact.ripple, primereact.icons.spinner);
+})({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.icons.chevrondown, primereact.icons.spinner, primereact.icons.times, primereact.overlayservice, primereact.tooltip, primereact.utils, primereact.csstransition, primereact.icons.search, primereact.portal, primereact.virtualscroller, primereact.ripple);
 
 this.primereact = this.primereact || {};
-this.primereact.dialog = (function (exports, React, utils, PrimeReact, componentbase, csstransition, hooks, times, windowmaximize, windowminimize, portal, ripple) {
+this.primereact.dialog = (function (exports, React, PrimeReact, componentbase, csstransition, hooks, times, windowmaximize, windowminimize, portal, ripple, utils) {
   'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -32032,106 +32339,6 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
   }
 
-  var usePrevious = function usePrevious(newValue) {
-    var ref = React__namespace.useRef(undefined);
-    React__namespace.useEffect(function () {
-      ref.current = newValue;
-    });
-    return ref.current;
-  };
-
-  /* eslint-disable */
-  var useUnmountEffect = function useUnmountEffect(fn) {
-    return React__namespace.useEffect(function () {
-      return fn;
-    }, []);
-  };
-  /* eslint-enable */
-
-  /* eslint-disable */
-  var useEventListener = function useEventListener(_ref) {
-    var _ref$target = _ref.target,
-      target = _ref$target === void 0 ? 'document' : _ref$target,
-      type = _ref.type,
-      listener = _ref.listener,
-      options = _ref.options,
-      _ref$when = _ref.when,
-      when = _ref$when === void 0 ? true : _ref$when;
-    var targetRef = React__namespace.useRef(null);
-    var listenerRef = React__namespace.useRef(null);
-    var prevListener = usePrevious(listener);
-    var prevOptions = usePrevious(options);
-    var bind = function bind() {
-      var bindOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      if (utils.ObjectUtils.isNotEmpty(bindOptions.target)) {
-        unbind();
-        (bindOptions.when || when) && (targetRef.current = utils.DomHandler.getTargetElement(bindOptions.target));
-      }
-      if (!listenerRef.current && targetRef.current) {
-        listenerRef.current = function (event) {
-          return listener && listener(event);
-        };
-        targetRef.current.addEventListener(type, listenerRef.current, options);
-      }
-    };
-    var unbind = function unbind() {
-      if (listenerRef.current) {
-        targetRef.current.removeEventListener(type, listenerRef.current, options);
-        listenerRef.current = null;
-      }
-    };
-    React__namespace.useEffect(function () {
-      if (when) {
-        targetRef.current = utils.DomHandler.getTargetElement(target);
-      } else {
-        unbind();
-        targetRef.current = null;
-      }
-    }, [target, when]);
-    React__namespace.useEffect(function () {
-      // to properly compare functions we can implicitly converting the function to it's body's text as a String
-      if (listenerRef.current && ('' + prevListener !== '' + listener || prevOptions !== options)) {
-        unbind();
-        when && bind();
-      }
-    }, [listener, options, when]);
-    useUnmountEffect(function () {
-      unbind();
-    });
-    return [bind, unbind];
-  };
-  /* eslint-enable */
-
-  var useOnEscapeKey = function useOnEscapeKey(ref, condition, callback) {
-    var handleEsc = function handleEsc(event) {
-      if (event.key === 'Esc' || event.key === 'Escape') {
-        event.stopImmediatePropagation();
-        callback(event);
-      }
-      return;
-    };
-    var _useEventListener = useEventListener({
-        type: 'keydown',
-        listener: handleEsc
-      }),
-      _useEventListener2 = _slicedToArray(_useEventListener, 2),
-      bindKeyDownListener = _useEventListener2[0],
-      unbindKeyDownListener = _useEventListener2[1];
-    React__namespace.useEffect(function () {
-      if (!condition) {
-        return;
-      }
-      if (!ref.current) {
-        return;
-      }
-      bindKeyDownListener();
-      return function () {
-        unbindKeyDownListener();
-      };
-    });
-    return [ref, callback];
-  };
-
   function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var classes = {
@@ -32263,6 +32470,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(PrimeReact.PrimeReactContext);
     var props = DialogBase.getProps(inProps, context);
     var uniqueId = props.id ? props.id : utils.UniqueComponentId();
@@ -32298,6 +32506,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     var focusElementOnHide = React__namespace.useRef(null);
     var maximized = props.onMaximize ? props.maximized : maximizedState;
     var shouldBlockScroll = visibleState && (props.blockScroll || props.maximizable && maximized);
+    var displayOrder = hooks.useDisplayOrder('dialog', visibleState);
     var _DialogBase$setMetaDa = DialogBase.setMetaData(_objectSpread(_objectSpread({
         props: props
       }, props.__parentMetadata), {}, {
@@ -32314,15 +32523,14 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     componentbase.useHandleStyle(DialogBase.css.styles, isUnstyled, {
       name: 'dialog'
     });
-    useOnEscapeKey(maskRef, props.closable && props.closeOnEscape, function (event) {
-      var currentTarget = event.currentTarget;
-      if (!currentTarget || !currentTarget.primeDialogParams) {
-        return;
-      }
-      var params = currentTarget.primeDialogParams;
-      var paramLength = params.length;
-      onClose(event);
-      params.splice(paramLength - 1, 1);
+    hooks.useGlobalOnEscapeKey({
+      callback: function callback(event) {
+        if (props.closable && props.closeOnEscape) {
+          onClose(event);
+        }
+      },
+      when: visibleState && displayOrder,
+      priority: [hooks.ESC_KEY_HANDLING_PRIORITIES.DIALOG, displayOrder]
     });
     var _useEventListener = hooks.useEventListener({
         type: 'keydown',
@@ -32582,11 +32790,9 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     };
     var enableDocumentSettings = function enableDocumentSettings() {
       bindGlobalListeners();
-      updateGlobalDialogsRegistry(true);
     };
     var disableDocumentSettings = function disableDocumentSettings() {
       unbindGlobalListeners();
-      updateGlobalDialogsRegistry(false);
     };
     var updateScrollBlocker = function updateScrollBlocker() {
       // Scroll should be unblocked if there is at least one dialog that blocks scrolling:
@@ -32600,7 +32806,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
       }
     };
     var updateGlobalDialogsRegistry = function updateGlobalDialogsRegistry(isMounted) {
-      // Update current dialog info in global registry if it is mounted :
+      // Update current dialog info in global registry if it is mounted and visible:
       if (isMounted && visibleState) {
         var newParam = {
           id: idState,
@@ -32620,7 +32826,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
           document.primeDialogParams = document.primeDialogParams.toSpliced(currentDialogIndexInRegistry, 1, newParam);
         }
       }
-      // Or remove it from global registry if unmounted:
+      // Or remove it from global registry if unmounted or invisible:
       else {
         document.primeDialogParams = document.primeDialogParams && document.primeDialogParams.filter(function (param) {
           return param.id !== idState;
@@ -32650,21 +32856,31 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
       unbindDocumentKeyDownListener();
     };
     var createStyle = function createStyle() {
-      styleElement.current = utils.DomHandler.createInlineStyle(context && context.nonce || PrimeReact__default["default"].nonce);
+      styleElement.current = utils.DomHandler.createInlineStyle(context && context.nonce || PrimeReact__default["default"].nonce, context && context.styleContainer);
       var innerHTML = '';
       for (var breakpoint in props.breakpoints) {
-        innerHTML += "\n                @media screen and (max-width: ".concat(breakpoint, ") {\n                    .p-dialog[").concat(attributeSelector.current, "] {\n                        width: ").concat(props.breakpoints[breakpoint], ";\n                    }\n                }\n            ");
+        innerHTML += "\n                @media screen and (max-width: ".concat(breakpoint, ") {\n                     [data-pc-name=\"dialog\"][").concat(attributeSelector.current, "] {\n                        width: ").concat(props.breakpoints[breakpoint], " !important;\n                    }\n                }\n            ");
       }
       styleElement.current.innerHTML = innerHTML;
     };
+    var destroyStyle = function destroyStyle() {
+      styleElement.current = utils.DomHandler.removeInlineStyle(styleElement.current);
+    };
     hooks.useMountEffect(function () {
+      updateGlobalDialogsRegistry(true);
       if (props.visible) {
         setMaskVisibleState(true);
       }
+    });
+    React__namespace.useEffect(function () {
       if (props.breakpoints) {
         createStyle();
       }
-    });
+      return function () {
+        destroyStyle();
+      };
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.breakpoints]);
     hooks.useUpdateEffect(function () {
       if (props.visible && !maskVisibleState) {
         setMaskVisibleState(true);
@@ -32686,9 +32902,10 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     }, [maskVisibleState]);
     hooks.useUpdateEffect(function () {
       updateGlobalDialogsRegistry(true);
-    }, [shouldBlockScroll]);
+    }, [shouldBlockScroll, visibleState]);
     hooks.useUnmountEffect(function () {
       disableDocumentSettings();
+      updateGlobalDialogsRegistry(false);
       utils.DomHandler.removeInlineStyle(styleElement.current);
       utils.ZIndexUtils.clear(maskRef.current);
     });
@@ -32719,7 +32936,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     var createCloseIcon = function createCloseIcon() {
       if (props.closable) {
         var ariaLabel = props.ariaCloseIconLabel || PrimeReact.localeOption('close');
-        var closeButtonIconProps = utils.mergeProps({
+        var closeButtonIconProps = mergeProps({
           className: cx('closeButtonIcon'),
           'aria-hidden': true
         }, ptm('closeButtonIcon'));
@@ -32727,7 +32944,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
         var headerCloseIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread({}, closeButtonIconProps), {
           props: props
         });
-        var closeButtonProps = utils.mergeProps({
+        var closeButtonProps = mergeProps({
           ref: closeRef,
           type: 'button',
           className: cx('closeButton'),
@@ -32740,7 +32957,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     };
     var createMaximizeIcon = function createMaximizeIcon() {
       var icon;
-      var maximizableIconProps = utils.mergeProps({
+      var maximizableIconProps = mergeProps({
         className: cx('maximizableIcon')
       }, ptm('maximizableIcon'));
       if (!maximized) {
@@ -32752,7 +32969,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
         props: props
       });
       if (props.maximizable) {
-        var maximizableButtonProps = utils.mergeProps({
+        var maximizableButtonProps = mergeProps({
           type: 'button',
           className: cx('maximizableButton'),
           onClick: toggleMaximize
@@ -32768,17 +32985,17 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
         var icons = utils.ObjectUtils.getJSXElement(props.icons, props);
         var header = utils.ObjectUtils.getJSXElement(props.header, props);
         var headerId = idState + '_header';
-        var headerProps = utils.mergeProps({
+        var headerProps = mergeProps({
           ref: headerRef,
           style: props.headerStyle,
           className: cx('header'),
           onMouseDown: onDragStart
         }, ptm('header'));
-        var headerTitleProps = utils.mergeProps({
+        var headerTitleProps = mergeProps({
           id: headerId,
           className: cx('headerTitle')
         }, ptm('headerTitle'));
-        var headerIconsProps = utils.mergeProps({
+        var headerIconsProps = mergeProps({
           className: cx('headerIcons')
         }, ptm('headerIcons'));
         return /*#__PURE__*/React__namespace.createElement("div", headerProps, /*#__PURE__*/React__namespace.createElement("div", headerTitleProps, header), /*#__PURE__*/React__namespace.createElement("div", headerIconsProps, icons, maximizeIcon, closeIcon));
@@ -32787,7 +33004,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     };
     var createContent = function createContent() {
       var contentId = idState + '_content';
-      var contentProps = utils.mergeProps({
+      var contentProps = mergeProps({
         id: contentId,
         ref: contentRef,
         style: props.contentStyle,
@@ -32797,7 +33014,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
     };
     var createFooter = function createFooter() {
       var footer = utils.ObjectUtils.getJSXElement(props.footer, props);
-      var footerProps = utils.mergeProps({
+      var footerProps = mergeProps({
         ref: footerRef,
         className: cx('footer')
       }, ptm('footer'));
@@ -32856,13 +33073,13 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
         enter: props.position === 'center' ? 150 : 300,
         exit: props.position === 'center' ? 150 : 300
       };
-      var maskProps = utils.mergeProps({
+      var maskProps = mergeProps({
         ref: maskRef,
         style: sx('mask'),
         className: cx('mask'),
         onPointerUp: onMaskPointerUp
       }, ptm('mask'));
-      var rootProps = utils.mergeProps({
+      var rootProps = mergeProps({
         ref: dialogRef,
         id: idState,
         className: cx('root', {
@@ -32878,7 +33095,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
         'aria-modal': props.modal,
         onPointerDown: onDialogPointerDown
       }, DialogBase.getOtherProps(props), ptm('root'));
-      var transitionProps = utils.mergeProps({
+      var transitionProps = mergeProps({
         classNames: cx('transition'),
         timeout: transitionTimeout,
         "in": visibleState,
@@ -32923,7 +33140,7 @@ this.primereact.dialog = (function (exports, React, utils, PrimeReact, component
 
   return exports;
 
-})({}, React, primereact.utils, primereact.api, primereact.componentbase, primereact.csstransition, primereact.hooks, primereact.icons.times, primereact.icons.windowmaximize, primereact.icons.windowminimize, primereact.portal, primereact.ripple);
+})({}, React, primereact.api, primereact.componentbase, primereact.csstransition, primereact.hooks, primereact.icons.times, primereact.icons.windowmaximize, primereact.icons.windowminimize, primereact.portal, primereact.ripple, primereact.utils);
 
 this.primereact = this.primereact || {};
 this.primereact.paginator = (function (exports, React, api, componentbase, hooks, utils, angledoubleleft, ripple, inputnumber, angledoubleright, angleright, angleleft, dropdown) {
@@ -33214,6 +33431,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var CurrentPageReport = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = CurrentPageReportBase.getProps(inProps, context);
     var report = {
@@ -33225,7 +33443,8 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
       totalRecords: props.totalRecords
     };
     var text = props.reportTemplate.replace('{currentPage}', report.currentPage).replace('{totalPages}', report.totalPages).replace('{first}', report.first).replace('{last}', report.last).replace('{rows}', report.rows).replace('{totalRecords}', report.totalRecords);
-    var currentProps = utils.mergeProps({
+    var currentProps = mergeProps({
+      'aria-live': 'polite',
       className: 'p-paginator-current'
     }, props.ptm('current', {
       hostName: props.hostName
@@ -33233,6 +33452,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
     var element = /*#__PURE__*/React__namespace.createElement("span", currentProps, text);
     if (props.template) {
       var defaultOptions = _objectSpread$5(_objectSpread$5({}, report), {
+        ariaLive: 'polite',
         className: 'p-paginator-current',
         element: element,
         props: props
@@ -33246,6 +33466,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var FirstPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = FirstPageLinkBase.getProps(inProps, context);
     var ptm = props.ptm,
@@ -33262,14 +33483,14 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon';
-    var firstPageIconProps = utils.mergeProps({
+    var firstPageIconProps = mergeProps({
       className: cx('firstPageIcon')
     }, getPTOptions('firstPageIcon'));
     var icon = props.firstPageLinkIcon || /*#__PURE__*/React__namespace.createElement(angledoubleleft.AngleDoubleLeftIcon, firstPageIconProps);
     var firstPageLinkIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$4({}, firstPageIconProps), {
       props: props
     });
-    var firstPageButtonProps = utils.mergeProps({
+    var firstPageButtonProps = mergeProps({
       type: 'button',
       className: cx('firstPageButton', {
         disabled: props.disabled
@@ -33295,8 +33516,10 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   FirstPageLink.displayName = 'FirstPageLink';
 
   var JumpToPageInput = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = JumpToPageInputBase.getProps(inProps, context);
+    var ariaLabelValue = ariaLabel('jumpToPageInputLabel');
     var onChange = function onChange(event) {
       if (props.onChange) {
         props.onChange(props.rows * (event.value - 1), props.rows);
@@ -33312,7 +33535,8 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
       unstyled: props.unstyled,
       __parentMetadata: {
         parent: props.metaData
-      }
+      },
+      "aria-label": ariaLabelValue
     });
     if (props.template) {
       var defaultOptions = {
@@ -33320,6 +33544,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
         onChange: onChange,
         disabled: props.disabled,
         className: 'p-paginator-page-input',
+        ariaLabel: ariaLabelValue,
         element: element,
         props: props
       };
@@ -33332,6 +33557,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var LastPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = LastPageLinkBase.getProps(inProps, context);
     var ptm = props.ptm,
@@ -33348,14 +33574,14 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon';
-    var lastPageIconProps = utils.mergeProps({
+    var lastPageIconProps = mergeProps({
       className: cx('lastPageIcon')
     }, getPTOptions('lastPageIcon'));
     var icon = props.lastPageLinkIcon || /*#__PURE__*/React__namespace.createElement(angledoubleright.AngleDoubleRightIcon, lastPageIconProps);
     var lastPageLinkIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$3({}, lastPageIconProps), {
       props: props
     });
-    var lastPageButtonProps = utils.mergeProps({
+    var lastPageButtonProps = mergeProps({
       type: 'button',
       className: cx('lastPageButton', {
         disabled: props.disabled
@@ -33383,6 +33609,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var NextPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = NextPageLinkBase.getProps(inProps, context);
     var ptm = props.ptm,
@@ -33399,14 +33626,14 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon';
-    var nextPageIconProps = utils.mergeProps({
+    var nextPageIconProps = mergeProps({
       className: cx('nextPageIcon')
     }, getPTOptions('nextPageIcon'));
     var icon = props.nextPageLinkIcon || /*#__PURE__*/React__namespace.createElement(angleright.AngleRightIcon, nextPageIconProps);
     var nextPageLinkIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$2({}, nextPageIconProps), {
       props: props
     });
-    var nextPageButtonProps = utils.mergeProps({
+    var nextPageButtonProps = mergeProps({
       type: 'button',
       className: cx('nextPageButton', {
         disabled: props.disabled
@@ -33433,6 +33660,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   NextPageLink.displayName = 'NextPageLink';
 
   var PageLinks = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = PageLinksBase.getProps(inProps, context);
     var ptm = props.ptm,
@@ -33464,7 +33692,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
           'p-paginator-page-end': pageLink === endPageInView,
           'p-highlight': pageLink - 1 === props.page
         });
-        var pageButtonProps = utils.mergeProps({
+        var pageButtonProps = mergeProps({
           type: 'button',
           onClick: function onClick(e) {
             return onPageLinkClick(e, pageLink);
@@ -33478,7 +33706,8 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
           disabled: props.disabled,
           'aria-label': api.ariaLabel('pageLabel', {
             page: pageLink
-          })
+          }),
+          'aria-current': pageLink - 1 === props.page ? 'true' : undefined
         }, getPTOptions(pageLink, 'pageButton'));
         var element = /*#__PURE__*/React__namespace.createElement("button", pageButtonProps, pageLink, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
         if (props.template) {
@@ -33494,6 +33723,10 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
             page: pageLink - 1,
             currentPage: props.page,
             totalPages: props.pageCount,
+            ariaLabel: api.ariaLabel('pageLabel', {
+              page: pageLink
+            }),
+            ariaCurrent: pageLink - 1 === props.page ? 'true' : undefined,
             element: element,
             props: props
           };
@@ -33504,7 +33737,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
         }, element);
       });
     }
-    var pagesProps = utils.mergeProps({
+    var pagesProps = mergeProps({
       className: cx('pages')
     }, ptm('pages', {
       hostName: props.hostName
@@ -33516,6 +33749,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var PrevPageLink = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = PrevPageLinkBase.getProps(inProps, context);
     var ptm = props.ptm,
@@ -33532,14 +33766,14 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
       'p-disabled': props.disabled
     });
     var iconClassName = 'p-paginator-icon';
-    var prevPageIconProps = utils.mergeProps({
+    var prevPageIconProps = mergeProps({
       className: cx('prevPageIcon')
     }, getPTOptions('prevPageIcon'));
     var icon = props.prevPageLinkIcon || /*#__PURE__*/React__namespace.createElement(angleleft.AngleLeftIcon, prevPageIconProps);
     var prevPageLinkIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$1({}, prevPageIconProps), {
       props: props
     });
-    var prevPageButtonProps = utils.mergeProps({
+    var prevPageButtonProps = mergeProps({
       type: 'button',
       className: cx('prevPageButton', {
         disabled: props.disabled
@@ -33564,7 +33798,237 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   });
   PrevPageLink.displayName = 'PrevPageLink';
 
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+    }
+  }
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    Object.defineProperty(Constructor, "prototype", {
+      writable: false
+    });
+    return Constructor;
+  }
+
+  function _classCallCheck(instance, Constructor) {
+    if (!(instance instanceof Constructor)) {
+      throw new TypeError("Cannot call a class as a function");
+    }
+  }
+
+  var FilterMatchMode = Object.freeze({
+    STARTS_WITH: 'startsWith',
+    CONTAINS: 'contains',
+    NOT_CONTAINS: 'notContains',
+    ENDS_WITH: 'endsWith',
+    EQUALS: 'equals',
+    NOT_EQUALS: 'notEquals',
+    IN: 'in',
+    LESS_THAN: 'lt',
+    LESS_THAN_OR_EQUAL_TO: 'lte',
+    GREATER_THAN: 'gt',
+    GREATER_THAN_OR_EQUAL_TO: 'gte',
+    BETWEEN: 'between',
+    DATE_IS: 'dateIs',
+    DATE_IS_NOT: 'dateIsNot',
+    DATE_BEFORE: 'dateBefore',
+    DATE_AFTER: 'dateAfter',
+    CUSTOM: 'custom'
+  });
+
+  /**
+   * @deprecated please use PrimeReactContext
+   */
+  var PrimeReact = /*#__PURE__*/_createClass(function PrimeReact() {
+    _classCallCheck(this, PrimeReact);
+  });
+  _defineProperty(PrimeReact, "ripple", false);
+  _defineProperty(PrimeReact, "inputStyle", 'outlined');
+  _defineProperty(PrimeReact, "locale", 'en');
+  _defineProperty(PrimeReact, "appendTo", null);
+  _defineProperty(PrimeReact, "cssTransition", true);
+  _defineProperty(PrimeReact, "autoZIndex", true);
+  _defineProperty(PrimeReact, "hideOverlaysOnDocumentScrolling", false);
+  _defineProperty(PrimeReact, "nonce", null);
+  _defineProperty(PrimeReact, "nullSortOrder", 1);
+  _defineProperty(PrimeReact, "zIndex", {
+    modal: 1100,
+    overlay: 1000,
+    menu: 1000,
+    tooltip: 1100,
+    toast: 1200
+  });
+  _defineProperty(PrimeReact, "pt", undefined);
+  _defineProperty(PrimeReact, "filterMatchModeOptions", {
+    text: [FilterMatchMode.STARTS_WITH, FilterMatchMode.CONTAINS, FilterMatchMode.NOT_CONTAINS, FilterMatchMode.ENDS_WITH, FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS],
+    numeric: [FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS, FilterMatchMode.LESS_THAN, FilterMatchMode.LESS_THAN_OR_EQUAL_TO, FilterMatchMode.GREATER_THAN, FilterMatchMode.GREATER_THAN_OR_EQUAL_TO],
+    date: [FilterMatchMode.DATE_IS, FilterMatchMode.DATE_IS_NOT, FilterMatchMode.DATE_BEFORE, FilterMatchMode.DATE_AFTER]
+  });
+  _defineProperty(PrimeReact, "changeTheme", function (currentTheme, newTheme, linkElementId, callback) {
+    var _linkElement$parentNo;
+    var linkElement = document.getElementById(linkElementId);
+    var cloneLinkElement = linkElement.cloneNode(true);
+    var newThemeUrl = linkElement.getAttribute('href').replace(currentTheme, newTheme);
+    cloneLinkElement.setAttribute('id', linkElementId + '-clone');
+    cloneLinkElement.setAttribute('href', newThemeUrl);
+    cloneLinkElement.addEventListener('load', function () {
+      linkElement.remove();
+      cloneLinkElement.setAttribute('id', linkElementId);
+      if (callback) {
+        callback();
+      }
+    });
+    (_linkElement$parentNo = linkElement.parentNode) === null || _linkElement$parentNo === void 0 || _linkElement$parentNo.insertBefore(cloneLinkElement, linkElement.nextSibling);
+  });
+
+  var locales = {
+    en: {
+      startsWith: 'Starts with',
+      contains: 'Contains',
+      notContains: 'Not contains',
+      endsWith: 'Ends with',
+      equals: 'Equals',
+      notEquals: 'Not equals',
+      noFilter: 'No Filter',
+      filter: 'Filter',
+      lt: 'Less than',
+      lte: 'Less than or equal to',
+      gt: 'Greater than',
+      gte: 'Greater than or equal to',
+      dateIs: 'Date is',
+      dateIsNot: 'Date is not',
+      dateBefore: 'Date is before',
+      dateAfter: 'Date is after',
+      custom: 'Custom',
+      clear: 'Clear',
+      close: 'Close',
+      apply: 'Apply',
+      matchAll: 'Match All',
+      matchAny: 'Match Any',
+      addRule: 'Add Rule',
+      removeRule: 'Remove Rule',
+      accept: 'Yes',
+      reject: 'No',
+      choose: 'Choose',
+      upload: 'Upload',
+      cancel: 'Cancel',
+      completed: 'Completed',
+      pending: 'Pending',
+      fileSizeTypes: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
+      dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
+      dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
+      dayNamesMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
+      monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+      today: 'Today',
+      weekHeader: 'Wk',
+      firstDayOfWeek: 0,
+      showMonthAfterYear: false,
+      dateFormat: 'mm/dd/yy',
+      weak: 'Weak',
+      medium: 'Medium',
+      strong: 'Strong',
+      passwordPrompt: 'Enter a password',
+      emptyFilterMessage: 'No available options',
+      emptyMessage: 'No results found',
+      aria: {
+        trueLabel: 'True',
+        falseLabel: 'False',
+        nullLabel: 'Not Selected',
+        star: '1 star',
+        stars: '{star} stars',
+        selectAll: 'All items selected',
+        unselectAll: 'All items unselected',
+        close: 'Close',
+        previous: 'Previous',
+        next: 'Next',
+        navigation: 'Navigation',
+        scrollTop: 'Scroll Top',
+        moveTop: 'Move Top',
+        moveUp: 'Move Up',
+        moveDown: 'Move Down',
+        moveBottom: 'Move Bottom',
+        moveToTarget: 'Move to Target',
+        moveToSource: 'Move to Source',
+        moveAllToTarget: 'Move All to Target',
+        moveAllToSource: 'Move All to Source',
+        pageLabel: 'Page {page}',
+        firstPageLabel: 'First Page',
+        lastPageLabel: 'Last Page',
+        nextPageLabel: 'Next Page',
+        previousPageLabel: 'Previous Page',
+        rowsPerPageLabel: 'Rows per page',
+        jumpToPageDropdownLabel: 'Jump to Page Dropdown',
+        jumpToPageInputLabel: 'Jump to Page Input',
+        selectRow: 'Row Selected',
+        unselectRow: 'Row Unselected',
+        expandRow: 'Row Expanded',
+        collapseRow: 'Row Collapsed',
+        showFilterMenu: 'Show Filter Menu',
+        hideFilterMenu: 'Hide Filter Menu',
+        filterOperator: 'Filter Operator',
+        filterConstraint: 'Filter Constraint',
+        editRow: 'Row Edit',
+        saveEdit: 'Save Edit',
+        cancelEdit: 'Cancel Edit',
+        listView: 'List View',
+        gridView: 'Grid View',
+        slide: 'Slide',
+        slideNumber: '{slideNumber}',
+        zoomImage: 'Zoom Image',
+        zoomIn: 'Zoom In',
+        zoomOut: 'Zoom Out',
+        rotateRight: 'Rotate Right',
+        rotateLeft: 'Rotate Left',
+        selectLabel: 'Select',
+        unselectLabel: 'Unselect',
+        expandLabel: 'Expand',
+        collapseLabel: 'Collapse'
+      }
+    }
+  };
+
+  /**
+   * Find an ARIA label in the locale by key.  If options are passed it will replace all options:
+   * ```ts
+   * const ariaValue = "Page {page}, User {user}, Role {role}";
+   * const options = { page: 2, user: "John", role: "Admin" };
+   * const result = ariaLabel('yourLabel', { page: 2, user: "John", role: "Admin" })
+   * console.log(result); // Output: Page 2, User John, Role Admin
+   * ```
+   * @param {string} ariaKey key of the ARIA label to look up in locale.
+   * @param {any} options JSON options like { page: 2, user: "John", role: "Admin" }
+   * @returns the ARIA label with replaced values
+   */
+  function ariaLabel$1(ariaKey, options) {
+    var _locale = PrimeReact.locale;
+    try {
+      var _ariaLabel = localeOptions(_locale)['aria'][ariaKey];
+      if (_ariaLabel) {
+        for (var key in options) {
+          if (options.hasOwnProperty(key)) {
+            _ariaLabel = _ariaLabel.replace("{".concat(key, "}"), options[key]);
+          }
+        }
+      }
+      return _ariaLabel;
+    } catch (error) {
+      throw new Error("The ".concat(ariaKey, " option is not found in the current locale('").concat(_locale, "')."));
+    }
+  }
+  function localeOptions(locale) {
+    var _locale = locale || PrimeReact.locale;
+    return locales[_locale];
+  }
+
   var RowsPerPageDropdown = /*#__PURE__*/React__namespace.memo(function (inProps) {
+    hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = RowsPerPageDropdownBase.getProps(inProps, context);
     var hasOptions = props.options && props.options.length > 0;
@@ -33574,21 +34038,22 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
         value: opt
       };
     }) : [];
-    var ariaLabel = api.localeOption('choose');
-    var element = hasOptions ? /*#__PURE__*/React__namespace.createElement(dropdown.Dropdown, {
+    var placeholderValue = api.localeOption('choose');
+    var ariaLabelValue = ariaLabel$1('rowsPerPage');
+    var element = hasOptions ? /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(dropdown.Dropdown, {
       value: props.value,
       options: options,
       onChange: props.onChange,
       appendTo: props.appendTo,
       disabled: props.disabled,
-      placeholder: ariaLabel,
-      "aria-label": ariaLabel,
+      placeholder: placeholderValue,
+      "aria-label": ariaLabelValue,
       pt: props.ptm('RPPDropdown'),
       unstyled: props.unstyled,
       __parentMetadata: {
         parent: props.metaData
       }
-    }) : null;
+    })) : null;
     if (props.template) {
       var defaultOptions = {
         value: props.value,
@@ -33599,6 +34064,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
         totalPages: props.pageCount,
         totalRecords: props.totalRecords,
         disabled: props.disabled,
+        ariaLabel: ariaLabelValue,
         element: element,
         props: props
       };
@@ -33611,6 +34077,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var Paginator = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = PaginatorBase.getProps(inProps, context);
     var metaData = _objectSpread({
@@ -33848,15 +34315,15 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
       var leftContent = utils.ObjectUtils.getJSXElement(props.leftContent, props);
       var rightContent = utils.ObjectUtils.getJSXElement(props.rightContent, props);
       var elements = createElements();
-      var leftProps = utils.mergeProps({
+      var leftProps = mergeProps({
         className: cx('left')
       }, ptm('left'));
       var leftElement = leftContent && /*#__PURE__*/React__namespace.createElement("div", leftProps, leftContent);
-      var endProps = utils.mergeProps({
+      var endProps = mergeProps({
         className: cx('end')
       }, ptm('end'));
       var rightElement = rightContent && /*#__PURE__*/React__namespace.createElement("div", endProps, rightContent);
-      var rootProps = utils.mergeProps({
+      var rootProps = mergeProps({
         ref: elementRef,
         className: utils.classNames(props.className, cx('root')),
         style: props.style
@@ -33875,7 +34342,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
 })({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.utils, primereact.icons.angledoubleleft, primereact.ripple, primereact.inputnumber, primereact.icons.angledoubleright, primereact.icons.angleright, primereact.icons.angleleft, primereact.dropdown);
 
 this.primereact = this.primereact || {};
-this.primereact.tree = (function (exports, React, api, componentbase, search, spinner, utils, check, chevrondown, chevronright, minus, ripple) {
+this.primereact.tree = (function (exports, React, api, componentbase, hooks, search, spinner, utils, check, chevrondown, chevronright, minus, ripple) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -34025,6 +34492,19 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$2(arr, i) || _nonIterableRest();
   }
 
+  /* eslint-disable */
+  var useUpdateEffect = function useUpdateEffect(fn, deps) {
+    var mounted = React__namespace.useRef(false);
+    return React__namespace.useEffect(function () {
+      if (!mounted.current) {
+        mounted.current = true;
+        return;
+      }
+      return fn && fn();
+    }, deps);
+  };
+  /* eslint-enable */
+
   var classes = {
     container: 'p-tree-container',
     loadingIcon: 'p-tree-loading-icon',
@@ -34079,7 +34559,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       });
     }
   };
-  var styles = "\n@layer primereact {\n    .p-tree-container {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        overflow: auto;\n    }\n    \n    .p-treenode-children {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n    }\n    \n    .p-treenode-selectable {\n        cursor: pointer;\n        user-select: none;\n    }\n    \n    .p-tree-toggler {\n        cursor: pointer;\n        user-select: none;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-treenode-leaf > .p-treenode-content .p-tree-toggler {\n        visibility: hidden;\n    }\n    \n    .p-treenode-content {\n        display: flex;\n        align-items: center;\n    }\n    \n    .p-tree-filter {\n        width: 100%;\n    }\n    \n    .p-tree-filter-container {\n        position: relative;\n        display: block;\n        width: 100%;\n    }\n    \n    .p-tree-filter-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -.5rem;\n    }\n    \n    .p-tree-loading {\n        position: relative;\n        min-height: 4rem;\n    }\n    \n    .p-tree .p-tree-loading-overlay {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n}\n";
+  var styles = "\n@layer primereact {\n    .p-tree-container {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        overflow: auto;\n    }\n\n    .p-treenode-children {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n    }\n\n    .p-treenode-selectable {\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-tree-toggler {\n        cursor: pointer;\n        user-select: none;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-treenode-leaf > .p-treenode-content .p-tree-toggler {\n        visibility: hidden;\n    }\n\n    .p-treenode-content {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-tree-filter {\n        width: 100%;\n    }\n\n    .p-tree-filter-container {\n        position: relative;\n        display: block;\n        width: 100%;\n    }\n\n    .p-tree-filter-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -.5rem;\n    }\n\n    .p-tree-loading {\n        position: relative;\n        min-height: 4rem;\n    }\n\n    .p-tree .p-tree-loading-overlay {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n}\n";
   var TreeBase = componentbase.ComponentBase.extend({
     defaultProps: {
       __TYPE: 'Tree',
@@ -34094,6 +34574,8 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       contextMenuSelectionKey: null,
       onContextMenuSelectionChange: null,
       expandedKeys: null,
+      ariaLabel: null,
+      ariaLabelledBy: null,
       style: null,
       className: null,
       contentStyle: null,
@@ -34117,6 +34599,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       filterPlaceholder: null,
       filterLocale: undefined,
       filterTemplate: null,
+      level: 0,
       nodeTemplate: null,
       togglerTemplate: null,
       onSelect: null,
@@ -34144,8 +34627,11 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
   function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var UITreeNode = /*#__PURE__*/React__namespace.memo(function (props) {
     var contentRef = React__namespace.useRef(null);
+    var elementRef = React__namespace.useRef(null);
     var nodeTouched = React__namespace.useRef(false);
+    var mergeProps = hooks.useMergeProps();
     var isLeaf = props.isNodeLeaf(props.node);
+    var label = props.node.label;
     var expanded = (props.expandedKeys ? props.expandedKeys[props.node.key] !== undefined : false) || props.node.expanded;
     var ptm = props.ptm,
       cx = props.cx;
@@ -34161,11 +34647,13 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       });
     };
     var expand = function expand(event) {
+      var navigateFocusToChild = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       var expandedKeys = props.expandedKeys ? _objectSpread$1({}, props.expandedKeys) : {};
       expandedKeys[props.node.key] = true;
       props.onToggle({
         originalEvent: event,
-        value: expandedKeys
+        value: expandedKeys,
+        navigateFocusToChild: navigateFocusToChild
       });
       invokeToggleEvents(event, true);
     };
@@ -34182,7 +34670,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       if (props.disabled) {
         return;
       }
-      expanded ? collapse(event) : expand(event);
+      expanded ? collapse(event) : expand(event, false);
       event.preventDefault();
       event.stopPropagation();
     };
@@ -34203,72 +34691,6 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
         }
       }
     };
-    var onNodeKeyDown = function onNodeKeyDown(event) {
-      if (props.disabled) {
-        return;
-      }
-      var nodeElement = event.target.parentElement;
-      if (!utils.DomHandler.hasClass(nodeElement, 'p-treenode')) {
-        return;
-      }
-      switch (event.which) {
-        //down arrow
-        case 40:
-          var listElement = nodeElement.children[1];
-          if (listElement) {
-            focusNode(listElement.children[0]);
-          } else {
-            var nextNodeElement = nodeElement.nextElementSibling;
-            while (nextNodeElement) {
-              if (!utils.DomHandler.hasClass(nextNodeElement, 'p-treenode-droppoint')) {
-                break;
-              }
-              nextNodeElement = nextNodeElement.nextElementSibling;
-            }
-            if (nextNodeElement) {
-              focusNode(nextNodeElement);
-            } else {
-              var nextSiblingAncestor = findNextSiblingOfAncestor(nodeElement);
-              nextSiblingAncestor && focusNode(nextSiblingAncestor);
-            }
-          }
-          event.preventDefault();
-          break;
-
-        //up arrow
-        case 38:
-          if (nodeElement.previousElementSibling) {
-            focusNode(findLastVisibleDescendant(nodeElement.previousElementSibling));
-          } else {
-            var parentNodeElement = getParentNodeElement(nodeElement);
-            parentNodeElement && focusNode(parentNodeElement);
-          }
-          event.preventDefault();
-          break;
-
-        //right arrow
-        case 39:
-          if (!expanded) {
-            expand(event);
-          }
-          event.preventDefault();
-          break;
-
-        //left arrow
-        case 37:
-          if (expanded) {
-            collapse(event);
-          }
-          event.preventDefault();
-          break;
-
-        //enter
-        case 13:
-          onClick(event);
-          event.preventDefault();
-          break;
-      }
-    };
     var findNextSiblingOfAncestor = function findNextSiblingOfAncestor(nodeElement) {
       var parentNodeElement = getParentNodeElement(nodeElement);
       return parentNodeElement ? parentNodeElement.nextElementSibling || findNextSiblingOfAncestor(parentNodeElement) : null;
@@ -34287,7 +34709,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       return utils.DomHandler.hasClass(parentNodeElement, 'p-treenode') ? parentNodeElement : null;
     };
     var focusNode = function focusNode(element) {
-      element && element.children[0] && element.children[0].focus();
+      element && element.focus();
     };
     var onClick = function onClick(event) {
       if (props.onClick) {
@@ -34447,6 +34869,131 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
         });
       }
     };
+    var onKeyDown = function onKeyDown(event) {
+      if (!isSameNode(event)) return;
+      switch (event.code) {
+        case 'Tab':
+          onTabKey();
+          break;
+        case 'ArrowDown':
+          onArrowDown(event);
+          break;
+        case 'ArrowUp':
+          onArrowUp(event);
+          break;
+        case 'ArrowRight':
+          onArrowRight(event);
+          break;
+        case 'ArrowLeft':
+          onArrowLeft(event);
+          break;
+        case 'Enter':
+        case 'NumpadEnter':
+        case 'Space':
+          onEnterKey(event);
+          break;
+      }
+    };
+    var onArrowDown = function onArrowDown(event) {
+      var nodeElement = event.target.getAttribute('data-pc-section') === 'toggler' ? event.target.closest('[role="treeitem"]') : event.target;
+      var listElement = nodeElement.children[1];
+      if (listElement) {
+        focusRowChange(nodeElement, listElement.children[0]);
+      } else {
+        if (nodeElement.nextElementSibling) {
+          focusRowChange(nodeElement, nodeElement.nextElementSibling);
+        } else {
+          var nextSiblingAncestor = findNextSiblingOfAncestor(nodeElement);
+          if (nextSiblingAncestor) {
+            focusRowChange(nodeElement, nextSiblingAncestor);
+          }
+        }
+      }
+      event.preventDefault();
+    };
+    var onArrowUp = function onArrowUp(event) {
+      var nodeElement = event.target;
+      if (nodeElement.previousElementSibling) {
+        focusRowChange(nodeElement, nodeElement.previousElementSibling, findLastVisibleDescendant(nodeElement.previousElementSibling));
+      } else {
+        var parentNodeElement = getParentNodeElement(nodeElement);
+        if (parentNodeElement) {
+          focusRowChange(nodeElement, parentNodeElement);
+        }
+      }
+      event.preventDefault();
+    };
+    var onArrowRight = function onArrowRight(event) {
+      if (isLeaf || expanded) return;
+      event.currentTarget.tabIndex = -1;
+      expand(event, true);
+    };
+    var onArrowLeft = function onArrowLeft(event) {
+      var togglerElement = utils.DomHandler.findSingle(event.currentTarget, '[data-pc-section="toggler"]');
+      if (props.level === 0 && !expanded) {
+        return false;
+      }
+      if (expanded && !isLeaf) {
+        togglerElement.click();
+        return false;
+      }
+      var target = findBeforeClickableNode(event.currentTarget);
+      if (target) {
+        focusRowChange(event.currentTarget, target);
+      }
+    };
+    var onEnterKey = function onEnterKey(event) {
+      setTabIndexForSelectionMode(event, nodeTouched.current);
+      onClick(event);
+      event.preventDefault();
+    };
+    var onTabKey = function onTabKey() {
+      setAllNodesTabIndexes();
+    };
+    var setAllNodesTabIndexes = function setAllNodesTabIndexes() {
+      var nodes = utils.DomHandler.find(contentRef.current.closest('[data-pc-section="container"]'), '[role="treeitem"]');
+      var hasSelectedNode = _toConsumableArray(nodes).some(function (node) {
+        return node.getAttribute('aria-selected') === 'true' || node.getAttribute('aria-checked') === 'true';
+      });
+      _toConsumableArray(nodes).forEach(function (node) {
+        node.tabIndex = -1;
+      });
+      if (hasSelectedNode) {
+        var selectedNodes = _toConsumableArray(nodes).filter(function (node) {
+          return node.getAttribute('aria-selected') === 'true' || node.getAttribute('aria-checked') === 'true';
+        });
+        selectedNodes[0].tabIndex = 0;
+        return;
+      }
+      _toConsumableArray(nodes)[0].tabIndex = 0;
+    };
+    var setTabIndexForSelectionMode = function setTabIndexForSelectionMode(event, nodeTouched) {
+      if (props.selectionMode !== null) {
+        var elements = _toConsumableArray(utils.DomHandler.find(elementRef.current.parentElement, '[role="treeitem"]'));
+        event.currentTarget.tabIndex = nodeTouched === false ? -1 : 0;
+        if (elements.every(function (element) {
+          return element.tabIndex === -1;
+        })) {
+          elements[0].tabIndex = 0;
+        }
+      }
+    };
+    var focusRowChange = function focusRowChange(firstFocusableRow, currentFocusedRow, lastVisibleDescendant) {
+      firstFocusableRow.tabIndex = '-1';
+      currentFocusedRow.tabIndex = '0';
+      focusNode(lastVisibleDescendant || currentFocusedRow);
+    };
+    var findBeforeClickableNode = function findBeforeClickableNode(node) {
+      var parentListElement = node.closest('ul').closest('li');
+      if (parentListElement) {
+        var prevNodeButton = utils.DomHandler.findSingle(parentListElement, 'button');
+        if (prevNodeButton && prevNodeButton.style.visibility !== 'hidden') {
+          return parentListElement;
+        }
+        return findBeforeClickableNode(node.previousElementSibling);
+      }
+      return null;
+    };
     var propagateUp = function propagateUp(event) {
       var check = event.check;
       var selectionKeys = event.selectionKeys;
@@ -34510,6 +35057,9 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     var isChecked = function isChecked() {
       return (props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].checked : false) || false;
     };
+    var isSameNode = function isSameNode(event) {
+      return event.currentTarget && (event.currentTarget.isSameNode(event.target) || event.currentTarget.isSameNode(event.target.closest('[role="treeitem"]')));
+    };
     var isPartialChecked = function isPartialChecked() {
       return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].partialChecked : false;
     };
@@ -34609,10 +35159,10 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       }
     };
     var createLabel = function createLabel() {
-      var labelProps = utils.mergeProps({
+      var labelProps = mergeProps({
         className: cx('label')
       }, getPTOptions('label'));
-      var content = /*#__PURE__*/React__namespace.createElement("span", labelProps, props.node.label);
+      var content = /*#__PURE__*/React__namespace.createElement("span", labelProps, label);
       if (props.nodeTemplate) {
         var defaultContentOptions = {
           onTogglerClick: onTogglerClick,
@@ -34629,22 +35179,22 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       if (isCheckboxSelectionMode() && props.node.selectable !== false) {
         var checked = isChecked();
         var partialChecked = isPartialChecked();
-        var checkboxIconProps = utils.mergeProps({
+        var checkboxIconProps = mergeProps({
           className: cx('checkboxIcon')
         }, getPTOptions('checkboxIcon'));
         var icon = checked ? props.checkboxIcon || /*#__PURE__*/React__namespace.createElement(check.CheckIcon, checkboxIconProps) : partialChecked ? props.checkboxIcon || /*#__PURE__*/React__namespace.createElement(minus.MinusIcon, checkboxIconProps) : null;
         var checkboxIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$1({}, checkboxIconProps), props);
-        var checkboxContainerProps = utils.mergeProps({
+        var checkboxContainerProps = mergeProps({
+          'aria-hidden': true,
           className: cx('checkboxContainer')
         }, getPTOptions('checkboxContainer'));
-        var checkboxProps = utils.mergeProps({
+        var checkboxProps = mergeProps({
           className: cx('checkbox', {
             checked: checked,
             partialChecked: partialChecked,
             nodeProps: props
           }),
-          role: 'checkbox',
-          'aria-checked': checked
+          role: 'checkbox'
         }, getPTOptions('checkbox'));
         return /*#__PURE__*/React__namespace.createElement("div", checkboxContainerProps, /*#__PURE__*/React__namespace.createElement("div", checkboxProps, checkboxIcon));
       }
@@ -34653,7 +35203,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     var createIcon = function createIcon() {
       var icon = props.node.icon || (expanded ? props.node.expandedIcon : props.node.collapsedIcon);
       if (icon) {
-        var nodeIconProps = utils.mergeProps({
+        var nodeIconProps = mergeProps({
           className: utils.classNames(icon, cx('nodeIcon'))
         }, getPTOptions('nodeIcon'));
         return /*#__PURE__*/React__namespace.createElement("span", nodeIconProps);
@@ -34661,8 +35211,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       return null;
     };
     var createToggler = function createToggler() {
-      var label = expanded ? api.ariaLabel('collapseLabel') : api.ariaLabel('expandLabel');
-      var togglerIconProps = utils.mergeProps({
+      var togglerIconProps = mergeProps({
         className: cx('togglerIcon'),
         'aria-hidden': true
       }, getPTOptions('togglerIcon'));
@@ -34671,12 +35220,12 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
         props: props,
         expanded: expanded
       });
-      var togglerProps = utils.mergeProps({
+      var togglerProps = mergeProps({
         type: 'button',
         className: cx('toggler'),
         tabIndex: -1,
-        onClick: onTogglerClick,
-        'aria-label': label
+        'aria-hidden': true,
+        onClick: onTogglerClick
       }, getPTOptions('toggler'));
       var content = /*#__PURE__*/React__namespace.createElement("button", togglerProps, togglerIcon, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
       if (props.togglerTemplate) {
@@ -34694,7 +35243,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     };
     var createDropPoint = function createDropPoint(position) {
       if (props.dragdropScope) {
-        var droppointProps = utils.mergeProps({
+        var droppointProps = mergeProps({
           className: cx('droppoint'),
           onDrop: function onDrop(event) {
             return onDropPoint(event, position);
@@ -34714,7 +35263,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       var checkbox = createCheckbox();
       var icon = createIcon();
       var label = createLabel();
-      var contentProps = utils.mergeProps({
+      var contentProps = mergeProps({
         ref: contentRef,
         className: utils.classNames(props.node.className, cx('content', {
           checked: checked,
@@ -34734,12 +35283,12 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
         onDragLeave: onDragLeave,
         onDragStart: onDragStart,
         onDragEnd: onDragEnd,
-        onKeyDown: onNodeKeyDown
+        'data-p-highlight': isCheckboxSelectionMode() ? checked : selected
       }, getPTOptions('content'));
       return /*#__PURE__*/React__namespace.createElement("div", contentProps, toggler, checkbox, icon, label);
     };
     var createChildren = function createChildren() {
-      var subgroupProps = utils.mergeProps({
+      var subgroupProps = mergeProps({
         className: cx('subgroup'),
         role: 'group'
       }, getPTOptions('subgroup'));
@@ -34748,62 +35297,70 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
           return /*#__PURE__*/React__namespace.createElement(UITreeNode, {
             key: childNode.key || childNode.label,
             node: childNode,
-            originalOptions: props.originalOptions,
-            parent: props.node,
+            checkboxIcon: props.checkboxIcon,
+            collapseIcon: props.collapseIcon,
+            contextMenuSelectionKey: props.contextMenuSelectionKey,
+            cx: cx,
+            disabled: props.disabled,
+            dragdropScope: props.dragdropScope,
+            expandIcon: props.expandIcon,
+            expandedKeys: props.expandedKeys,
             index: index,
+            isNodeLeaf: props.isNodeLeaf,
             last: index === props.node.children.length - 1,
-            path: props.path + '-' + index,
-            disabled: props.disabled,
-            selectionMode: props.selectionMode,
-            selectionKeys: props.selectionKeys,
-            onSelectionChange: props.onSelectionChange,
             metaKeySelection: props.metaKeySelection,
-            propagateSelectionDown: props.propagateSelectionDown,
-            propagateSelectionUp: props.propagateSelectionUp,
-            contextMenuSelectionKey: props.contextMenuSelectionKey,
-            onContextMenuSelectionChange: props.onContextMenuSelectionChange,
-            onContextMenu: props.onContextMenu,
-            onExpand: props.onExpand,
-            onCollapse: props.onCollapse,
-            onSelect: props.onSelect,
-            onUnselect: props.onUnselect,
+            nodeTemplate: props.nodeTemplate,
             onClick: props.onClick,
+            onCollapse: props.onCollapse,
+            onContextMenu: props.onContextMenu,
+            onContextMenuSelectionChange: props.onContextMenuSelectionChange,
             onDoubleClick: props.onDoubleClick,
-            expandedKeys: props.expandedKeys,
-            onToggle: props.onToggle,
-            onPropagateUp: propagateUp,
-            nodeTemplate: props.nodeTemplate,
-            togglerTemplate: props.togglerTemplate,
-            isNodeLeaf: props.isNodeLeaf,
-            dragdropScope: props.dragdropScope,
-            onDragStart: props.onDragStart,
             onDragEnd: props.onDragEnd,
+            onDragStart: props.onDragStart,
             onDrop: props.onDrop,
             onDropPoint: props.onDropPoint,
+            onExpand: props.onExpand,
+            onPropagateUp: propagateUp,
+            onSelect: props.onSelect,
+            onSelectionChange: props.onSelectionChange,
+            onToggle: props.onToggle,
+            onUnselect: props.onUnselect,
+            originalOptions: props.originalOptions,
+            parent: props.node,
+            path: props.path + '-' + index,
+            propagateSelectionDown: props.propagateSelectionDown,
+            propagateSelectionUp: props.propagateSelectionUp,
             ptm: ptm,
-            cx: cx
+            selectionKeys: props.selectionKeys,
+            selectionMode: props.selectionMode,
+            togglerTemplate: props.togglerTemplate
           });
         }));
       }
       return null;
     };
     var createNode = function createNode() {
-      var tabIndex = props.disabled ? undefined : 0;
+      var tabIndex = props.disabled || props.index !== 0 ? -1 : 0;
       var selected = isSelected();
       var checked = isChecked();
       var content = createContent();
       var children = createChildren();
-      var nodeProps = utils.mergeProps({
+      var nodeProps = mergeProps(_defineProperty(_defineProperty({
+        ref: elementRef,
         className: utils.classNames(props.node.className, cx('node', {
           isLeaf: isLeaf
         })),
         style: props.node.style,
         tabIndex: tabIndex,
         role: 'treeitem',
-        'aria-posinset': props.index + 1,
+        'aria-label': label,
+        'aria-level': props.level,
         'aria-expanded': expanded,
-        'aria-selected': checked || selected
-      }, getPTOptions('node'));
+        'aria-checked': checked,
+        'aria-setsize': props.node.children ? props.node.children.length : 0,
+        'aria-posinset': props.index + 1,
+        onKeyDown: onKeyDown
+      }, "aria-expanded", expanded), 'aria-selected', checked || selected), getPTOptions('node'));
       return /*#__PURE__*/React__namespace.createElement("li", nodeProps, content, children);
     };
     var node = createNode();
@@ -34822,6 +35379,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
   function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
   function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
   var Tree = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+    var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = TreeBase.getProps(inProps, context);
     var _React$useState = React__namespace.useState(''),
@@ -34838,6 +35396,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     var filterChanged = React__namespace.useRef(false);
     var filteredValue = props.onFilterValueChange ? props.filterValue : filterValueState;
     var expandedKeys = props.onToggle ? props.expandedKeys : expandedKeysState;
+    var childFocusEvent = React__namespace.useRef(null);
     var _TreeBase$setMetaData = TreeBase.setMetaData({
         props: props,
         state: {
@@ -34863,12 +35422,33 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
       return props.filter && filteredNodes.current ? filteredNodes.current : props.value;
     };
     var onToggle = function onToggle(event) {
+      var originalEvent = event.originalEvent,
+        value = event.value,
+        navigateFocusToChild = event.navigateFocusToChild;
       if (props.onToggle) {
-        props.onToggle(event);
+        props.onToggle({
+          originalEvent: originalEvent,
+          value: value
+        });
       } else {
-        setExpandedKeysState(event.value);
+        if (navigateFocusToChild) {
+          childFocusEvent.current = originalEvent;
+        }
+        setExpandedKeysState(value);
       }
     };
+    useUpdateEffect(function () {
+      if (childFocusEvent.current) {
+        var event = childFocusEvent.current;
+        var nodeElement = event.target.getAttribute('data-pc-section') === 'toggler' ? event.target.closest('[role="treeitem"]') : event.target;
+        var listElement = nodeElement.children[1];
+        var childElement = listElement.children[0];
+        nodeElement.tabIndex = '-1';
+        childElement.tabIndex = '0';
+        childElement.focus();
+        childFocusEvent.current = null;
+      }
+    }, [expandedKeys]);
     var onDragStart = function onDragStart(event) {
       dragState.current = {
         path: event.path,
@@ -35141,41 +35721,42 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
         hostName: "Tree",
         key: node.key || node.label,
         node: node,
+        level: props.level + 1,
         originalOptions: props.value,
         index: index,
         last: last,
         path: String(index),
         checkboxIcon: props.checkboxIcon,
-        expandIcon: props.expandIcon,
         collapseIcon: props.collapseIcon,
-        disabled: props.disabled,
-        selectionMode: props.selectionMode,
-        selectionKeys: props.selectionKeys,
-        onSelectionChange: props.onSelectionChange,
-        metaKeySelection: props.metaKeySelection,
         contextMenuSelectionKey: props.contextMenuSelectionKey,
-        onContextMenuSelectionChange: props.onContextMenuSelectionChange,
-        onContextMenu: props.onContextMenu,
-        propagateSelectionDown: props.propagateSelectionDown,
-        propagateSelectionUp: props.propagateSelectionUp,
-        onExpand: props.onExpand,
-        onCollapse: props.onCollapse,
-        onSelect: props.onSelect,
-        onUnselect: props.onUnselect,
+        cx: cx,
+        disabled: props.disabled,
+        dragdropScope: props.dragdropScope,
+        expandIcon: props.expandIcon,
         expandedKeys: expandedKeys,
-        onToggle: onToggle,
-        nodeTemplate: props.nodeTemplate,
-        togglerTemplate: props.togglerTemplate,
         isNodeLeaf: isNodeLeaf,
-        dragdropScope: props.dragdropScope,
-        onDragStart: onDragStart,
+        metaKeySelection: props.metaKeySelection,
+        nodeTemplate: props.nodeTemplate,
+        onClick: props.onNodeClick,
+        onCollapse: props.onCollapse,
+        onContextMenu: props.onContextMenu,
+        onContextMenuSelectionChange: props.onContextMenuSelectionChange,
+        onDoubleClick: props.onNodeDoubleClick,
         onDragEnd: onDragEnd,
+        onDragStart: onDragStart,
         onDrop: onDrop,
         onDropPoint: onDropPoint,
-        onClick: props.onNodeClick,
-        onDoubleClick: props.onNodeDoubleClick,
+        onExpand: props.onExpand,
+        onSelect: props.onSelect,
+        onSelectionChange: props.onSelectionChange,
+        onToggle: onToggle,
+        onUnselect: props.onUnselect,
+        propagateSelectionDown: props.propagateSelectionDown,
+        propagateSelectionUp: props.propagateSelectionUp,
         ptm: ptm,
-        cx: cx
+        selectionKeys: props.selectionKeys,
+        selectionMode: props.selectionMode,
+        togglerTemplate: props.togglerTemplate
       });
     };
     var createRootChildren = function createRootChildren() {
@@ -35191,9 +35772,11 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     var createModel = function createModel() {
       if (props.value) {
         var rootNodes = createRootChildren();
-        var containerProps = utils.mergeProps(_objectSpread({
+        var containerProps = mergeProps(_objectSpread({
           className: utils.classNames(props.contentClassName, cx('container')),
           role: 'tree',
+          'aria-label': props.ariaLabel,
+          'aria-labelledby': props.ariaLabelledBy,
           style: props.contentStyle
         }, ariaProps), ptm('container'));
         return /*#__PURE__*/React__namespace.createElement("ul", containerProps, rootNodes);
@@ -35202,7 +35785,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     };
     var createLoader = function createLoader() {
       if (props.loading) {
-        var loadingIconProps = utils.mergeProps({
+        var loadingIconProps = mergeProps({
           className: cx('loadingIcon')
         }, ptm('loadingIcon'));
         var icon = props.loadingIcon || /*#__PURE__*/React__namespace.createElement(spinner.SpinnerIcon, _extends({}, loadingIconProps, {
@@ -35211,7 +35794,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
         var loadingIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread({}, loadingIconProps), {
           props: props
         });
-        var loadingOverlayProps = utils.mergeProps({
+        var loadingOverlayProps = mergeProps({
           className: cx('loadingOverlay')
         }, ptm('loadingOverlay'));
         return /*#__PURE__*/React__namespace.createElement("div", loadingOverlayProps, loadingIcon);
@@ -35221,17 +35804,17 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     var createFilter = function createFilter() {
       if (props.filter) {
         var value = utils.ObjectUtils.isNotEmpty(filteredValue) ? filteredValue : '';
-        var searchIconProps = utils.mergeProps({
+        var searchIconProps = mergeProps({
           className: cx('searchIcon')
         }, ptm('searchIcon'));
         var icon = props.filterIcon || /*#__PURE__*/React__namespace.createElement(search.SearchIcon, searchIconProps);
         var filterIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread({}, searchIconProps), {
           props: props
         });
-        var filterContainerProps = utils.mergeProps({
+        var filterContainerProps = mergeProps({
           className: cx('filterContainer')
         }, ptm('filterContainer'));
-        var inputProps = utils.mergeProps({
+        var inputProps = mergeProps({
           type: 'text',
           value: value,
           autoComplete: 'off',
@@ -35278,7 +35861,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
           };
           _content2 = utils.ObjectUtils.getJSXElement(props.header, defaultContentOptions);
         }
-        var headerProps = utils.mergeProps({
+        var headerProps = mergeProps({
           className: cx('header')
         }, ptm('header'));
         return /*#__PURE__*/React__namespace.createElement("div", headerProps, _content2);
@@ -35287,7 +35870,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     };
     var createFooter = function createFooter() {
       var content = utils.ObjectUtils.getJSXElement(props.footer, props);
-      var footerProps = utils.mergeProps({
+      var footerProps = mergeProps({
         className: cx('footer')
       }, ptm('footer'));
       return /*#__PURE__*/React__namespace.createElement("div", footerProps, content);
@@ -35298,7 +35881,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
     var content = createModel();
     var header = createHeader();
     var footer = createFooter();
-    var rootProps = utils.mergeProps({
+    var rootProps = mergeProps({
       ref: elementRef,
       className: utils.classNames(props.className, cx('root')),
       style: props.style,
@@ -35314,7 +35897,7 @@ this.primereact.tree = (function (exports, React, api, componentbase, search, sp
 
   return exports;
 
-})({}, React, primereact.api, primereact.componentbase, primereact.icons.search, primereact.icons.spinner, primereact.utils, primereact.icons.check, primereact.icons.chevrondown, primereact.icons.chevronright, primereact.icons.minus, primereact.ripple);
+})({}, React, primereact.api, primereact.componentbase, primereact.hooks, primereact.icons.search, primereact.icons.spinner, primereact.utils, primereact.icons.check, primereact.icons.chevrondown, primereact.icons.chevronright, primereact.icons.minus, primereact.ripple);
 
 undefined
 undefined