primereact 10.0.8 → 10.1.0

package/primereact.all.js

@@ -2914,10 +2914,11 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     ARROW_DOWN_RIGHT: 'pi pi-arrow-down-right',
     ARROW_LEFT: 'pi pi-arrow-left',
     ARROW_RIGHT: 'pi pi-arrow-right',
-    ARROW_RIGHT_ARROW_LEFT: 'pi-arrow-right-arrow-left',
+    ARROW_RIGHT_ARROW_LEFT: 'pi pi-arrow-right-arrow-left',
     ARROW_UP: 'pi pi-arrow-up',
     ARROW_UP_LEFT: 'pi pi-arrow-up-left',
     ARROW_UP_RIGHT: 'pi pi-arrow-up-right',
+    ARROWS_ALT: 'pi pi-arrows-alt',
     ARROWS_H: 'pi pi-arrows-h',
     ARROWS_V: 'pi pi-arrows-v',
     AT: 'pi pi-at',
@@ -2925,6 +2926,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     BAN: 'pi pi-ban',
     BARS: 'pi pi-bars',
     BELL: 'pi pi-bell',
+    BITCOIN: 'pi pi-bitcoin',
     BOLT: 'pi pi-bolt',
     BOOK: 'pi pi-book',
     BOOKMARK: 'pi pi-bookmark',
@@ -2932,6 +2934,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     BOX: 'pi pi-box',
     BRIEFCASE: 'pi pi-briefcase',
     BUILDING: 'pi pi-building',
+    CALCULATOR: 'pi pi-calculator',
     CALENDAR: 'pi pi-calendar',
     CALENDAR_MINUS: 'pi pi-calendar-minus',
     CALENDAR_PLUS: 'pi pi-calendar-plus',
@@ -2942,6 +2945,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     CARET_LEFT: 'pi pi-caret-left',
     CARET_RIGHT: 'pi pi-caret-right',
     CARET_UP: 'pi pi-caret-up',
+    CART_PLUS: 'pi pi-cart-plus',
     CHART_BAR: 'pi pi-chart-bar',
     CHART_LINE: 'pi pi-chart-line',
     CHART_PIE: 'pi pi-chart-pie',
@@ -2958,6 +2962,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     CHEVRON_UP: 'pi pi-chevron-up',
     CIRCLE: 'pi pi-circle',
     CIRCLE_FILL: 'pi pi-circle-fill',
+    CIRCLE_OFF: 'pi pi-circle-off',
+    CIRCLE_ON: 'pi pi-circle-on',
     CLOCK: 'pi pi-clock',
     CLONE: 'pi pi-clone',
     CLOUD: 'pi pi-cloud',
@@ -2971,6 +2977,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     COPY: 'pi pi-copy',
     CREDIT_CARD: 'pi pi-credit-card',
     DATABASE: 'pi pi-database',
+    DELETE_LEFT: 'pi pi-delete-left',
     DESKTOP: 'pi pi-desktop',
     DIRECTIONS: 'pi pi-directions',
     DIRECTIONS_ALT: 'pi pi-directions-alt',
@@ -2981,6 +2988,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     ELLIPSIS_H: 'pi pi-ellipsis-h',
     ELLIPSIS_V: 'pi pi-ellipsis-v',
     ENVELOPE: 'pi pi-envelope',
+    ERASER: 'pi pi-eraser',
     EURO: 'pi pi-euro',
     EXCLAMATION_CIRCLE: 'pi pi-exclamation-circle',
     EXCLAMATION_TRIANGLE: 'pi pi-exclamation-triangle',
@@ -2993,7 +3001,11 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     FILE: 'pi pi-file',
     FILE_EDIT: 'pi pi-file-edit',
     FILE_EXCEL: 'pi pi-file-excel',
+    FILE_EXPORT: 'pi pi-file-export',
+    FILE_IMPORT: 'pi pi-file-import',
+    FILE_O: 'pi pi-file-o',
     FILE_PDF: 'pi pi-file-pdf',
+    FILE_WORD: 'pi pi-file-word',
     FILTER: 'pi pi-filter',
     FILTER_FILL: 'pi pi-filter-fill',
     FILTER_SLASH: 'pi pi-filter-slash',
@@ -3002,6 +3014,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     FOLDER: 'pi pi-folder',
     FOLDER_OPEN: 'pi pi-folder-open',
     FORWARD: 'pi pi-forward',
+    GIFT: 'pi pi-gift',
     GITHUB: 'pi pi-github',
     GLOBE: 'pi pi-globe',
     GOOGLE: 'pi pi-google',
@@ -3010,6 +3023,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     HEART_FILL: 'pi pi-heart-fill',
     HISTORY: 'pi pi-history',
     HOME: 'pi pi-home',
+    HOURGLASS: 'pi pi-hourglass',
     ID_CARD: 'pi pi-id-card',
     IMAGE: 'pi pi-image',
     IMAGES: 'pi pi-images',
@@ -3018,6 +3032,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     INFO_CIRCLE: 'pi pi-info-circle',
     INSTAGRAM: 'pi pi-instagram',
     KEY: 'pi pi-key',
+    LANGUAGE: 'pi pi-language',
     LINK: 'pi pi-link',
     LINKEDIN: 'pi pi-linkedin',
     LIST: 'pi pi-list',
@@ -3025,6 +3040,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     LOCK_OPEN: 'pi pi-lock-open',
     MAP: 'pi pi-map',
     MAP_MARKER: 'pi pi-map-marker',
+    MEGAPHONE: 'pi pi-megaphone',
+    MICROPHONE: 'pi pi-microphone',
     MICROSOFT: 'pi pi-microsoft',
     MINUS: 'pi pi-minus',
     MINUS_CIRCLE: 'pi pi-minus-circle',
@@ -3070,20 +3087,20 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     SLIDERS_V: 'pi pi-sliders-v',
     SORT: 'pi pi-sort',
     SORT_ALPHA_DOWN: 'pi pi-sort-alpha-down',
-    SORT_ALPHA_ALT_DOWN: 'pi pi-sort-alpha-alt-down',
+    SORT_ALPHA_DOWN_ALT: 'pi pi-sort-alpha-down-alt',
     SORT_ALPHA_UP: 'pi pi-sort-alpha-up',
-    SORT_ALPHA_ALT_UP: 'pi pi-sort-alpha-alt-up',
+    SORT_ALPHA_UP_ALT: 'pi pi-sort-alpha-up-alt',
     SORT_ALT: 'pi pi-sort-alt',
-    SORT_ALT_SLASH: 'pi pi-sort-slash',
+    SORT_ALT_SLASH: 'pi pi-sort-alt-slash',
     SORT_AMOUNT_DOWN: 'pi pi-sort-amount-down',
     SORT_AMOUNT_DOWN_ALT: 'pi pi-sort-amount-down-alt',
     SORT_AMOUNT_UP: 'pi pi-sort-amount-up',
     SORT_AMOUNT_UP_ALT: 'pi pi-sort-amount-up-alt',
     SORT_DOWN: 'pi pi-sort-down',
     SORT_NUMERIC_DOWN: 'pi pi-sort-numeric-down',
-    SORT_NUMERIC_ALT_DOWN: 'pi pi-sort-numeric-alt-down',
+    SORT_NUMERIC_DOWN_ALT: 'pi pi-sort-numeric-down-alt',
     SORT_NUMERIC_UP: 'pi pi-sort-numeric-up',
-    SORT_NUMERIC_ALT_UP: 'pi pi-sort-numeric-alt-up',
+    SORT_NUMERIC_UP_ALT: 'pi pi-sort-numeric-up-alt',
     SORT_UP: 'pi pi-sort-up',
     SPINNER: 'pi pi-spinner',
     STAR: 'pi pi-star',
@@ -3094,6 +3111,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     STEP_FORWARD_ALT: 'pi pi-step-forward-alt',
     STOP: 'pi pi-stop',
     STOP_CIRCLE: 'pi pi-stop-circle',
+    STOPWATCH: 'pi pi-stopwatch',
     SUN: 'pi pi-sun',
     SYNC: 'pi pi-sync',
     TABLE: 'pi pi-table',
@@ -3103,11 +3121,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     TELEGRAM: 'pi pi-telegram',
     TH_LARGE: 'pi pi-th-large',
     THUMBS_DOWN: 'pi pi-thumbs-down',
+    THUMBS_DOWN_FILL: 'pi pi-thumbs-down-fill',
     THUMBS_UP: 'pi pi-thumbs-up',
+    THUMBS_UP_FILL: 'pi pi-thumbs-up-fill',
     TICKET: 'pi pi-ticket',
     TIMES: 'pi pi-times',
     TIMES_CIRCLE: 'pi pi-times-circle',
     TRASH: 'pi pi-trash',
+    TRUCK: 'pi pi-truck',
     TWITTER: 'pi pi-twitter',
     UNDO: 'pi pi-undo',
     UNLOCK: 'pi pi-unlock',
@@ -3117,6 +3138,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     USER_MINUS: 'pi pi-user-minus',
     USER_PLUS: 'pi pi-user-plus',
     USERS: 'pi pi-users',
+    VERIFIED: 'pi pi-verified',
     VIDEO: 'pi pi-video',
     VIMEO: 'pi pi-vimeo',
     VOLUME_DOWN: 'pi pi-volume-down',
@@ -3127,6 +3149,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     WIFI: 'pi pi-wifi',
     WINDOW_MAXIMIZE: 'pi pi-window-maximize',
     WINDOW_MINIMIZE: 'pi pi-window-minimize',
+    WRENCH: 'pi pi-wrench',
     YOUTUBE: 'pi pi-youtube'
   });
 
@@ -3555,7 +3578,13 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
    * @returns the hook
    */
   var useMountEffect = function useMountEffect(fn) {
-    return React__namespace.useEffect(fn, []);
+    var mounted = React__namespace.useRef(false);
+    return React__namespace.useEffect(function () {
+      if (!mounted.current) {
+        mounted.current = true;
+        return fn && fn();
+      }
+    }, []);
   };
   /* eslint-enable */
 
@@ -3944,19 +3973,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       _useEventListener4 = _slicedToArray(_useEventListener3, 2),
       bindWindowOrientationChangeListener = _useEventListener4[0],
       unbindWindowOrientationChangeListener = _useEventListener4[1];
-    var _useEventListener5 = useEventListener({
-        target: 'window',
-        type: 'scroll',
-        listener: function listener(event) {
-          _listener && _listener(event, {
-            type: 'scroll',
-            valid: true
-          });
-        }
-      }),
-      _useEventListener6 = _slicedToArray(_useEventListener5, 2),
-      bindWindowScrollChangeListener = _useEventListener6[0],
-      unbindWindowScrollChangeListener = _useEventListener6[1];
     var _useOverlayScrollList = useOverlayScrollListener({
         target: target,
         listener: function listener(event) {
@@ -3976,14 +3992,12 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       bindDocumentClickListener();
       bindWindowResizeListener();
       bindWindowOrientationChangeListener();
-      bindWindowScrollChangeListener();
       bindOverlayScrollListener();
     };
     var unbind = function unbind() {
       unbindDocumentClickListener();
       unbindWindowResizeListener();
       unbindWindowOrientationChangeListener();
-      unbindWindowScrollChangeListener();
       unbindOverlayScrollListener();
     };
     React__namespace.useEffect(function () {
@@ -4292,7 +4306,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
   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 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 !important;\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 !important;\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 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,
     cParams: undefined,
@@ -4480,9 +4494,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
   var _useDefaultPT = function _useDefaultPT(callback, key, params) {
     return _usePT(getDefaultPT(), callback, key, params);
   };
-  var useHandleStyle = function useHandleStyle() {
-    var styles = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {};
-    var config = arguments.length > 1 ? arguments[1] : undefined;
+  var useHandleStyle = function useHandleStyle(styles) {
+    var config = arguments.length > 2 ? arguments[2] : undefined;
     var name = config.name,
       _config$styled = config.styled,
       styled = _config$styled === void 0 ? false : _config$styled,
@@ -6172,7 +6185,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
   }));
   Badge.displayName = 'Badge';
 
-  var styles$14 = "\n@layer primereact {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n    }\n    \n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n    \n    .p-ripple-disabled .p-ink {\n        display: none !important;\n    }\n}\n\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n";
+  var styles$14 = "\n@layer primereact {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n    }\n    \n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n    \n    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n";
   var classes$1a = {
     root: 'p-ink'
   };
@@ -6357,7 +6370,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       };
     }
   };
-  var styles$13 = "\n@layer primereact {\n    .p-tooltip {\n        position: absolute;\n        padding: .25em .5rem;\n        /* #3687: Tooltip prevent scrollbar flickering */\n        top: -9999px;\n        left: -9999px;\n    }\n    \n    .p-tooltip.p-tooltip-right,\n    .p-tooltip.p-tooltip-left {\n        padding: 0 .25rem;\n    }\n    \n    .p-tooltip.p-tooltip-top,\n    .p-tooltip.p-tooltip-bottom {\n        padding:.25em 0;\n    }\n    \n    .p-tooltip .p-tooltip-text {\n       white-space: pre-line;\n       word-break: break-word;\n    }\n    \n    .p-tooltip-arrow {\n        position: absolute;\n        width: 0;\n        height: 0;\n        border-color: transparent;\n        border-style: solid;\n    }\n    \n    .p-tooltip-right .p-tooltip-arrow {\n        top: 50%;\n        left: 0;\n        margin-top: -.25rem;\n        border-width: .25em .25em .25em 0;\n    }\n    \n    .p-tooltip-left .p-tooltip-arrow {\n        top: 50%;\n        right: 0;\n        margin-top: -.25rem;\n        border-width: .25em 0 .25em .25rem;\n    }\n    \n    .p-tooltip.p-tooltip-top {\n        padding: .25em 0;\n    }\n    \n    .p-tooltip-top .p-tooltip-arrow {\n        bottom: 0;\n        left: 50%;\n        margin-left: -.25rem;\n        border-width: .25em .25em 0;\n    }\n    \n    .p-tooltip-bottom .p-tooltip-arrow {\n        top: 0;\n        left: 50%;\n        margin-left: -.25rem;\n        border-width: 0 .25em .25rem;\n    }\n}\n";
+  var styles$13 = "\n@layer primereact {\n    .p-tooltip {\n        position: absolute;\n        padding: .25em .5rem;\n        /* #3687: Tooltip prevent scrollbar flickering */\n        top: -9999px;\n        left: -9999px;\n    }\n    \n    .p-tooltip.p-tooltip-right,\n    .p-tooltip.p-tooltip-left {\n        padding: 0 .25rem;\n    }\n    \n    .p-tooltip.p-tooltip-top,\n    .p-tooltip.p-tooltip-bottom {\n        padding:.25em 0;\n    }\n    \n    .p-tooltip .p-tooltip-text {\n       white-space: pre-line;\n       word-break: break-word;\n    }\n    \n    .p-tooltip-arrow {\n        position: absolute;\n        width: 0;\n        height: 0;\n        border-color: transparent;\n        border-style: solid;\n    }\n    \n    .p-tooltip-right .p-tooltip-arrow {\n        top: 50%;\n        left: 0;\n        margin-top: -.25rem;\n        border-width: .25em .25em .25em 0;\n    }\n    \n    .p-tooltip-left .p-tooltip-arrow {\n        top: 50%;\n        right: 0;\n        margin-top: -.25rem;\n        border-width: .25em 0 .25em .25rem;\n    }\n    \n    .p-tooltip.p-tooltip-top {\n        padding: .25em 0;\n    }\n    \n    .p-tooltip-top .p-tooltip-arrow {\n        bottom: 0;\n        left: 50%;\n        margin-left: -.25rem;\n        border-width: .25em .25em 0;\n    }\n    \n    .p-tooltip-bottom .p-tooltip-arrow {\n        top: 0;\n        left: 50%;\n        margin-left: -.25rem;\n        border-width: 0 .25em .25rem;\n    }\n\n    .p-tooltip-target-wrapper {\n        display: inline-flex;\n    }\n}\n";
   var TooltipBase = ComponentBase.extend({
     defaultProps: {
       __TYPE: 'Tooltip',
@@ -6742,8 +6755,13 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (target) {
         if (isShowOnDisabled(target)) {
           if (!target.hasWrapper) {
-            var wrapper = document.createElement('span');
-            DomHandler.addClass(wrapper, 'p-tooltip-target-wrapper');
+            var wrapper = document.createElement('div');
+            var isInputElement = target.nodeName === 'INPUT';
+            if (isInputElement) {
+              DomHandler.addMultipleClasses(wrapper, "p-tooltip-target-wrapper p-inputwrapper");
+            } else {
+              DomHandler.addClass(wrapper, 'p-tooltip-target-wrapper');
+            }
             target.parentNode.insertBefore(wrapper, target);
             wrapper.appendChild(target);
             target.hasWrapper = true;
@@ -6834,8 +6852,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       }
     }, [props.content]);
     useUnmountEffect(function () {
-      clearTimeouts();
-      unloadTargetEvents();
+      hide();
       ZIndexUtils.clear(elementRef.current);
     });
     React__namespace.useImperativeHandle(ref, function () {
@@ -6911,11 +6928,10 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     },
     label: 'p-button-label p-c',
     root: function root(_ref3) {
-      var _classNames2;
       var props = _ref3.props,
         size = _ref3.size,
         disabled = _ref3.disabled;
-      return classNames('p-button p-component', (_classNames2 = {
+      return classNames('p-button p-component', _defineProperty(_defineProperty(_defineProperty(_defineProperty({
         'p-button-icon-only': (props.icon || props.loading) && !props.label && !props.children,
         'p-button-vertical': (props.iconPos === 'top' || props.iconPos === 'bottom') && props.label,
         'p-disabled': disabled,
@@ -6926,7 +6942,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         'p-button-text': props.text,
         'p-button-rounded': props.rounded,
         'p-button-loading-label-only': props.loading && !props.icon && props.label
-      }, _defineProperty(_classNames2, "p-button-loading-".concat(props.iconPos), props.loading && props.label), _defineProperty(_classNames2, "p-button-".concat(size), size), _defineProperty(_classNames2, "p-button-".concat(props.severity), props.severity), _classNames2));
+      }, "p-button-loading-".concat(props.iconPos), props.loading && props.label), "p-button-".concat(size), size), "p-button-".concat(props.severity), props.severity), 'p-button-plain', props.plain));
     }
   };
   var ButtonBase = ComponentBase.extend({
@@ -6945,6 +6961,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       loading: false,
       loadingIcon: null,
       outlined: false,
+      plain: false,
       raised: false,
       rounded: false,
       severity: null,
@@ -8575,7 +8592,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       selectedItem.current = ObjectUtils.isNotEmpty(value) ? value : null;
     };
     var formatValue = function formatValue(value) {
-      if (value) {
+      if (ObjectUtils.isNotEmpty(value)) {
         if (typeof value === 'string') {
           return value;
         } else if (props.selectedItemTemplate) {
@@ -8836,6 +8853,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (props.autoFocus) {
         DomHandler.focus(inputRef.current, props.autoFocus);
       }
+      alignOverlay();
     });
     useUpdateEffect(function () {
       if (searchingState) {
@@ -9642,11 +9660,10 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
   var styles$Y = "\n@layer primereact {\n    .p-calendar {\n        position: relative;\n        display: inline-flex;\n        max-width: 100%;\n    }\n    \n    .p-calendar .p-inputtext {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n    \n    .p-calendar-w-btn-right .p-inputtext {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n    \n    .p-calendar-w-btn-right .p-datepicker-trigger {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n    \n    .p-calendar-w-btn-left .p-inputtext {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n    \n    .p-calendar-w-btn-left .p-datepicker-trigger {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n    \n    /* Fluid */\n    .p-fluid .p-calendar {\n        display: flex;\n    }\n    \n    .p-fluid .p-calendar .p-inputtext {\n        width: 1%;\n    }\n    \n    /* Datepicker */\n    .p-calendar .p-datepicker {\n        min-width: 100%;\n    }\n    \n    .p-datepicker {\n        width: auto;\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n    \n    .p-datepicker-inline {\n        display: inline-block;\n        position: static;\n        overflow-x: auto;\n    }\n    \n    /* Header */\n    .p-datepicker-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n    \n    .p-datepicker-header .p-datepicker-title {\n        margin: 0 auto;\n    }\n    \n    .p-datepicker-prev,\n    .p-datepicker-next {\n        cursor: pointer;\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    /* Multiple Month DatePicker */\n    .p-datepicker-multiple-month .p-datepicker-group-container {\n        display: flex;\n    }\n    \n    .p-datepicker-multiple-month .p-datepicker-group-container .p-datepicker-group {\n        flex: 1 1 auto;\n    }\n    \n    /* Multiple Month DatePicker */\n    .p-datepicker-multiple-month .p-datepicker-group-container {\n        display: flex;\n    }\n    \n    /* DatePicker Table */\n    .p-datepicker table {\n        width: 100%;\n        border-collapse: collapse;\n    }\n    \n    .p-datepicker td > span {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        margin: 0 auto;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    /* Month Picker */\n    .p-monthpicker-month {\n        width: 33.3%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    /*  Button Bar */\n    .p-datepicker-buttonbar {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n    }\n    \n    /* Time Picker */\n    .p-timepicker {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n    \n    .p-timepicker button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-timepicker > div {\n        display: flex;\n        align-items: center;\n        flex-direction: column;\n    }\n    \n    /* Touch UI */\n    .p-datepicker-touch-ui,\n    .p-calendar .p-datepicker-touch-ui {\n        position: fixed;\n        top: 50%;\n        left: 50%;\n        min-width: 80vw;\n        transform: translate(-50%, -50%);\n    }\n    \n    /* Year Picker */\n    .p-yearpicker-year {\n        width: 50%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n}\n";
   var classes$11 = {
     root: function root(_ref) {
-      var _classNames;
       var props = _ref.props,
         focusedState = _ref.focusedState,
         isFilled = _ref.isFilled;
-      return classNames('p-calendar p-component p-inputwrapper', (_classNames = {}, _defineProperty(_classNames, "p-calendar-w-btn p-calendar-w-btn-".concat(props.iconPos), props.showIcon), _defineProperty(_classNames, 'p-calendar-disabled', props.disabled), _defineProperty(_classNames, 'p-calendar-timeonly', props.timeOnly), _defineProperty(_classNames, 'p-inputwrapper-filled', props.value || isFilled), _defineProperty(_classNames, 'p-inputwrapper-focus', focusedState), _classNames));
+      return classNames('p-calendar p-component p-inputwrapper', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "p-calendar-w-btn p-calendar-w-btn-".concat(props.iconPos), props.showIcon), 'p-calendar-disabled', props.disabled), 'p-calendar-timeonly', props.timeOnly), 'p-inputwrapper-filled', props.value || isFilled), 'p-inputwrapper-focus', focusedState));
     },
     dropdownButton: 'p-datepicker-trigger',
     buttonbar: 'p-datepicker-buttonbar',
@@ -12050,6 +12067,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
             overlayRef.current.style.width = DomHandler.getOuterWidth(overlayRef.current) + 'px';
           }
         }
+      } else {
+        alignOverlay();
       }
       if (props.value) {
         updateInputfield(props.value);
@@ -13769,7 +13788,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     text: 'p-cascadeselect-item-text',
     transition: 'p-connected-overlay'
   };
-  var styles$V = "\n@layer primereact {\n    .p-cascadeselect {\n        display: inline-flex;\n        cursor: pointer;\n        position: relative;\n        user-select: none;\n    }\n    \n    .p-cascadeselect-trigger {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n    }\n    \n    .p-cascadeselect-label {\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        flex: 1 1 auto;\n        width: 1%;\n        text-overflow: ellipsis;\n        cursor: pointer;\n    }\n    \n    .p-cascadeselect-label-empty {\n        overflow: hidden;\n        visibility: hidden;\n    }\n    \n    .p-cascadeselect .p-cascadeselect-panel {\n        min-width: 100%;\n    }\n    \n    .p-cascadeselect-panel {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n    \n    .p-cascadeselect-item {\n        cursor: pointer;\n        font-weight: normal;\n        white-space: nowrap;\n    }\n    \n    .p-cascadeselect-item-content {\n        display: flex;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-cascadeselect-group-icon {\n        margin-left: auto;\n    }\n    \n    .p-cascadeselect-items {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        min-width: 100%;\n    }\n    \n    .p-fluid .p-cascadeselect {\n        display: flex;\n    }\n    \n    .p-fluid .p-cascadeselect .p-cascadeselect-label {\n        width: 1%;\n    }\n    \n    .p-cascadeselect-sublist {\n        position: absolute;\n        min-width: 100%;\n        z-index: 1;\n        display: none;\n    }\n    \n    .p-cascadeselect-item-active {\n        overflow: visible !important;\n    }\n    \n    .p-cascadeselect-item-active > .p-cascadeselect-sublist {\n        display: block;\n        left: 100%;\n        top: 0;\n    }\n}\n";
+  var styles$V = "\n@layer primereact {\n    .p-cascadeselect {\n        display: inline-flex;\n        cursor: pointer;\n        position: relative;\n        user-select: none;\n    }\n    \n    .p-cascadeselect-trigger {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n    }\n    \n    .p-cascadeselect-label {\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        flex: 1 1 auto;\n        width: 1%;\n        text-overflow: ellipsis;\n        cursor: pointer;\n    }\n    \n    .p-cascadeselect-label-empty {\n        overflow: hidden;\n        visibility: hidden;\n    }\n    \n    .p-cascadeselect .p-cascadeselect-panel {\n        min-width: 100%;\n    }\n    \n    .p-cascadeselect-panel {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n    \n    .p-cascadeselect-item {\n        cursor: pointer;\n        font-weight: normal;\n        white-space: nowrap;\n    }\n    \n    .p-cascadeselect-item-content {\n        display: flex;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-cascadeselect-group-icon {\n        margin-left: auto;\n    }\n    \n    .p-cascadeselect-items {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        min-width: 100%;\n    }\n    \n    .p-fluid .p-cascadeselect {\n        display: flex;\n    }\n    \n    .p-fluid .p-cascadeselect .p-cascadeselect-label {\n        width: 1%;\n    }\n    \n    .p-cascadeselect-sublist {\n        position: absolute;\n        min-width: 100%;\n        z-index: 1;\n        display: none;\n    }\n    \n    .p-cascadeselect-item-active {\n        overflow: visible;\n    }\n    \n    .p-cascadeselect-item-active > .p-cascadeselect-sublist {\n        display: block;\n        left: 100%;\n        top: 0;\n    }\n}\n";
   var CascadeSelectBase = ComponentBase.extend({
     defaultProps: {
       __TYPE: 'CascadeSelect',
@@ -14246,7 +14265,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (!styleElementRef.current) {
         styleElementRef.current = DomHandler.createInlineStyle(context && context.nonce || PrimeReact.nonce);
         var selector = "".concat(attributeSelectorState, "_panel");
-        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-items-wrapper > ul {\n        max-height: ").concat(props.scrollHeight, ";\n        overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n    }\n\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-sublist {\n        position: relative;\n    }\n\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-item-active > .p-cascadeselect-sublist {\n        left: 0 !important;\n        box-shadow: none;\n        border-radius: 0;\n        padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n    }\n\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-group-icon:before {\n        content: \"\\e930\";\n    }\n}\n");
+        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-items-wrapper > ul {\n        max-height: ").concat(props.scrollHeight, ";\n        overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n    }\n\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-sublist {\n        position: relative;\n    }\n\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-item-active > .p-cascadeselect-sublist {\n        left: 0;\n        box-shadow: none;\n        border-radius: 0;\n        padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n    }\n\n    .p-cascadeselect-panel[").concat(selector, "] .p-cascadeselect-group-icon:before {\n        content: \"\\e930\";\n    }\n}\n");
         styleElementRef.current.innerHTML = innerHTML;
       }
     };
@@ -14280,6 +14299,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (props.autoFocus) {
         DomHandler.focus(inputRef.current, props.autoFocus);
       }
+      alignOverlay();
     });
     React__namespace.useEffect(function () {
       ObjectUtils.combinedRefs(inputRef, props.inputRef);
@@ -15830,6 +15850,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (props.autoFocus) {
         DomHandler.focus(inputRef.current, props.autoFocus);
       }
+      alignOverlay();
     });
     useUpdateEffect(function () {
       if (!colorDragging.current && !hueDragging.current) {
@@ -16005,7 +16026,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     },
     transition: 'p-dialog'
   };
-  var styles$Q = "\n@layer primereact {\n    .p-dialog-mask {\n        background-color: transparent;\n        transition-property: background-color;\n    }\n    \n    .p-dialog-visible {\n        display: flex;\n    }\n    \n    .p-dialog-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n    \n    .p-dialog {\n        display: flex;\n        flex-direction: column;\n        pointer-events: auto;\n        max-height: 90%;\n        transform: scale(1);\n        position: relative;\n    }\n    \n    .p-dialog-content {\n        overflow-y: auto;\n        flex-grow: 1;\n    }\n    \n    .p-dialog-header {\n        display: flex;\n        align-items: center;\n        flex-shrink: 0;\n    }\n    \n    .p-dialog-footer {\n        flex-shrink: 0;\n    }\n    \n    .p-dialog .p-dialog-header-icons {\n        display: flex;\n        align-items: center;\n        align-self: flex-start;\n        flex-shrink: 0;\n    }\n    \n    .p-dialog .p-dialog-header-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-dialog .p-dialog-title {\n        flex-grow: 1;\n    }\n    \n    /* Fluid */\n    .p-fluid .p-dialog-footer .p-button {\n        width: auto;\n    }\n    \n    /* Animation */\n    /* Center */\n    .p-dialog-enter {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n    \n    .p-dialog-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n    \n    .p-dialog-enter-done {\n        transform: none;\n    }\n    \n    .p-dialog-exit-active {\n        opacity: 0;\n        transform: scale(0.7);\n        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    \n    /* Top, Bottom, Left, Right, Top* and Bottom* */\n    .p-dialog-top .p-dialog,\n    .p-dialog-bottom .p-dialog,\n    .p-dialog-left .p-dialog,\n    .p-dialog-right .p-dialog,\n    .p-dialog-top-left .p-dialog,\n    .p-dialog-top-right .p-dialog,\n    .p-dialog-bottom-left .p-dialog,\n    .p-dialog-bottom-right .p-dialog {\n        margin: 0.75em;\n    }\n    \n    .p-dialog-top .p-dialog-enter,\n    .p-dialog-top .p-dialog-exit-active {\n        transform: translate3d(0px, -100%, 0px);\n    }\n    \n    .p-dialog-bottom .p-dialog-enter,\n    .p-dialog-bottom .p-dialog-exit-active {\n        transform: translate3d(0px, 100%, 0px);\n    }\n    \n    .p-dialog-left .p-dialog-enter,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-enter,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-enter,\n    .p-dialog-bottom-left .p-dialog-exit-active {\n        transform: translate3d(-100%, 0px, 0px);\n    }\n    \n    .p-dialog-right .p-dialog-enter,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-enter,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-enter,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transform: translate3d(100%, 0px, 0px);\n    }\n    \n    .p-dialog-top .p-dialog-enter-active,\n    .p-dialog-bottom .p-dialog-enter-active,\n    .p-dialog-left .p-dialog-enter-active,\n    .p-dialog-top-left .p-dialog-enter-active,\n    .p-dialog-bottom-left .p-dialog-enter-active,\n    .p-dialog-right .p-dialog-enter-active,\n    .p-dialog-top-right .p-dialog-enter-active,\n    .p-dialog-bottom-right .p-dialog-enter-active {\n        transform: translate3d(0px, 0px, 0px);\n        transition: all 0.3s ease-out;\n    }\n    \n    .p-dialog-top .p-dialog-exit-active,\n    .p-dialog-bottom .p-dialog-exit-active,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-exit-active,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transition: all 0.3s ease-out;\n    }\n    \n    /* Maximize */\n    .p-dialog-maximized {\n        transition: none;\n        transform: none;\n        margin: 0 !important;\n        width: 100vw !important;\n        height: 100vh !important;\n        max-height: 100%;\n        top: 0px !important;\n        left: 0px !important;\n    }\n    \n    .p-dialog-maximized .p-dialog-content {\n        flex-grow: 1;\n    }\n    \n    .p-confirm-dialog .p-dialog-content {\n        display: flex;\n        align-items: center;\n    }\n    \n    /* Resizable */\n    .p-dialog .p-resizable-handle {\n        position: absolute;\n        font-size: 0.1px;\n        display: block;\n        cursor: se-resize;\n        width: 12px;\n        height: 12px;\n        right: 1px;\n        bottom: 1px;\n    }\n    \n    .p-dialog-draggable .p-dialog-header {\n        cursor: move;\n    }        \n}\n";
+  var styles$Q = "\n@layer primereact {\n    .p-dialog-mask {\n        background-color: transparent;\n        transition-property: background-color;\n    }\n    \n    .p-dialog-visible {\n        display: flex;\n    }\n    \n    .p-dialog-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n    \n    .p-dialog {\n        display: flex;\n        flex-direction: column;\n        pointer-events: auto;\n        max-height: 90%;\n        transform: scale(1);\n        position: relative;\n    }\n    \n    .p-dialog-content {\n        overflow-y: auto;\n        flex-grow: 1;\n    }\n    \n    .p-dialog-header {\n        display: flex;\n        align-items: center;\n        flex-shrink: 0;\n    }\n    \n    .p-dialog-footer {\n        flex-shrink: 0;\n    }\n    \n    .p-dialog .p-dialog-header-icons {\n        display: flex;\n        align-items: center;\n        align-self: flex-start;\n        flex-shrink: 0;\n    }\n    \n    .p-dialog .p-dialog-header-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-dialog .p-dialog-title {\n        flex-grow: 1;\n    }\n    \n    /* Fluid */\n    .p-fluid .p-dialog-footer .p-button {\n        width: auto;\n    }\n    \n    /* Animation */\n    /* Center */\n    .p-dialog-enter {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n    \n    .p-dialog-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n    \n    .p-dialog-enter-done {\n        transform: none;\n    }\n    \n    .p-dialog-exit-active {\n        opacity: 0;\n        transform: scale(0.7);\n        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    \n    /* Top, Bottom, Left, Right, Top* and Bottom* */\n    .p-dialog-top .p-dialog,\n    .p-dialog-bottom .p-dialog,\n    .p-dialog-left .p-dialog,\n    .p-dialog-right .p-dialog,\n    .p-dialog-top-left .p-dialog,\n    .p-dialog-top-right .p-dialog,\n    .p-dialog-bottom-left .p-dialog,\n    .p-dialog-bottom-right .p-dialog {\n        margin: 0.75em;\n    }\n    \n    .p-dialog-top .p-dialog-enter,\n    .p-dialog-top .p-dialog-exit-active {\n        transform: translate3d(0px, -100%, 0px);\n    }\n    \n    .p-dialog-bottom .p-dialog-enter,\n    .p-dialog-bottom .p-dialog-exit-active {\n        transform: translate3d(0px, 100%, 0px);\n    }\n    \n    .p-dialog-left .p-dialog-enter,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-enter,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-enter,\n    .p-dialog-bottom-left .p-dialog-exit-active {\n        transform: translate3d(-100%, 0px, 0px);\n    }\n    \n    .p-dialog-right .p-dialog-enter,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-enter,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-enter,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transform: translate3d(100%, 0px, 0px);\n    }\n    \n    .p-dialog-top .p-dialog-enter-active,\n    .p-dialog-bottom .p-dialog-enter-active,\n    .p-dialog-left .p-dialog-enter-active,\n    .p-dialog-top-left .p-dialog-enter-active,\n    .p-dialog-bottom-left .p-dialog-enter-active,\n    .p-dialog-right .p-dialog-enter-active,\n    .p-dialog-top-right .p-dialog-enter-active,\n    .p-dialog-bottom-right .p-dialog-enter-active {\n        transform: translate3d(0px, 0px, 0px);\n        transition: all 0.3s ease-out;\n    }\n    \n    .p-dialog-top .p-dialog-exit-active,\n    .p-dialog-bottom .p-dialog-exit-active,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-exit-active,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transition: all 0.3s ease-out;\n    }\n    \n    /* Maximize */\n    .p-dialog-maximized {\n        transition: none;\n        transform: none;\n        margin: 0;\n        width: 100vw !important;\n        height: 100vh !important;\n        max-height: 100%;\n        top: 0px;\n        left: 0px;\n    }\n    \n    .p-dialog-maximized .p-dialog-content {\n        flex-grow: 1;\n    }\n    \n    .p-confirm-dialog .p-dialog-content {\n        display: flex;\n        align-items: center;\n    }\n    \n    /* Resizable */\n    .p-dialog .p-resizable-handle {\n        position: absolute;\n        font-size: 0.1px;\n        display: block;\n        cursor: se-resize;\n        width: 12px;\n        height: 12px;\n        right: 1px;\n        bottom: 1px;\n    }\n    \n    .p-dialog-draggable .p-dialog-header {\n        cursor: move;\n    }        \n}\n";
   var inlineStyles$k = {
     mask: function mask(_ref5) {
       var props = _ref5.props;
@@ -16476,7 +16497,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       styleElement.current = DomHandler.createInlineStyle(context && context.nonce || PrimeReact.nonce);
       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], " !important;\n                    }\n                }\n            ");
+        innerHTML += "\n                @media screen and (max-width: ".concat(breakpoint, ") {\n                    .p-dialog[").concat(attributeSelector.current, "] {\n                        width: ").concat(props.breakpoints[breakpoint], ";\n                    }\n                }\n            ");
       }
       styleElement.current.innerHTML = innerHTML;
     };
@@ -16652,9 +16673,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var maskProps = mergeProps({
         ref: maskRef,
         style: sx('mask'),
-        className: cx('mask', {
-          maskVisibleState: maskVisibleState
-        }),
+        className: cx('mask'),
         onPointerUp: onMaskPointerUp
       }, ptm('mask'));
       var rootProps = mergeProps({
@@ -17504,7 +17523,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       return null;
     };
     var createMenuItem = function createMenuItem(item, index) {
-      var _mergeProps;
       if (item.visible === false) {
         return null;
       }
@@ -17556,7 +17574,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         };
         content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
       }
-      var menuitemProps = mergeProps((_mergeProps = {
+      var menuitemProps = mergeProps(_defineProperty(_defineProperty({
         id: key,
         key: key,
         role: 'none',
@@ -17565,9 +17583,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
           active: active
         }),
         style: item.style
-      }, _defineProperty(_mergeProps, "key", key), _defineProperty(_mergeProps, "onMouseEnter", function onMouseEnter(event) {
+      }, "key", key), "onMouseEnter", function onMouseEnter(event) {
         return onItemMouseEnter(event, item);
-      }), _mergeProps), getPTOptions(item, 'menuitem'));
+      }), getPTOptions(item, 'menuitem'));
       return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, content, submenu);
     };
     var createItem = function createItem(item, index) {
@@ -17682,7 +17700,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (!styleElementRef.current) {
         styleElementRef.current = DomHandler.createInlineStyle(context && context.nonce || PrimeReact.nonce);
         var selector = "".concat(attributeSelectorState);
-        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-contextmenu[").concat(selector, "] > ul {\n        max-height: ").concat(props.scrollHeight, ";\n        overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-submenu-list {\n        position: relative;\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-menuitem-active > .p-submenu-list {\n        left: 0 !important;\n        box-shadow: none;\n        border-radius: 0;\n        padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n        transform: rotate(-180deg);\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-submenu-icon:before {\n        content: \"\\e930\";\n    }\n}\n");
+        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-contextmenu[").concat(selector, "] > ul {\n        max-height: ").concat(props.scrollHeight, ";\n        overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-submenu-list {\n        position: relative;\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-menuitem-active > .p-submenu-list {\n        left: 0;\n        box-shadow: none;\n        border-radius: 0;\n        padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n        transform: rotate(-180deg);\n    }\n\n    .p-contextmenu[").concat(selector, "] .p-submenu-icon:before {\n        content: \"\\e930\";\n    }\n}\n");
         styleElementRef.current.innerHTML = innerHTML;
       }
     };
@@ -19265,7 +19283,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
           _selectionEnd = sRegex.lastIndex + tRegex.lastIndex;
           inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
         } else if (newLength === currentLength) {
-          if (operation === 'insert' || operation === 'delete-back-single') inputEl.setSelectionRange(_selectionEnd + 1, _selectionEnd + 1);else if (operation === 'delete-single') inputEl.setSelectionRange(_selectionEnd - 1, _selectionEnd - 1);else if (operation === 'delete-range' || operation === 'spin') inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
+          if (operation === 'insert' || operation === 'delete-back-single') {
+            var newSelectionEnd = _selectionEnd + Number(isDecimalSign(value) || isDecimalSign(insertedValueStr));
+            inputEl.setSelectionRange(newSelectionEnd, newSelectionEnd);
+          } else if (operation === 'delete-single') {
+            inputEl.setSelectionRange(_selectionEnd - 1, _selectionEnd - 1);
+          } else if (operation === 'delete-range' || operation === 'spin') {
+            inputEl.setSelectionRange(_selectionEnd, _selectionEnd);
+          }
         } else if (operation === 'delete-back-single') {
           var prevChar = inputValue.charAt(_selectionEnd - 1);
           var nextChar = inputValue.charAt(_selectionEnd);
@@ -19407,6 +19432,12 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     useUpdateEffect(function () {
       changeValue();
     }, [props.value]);
+    useUpdateEffect(function () {
+      // #5245 prevent infinite loop
+      if (props.disabled) {
+        clearTimer();
+      }
+    }, [props.disabled]);
     var createInputElement = function createInputElement() {
       var className = classNames('p-inputnumber-input', props.inputClassName);
       var valueToRender = formattedValue(props.value);
@@ -19469,7 +19500,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         },
         onKeyUp: onUpButtonKeyUp,
         disabled: props.disabled,
-        tabIndex: -1
+        tabIndex: -1,
+        'aria-hidden': true
       }, ptm('incrementButton'));
       return /*#__PURE__*/React__namespace.createElement("button", incrementButtonProps, upButton, /*#__PURE__*/React__namespace.createElement(Ripple, null));
     };
@@ -19494,7 +19526,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         },
         onKeyUp: onDownButtonKeyUp,
         disabled: props.disabled,
-        tabIndex: -1
+        tabIndex: -1,
+        'aria-hidden': true
       }, ptm('decrementButton'));
       return /*#__PURE__*/React__namespace.createElement("button", decrementButtonProps, downButton, /*#__PURE__*/React__namespace.createElement(Ripple, null));
     };
@@ -20870,6 +20903,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (props.autoFocus) {
         DomHandler.focus(focusInputRef.current, props.autoFocus);
       }
+      alignOverlay();
     });
     useUpdateEffect(function () {
       if (overlayVisibleState && props.value) {
@@ -20987,7 +21021,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     };
     var createDropdownIcon = function createDropdownIcon() {
       var dropdownIconProps = mergeProps({
-        className: cx('dropdownIcon')
+        className: cx('dropdownIcon'),
+        'data-pr-overlay-visible': overlayVisibleState
       }, ptm('dropdownIcon'));
       var icon = props.dropdownIcon || /*#__PURE__*/React__namespace.createElement(ChevronDownIcon, dropdownIconProps);
       var dropdownIcon = IconUtils.getJSXIcon(icon, _objectSpread$1e({}, dropdownIconProps), {
@@ -21373,7 +21408,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
 
   function ownKeys$1c(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$1c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1c(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-  var styles$J = "\n@layer primereact {\n    .p-datatable {\n        position: relative;\n    }\n\n    .p-datatable > .p-datatable-wrapper {\n        overflow: auto;\n    }\n\n    .p-datatable-table {\n        border-spacing: 0px;\n        width: 100%;\n    }\n\n    .p-datatable .p-sortable-disabled {\n        cursor: auto;\n    }\n\n    .p-datatable .p-sortable-column {\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-datatable .p-sortable-column .p-column-title,\n    .p-datatable .p-sortable-column .p-sortable-column-icon,\n    .p-datatable .p-sortable-column .p-sortable-column-badge {\n        vertical-align: middle;\n    }\n\n    .p-datatable .p-sortable-column .p-sortable-column-badge {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-datatable-selectable .p-selectable-row,\n    .p-datatable-selectable-cell .p-selectable-cell {\n        cursor: pointer;\n    }\n\n    .p-datatable-drag-selection-helper {\n        position: absolute;\n        z-index: 99999999;\n    }\n\n    /* Scrollable */\n    .p-datatable-scrollable > .p-datatable-wrapper {\n        position: relative;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-thead {\n        position: sticky;\n        top: 0;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-frozen-tbody {\n        position: sticky;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-tfoot {\n        position: sticky;\n        bottom: 0;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable .p-frozen-column {\n        position: sticky;\n        background: inherit;\n    }\n\n    .p-datatable-scrollable th.p-frozen-column {\n        z-index: 1;\n    }\n\n    .p-datatable-flex-scrollable {\n        display: flex;\n        flex-direction: column;\n        height: 100%;\n    }\n\n    .p-datatable-flex-scrollable > .p-datatable-wrapper {\n        display: flex;\n        flex-direction: column;\n        flex: 1;\n        height: 100%;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-tbody > .p-rowgroup-header {\n        position: sticky;\n        z-index: 1;\n    }\n\n    /* Resizable */\n    .p-datatable-resizable-table > .p-datatable-thead > tr > th,\n    .p-datatable-resizable-table > .p-datatable-tfoot > tr > td,\n    .p-datatable-resizable-table > .p-datatable-tbody > tr > td {\n        overflow: hidden;\n        white-space: nowrap;\n    }\n\n    .p-datatable-resizable-table > .p-datatable-thead > tr > th.p-resizable-column:not(.p-frozen-column) {\n        background-clip: padding-box;\n        position: relative;\n    }\n\n    .p-datatable-resizable-table-fit > .p-datatable-thead > tr > th.p-resizable-column:last-child .p-column-resizer {\n        display: none;\n    }\n\n    .p-datatable .p-column-resizer {\n        display: block;\n        position: absolute !important;\n        top: 0;\n        right: 0;\n        margin: 0;\n        width: 0.5rem;\n        height: 100%;\n        padding: 0px;\n        cursor: col-resize;\n        border: 1px solid transparent;\n    }\n\n    .p-datatable .p-column-header-content {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-datatable .p-column-resizer-helper {\n        width: 1px;\n        position: absolute;\n        z-index: 10;\n        display: none;\n    }\n\n    .p-datatable .p-row-editor-init,\n    .p-datatable .p-row-editor-save,\n    .p-datatable .p-row-editor-cancel {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Expand */\n    .p-datatable .p-row-toggler {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Reorder */\n    .p-datatable-reorder-indicator-up,\n    .p-datatable-reorder-indicator-down {\n        position: absolute;\n        display: none;\n    }\n\n    .p-reorderable-column,\n    .p-datatable-reorderablerow-handle {\n        cursor: move;\n    }\n\n    /* Loader */\n    .p-datatable .p-datatable-loading-overlay {\n        position: absolute;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 2;\n    }\n\n    /* Filter */\n    .p-column-filter-row {\n        display: flex;\n        align-items: center;\n        width: 100%;\n    }\n\n    .p-column-filter-menu {\n        display: inline-flex;\n        margin-left: auto;\n    }\n\n    .p-column-filter-row .p-column-filter-element {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n\n    .p-column-filter-menu-button,\n    .p-column-filter-clear-button {\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-column-filter-overlay {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n\n    .p-column-filter-row-items {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-column-filter-row-item {\n        cursor: pointer;\n    }\n\n    .p-column-filter-add-button,\n    .p-column-filter-remove-button {\n        justify-content: center;\n    }\n\n    .p-column-filter-add-button .p-button-label,\n    .p-column-filter-remove-button .p-button-label {\n        flex-grow: 0;\n    }\n\n    .p-column-filter-buttonbar {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    .p-column-filter-buttonbar .p-button:not(.p-button-icon-only) {\n        width: auto;\n    }\n\n    /* Responsive */\n    .p-datatable .p-datatable-tbody > tr > td > .p-column-title {\n        display: none;\n    }\n\n    /* VirtualScroller */\n    .p-datatable-virtualscroller-spacer {\n        display: flex;\n    }\n\n    .p-datatable .p-virtualscroller .p-virtualscroller-loading {\n        transform: none !important;\n        min-height: 0;\n        position: sticky;\n        top: 0;\n        left: 0;\n    }\n\n    /* Alignment */\n    .p-datatable .p-datatable-thead > tr > th.p-align-left > .p-column-header-content,\n    .p-datatable .p-datatable-tbody > tr > td.p-align-left,\n    .p-datatable .p-datatable-tfoot > tr > td.p-align-left {\n        text-align: left;\n        justify-content: flex-start;\n    }\n\n    .p-datatable .p-datatable-thead > tr > th.p-align-right > .p-column-header-content,\n    .p-datatable .p-datatable-tbody > tr > td.p-align-right,\n    .p-datatable .p-datatable-tfoot > tr > td.p-align-right {\n        text-align: right;\n        justify-content: flex-end;\n    }\n\n    .p-datatable .p-datatable-thead > tr > th.p-align-center > .p-column-header-content,\n    .p-datatable .p-datatable-tbody > tr > td.p-align-center,\n    .p-datatable .p-datatable-tfoot > tr > td.p-align-center {\n        text-align: center;\n        justify-content: center;\n    }\n}\n";
+  var styles$J = "\n@layer primereact {\n    .p-datatable {\n        position: relative;\n    }\n\n    .p-datatable > .p-datatable-wrapper {\n        overflow: auto;\n    }\n\n    .p-datatable-table {\n        border-spacing: 0px;\n        width: 100%;\n    }\n\n    .p-datatable .p-sortable-disabled {\n        cursor: auto;\n    }\n\n    .p-datatable .p-sortable-column {\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-datatable .p-sortable-column .p-column-title,\n    .p-datatable .p-sortable-column .p-sortable-column-icon,\n    .p-datatable .p-sortable-column .p-sortable-column-badge {\n        vertical-align: middle;\n    }\n\n    .p-datatable .p-sortable-column .p-sortable-column-badge {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-datatable-selectable .p-selectable-row,\n    .p-datatable-selectable-cell .p-selectable-cell {\n        cursor: pointer;\n    }\n\n    .p-datatable-drag-selection-helper {\n        position: absolute;\n        z-index: 99999999;\n    }\n\n    /* Scrollable */\n    .p-datatable-scrollable > .p-datatable-wrapper {\n        position: relative;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-thead {\n        position: sticky;\n        top: 0;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-frozen-tbody {\n        position: sticky;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-tfoot {\n        position: sticky;\n        bottom: 0;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable .p-frozen-column {\n        position: sticky;\n        background: inherit;\n    }\n\n    .p-datatable-scrollable th.p-frozen-column {\n        z-index: 1;\n    }\n\n    .p-datatable-flex-scrollable {\n        display: flex;\n        flex-direction: column;\n        height: 100%;\n    }\n\n    .p-datatable-flex-scrollable > .p-datatable-wrapper {\n        display: flex;\n        flex-direction: column;\n        flex: 1;\n        height: 100%;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-tbody > .p-rowgroup-header {\n        position: sticky;\n        z-index: 1;\n    }\n\n    /* Resizable */\n    .p-datatable-resizable-table > .p-datatable-thead > tr > th,\n    .p-datatable-resizable-table > .p-datatable-tfoot > tr > td,\n    .p-datatable-resizable-table > .p-datatable-tbody > tr > td {\n        overflow: hidden;\n        white-space: nowrap;\n    }\n\n    .p-datatable-resizable-table > .p-datatable-thead > tr > th.p-resizable-column:not(.p-frozen-column) {\n        background-clip: padding-box;\n        position: relative;\n    }\n\n    .p-datatable-resizable-table-fit > .p-datatable-thead > tr > th.p-resizable-column:last-child .p-column-resizer {\n        display: none;\n    }\n\n    .p-datatable .p-column-resizer {\n        display: block;\n        position: absolute;\n        top: 0;\n        right: 0;\n        margin: 0;\n        width: 0.5rem;\n        height: 100%;\n        padding: 0px;\n        cursor: col-resize;\n        border: 1px solid transparent;\n    }\n\n    .p-datatable .p-column-header-content {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-datatable .p-column-resizer-helper {\n        width: 1px;\n        position: absolute;\n        z-index: 10;\n        display: none;\n    }\n\n    .p-datatable .p-row-editor-init,\n    .p-datatable .p-row-editor-save,\n    .p-datatable .p-row-editor-cancel {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Expand */\n    .p-datatable .p-row-toggler {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Reorder */\n    .p-datatable-reorder-indicator-up,\n    .p-datatable-reorder-indicator-down {\n        position: absolute;\n        display: none;\n    }\n\n    .p-reorderable-column,\n    .p-datatable-reorderablerow-handle {\n        cursor: move;\n    }\n\n    /* Loader */\n    .p-datatable .p-datatable-loading-overlay {\n        position: absolute;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 2;\n    }\n\n    /* Filter */\n    .p-column-filter-row {\n        display: flex;\n        align-items: center;\n        width: 100%;\n    }\n\n    .p-column-filter-menu {\n        display: inline-flex;\n        margin-left: auto;\n    }\n\n    .p-column-filter-row .p-column-filter-element {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n\n    .p-column-filter-menu-button,\n    .p-column-filter-clear-button {\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-column-filter-overlay {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n\n    .p-column-filter-row-items {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-column-filter-row-item {\n        cursor: pointer;\n    }\n\n    .p-column-filter-add-button,\n    .p-column-filter-remove-button {\n        justify-content: center;\n    }\n\n    .p-column-filter-add-button .p-button-label,\n    .p-column-filter-remove-button .p-button-label {\n        flex-grow: 0;\n    }\n\n    .p-column-filter-buttonbar {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    .p-column-filter-buttonbar .p-button:not(.p-button-icon-only) {\n        width: auto;\n    }\n\n    /* Responsive */\n    .p-datatable .p-datatable-tbody > tr > td > .p-column-title {\n        display: none;\n    }\n\n    /* VirtualScroller */\n    .p-datatable-virtualscroller-spacer {\n        display: flex;\n    }\n\n    .p-datatable .p-virtualscroller .p-virtualscroller-loading {\n        transform: none;\n        min-height: 0;\n        position: sticky;\n        top: 0;\n        left: 0;\n    }\n\n    /* Alignment */\n    .p-datatable .p-datatable-thead > tr > th.p-align-left > .p-column-header-content,\n    .p-datatable .p-datatable-tbody > tr > td.p-align-left,\n    .p-datatable .p-datatable-tfoot > tr > td.p-align-left {\n        text-align: left;\n        justify-content: flex-start;\n    }\n\n    .p-datatable .p-datatable-thead > tr > th.p-align-right > .p-column-header-content,\n    .p-datatable .p-datatable-tbody > tr > td.p-align-right,\n    .p-datatable .p-datatable-tfoot > tr > td.p-align-right {\n        text-align: right;\n        justify-content: flex-end;\n    }\n\n    .p-datatable .p-datatable-thead > tr > th.p-align-center > .p-column-header-content,\n    .p-datatable .p-datatable-tbody > tr > td.p-align-center,\n    .p-datatable .p-datatable-tfoot > tr > td.p-align-center {\n        text-align: center;\n        justify-content: center;\n    }\n}\n";
   var classes$N = {
     root: function root(_ref) {
       var props = _ref.props,
@@ -21655,6 +21690,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       first: 0,
       footer: null,
       footerColumnGroup: null,
+      frozenRow: false,
       frozenValue: null,
       frozenWidth: null,
       globalFilter: null,
@@ -21686,8 +21722,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       onRowClick: null,
       onRowCollapse: null,
       onRowDoubleClick: null,
-      onRowPointerDown: null,
-      onRowPointerUp: null,
       onRowEditCancel: null,
       onRowEditChange: null,
       onRowEditComplete: null,
@@ -21696,6 +21730,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       onRowExpand: null,
       onRowMouseEnter: null,
       onRowMouseLeave: null,
+      onRowPointerDown: null,
+      onRowPointerUp: null,
       onRowReorder: null,
       onRowSelect: null,
       onRowToggle: null,
@@ -26743,7 +26779,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         var tableSelector = ".p-datatable-wrapper ".concat(isVirtualScrollerDisabled() ? '' : '> .p-virtualscroller', " > .p-datatable-table");
         var selector = ".p-datatable[".concat(attributeSelector.current, "] > ").concat(tableSelector);
         var gridLinesSelector = ".p-datatable[".concat(attributeSelector.current, "].p-datatable-gridlines > ").concat(tableSelector);
-        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    ").concat(selector, " > .p-datatable-thead > tr > th,\n    ").concat(selector, " > .p-datatable-tfoot > tr > td {\n        display: none !important;\n    }\n\n    ").concat(selector, " > .p-datatable-tbody > tr > td {\n        display: flex;\n        width: 100% !important;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    ").concat(selector, " > .p-datatable-tbody > tr > td:not(:last-child) {\n        border: 0 none;\n    }\n\n    ").concat(gridLinesSelector, " > .p-datatable-tbody > tr > td:last-child {\n        border-top: 0;\n        border-right: 0;\n        border-left: 0;\n    }\n\n    ").concat(selector, " > .p-datatable-tbody > tr > td > .p-column-title {\n        display: block;\n    }\n}\n");
+        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    ").concat(selector, " > .p-datatable-thead > tr > th,\n    ").concat(selector, " > .p-datatable-tfoot > tr > td {\n        display: none;\n    }\n\n    ").concat(selector, " > .p-datatable-tbody > tr > td {\n        display: flex;\n        width: 100%;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    ").concat(selector, " > .p-datatable-tbody > tr > td:not(:last-child) {\n        border: 0 none;\n    }\n\n    ").concat(gridLinesSelector, " > .p-datatable-tbody > tr > td:last-child {\n        border-top: 0;\n        border-right: 0;\n        border-left: 0;\n    }\n\n    ").concat(selector, " > .p-datatable-tbody > tr > td > .p-column-title {\n        display: block;\n    }\n}\n");
         responsiveStyleElement.current.innerHTML = innerHTML;
       }
     };
@@ -27306,7 +27342,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
           filters: filters
         }));
       }
-    }, [props.filters, props.children]);
+    }, [props.filters]);
     useUpdateEffect(function () {
       if (isStateful()) {
         saveState();
@@ -27536,80 +27572,83 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var body = /*#__PURE__*/React__namespace.createElement(TableBody, {
         hostName: "DataTable",
         ref: bodyRef,
-        value: dataToRender(rows),
-        style: style,
+        cellClassName: props.cellClassName,
+        cellSelection: props.cellSelection,
+        checkIcon: props.checkIcon,
         className: classNames('p-datatable-tbody', className),
-        empty: empty,
-        frozenRow: false,
-        tableProps: props,
-        tableSelector: attributeSelector.current,
+        collapsedRowIcon: props.collapsedRowIcon,
         columns: columns,
-        selectionModeInColumn: selectionModeInColumn,
-        first: first,
+        compareSelectionBy: props.compareSelectionBy,
+        contextMenuSelection: props.contextMenuSelection,
+        dataKey: props.dataKey,
+        dragSelection: props.dragSelection,
+        editMode: props.editMode,
         editingMeta: editingMetaState,
-        onEditingMetaChange: onEditingMetaChange,
-        tabIndex: props.tabIndex,
-        onRowClick: props.onRowClick,
-        onRowDoubleClick: props.onRowDoubleClick,
-        onRowPointerDown: props.onRowPointerDown,
-        onRowPointerUp: props.onRowPointerUp,
-        onRowMouseEnter: props.onRowMouseEnter,
-        onRowMouseLeave: props.onRowMouseLeave,
-        onCellClick: props.onCellClick,
-        selection: props.selection,
-        onSelectionChange: props.onSelectionChange,
+        editingRows: props.editingRows,
+        empty: empty,
+        emptyMessage: props.emptyMessage,
+        expandableRowGroups: props.expandableRowGroups,
+        expandedRowIcon: props.expandedRowIcon,
+        expandedRows: props.expandedRows,
+        first: first,
+        frozenRow: false,
+        groupRowsBy: props.groupRowsBy,
+        isDataSelectable: props.isDataSelectable,
+        isVirtualScrollerDisabled: isVirtualScrollerDisabled,
         lazy: props.lazy,
-        paginator: props.paginator,
+        loading: props.loading,
+        metaKeySelection: props.metaKeySelection,
+        onCellClick: props.onCellClick,
         onCellSelect: props.onCellSelect,
         onCellUnselect: props.onCellUnselect,
-        onRowSelect: props.onRowSelect,
-        onRowUnselect: props.onRowUnselect,
-        dragSelection: props.dragSelection,
         onContextMenu: props.onContextMenu,
         onContextMenuSelectionChange: props.onContextMenuSelectionChange,
-        metaKeySelection: props.metaKeySelection,
-        selectionMode: props.selectionMode,
-        cellSelection: props.cellSelection,
-        contextMenuSelection: props.contextMenuSelection,
-        dataKey: props.dataKey,
-        expandedRows: props.expandedRows,
+        onEditingMetaChange: onEditingMetaChange,
+        onRowClick: props.onRowClick,
         onRowCollapse: props.onRowCollapse,
+        onRowDoubleClick: props.onRowDoubleClick,
+        onRowEditCancel: props.onRowEditCancel,
+        onRowEditChange: props.onRowEditChange,
+        onRowEditComplete: props.onRowEditComplete,
+        onRowEditInit: props.onRowEditInit,
+        onRowEditSave: props.onRowEditSave,
         onRowExpand: props.onRowExpand,
-        onRowToggle: props.onRowToggle,
-        editMode: props.editMode,
-        editingRows: props.editingRows,
+        onRowMouseEnter: props.onRowMouseEnter,
+        onRowMouseLeave: props.onRowMouseLeave,
+        onRowPointerDown: props.onRowPointerDown,
+        onRowPointerUp: props.onRowPointerUp,
         onRowReorder: props.onRowReorder,
+        onRowSelect: props.onRowSelect,
+        onRowToggle: props.onRowToggle,
+        onRowUnselect: props.onRowUnselect,
+        onSelectionChange: props.onSelectionChange,
+        paginator: props.paginator,
         reorderableRows: props.reorderableRows,
-        scrollable: props.scrollable,
-        rowGroupMode: props.rowGroupMode,
-        groupRowsBy: props.groupRowsBy,
-        expandableRowGroups: props.expandableRowGroups,
-        loading: props.loading,
-        emptyMessage: props.emptyMessage,
-        rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,
+        responsiveLayout: props.responsiveLayout,
+        rowClassName: props.rowClassName,
+        rowEditValidator: props.rowEditValidator,
+        rowEditorCancelIcon: props.rowEditorCancelIcon,
+        rowEditorInitIcon: props.rowEditorInitIcon,
+        rowEditorSaveIcon: props.rowEditorSaveIcon,
         rowExpansionTemplate: props.rowExpansionTemplate,
         rowGroupFooterTemplate: props.rowGroupFooterTemplate,
-        onRowEditChange: props.onRowEditChange,
-        compareSelectionBy: props.compareSelectionBy,
+        rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,
+        rowGroupMode: props.rowGroupMode,
+        scrollable: props.scrollable,
         selectOnEdit: props.selectOnEdit,
-        onRowEditInit: props.onRowEditInit,
-        rowEditValidator: props.rowEditValidator,
-        onRowEditSave: props.onRowEditSave,
-        onRowEditComplete: props.onRowEditComplete,
-        onRowEditCancel: props.onRowEditCancel,
-        cellClassName: props.cellClassName,
-        responsiveLayout: props.responsiveLayout,
+        selection: props.selection,
         selectionAutoFocus: props.selectionAutoFocus,
-        isDataSelectable: props.isDataSelectable,
-        showSelectionElement: props.showSelectionElement,
+        selectionMode: props.selectionMode,
+        selectionModeInColumn: selectionModeInColumn,
         showRowReorderElement: props.showRowReorderElement,
-        expandedRowIcon: props.expandedRowIcon,
-        collapsedRowIcon: props.collapsedRowIcon,
-        checkIcon: props.checkIcon,
-        rowClassName: props.rowClassName,
+        showSelectionElement: props.showSelectionElement,
+        style: style,
+        tabIndex: props.tabIndex,
+        tableProps: props,
+        tableSelector: attributeSelector.current,
+        value: dataToRender(rows),
         virtualScrollerContentRef: contentRef,
         virtualScrollerOptions: options,
-        isVirtualScrollerDisabled: isVirtualScrollerDisabled,
         ptCallbacks: ptCallbacks,
         metaData: metaData
       });
@@ -27820,9 +27859,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       });
     },
     root: function root(_ref2) {
-      var _classNames;
       var props = _ref2.props;
-      return classNames('p-dataview p-component', (_classNames = {}, _defineProperty(_classNames, "p-dataview-".concat(props.layout), !!props.layout), _defineProperty(_classNames, 'p-dataview-loading', props.loading), _classNames));
+      return classNames('p-dataview p-component', _defineProperty(_defineProperty({}, "p-dataview-".concat(props.layout), !!props.layout), 'p-dataview-loading', props.loading));
     }
   };
   var styles$I = "\n@layer primereact {\n    .p-dataview-loading {\n        position: relative;\n        min-height: 4rem;\n    }\n    \n    .p-dataview .p-dataview-loading-overlay {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n}\n";
@@ -29801,10 +29839,10 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
                 });
               }
             }
+            clear();
             setUploadedFilesState(function (prevUploadedFiles) {
               return [].concat(_toConsumableArray(prevUploadedFiles), _toConsumableArray(files));
             });
-            clear();
           }
         };
         xhr.open('POST', props.url, true);
@@ -32134,11 +32172,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       androidChrome.current ? handleAndroidInput(event) : handleInputChange(event);
     };
     var handleInputChange = function handleInputChange(e) {
+      var isOnPaste = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       if (props.readOnly) {
         return;
       }
-      var pos = checkVal(true);
-      caret(pos);
+      if (!isOnPaste) {
+        var pos = checkVal(true);
+        caret(pos);
+      }
       updateModel(e);
       if (props.onComplete && isCompleted()) {
         props.onComplete({
@@ -32295,7 +32336,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       onKeyDown: onKeyDown,
       onKeyPress: onKeyPress,
       onInput: onInput,
-      onPaste: handleInputChange,
+      onPaste: function onPaste(e) {
+        return handleInputChange(e, true);
+      },
       required: props.required,
       tooltip: props.tooltip,
       tooltipOptions: props.tooltipOptions,
@@ -34009,7 +34052,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (!styleElementRef.current) {
         styleElementRef.current = DomHandler.createInlineStyle(context && context.nonce || PrimeReact.nonce);
         var selector = "".concat(attributeSelectorState);
-        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-megamenu[").concat(selector, "] > .p-megamenu-root-list .p-menuitem-active .p-megamenu-panel {\n        position: relative;\n        left: 0 !important;\n        box-shadow: none;\n        border-radius: 0;\n        background: inherit;\n    }\n\n    .p-megamenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n        transform: rotate(-180deg);\n    }\n\n    .p-megamenu[").concat(selector, "] .p-megamenu-grid {\n        flex-wrap: wrap;\n    }\n\n    ").concat(horizontal ? "\n.p-megamenu[".concat(selector, "] .p-megamenu-button {\n    display: flex;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-horizontal {\n    position: relative;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-horizontal .p-megamenu-root-list {\n    display: none;\n}\n\n.p-megamenu-horizontal[").concat(selector, "] div[class*=\"p-megamenu-col-\"] {\n    width: auto;\n    flex: 1;\n    padding: 0;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-mobile-active .p-megamenu-root-list {\n    display: flex;\n    flex-direction: column;\n    position: absolute;\n    width: 100%;\n    top: 100%;\n    left: 0;\n    z-index: 1;\n}\n        ") : '', "\n\n    ").concat(vertical ? "\n.p-megamenu-vertical[".concat(selector, "] {\n    width: 100%;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-megamenu-root-list {\n    max-height: ").concat(props.scrollHeight, ";\n    overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n}\n.p-megamenu-vertical[").concat(selector, "] div[class*=\"p-megamenu-col-\"] {\n    width: 100%;\n    padding: 0;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-megamenu-submenu {\n    width: 100%;\n}\n\n.p-megamenu-vertical[").concat(selector, "] div[class*=\"p-megamenu-col-\"] .p-megamenu-submenu-header {\n    background: inherit;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-submenu-icon:before {\n    content: \"\\e930\";\n}\n        ") : '', "\n}\n");
+        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-megamenu[").concat(selector, "] > .p-megamenu-root-list .p-menuitem-active .p-megamenu-panel {\n        position: relative;\n        left: 0;\n        box-shadow: none;\n        border-radius: 0;\n        background: inherit;\n    }\n\n    .p-megamenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n        transform: rotate(-180deg);\n    }\n\n    .p-megamenu[").concat(selector, "] .p-megamenu-grid {\n        flex-wrap: wrap;\n    }\n\n    ").concat(horizontal ? "\n.p-megamenu[".concat(selector, "] .p-megamenu-button {\n    display: flex;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-horizontal {\n    position: relative;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-horizontal .p-megamenu-root-list {\n    display: none;\n}\n\n.p-megamenu-horizontal[").concat(selector, "] div[class*=\"p-megamenu-col-\"] {\n    width: auto;\n    flex: 1;\n    padding: 0;\n}\n\n.p-megamenu[").concat(selector, "].p-megamenu-mobile-active .p-megamenu-root-list {\n    display: flex;\n    flex-direction: column;\n    position: absolute;\n    width: 100%;\n    top: 100%;\n    left: 0;\n    z-index: 1;\n}\n        ") : '', "\n\n    ").concat(vertical ? "\n.p-megamenu-vertical[".concat(selector, "] {\n    width: 100%;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-megamenu-root-list {\n    max-height: ").concat(props.scrollHeight, ";\n    overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n}\n.p-megamenu-vertical[").concat(selector, "] div[class*=\"p-megamenu-col-\"] {\n    width: 100%;\n    padding: 0;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-megamenu-submenu {\n    width: 100%;\n}\n\n.p-megamenu-vertical[").concat(selector, "] div[class*=\"p-megamenu-col-\"] .p-megamenu-submenu-header {\n    background: inherit;\n}\n\n.p-megamenu-vertical[").concat(selector, "] .p-submenu-icon:before {\n    content: \"\\e930\";\n}\n        ") : '', "\n}\n");
         styleElementRef.current.innerHTML = innerHTML;
       }
     };
@@ -34396,7 +34439,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var selectedText = formatValue(suggestion).replace(/\s+/g, '');
       if (currentText.trim() !== selectedText) {
         var prevText = value.substring(0, triggerState.index);
-        var nextText = value.substring(spaceIndex > -1 ? triggerState.index : triggerState.index + currentText.length);
+        var nextText = value.substring(spaceIndex > -1 ? selectionStart : triggerState.index + currentText.length);
         inputRef.current.value = "".concat(prevText).concat(selectedText, " ").concat(nextText);
         event.target = inputRef.current;
         props.onChange && props.onChange(event);
@@ -34531,6 +34574,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     React__namespace.useEffect(function () {
       ObjectUtils.combinedRefs(inputRef, props.inputRef);
     }, [inputRef, props.inputRef]);
+    useMountEffect(function () {
+      alignOverlay();
+    });
     useUpdateEffect(function () {
       if (searchingState) {
         props.suggestions && props.suggestions.length ? show() : hide();
@@ -35707,6 +35753,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       onFilter: null,
       onFocus: null,
       onHide: null,
+      onRemove: null,
       onSelectAll: null,
       onShow: null,
       optionDisabled: null,
@@ -35911,6 +35958,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         });
       }
       event.preventDefault();
+      event.stopPropagation();
     };
     var onKeyDown = function onKeyDown(event) {
       if (props.onKeyDown) {
@@ -36683,6 +36731,12 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var value = props.value.filter(function (val) {
         return !ObjectUtils.equals(val, item, equalityKey);
       });
+      if (props.onRemove) {
+        props.onRemove({
+          originalEvent: event,
+          value: value
+        });
+      }
       updateModel(event, value, item);
     };
     var getSelectedItemsLabel = function getSelectedItemsLabel() {
@@ -36803,6 +36857,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         }
       };
     });
+    useMountEffect(function () {
+      alignOverlay();
+    });
     React__namespace.useEffect(function () {
       ObjectUtils.combinedRefs(inputRef, props.inputRef);
     }, [inputRef, props.inputRef]);
@@ -38385,7 +38442,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         styleElement.current = DomHandler.createInlineStyle(context && context.nonce || PrimeReact.nonce);
         var innerHTML = '';
         for (var breakpoint in props.breakpoints) {
-          innerHTML += "\n                    @media screen and (max-width: ".concat(breakpoint, ") {\n                        .p-overlaypanel[").concat(attributeSelector.current, "] {\n                            width: ").concat(props.breakpoints[breakpoint], " !important;\n                        }\n                    }\n                ");
+          innerHTML += "\n                    @media screen and (max-width: ".concat(breakpoint, ") {\n                        .p-overlaypanel[").concat(attributeSelector.current, "] {\n                            width: ").concat(props.breakpoints[breakpoint], ";\n                        }\n                    }\n                ");
         }
         styleElement.current.innerHTML = innerHTML;
       }
@@ -39044,7 +39101,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       return null;
     };
     var onItemClick = function onItemClick(event, item) {
-      if (item.disabled || !item.items) {
+      if (item.disabled) {
         event.preventDefault();
         return;
       }
@@ -39068,8 +39125,10 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         if (!props.multiple && activeItem) {
           activeItem.expanded = false;
         }
-        item.expanded = true;
-        setActiveItemState(props.multiple ? [].concat(_toConsumableArray(activeItem || []), [item]) : item);
+        if (item.items) {
+          item.expanded = true;
+          setActiveItemState(props.multiple ? [].concat(_toConsumableArray(activeItem || []), [item]) : item);
+        }
       }
     };
     var isItemActive = function isItemActive(item) {
@@ -39355,6 +39414,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     useHandleStyle(PasswordBase.css.styles, isUnstyled, {
       name: 'password'
     });
+    useOnEscapeKey(overlayRef, props.feedback, function (event) {
+      hide();
+    });
     var _useOverlayListener = useOverlayListener({
         target: elementRef,
         overlay: overlayRef,
@@ -39454,7 +39516,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       props.onBlur && props.onBlur(event);
     };
     var onKeyup = function onKeyup(e) {
-      var keyCode = e.keyCode || e.which;
+      var keyCode = e.code;
       if (props.feedback) {
         var value = e.target.value;
         var label = null;
@@ -39488,7 +39550,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         }
         setMeterState(meter);
         setInfoTextState(label);
-        if (!!keyCode && !overlayVisibleState) {
+        if (!!keyCode && keyCode !== 'Escape' && !overlayVisibleState) {
           show();
         }
       }
@@ -39538,6 +39600,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
       }
     }, [isFilled]);
+    useMountEffect(function () {
+      alignOverlay();
+    });
     useUnmountEffect(function () {
       ZIndexUtils.clear(overlayRef.current);
     });
@@ -41380,7 +41445,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     icon: 'p-scrolltop-icon',
     transition: 'p-scrolltop'
   };
-  var styles$h = "\n@layer primereact {\n    .p-scrolltop {\n        position: fixed;\n        bottom: 20px;\n        right: 20px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n    \n    .p-scrolltop-sticky {\n        position: sticky;\n    }\n    \n    .p-scrolltop-sticky.p-link {\n        margin-left: auto;\n    }\n    \n    .p-scrolltop-helper {\n        display: none !important;\n    }\n    \n    .p-scrolltop-enter {\n        opacity: 0;\n    }\n    \n    .p-scrolltop-enter-active {\n        opacity: 1;\n        transition: opacity .15s;\n    }\n    \n    .p-scrolltop-exit {\n        opacity: 1;\n    }\n    \n    .p-scrolltop-exit-active {\n        opacity: 0;\n        transition: opacity .15s;\n    }\n}\n";
+  var styles$h = "\n@layer primereact {\n    .p-scrolltop {\n        position: fixed;\n        bottom: 20px;\n        right: 20px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n    \n    .p-scrolltop-sticky {\n        position: sticky;\n    }\n    \n    .p-scrolltop-sticky.p-link {\n        margin-left: auto;\n    }\n    \n    .p-scrolltop-helper {\n        display: none;\n    }\n    \n    .p-scrolltop-enter {\n        opacity: 0;\n    }\n    \n    .p-scrolltop-enter-active {\n        opacity: 1;\n        transition: opacity .15s;\n    }\n    \n    .p-scrolltop-exit {\n        opacity: 1;\n    }\n    \n    .p-scrolltop-exit-active {\n        opacity: 0;\n        transition: opacity .15s;\n    }\n}\n";
   var ScrollTopBase = ComponentBase.extend({
     defaultProps: {
       __TYPE: 'ScrollTop',
@@ -41758,7 +41823,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var pos = positions.find(function (item) {
         return item === props.position;
       });
-      return classNames('p-sidebar-mask', pos ? "p-sidebar-".concat(pos) : '', {
+      return classNames('p-sidebar-mask', pos && !props.fullScreen ? "p-sidebar-".concat(pos) : '', {
         'p-component-overlay p-component-overlay-enter': props.modal,
         'p-sidebar-mask-scrollblocker': props.blockScroll,
         'p-sidebar-visible': maskVisibleState,
@@ -41783,7 +41848,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     },
     transition: 'p-sidebar'
   };
-  var styles$g = "\n@layer primereact {\n    .p-sidebar-mask {\n        display: none;\n        justify-content: center;\n        align-items: center;\n        pointer-events: none;\n        background-color: transparent;\n        transition-property: background-color;\n    }\n    \n    .p-sidebar-visible {\n        display: flex;\n    }\n    \n    .p-sidebar-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n    \n    .p-sidebar {\n        display: flex;\n        flex-direction: column;\n        pointer-events: auto;\n        transform: translate3d(0px, 0px, 0px);\n        position: relative;\n    }\n    \n    .p-sidebar-content {\n        overflow-y: auto;\n        flex-grow: 1;\n    }\n    \n    .p-sidebar-header {\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n    }\n    \n    .p-sidebar-custom-header {\n        justify-content: space-between;\n    }\n    \n    .p-sidebar-icons {\n        display: flex;\n        align-items: center;\n        flex-shrink: 0;\n    }\n    \n    .p-sidebar-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-sidebar-full .p-sidebar {\n        transition: none;\n        transform: none;\n        width: 100vw !important;\n        height: 100vh !important;\n        max-height: 100%;\n        top: 0px !important;\n        left: 0px !important;\n    }\n    \n    /* Animation */\n    /* Top, Bottom, Left and Right */\n    .p-sidebar-top .p-sidebar-enter,\n    .p-sidebar-top .p-sidebar-exit-active {\n        transform: translate3d(0px, -100%, 0px);\n    }\n    \n    .p-sidebar-bottom .p-sidebar-enter,\n    .p-sidebar-bottom .p-sidebar-exit-active {\n        transform: translate3d(0px, 100%, 0px);\n    }\n    \n    .p-sidebar-left .p-sidebar-enter,\n    .p-sidebar-left .p-sidebar-exit-active {\n        transform: translate3d(-100%, 0px, 0px);\n    }\n    \n    .p-sidebar-right .p-sidebar-enter,\n    .p-sidebar-right .p-sidebar-exit-active {\n        transform: translate3d(100%, 0px, 0px);\n    }\n    \n    .p-sidebar-top .p-sidebar-enter-active,\n    .p-sidebar-bottom .p-sidebar-enter-active,\n    .p-sidebar-left .p-sidebar-enter-active,\n    .p-sidebar-right .p-sidebar-enter-active {\n        transform: translate3d(0px, 0px, 0px);\n        transition: all 0.3s;\n    }\n    \n    .p-sidebar-top .p-sidebar-enter-done,\n    .p-sidebar-bottom .p-sidebar-enter-done,\n    .p-sidebar-left .p-sidebar-enter-done,\n    .p-sidebar-right .p-sidebar-enter-done {\n        transform: none;\n    }\n    \n    .p-sidebar-top .p-sidebar-exit-active,\n    .p-sidebar-bottom .p-sidebar-exit-active,\n    .p-sidebar-left .p-sidebar-exit-active,\n    .p-sidebar-right .p-sidebar-exit-active {\n        transition: all 0.3s;\n    }\n    \n    /* Full */\n    .p-sidebar-full .p-sidebar-enter {\n        opacity: 0;\n        transform: scale(0.5);\n    }\n    \n    .p-sidebar-full .p-sidebar-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 0.15s cubic-bezier(0, 0, 0.2, 1);\n    }\n    \n    .p-sidebar-full .p-sidebar-enter-done {\n        transform: none;\n    }\n    \n    .p-sidebar-full .p-sidebar-exit-active {\n        opacity: 0;\n        transform: scale(0.5);\n        transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    \n    /* Size */\n    .p-sidebar-left .p-sidebar {\n        width: 20rem;\n        height: 100%;\n    }\n    \n    .p-sidebar-right .p-sidebar {\n        width: 20rem;\n        height: 100%;\n    }\n    \n    .p-sidebar-top .p-sidebar {\n        height: 10rem;\n        width: 100%;\n    }\n    \n    .p-sidebar-bottom .p-sidebar {\n        height: 10rem;\n        width: 100%;\n    }\n    \n    .p-sidebar-left .p-sidebar-sm,\n    .p-sidebar-right .p-sidebar-sm {\n        width: 20rem;\n    }\n    \n    .p-sidebar-left .p-sidebar-md,\n    .p-sidebar-right .p-sidebar-md {\n        width: 40rem;\n    }\n    \n    .p-sidebar-left .p-sidebar-lg,\n    .p-sidebar-right .p-sidebar-lg {\n        width: 60rem;\n    }\n    \n    .p-sidebar-top .p-sidebar-sm,\n    .p-sidebar-bottom .p-sidebar-sm {\n        height: 10rem;\n    }\n    \n    .p-sidebar-top .p-sidebar-md,\n    .p-sidebar-bottom .p-sidebar-md {\n        height: 20rem;\n    }\n    \n    .p-sidebar-top .p-sidebar-lg,\n    .p-sidebar-bottom .p-sidebar-lg {\n        height: 30rem;\n    }\n    \n    .p-sidebar-left .p-sidebar-view,\n    .p-sidebar-right .p-sidebar-view,\n    .p-sidebar-top .p-sidebar-view,\n    .p-sidebar-bottom .p-sidebar-view {\n        width: 100%;\n        height: 100%;\n    }\n    \n    .p-sidebar-left .p-sidebar-content,\n    .p-sidebar-right .p-sidebar-content,\n    .p-sidebar-top .p-sidebar-content,\n    .p-sidebar-bottom .p-sidebar-content {\n        width: 100%;\n        height: 100%;\n    }\n    \n    @media screen and (max-width: 64em) {\n        .p-sidebar-left .p-sidebar-lg,\n        .p-sidebar-left .p-sidebar-md,\n        .p-sidebar-right .p-sidebar-lg,\n        .p-sidebar-right .p-sidebar-md {\n            width: 20rem;\n        }\n    }        \n}\n";
+  var styles$g = "\n@layer primereact {\n    .p-sidebar-mask {\n        display: none;\n        justify-content: center;\n        align-items: center;\n        pointer-events: none;\n        background-color: transparent;\n        transition-property: background-color;\n    }\n    \n    .p-sidebar-visible {\n        display: flex;\n    }\n    \n    .p-sidebar-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n    \n    .p-sidebar {\n        display: flex;\n        flex-direction: column;\n        pointer-events: auto;\n        transform: translate3d(0px, 0px, 0px);\n        position: relative;\n    }\n    \n    .p-sidebar-content {\n        overflow-y: auto;\n        flex-grow: 1;\n    }\n    \n    .p-sidebar-header {\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n    }\n    \n    .p-sidebar-custom-header {\n        justify-content: space-between;\n    }\n    \n    .p-sidebar-icons {\n        display: flex;\n        align-items: center;\n        flex-shrink: 0;\n    }\n    \n    .p-sidebar-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-sidebar-full .p-sidebar {\n        transition: none;\n        transform: none;\n        width: 100vw;\n        height: 100vh;\n        max-height: 100%;\n        top: 0px;\n        left: 0px;\n    }\n    \n    /* Animation */\n    /* Top, Bottom, Left and Right */\n    .p-sidebar-top .p-sidebar-enter,\n    .p-sidebar-top .p-sidebar-exit-active {\n        transform: translate3d(0px, -100%, 0px);\n    }\n    \n    .p-sidebar-bottom .p-sidebar-enter,\n    .p-sidebar-bottom .p-sidebar-exit-active {\n        transform: translate3d(0px, 100%, 0px);\n    }\n    \n    .p-sidebar-left .p-sidebar-enter,\n    .p-sidebar-left .p-sidebar-exit-active {\n        transform: translate3d(-100%, 0px, 0px);\n    }\n    \n    .p-sidebar-right .p-sidebar-enter,\n    .p-sidebar-right .p-sidebar-exit-active {\n        transform: translate3d(100%, 0px, 0px);\n    }\n    \n    .p-sidebar-top .p-sidebar-enter-active,\n    .p-sidebar-bottom .p-sidebar-enter-active,\n    .p-sidebar-left .p-sidebar-enter-active,\n    .p-sidebar-right .p-sidebar-enter-active {\n        transform: translate3d(0px, 0px, 0px);\n        transition: all 0.3s;\n    }\n    \n    .p-sidebar-top .p-sidebar-enter-done,\n    .p-sidebar-bottom .p-sidebar-enter-done,\n    .p-sidebar-left .p-sidebar-enter-done,\n    .p-sidebar-right .p-sidebar-enter-done {\n        transform: none;\n    }\n    \n    .p-sidebar-top .p-sidebar-exit-active,\n    .p-sidebar-bottom .p-sidebar-exit-active,\n    .p-sidebar-left .p-sidebar-exit-active,\n    .p-sidebar-right .p-sidebar-exit-active {\n        transition: all 0.3s;\n    }\n    \n    /* Full */\n    .p-sidebar-full .p-sidebar-enter {\n        opacity: 0;\n        transform: scale(0.5);\n    }\n    \n    .p-sidebar-full .p-sidebar-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 0.15s cubic-bezier(0, 0, 0.2, 1);\n    }\n    \n    .p-sidebar-full .p-sidebar-enter-done {\n        transform: none;\n    }\n    \n    .p-sidebar-full .p-sidebar-exit-active {\n        opacity: 0;\n        transform: scale(0.5);\n        transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    \n    /* Size */\n    .p-sidebar-left .p-sidebar {\n        width: 20rem;\n        height: 100%;\n    }\n    \n    .p-sidebar-right .p-sidebar {\n        width: 20rem;\n        height: 100%;\n    }\n    \n    .p-sidebar-top .p-sidebar {\n        height: 10rem;\n        width: 100%;\n    }\n    \n    .p-sidebar-bottom .p-sidebar {\n        height: 10rem;\n        width: 100%;\n    }\n    \n    .p-sidebar-left .p-sidebar-sm,\n    .p-sidebar-right .p-sidebar-sm {\n        width: 20rem;\n    }\n    \n    .p-sidebar-left .p-sidebar-md,\n    .p-sidebar-right .p-sidebar-md {\n        width: 40rem;\n    }\n    \n    .p-sidebar-left .p-sidebar-lg,\n    .p-sidebar-right .p-sidebar-lg {\n        width: 60rem;\n    }\n    \n    .p-sidebar-top .p-sidebar-sm,\n    .p-sidebar-bottom .p-sidebar-sm {\n        height: 10rem;\n    }\n    \n    .p-sidebar-top .p-sidebar-md,\n    .p-sidebar-bottom .p-sidebar-md {\n        height: 20rem;\n    }\n    \n    .p-sidebar-top .p-sidebar-lg,\n    .p-sidebar-bottom .p-sidebar-lg {\n        height: 30rem;\n    }\n    \n    .p-sidebar-left .p-sidebar-view,\n    .p-sidebar-right .p-sidebar-view,\n    .p-sidebar-top .p-sidebar-view,\n    .p-sidebar-bottom .p-sidebar-view {\n        width: 100%;\n        height: 100%;\n    }\n    \n    .p-sidebar-left .p-sidebar-content,\n    .p-sidebar-right .p-sidebar-content,\n    .p-sidebar-top .p-sidebar-content,\n    .p-sidebar-bottom .p-sidebar-content {\n        width: 100%;\n        height: 100%;\n    }\n    \n    @media screen and (max-width: 64em) {\n        .p-sidebar-left .p-sidebar-lg,\n        .p-sidebar-left .p-sidebar-md,\n        .p-sidebar-right .p-sidebar-lg,\n        .p-sidebar-right .p-sidebar-md {\n            width: 20rem;\n        }\n    }        \n}\n";
   var inlineStyles$7 = {
     mask: function mask(_ref4) {
       var props = _ref4.props;
@@ -42857,8 +42922,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       bottomValue = ObjectUtils.isEmpty(bottomValue) ? null : bottomValue;
       var style = {
         transition: dragging.current ? 'none' : null,
-        left: leftValue != null && leftValue + '%',
-        bottom: bottomValue != null && bottomValue + '%'
+        left: leftValue != null ? leftValue + '%' : null,
+        bottom: bottomValue != null ? bottomValue + '%' : null
       };
       var handleProps = mergeProps(_objectSpread$o({
         className: cx('handle', {
@@ -42952,10 +43017,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
   var styles$c = "\n@layer primereact {\n    .p-speeddial {\n        position: absolute;\n        display: flex;\n        z-index: 1;\n    }\n    \n    .p-speeddial-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        transition: top 0s linear 0.2s;\n        pointer-events: none;\n    }\n    \n    .p-speeddial-item {\n        transform: scale(0);\n        opacity: 0;\n        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s;\n        will-change: transform;\n    }\n    \n    .p-speeddial-action {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-radius: 50%;\n        position: relative;\n        overflow: hidden;\n        text-decoration: none;\n    }\n    \n    .p-speeddial-circle .p-speeddial-item,\n    .p-speeddial-semi-circle .p-speeddial-item,\n    .p-speeddial-quarter-circle .p-speeddial-item {\n        position: absolute;\n    }\n    \n    .p-speeddial-rotate {\n        transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n        will-change: transform;\n    }\n    \n    .p-speeddial-mask {\n        position: absolute;\n        left: 0;\n        top: 0;\n        width: 100%;\n        height: 100%;\n        opacity: 0;\n        transition: opacity 250ms cubic-bezier(0.25, 0.8, 0.25, 1);\n    }\n    \n    .p-speeddial-mask-visible {\n        pointer-events: none;\n        opacity: 1;\n        transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n    }\n    \n    .p-speeddial-opened .p-speeddial-list {\n        pointer-events: auto;\n    }\n    \n    .p-speeddial-opened .p-speeddial-item {\n        transform: scale(1);\n        opacity: 1;\n    }\n    \n    .p-speeddial-opened .p-speeddial-rotate {\n        transform: rotate(45deg);\n    }\n}\n";
   var classes$e = {
     root: function root(_ref) {
-      var _classNames;
       var props = _ref.props,
         visible = _ref.visible;
-      return classNames("p-speeddial p-component p-speeddial-".concat(props.type), (_classNames = {}, _defineProperty(_classNames, "p-speeddial-direction-".concat(props.direction), props.type !== 'circle'), _defineProperty(_classNames, 'p-speeddial-opened', visible), _defineProperty(_classNames, 'p-disabled', props.disabled), _classNames));
+      return classNames("p-speeddial p-component p-speeddial-".concat(props.type), _defineProperty(_defineProperty(_defineProperty({}, "p-speeddial-direction-".concat(props.direction), props.type !== 'circle'), 'p-speeddial-opened', visible), 'p-disabled', props.disabled));
     },
     button: function button(_ref2) {
       var props = _ref2.props;
@@ -43279,13 +43343,12 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       return /*#__PURE__*/React__namespace.createElement("ul", menuProps, items);
     };
     var createButton = function createButton() {
-      var _classNames;
       var showIconVisible = !visible && !!props.showIcon || !props.hideIcon;
       var hideIconVisible = visible && !!props.hideIcon;
       var className = classNames('p-speeddial-button p-button-rounded', {
         'p-speeddial-rotate': props.rotateAnimation && !props.hideIcon
       }, props.buttonClassName);
-      var iconClassName = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(props.showIcon), !visible && !!props.showIcon || !props.hideIcon), _defineProperty(_classNames, "".concat(props.hideIcon), visible && !!props.hideIcon), _classNames));
+      var iconClassName = classNames(_defineProperty(_defineProperty({}, "".concat(props.showIcon), !visible && !!props.showIcon || !props.hideIcon), "".concat(props.hideIcon), visible && !!props.hideIcon));
       var icon = showIconVisible ? props.showIcon || /*#__PURE__*/React__namespace.createElement(PlusIcon, null) : hideIconVisible ? props.hideIcon || /*#__PURE__*/React__namespace.createElement(MinusIcon, null) : null;
       var toggleIcon = IconUtils.getJSXIcon(icon, undefined, {
         props: props,
@@ -43352,13 +43415,12 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
   var classes$d = {
     icon: 'p-button-icon p-c',
     root: function root(_ref) {
-      var _classNames;
       var props = _ref.props,
         size = _ref.size;
-      return classNames('p-splitbutton p-component', (_classNames = {
+      return classNames('p-splitbutton p-component', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
         'p-disabled': props.disabled,
         'p-button-loading-label-only': props.loading && !props.icon && props.label
-      }, _defineProperty(_classNames, "p-button-".concat(props.severity), props.severity), _defineProperty(_classNames, 'p-button-raised', props.raised), _defineProperty(_classNames, 'p-button-rounded', props.rounded), _defineProperty(_classNames, 'p-button-text', props.text), _defineProperty(_classNames, 'p-button-outlined', props.outlined), _defineProperty(_classNames, "p-button-".concat(size), size), _classNames));
+      }, "p-button-".concat(props.severity), props.severity), 'p-button-raised', props.raised), 'p-button-rounded', props.rounded), 'p-button-text', props.text), 'p-button-outlined', props.outlined), "p-button-".concat(size), size));
     },
     button: 'p-splitbutton-defaultbutton',
     menuButton: 'p-splitbutton-menubutton',
@@ -43380,7 +43442,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     menuItem: 'p-menuitem',
     transition: 'p-connected-overlay'
   };
-  var styles$b = "\n@layer primereact {\n    .p-splitbutton {\n        display: inline-flex;\n        position: relative;\n    }\n    \n    .p-splitbutton .p-splitbutton-defaultbutton,\n    .p-splitbutton.p-button-rounded > .p-splitbutton-defaultbutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button {\n        flex: 1 1 auto;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n        border-right: 0 none;\n    }\n    \n    .p-splitbutton-menubutton,\n    .p-splitbutton.p-button-rounded > .p-splitbutton-menubutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-menubutton.p-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n    \n    .p-splitbutton .p-menu {\n        min-width: 100%;\n    }\n    \n    .p-fluid .p-splitbutton  {\n        display: flex;\n    }\n}\n";
+  var styles$b = "\n@layer primereact {\n    .p-splitbutton {\n        display: inline-flex;\n        position: relative;\n    }\n\n    .p-splitbutton .p-splitbutton-defaultbutton,\n    .p-splitbutton.p-button-rounded > .p-splitbutton-defaultbutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button-outlined.p-button:hover {\n        flex: 1 1 auto;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n        border-right: 0 none;\n    }\n\n    .p-splitbutton-menubutton,\n    .p-splitbutton.p-button-rounded > .p-splitbutton-menubutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-menubutton.p-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-splitbutton .p-menu {\n        min-width: 100%;\n    }\n\n    .p-fluid .p-splitbutton  {\n        display: flex;\n    }\n}\n";
   var SplitButtonBase = ComponentBase.extend({
     defaultProps: {
       __TYPE: 'SplitButton',
@@ -43649,6 +43711,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (!idState) {
         setIdState(UniqueComponentId());
       }
+      alignOverlay();
     });
     useUnmountEffect(function () {
       ZIndexUtils.clear(overlayRef.current);
@@ -43943,7 +44006,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       }
     }, [props.stateStorage]);
     var saveState = function saveState(sizes) {
-      getStorage().setItem(props.stateKey, JSON.stringify(sizes));
+      if (ObjectUtils.isArray(sizes)) {
+        getStorage().setItem(props.stateKey, JSON.stringify(sizes));
+      }
     };
     var restoreState = React__namespace.useCallback(function () {
       var stateString = getStorage().getItem(props.stateKey);
@@ -44912,14 +44977,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     var getTabProp = function getTabProp(tab, name) {
       return TabPanelBase.getCProp(tab, name);
     };
-    var shouldUseTab = function shouldUseTab(tab, index) {
+    var shouldUseTab = function shouldUseTab(tab) {
       return tab && ObjectUtils.isValidChild(tab, 'TabPanel') && hiddenTabsState.every(function (_i) {
-        return _i !== index;
+        return _i !== tab.key;
       });
     };
     var findVisibleActiveTab = function findVisibleActiveTab(i) {
       var tabsInfo = React__namespace.Children.map(props.children, function (tab, index) {
-        if (shouldUseTab(tab, index)) {
+        if (shouldUseTab(tab)) {
           return {
             tab: tab,
             index: index
@@ -44938,17 +45003,21 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     };
     var onTabHeaderClose = function onTabHeaderClose(event, index) {
       event.preventDefault();
+      var onBeforeTabClose = props.onBeforeTabClose,
+        onTabClose = props.onTabClose,
+        children = props.children;
+      var key = children[index].key;
 
       // give caller a chance to stop the selection
-      if (props.onBeforeTabClose && props.onBeforeTabClose({
+      if (onBeforeTabClose && onBeforeTabClose({
         originalEvent: event,
         index: index
       }) === false) {
         return;
       }
-      setHiddenTabsState([].concat(_toConsumableArray(hiddenTabsState), [index]));
-      if (props.onTabClose) {
-        props.onTabClose({
+      setHiddenTabsState([].concat(_toConsumableArray(hiddenTabsState), [key]));
+      if (onTabClose) {
+        onTabClose({
           originalEvent: event,
           index: index
         });
@@ -45159,7 +45228,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     };
     var createTabHeaders = function createTabHeaders() {
       return React__namespace.Children.map(props.children, function (tab, index) {
-        if (shouldUseTab(tab, index)) {
+        if (shouldUseTab(tab)) {
           return createTabHeader(tab, index);
         }
       });
@@ -45190,7 +45259,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         style: props.panelContainerStyle
       }, ptm('panelcontainer'));
       var contents = React__namespace.Children.map(props.children, function (tab, index) {
-        if (shouldUseTab(tab, index) && (!props.renderActiveOnly || isSelected(index))) {
+        if (shouldUseTab(tab) && (!props.renderActiveOnly || isSelected(index))) {
           var selected = isSelected(index);
           var contentId = idState + '_content_' + index;
           var ariaLabelledBy = idState + '_header_' + index;
@@ -45285,9 +45354,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     value: 'p-tag-value',
     icon: 'p-tag-icon',
     root: function root(_ref) {
-      var _classNames;
       var props = _ref.props;
-      return classNames('p-tag p-component', (_classNames = {}, _defineProperty(_classNames, "p-tag-".concat(props.severity), props.severity !== null), _defineProperty(_classNames, 'p-tag-rounded', props.rounded), _classNames));
+      return classNames('p-tag p-component', _defineProperty(_defineProperty({}, "p-tag-".concat(props.severity), props.severity !== null), 'p-tag-rounded', props.rounded));
     }
   };
   var styles$6 = "\n@layer primereact {\n    .p-tag {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n    }\n    \n    .p-tag-icon,\n    .p-tag-value,\n    .p-tag-icon.pi {\n        line-height: 1.5;\n    }\n    \n    .p-tag.p-tag-rounded {\n        border-radius: 10rem;\n    }\n}\n";
@@ -46014,7 +46082,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (!styleElementRef.current) {
         styleElementRef.current = DomHandler.createInlineStyle(context && context.nonce || PrimeReact.nonce);
         var selector = "".concat(attributeSelectorState);
-        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-tieredmenu[").concat(selector, "] > ul {\n        max-height: ").concat(props.scrollHeight, ";\n        overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-submenu-list {\n        position: relative;\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-menuitem-active > .p-submenu-list {\n        left: 0 !important;\n        box-shadow: none;\n        border-radius: 0;\n        padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n        transform: rotate(-180deg);\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-submenu-icon:before {\n        content: \"\\e930\";\n    }\n\n    ").concat(!props.popup ? ".p-tieredmenu[".concat(selector, "] { width: 100%; }") : '', "\n}\n");
+        var innerHTML = "\n@media screen and (max-width: ".concat(props.breakpoint, ") {\n    .p-tieredmenu[").concat(selector, "] > ul {\n        max-height: ").concat(props.scrollHeight, ";\n        overflow: ").concat(props.scrollHeight ? 'auto' : '', ";\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-submenu-list {\n        position: relative;\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-menuitem-active > .p-submenu-list {\n        left: 0;\n        box-shadow: none;\n        border-radius: 0;\n        padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n        transform: rotate(-180deg);\n    }\n\n    .p-tieredmenu[").concat(selector, "] .p-submenu-icon:before {\n        content: \"\\e930\";\n    }\n\n    ").concat(!props.popup ? ".p-tieredmenu[".concat(selector, "] { width: 100%; }") : '', "\n}\n");
         styleElementRef.current.innerHTML = innerHTML;
       }
     };
@@ -46147,9 +46215,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         separator: 'p-timeline-event-separator',
         content: 'p-timeline-event-content',
         root: function root(_ref) {
-          var _classNames;
           var props = _ref.props;
-          return classNames('p-timeline p-component', (_classNames = {}, _defineProperty(_classNames, "p-timeline-".concat(props.align), true), _defineProperty(_classNames, "p-timeline-".concat(props.layout), true), _classNames), props.className);
+          return classNames('p-timeline p-component', _defineProperty(_defineProperty({}, "p-timeline-".concat(props.align), true), "p-timeline-".concat(props.layout), true), props.className);
         }
       },
       styles: "\n        @layer primereact {\n            .p-timeline {\n                display: flex;\n                flex-grow: 1;\n                flex-direction: column;\n            }\n        \n            .p-timeline-left .p-timeline-event-opposite {\n                text-align: right;\n            }\n        \n            .p-timeline-left .p-timeline-event-content {\n                text-align: left;\n            }\n        \n            .p-timeline-right .p-timeline-event {\n                flex-direction: row-reverse;\n            }\n        \n            .p-timeline-right .p-timeline-event-opposite {\n                text-align: left;\n            }\n        \n            .p-timeline-right .p-timeline-event-content {\n                text-align: right;\n            }\n        \n            .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n                flex-direction: row-reverse;\n            }\n        \n            .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n                text-align: right;\n            }\n        \n            .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n                text-align: left;\n            }\n        \n            .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n                text-align: left;\n            }\n        \n            .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n                text-align: right;\n            }\n        \n            .p-timeline-event {\n                display: flex;\n                position: relative;\n                min-height: 70px;\n            }\n        \n            .p-timeline-event:last-child {\n                min-height: 0;\n            }\n        \n            .p-timeline-event-opposite {\n                flex: 1;\n                padding: 0 1rem;\n            }\n        \n            .p-timeline-event-content {\n                flex: 1;\n                padding: 0 1rem;\n            }\n        \n            .p-timeline-event-separator {\n                flex: 0;\n                display: flex;\n                align-items: center;\n                flex-direction: column;\n            }\n        \n            .p-timeline-event-marker {\n                display: flex;\n                align-self: baseline;\n            }\n        \n            .p-timeline-event-connector {\n                flex-grow: 1;\n            }\n        \n            .p-timeline-horizontal {\n                flex-direction: row;\n            }\n        \n            .p-timeline-horizontal .p-timeline-event {\n                flex-direction: column;\n                flex: 1;\n            }\n        \n            .p-timeline-horizontal .p-timeline-event:last-child {\n                flex: 0;\n            }\n        \n            .p-timeline-horizontal .p-timeline-event-separator {\n                flex-direction: row;\n            }\n        \n            .p-timeline-horizontal .p-timeline-event-connector  {\n                width: 100%;\n            }\n        \n            .p-timeline-bottom .p-timeline-event {\n                flex-direction: column-reverse;\n            }\n        \n            .p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n                flex-direction: column-reverse;\n            }\n        }\n    "
@@ -46966,9 +47033,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       return ptm(key, {
         hostName: props.hostName,
         context: {
-          selected: props.selected,
-          expanded: expanded,
-          checked: props.checked,
+          selected: !isCheckboxSelectionMode() ? isSelected() : false,
+          expanded: expanded || false,
+          checked: isCheckboxSelectionMode() ? isChecked() : false,
           isLeaf: isLeaf
         }
       });
@@ -48663,6 +48730,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (props.autoFocus) {
         DomHandler.focus(focusInputRef.current, props.autoFocus);
       }
+      alignOverlay();
     });
     useUpdateEffect(function () {
       if (overlayVisibleState && props.filter) {
@@ -48923,7 +48991,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
   }));
   TreeSelect.displayName = 'TreeSelect';
 
-  var styles = "\n@layer primereact {\n    .p-treetable {\n        position: relative;\n    }\n    \n    .p-treetable > .p-treetable-wrapper {\n        overflow: auto;\n    }\n    \n    .p-treetable table {\n        border-collapse: collapse;\n        width: 100%;\n        table-layout: fixed;\n    }\n    \n    .p-treetable .p-sortable-column {\n        cursor: pointer;\n        user-select: none;\n    }\n    \n    .p-treetable-selectable .p-treetable-tbody > tr {\n        cursor: pointer;\n    }\n    \n    .p-treetable-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        vertical-align: middle;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-treetable-toggler + .p-checkbox {\n        vertical-align: middle;\n    }\n    \n    .p-treetable-toggler + .p-checkbox + span {\n        vertical-align: middle;\n    }\n    \n    /* Resizable */\n    .p-treetable-resizable > .p-treetable-wrapper {\n        overflow-x: auto;\n    }\n    \n    .p-treetable-resizable .p-treetable-thead > tr > th,\n    .p-treetable-resizable .p-treetable-tfoot > tr > td,\n    .p-treetable-resizable .p-treetable-tbody > tr > td {\n        overflow: hidden;\n    }\n    \n    .p-treetable-resizable .p-resizable-column {\n        background-clip: padding-box;\n        position: relative;\n    }\n    \n    .p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {\n        display: none;\n    }\n    \n    .p-treetable .p-column-resizer {\n        display: block;\n        position: absolute !important;\n        top: 0;\n        right: 0;\n        margin: 0;\n        width: 0.5rem;\n        height: 100%;\n        padding: 0px;\n        cursor: col-resize;\n        border: 1px solid transparent;\n    }\n    \n    .p-treetable .p-column-resizer-helper {\n        width: 1px;\n        position: absolute;\n        z-index: 10;\n        display: none;\n    }\n    \n    /* Scrollable */\n    .p-treetable-scrollable-wrapper {\n        position: relative;\n    }\n    .p-treetable-scrollable-header,\n    .p-treetable-scrollable-footer {\n        overflow: hidden;\n        border: 0 none;\n    }\n    \n    .p-treetable-scrollable-body {\n        overflow: auto;\n        position: relative;\n    }\n    \n    .p-treetable-virtual-table {\n        position: absolute;\n    }\n    \n    /* Frozen Columns */\n    .p-treetable-frozen-view .p-treetable-scrollable-body {\n        overflow: hidden;\n    }\n    \n    .p-treetable-unfrozen-view {\n        position: absolute;\n        top: 0px;\n        left: 0px;\n    }\n    \n    /* Reorder */\n    .p-treetable-reorder-indicator-up,\n    .p-treetable-reorder-indicator-down {\n        position: absolute;\n        display: none;\n    }\n    \n    /* Loader */\n    .p-treetable .p-treetable-loading-overlay {\n        position: absolute;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 2;\n    }\n}\n";
+  var styles = "\n@layer primereact {\n    .p-treetable {\n        position: relative;\n    }\n    \n    .p-treetable > .p-treetable-wrapper {\n        overflow: auto;\n    }\n    \n    .p-treetable table {\n        border-collapse: collapse;\n        width: 100%;\n        table-layout: fixed;\n    }\n    \n    .p-treetable .p-sortable-column {\n        cursor: pointer;\n        user-select: none;\n    }\n    \n    .p-treetable-selectable .p-treetable-tbody > tr {\n        cursor: pointer;\n    }\n    \n    .p-treetable-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        vertical-align: middle;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-treetable-toggler + .p-checkbox {\n        vertical-align: middle;\n    }\n    \n    .p-treetable-toggler + .p-checkbox + span {\n        vertical-align: middle;\n    }\n    \n    /* Resizable */\n    .p-treetable-resizable > .p-treetable-wrapper {\n        overflow-x: auto;\n    }\n    \n    .p-treetable-resizable .p-treetable-thead > tr > th,\n    .p-treetable-resizable .p-treetable-tfoot > tr > td,\n    .p-treetable-resizable .p-treetable-tbody > tr > td {\n        overflow: hidden;\n    }\n    \n    .p-treetable-resizable .p-resizable-column {\n        background-clip: padding-box;\n        position: relative;\n    }\n    \n    .p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {\n        display: none;\n    }\n    \n    .p-treetable .p-column-resizer {\n        display: block;\n        position: absolute;\n        top: 0;\n        right: 0;\n        margin: 0;\n        width: 0.5rem;\n        height: 100%;\n        padding: 0px;\n        cursor: col-resize;\n        border: 1px solid transparent;\n    }\n    \n    .p-treetable .p-column-resizer-helper {\n        width: 1px;\n        position: absolute;\n        z-index: 10;\n        display: none;\n    }\n    \n    /* Scrollable */\n    .p-treetable-scrollable-wrapper {\n        position: relative;\n    }\n    .p-treetable-scrollable-header,\n    .p-treetable-scrollable-footer {\n        overflow: hidden;\n        border: 0 none;\n    }\n    \n    .p-treetable-scrollable-body {\n        overflow: auto;\n        position: relative;\n    }\n    \n    .p-treetable-virtual-table {\n        position: absolute;\n    }\n    \n    /* Frozen Columns */\n    .p-treetable-frozen-view .p-treetable-scrollable-body {\n        overflow: hidden;\n    }\n    \n    .p-treetable-unfrozen-view {\n        position: absolute;\n        top: 0px;\n        left: 0px;\n    }\n    \n    /* Reorder */\n    .p-treetable-reorder-indicator-up,\n    .p-treetable-reorder-indicator-down {\n        position: absolute;\n        display: none;\n    }\n    \n    /* Loader */\n    .p-treetable .p-treetable-loading-overlay {\n        position: absolute;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 2;\n    }\n}\n";
   var classes$1 = {
     root: function root(_ref) {
       var props = _ref.props,
@@ -48971,12 +49039,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     headerTitle: 'p-column-title',
     headerCell: function headerCell(_ref4) {
       var props = _ref4.headerProps,
+        frozen = _ref4.frozen,
         column = _ref4.column,
         options = _ref4.options,
         getColumnProp = _ref4.getColumnProp,
-        sorted = _ref4.sorted,
-        frozen = _ref4.frozen;
-      return options.filterOnly ? 'p-filter-column' : classNames({
+        sorted = _ref4.sorted;
+      return options.filterOnly ? classNames('p-filter-column', {
+        'p-frozen-column': frozen
+      }) : classNames({
         'p-sortable-column': getColumnProp(column, 'sortable'),
         'p-highlight': sorted,
         'p-frozen-column': frozen,
@@ -50383,20 +50453,22 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         });
       }
       if (options.filterOnly) {
+        var frozen = getColumnProp(column, 'frozen');
         var headerCellProps = mergeProps({
           key: getColumnProp(column, 'columnKey') || getColumnProp(column, 'field') || options.index,
           className: classNames(cx('headerCell', {
-            options: options
+            options: options,
+            frozen: frozen
           }), getColumnProp(column, 'filterHeaderClassName')),
           style: getColumnProp(column, 'filterHeaderStyle') || getColumnProp(column, 'style'),
           rowSpan: getColumnProp(column, 'rowSpan'),
           colSpan: getColumnProp(column, 'colSpan'),
           'data-p-sortable-column': getColumnProp(column, 'sortable'),
           'data-p-resizable-column': props.resizableColumns,
-          'data-p-frozen-column': getColumnProp(column, 'frozen')
+          'data-p-frozen-column': frozen
         }, getColumnPTOptions(column, 'root'), getColumnPTOptions(column, 'headerCell', {
           context: {
-            frozen: getColumnProp(column, 'frozen')
+            frozen: frozen
           }
         }));
         return /*#__PURE__*/React__namespace.createElement("th", headerCellProps, filterElement);
@@ -50407,7 +50479,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         var singleSorted = getColumnProp(column, 'field') === props.sortField;
         var multipleSorted = multiSortMetaData !== null;
         var sorted = getColumnProp(column, 'sortable') && (singleSorted || multipleSorted);
-        var frozen = getColumnProp(column, 'frozen');
+        var _frozen = getColumnProp(column, 'frozen');
         var sortOrder = 0;
         if (singleSorted) sortOrder = props.sortOrder;else if (multipleSorted) sortOrder = multiSortMetaData.order;
         var sortIconElement = createSortIcon(column, sorted, sortOrder);
@@ -50420,11 +50492,11 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         var _headerCellProps = mergeProps({
           className: classNames(getColumnProp(column, 'headerClassName') || getColumnProp(column, 'className'), cx('headerCell', {
             headerProps: props,
+            frozen: _frozen,
             column: column,
             options: options,
             getColumnProp: getColumnProp,
-            sorted: sorted,
-            frozen: frozen
+            sorted: sorted
           })),
           style: getColumnProp(column, 'headerStyle') || getColumnProp(column, 'style'),
           tabIndex: getColumnProp(column, 'sortable') ? props.tabIndex : null,
@@ -50459,7 +50531,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         }, getColumnPTOptions(column, 'root'), getColumnPTOptions(column, 'headerCell', {
           context: {
             sorted: sorted,
-            frozen: frozen,
+            frozen: _frozen,
             resizable: props.resizableColumns
           }
         }));