primereact 10.9.5 → 10.9.7

package/primereact.all.cjs.js

@@ -154,6 +154,7 @@ var FilterMatchMode = Object.freeze({
   EQUALS: 'equals',
   NOT_EQUALS: 'notEquals',
   IN: 'in',
+  NOT_IN: 'notIn',
   LESS_THAN: 'lt',
   LESS_THAN_OR_EQUAL_TO: 'lte',
   GREATER_THAN: 'gt',
@@ -2158,11 +2159,13 @@ var ObjectUtils = /*#__PURE__*/function () {
      * @param {object} a - The first object to compare.
      * @param {object} b - The second object to compare.
      * @param {string[]} [keysToCompare] - The keys to compare. If not provided, performs a shallow comparison using absoluteCompare.
+     * @param {number} [maxDepth=1] - The maximum depth to compare if the variables are objects.
      * @returns {boolean} True if all specified properties are equal, false otherwise.
      */
   }, {
     key: "selectiveCompare",
     value: function selectiveCompare(a, b, keysToCompare) {
+      var maxDepth = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
       if (a === b) return true;
       if (!a || !b || _typeof(a) !== 'object' || _typeof(b) !== 'object') return false;
       if (!keysToCompare) return this.absoluteCompare(a, b, 1); // If no keys are provided, the comparison is limited to one depth level.
@@ -2176,7 +2179,7 @@ var ObjectUtils = /*#__PURE__*/function () {
           var isObject = _typeof(aValue) === 'object' && aValue !== null && _typeof(bValue) === 'object' && bValue !== null;
 
           // If the current key is an object, they are compared in one further level only.
-          if (isObject && !this.absoluteCompare(aValue, bValue, 1)) return false;
+          if (isObject && !this.absoluteCompare(aValue, bValue, maxDepth)) return false;
           if (!isObject && aValue !== bValue) return false;
         }
       } catch (err) {
@@ -3104,6 +3107,7 @@ var locales = {
     emptySelectionMessage: 'No selected item',
     endsWith: 'Ends with',
     equals: 'Equals',
+    fileChosenMessage: '{0} files',
     fileSizeTypes: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
     filter: 'Filter',
     firstDayOfWeek: 0,
@@ -3122,6 +3126,7 @@ var locales = {
     nextMonth: 'Next Month',
     nextSecond: 'Next Second',
     nextYear: 'Next Year',
+    noFileChosenMessage: 'No file chosen',
     noFilter: 'No Filter',
     notContains: 'Not contains',
     notEquals: 'Not equals',
@@ -3149,8 +3154,10 @@ var locales = {
     aria: {
       cancelEdit: 'Cancel Edit',
       close: 'Close',
+      collapseLabel: 'Collapse',
       collapseRow: 'Row Collapsed',
       editRow: 'Edit Row',
+      expandLabel: 'Expand',
       expandRow: 'Row Expanded',
       falseLabel: 'False',
       filterConstraint: 'Filter Constraint',
@@ -3175,18 +3182,20 @@ var locales = {
       next: 'Next',
       nextPageLabel: 'Next Page',
       nullLabel: 'Not Selected',
-      pageLabel: 'Page {page}',
       otpLabel: 'Please enter one time password character {0}',
+      pageLabel: 'Page {page}',
       passwordHide: 'Hide Password',
       passwordShow: 'Show Password',
       previous: 'Previous',
       prevPageLabel: 'Previous Page',
+      removeLabel: 'Remove',
       rotateLeft: 'Rotate Left',
       rotateRight: 'Rotate Right',
       rowsPerPageLabel: 'Rows per page',
       saveEdit: 'Save Edit',
       scrollTop: 'Scroll Top',
       selectAll: 'All items selected',
+      selectLabel: 'Select',
       selectRow: 'Row Selected',
       showFilterMenu: 'Show Filter Menu',
       slide: 'Slide',
@@ -3195,6 +3204,7 @@ var locales = {
       stars: '{star} stars',
       trueLabel: 'True',
       unselectAll: 'All items unselected',
+      unselectLabel: 'Unselect',
       unselectRow: 'Row Unselected',
       zoomImage: 'Zoom Image',
       zoomIn: 'Zoom In',
@@ -4908,7 +4918,7 @@ var useUpdateEffect = function useUpdateEffect(fn, deps) {
 function ownKeys$1Y(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$1Y(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1Y(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1Y(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var baseStyle = "\n.p-hidden-accessible {\n    border: 0;\n    clip: rect(0 0 0 0);\n    height: 1px;\n    margin: -1px;\n    opacity: 0;\n    overflow: hidden;\n    padding: 0;\n    pointer-events: none;\n    position: absolute;\n    white-space: nowrap;\n    width: 1px;\n}\n\n.p-overflow-hidden {\n    overflow: hidden;\n    padding-right: var(--scrollbar-width);\n}\n";
-var buttonStyles = "\n.p-button {\n    margin: 0;\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    align-items: center;\n    vertical-align: bottom;\n    text-align: center;\n    overflow: hidden;\n    position: relative;\n}\n\n.p-button-label {\n    flex: 1 1 auto;\n}\n\n.p-button-icon-right {\n    order: 1;\n}\n\n.p-button:disabled {\n    cursor: default;\n}\n\n.p-button-icon-only {\n    justify-content: center;\n}\n\n.p-button-icon-only .p-button-label {\n    visibility: hidden;\n    width: 0;\n    flex: 0 0 auto;\n}\n\n.p-button-vertical {\n    flex-direction: column;\n}\n\n.p-button-icon-bottom {\n    order: 2;\n}\n\n.p-button-group .p-button {\n    margin: 0;\n}\n\n.p-button-group .p-button:not(:last-child) {\n    border-right: 0 none;\n}\n\n.p-button-group .p-button:not(:first-of-type):not(:last-of-type) {\n    border-radius: 0;\n}\n\n.p-button-group .p-button:first-of-type {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n}\n\n.p-button-group .p-button:last-of-type {\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n}\n\n.p-button-group .p-button:focus {\n    position: relative;\n    z-index: 1;\n}\n\n.p-button-group-single .p-button:first-of-type {\n    border-top-right-radius: var(--border-radius) !important;\n    border-bottom-right-radius: var(--border-radius) !important;\n}\n\n.p-button-group-single .p-button:last-of-type {\n    border-top-left-radius: var(--border-radius) !important;\n    border-bottom-left-radius: var(--border-radius) !important;\n}\n";
+var buttonStyles = "\n.p-button {\n    margin: 0;\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    align-items: center;\n    vertical-align: bottom;\n    text-align: center;\n    overflow: hidden;\n    position: relative;\n}\n\n.p-button-label {\n    flex: 1 1 auto;\n}\n\n.p-button-icon {\n    pointer-events: none;\n}\n\n.p-button-icon-right {\n    order: 1;\n}\n\n.p-button:disabled {\n    cursor: default;\n}\n\n.p-button-icon-only {\n    justify-content: center;\n}\n\n.p-button-icon-only .p-button-label {\n    visibility: hidden;\n    width: 0;\n    flex: 0 0 auto;\n}\n\n.p-button-vertical {\n    flex-direction: column;\n}\n\n.p-button-icon-bottom {\n    order: 2;\n}\n\n.p-button-group .p-button {\n    margin: 0;\n}\n\n.p-button-group .p-button:not(:last-child) {\n    border-right: 0 none;\n}\n\n.p-button-group .p-button:not(:first-of-type):not(:last-of-type) {\n    border-radius: 0;\n}\n\n.p-button-group .p-button:first-of-type {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n}\n\n.p-button-group .p-button:last-of-type {\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n}\n\n.p-button-group .p-button:focus {\n    position: relative;\n    z-index: 1;\n}\n\n.p-button-group-single .p-button:first-of-type {\n    border-top-right-radius: var(--border-radius) !important;\n    border-bottom-right-radius: var(--border-radius) !important;\n}\n\n.p-button-group-single .p-button:last-of-type {\n    border-top-left-radius: var(--border-radius) !important;\n    border-bottom-left-radius: var(--border-radius) !important;\n}\n";
 var inputTextStyles = "\n.p-inputtext {\n    margin: 0;\n}\n\n.p-fluid .p-inputtext {\n    width: 100%;\n}\n\n/* InputGroup */\n.p-inputgroup {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup-addon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-inputgroup .p-float-label {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-fluid .p-inputgroup .p-inputtext,\n.p-inputgroup .p-inputwrapper,\n.p-fluid .p-inputgroup .p-input {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n/* Floating Label */\n.p-float-label {\n    display: block;\n    position: relative;\n}\n\n.p-float-label label {\n    position: absolute;\n    pointer-events: none;\n    top: 50%;\n    margin-top: -0.5rem;\n    transition-property: all;\n    transition-timing-function: ease;\n    line-height: 1;\n}\n\n.p-float-label textarea ~ label,\n.p-float-label .p-mention ~ label {\n    top: 1rem;\n}\n\n.p-float-label input:focus ~ label,\n.p-float-label input:-webkit-autofill ~ label,\n.p-float-label input.p-filled ~ label,\n.p-float-label textarea:focus ~ label,\n.p-float-label textarea.p-filled ~ label,\n.p-float-label .p-inputwrapper-focus ~ label,\n.p-float-label .p-inputwrapper-filled ~ label,\n.p-float-label .p-tooltip-target-wrapper ~ label {\n    top: -0.75rem;\n    font-size: 12px;\n}\n\n.p-float-label .p-placeholder,\n.p-float-label input::placeholder,\n.p-float-label .p-inputtext::placeholder {\n    opacity: 0;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-float-label .p-focus .p-placeholder,\n.p-float-label input:focus::placeholder,\n.p-float-label .p-inputtext:focus::placeholder {\n    opacity: 1;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-input-icon-left,\n.p-input-icon-right {\n    position: relative;\n    display: inline-block;\n}\n\n.p-input-icon-left > i,\n.p-input-icon-right > i,\n.p-input-icon-left > svg,\n.p-input-icon-right > svg,\n.p-input-icon-left > .p-input-prefix,\n.p-input-icon-right > .p-input-suffix {\n    position: absolute;\n    top: 50%;\n    margin-top: -0.5rem;\n}\n\n.p-fluid .p-input-icon-left,\n.p-fluid .p-input-icon-right {\n    display: block;\n    width: 100%;\n}\n";
 var iconStyles = "\n.p-icon {\n    display: inline-block;\n}\n\n.p-icon-spin {\n    -webkit-animation: p-icon-spin 2s infinite linear;\n    animation: p-icon-spin 2s infinite linear;\n}\n\nsvg.p-icon {\n    pointer-events: auto;\n}\n\nsvg.p-icon g,\n.p-disabled svg.p-icon {\n    pointer-events: none;\n}\n\n@-webkit-keyframes p-icon-spin {\n    0% {\n        -webkit-transform: rotate(0deg);\n        transform: rotate(0deg);\n    }\n    100% {\n        -webkit-transform: rotate(359deg);\n        transform: rotate(359deg);\n    }\n}\n\n@keyframes p-icon-spin {\n    0% {\n        -webkit-transform: rotate(0deg);\n        transform: rotate(0deg);\n    }\n    100% {\n        -webkit-transform: rotate(359deg);\n        transform: rotate(359deg);\n    }\n}\n";
 var commonStyle = "\n@layer primereact {\n    .p-component, .p-component * {\n        box-sizing: border-box;\n    }\n\n    .p-hidden {\n        display: none;\n    }\n\n    .p-hidden-space {\n        visibility: hidden;\n    }\n\n    .p-reset {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        outline: 0;\n        text-decoration: none;\n        font-size: 100%;\n        list-style: none;\n    }\n\n    .p-disabled, .p-disabled * {\n        cursor: default;\n        pointer-events: none;\n        user-select: none;\n    }\n\n    .p-component-overlay {\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n    }\n\n    .p-unselectable-text {\n        user-select: none;\n    }\n\n    .p-scrollbar-measure {\n        width: 100px;\n        height: 100px;\n        overflow: scroll;\n        position: absolute;\n        top: -9999px;\n    }\n\n    @-webkit-keyframes p-fadein {\n      0%   { opacity: 0; }\n      100% { opacity: 1; }\n    }\n    @keyframes p-fadein {\n      0%   { opacity: 0; }\n      100% { opacity: 1; }\n    }\n\n    .p-link {\n        text-align: left;\n        background-color: transparent;\n        margin: 0;\n        padding: 0;\n        border: none;\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-link:disabled {\n        cursor: default;\n    }\n\n    /* Non react overlay animations */\n    .p-connected-overlay {\n        opacity: 0;\n        transform: scaleY(0.8);\n        transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-connected-overlay-visible {\n        opacity: 1;\n        transform: scaleY(1);\n    }\n\n    .p-connected-overlay-hidden {\n        opacity: 0;\n        transform: scaleY(1);\n        transition: opacity .1s linear;\n    }\n\n    /* React based overlay animations */\n    .p-connected-overlay-enter {\n        opacity: 0;\n        transform: scaleY(0.8);\n    }\n\n    .p-connected-overlay-enter-active {\n        opacity: 1;\n        transform: scaleY(1);\n        transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-connected-overlay-enter-done {\n        transform: none;\n    }\n\n    .p-connected-overlay-exit {\n        opacity: 1;\n    }\n\n    .p-connected-overlay-exit-active {\n        opacity: 0;\n        transition: opacity .1s linear;\n    }\n\n    /* Toggleable Content */\n    .p-toggleable-content-enter {\n        max-height: 0;\n    }\n\n    .p-toggleable-content-enter-active {\n        overflow: hidden;\n        max-height: 1000px;\n        transition: max-height 1s ease-in-out;\n    }\n\n    .p-toggleable-content-enter-done {\n        transform: none;\n    }\n\n    .p-toggleable-content-exit {\n        max-height: 1000px;\n    }\n\n    .p-toggleable-content-exit-active {\n        overflow: hidden;\n        max-height: 0;\n        transition: max-height 0.45s cubic-bezier(0, 1, 0, 1);\n    }\n\n    /* @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(inputTextStyles, "\n    ").concat(iconStyles, "\n}\n");
@@ -5666,12 +5676,13 @@ var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
       var tabHeader = createTabHeader(tab, selected, index);
       var tabContent = createTabContent(tab, selected, index);
       var _rootProps = mergeProps({
-        key: key,
         className: cx('accordiontab.root', {
           selected: selected
         })
       }, AccordionTabBase.getCOtherProps(tab), getTabPT(tab, 'root', index));
-      return /*#__PURE__*/React__namespace.createElement("div", _rootProps, tabHeader, tabContent);
+      return /*#__PURE__*/React__namespace.createElement("div", _extends({}, _rootProps, {
+        key: key
+      }), tabHeader, tabContent);
     }
     return null;
   };
@@ -8182,7 +8193,8 @@ var AutoCompletePanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__n
       style: style,
       onClick: function onClick(e) {
         return props.onClick(e);
-      }
+      },
+      'data-pr-is-overlay': true
     }, _ptm('panel'));
     var transitionProps = mergeProps({
       classNames: cx('transition'),
@@ -9748,7 +9760,8 @@ var CalendarPanel = /*#__PURE__*/React__namespace.forwardRef(function (props, re
       'aria-label': localeOption('chooseDate', props.locale),
       'aria-modal': props.inline ? null : 'true',
       onClick: props.onClick,
-      onMouseUp: props.onMouseUp
+      onMouseUp: props.onMouseUp,
+      'data-pr-is-overlay': true
     }, props.ptm('panel', {
       hostName: props.hostName
     }));
@@ -10148,14 +10161,14 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
         newViewDate.setMonth(11);
         newViewDate.setFullYear(newYear);
         props.onMonthChange && props.onMonthChange({
-          month: 11,
+          month: 12,
           year: newYear
         });
         setCurrentMonth(11);
       } else {
         newViewDate.setMonth(newViewDate.getMonth() - 1);
         props.onMonthChange && props.onMonthChange({
-          month: currentMonth - 1,
+          month: currentMonth,
           year: currentYear
         });
         setCurrentMonth(function (prevState) {
@@ -10193,14 +10206,14 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
         newViewDate.setMonth(0);
         newViewDate.setFullYear(newYear);
         props.onMonthChange && props.onMonthChange({
-          month: 0,
+          month: 1,
           year: newYear
         });
         setCurrentMonth(0);
       } else {
         newViewDate.setMonth(newViewDate.getMonth() + 1);
         props.onMonthChange && props.onMonthChange({
-          month: currentMonth + 1,
+          month: currentMonth + 2,
           year: currentYear
         });
         setCurrentMonth(function (prevState) {
@@ -10277,8 +10290,8 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     var timeMeta = {
       hours: today.getHours(),
       minutes: today.getMinutes(),
-      seconds: today.getSeconds(),
-      milliseconds: today.getMilliseconds()
+      seconds: props.showSeconds ? today.getSeconds() : 0,
+      milliseconds: props.showMillisec ? today.getMilliseconds() : 0
     };
     updateViewDate(event, today);
     onDateSelect(event, dateMeta, timeMeta);
@@ -11263,7 +11276,7 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
         milliseconds = timeMeta.milliseconds;
       } else {
         var time = getCurrentDateTime();
-        var _ref5 = [time.getHours(), time.getMinutes(), time.getSeconds(), time.getMilliseconds()];
+        var _ref5 = [time.getHours(), time.getMinutes(), props.showSeconds ? time.getSeconds() : 0, props.showMillisec ? time.getMilliseconds() : 0];
         hours = _ref5[0];
         minutes = _ref5[1];
         seconds = _ref5[2];
@@ -12174,13 +12187,32 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       return props.parseDateTime(text);
     }
     var date;
-    var parts = text.split(' ');
     if (props.timeOnly) {
       date = new Date();
-      populateTime(date, parts[0], parts[1]);
+      var match = text.match(/(\d{1,2}:\d{2}(?::\d{2})?(?:\.\d{1,3})?)\s?(AM|PM)?/i);
+      if (match) {
+        populateTime(date, match[1], match[2]);
+      } else {
+        return null;
+      }
     } else if (props.showTime) {
-      date = parseDate(parts[0], getDateFormat());
-      populateTime(date, parts[1], parts[2]);
+      var time12 = /(\d{1,2}:\d{2}(?::\d{2})?(?:\.\d{1,3})?)\s?(AM|PM)/i;
+      var time24 = /(\d{1,2}:\d{2}(?::\d{2})?(?:\.\d{1,3})?)$/;
+      var _match, datePart, timePart, ampm;
+      if (props.hourFormat === '12' && (_match = text.match(time12))) {
+        timePart = _match[1];
+        ampm = _match[2];
+        datePart = text.replace(time12, '').trim();
+      } else if (props.hourFormat === '24' && (_match = text.match(time24))) {
+        timePart = _match[1];
+        datePart = text.replace(time24, '').trim();
+      }
+      if (datePart && timePart) {
+        date = parseDate(datePart, getDateFormat());
+        populateTime(date, timePart, ampm);
+      } else {
+        date = parseDate(text, getDateFormat());
+      }
     } else {
       date = parseDate(text, getDateFormat());
     }
@@ -12569,7 +12601,7 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       viewDate.setHours(0, 0, 0);
       isClearClicked.current = false;
     }
-    if (!prevPropValue && propValue || propValue && propValue instanceof Date && propValue.getTime() !== prevPropValue.getTime()) {
+    if (!prevPropValue && propValue || propValue && propValue instanceof Date && prevPropValue instanceof Date && propValue.getTime() !== prevPropValue.getTime()) {
       validateDate(viewDate);
     }
     setViewDateState(viewDate);
@@ -12823,6 +12855,9 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       }),
       'aria-selected': selected,
       'aria-disabled': !date.selectable,
+      onMouseDown: function onMouseDown(e) {
+        return e.preventDefault();
+      },
       onClick: function onClick(e) {
         return onDateSelect(e, date);
       },
@@ -14027,7 +14062,15 @@ var Carousel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     }
     if (!carouselStyle.current) {
       calculatePosition();
-      changePosition(totalShiftedItemsState);
+
+      // Workaround: force correct initial position for circular
+      if (isCircular) {
+        var initialPosition = -1 * numVisibleState;
+        setTotalShiftedItemsState(initialPosition);
+        changePosition(initialPosition);
+      } else {
+        changePosition(totalShiftedItemsState);
+      }
       bindWindowResizeListener();
     }
   });
@@ -14341,6 +14384,22 @@ var Carousel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
 CarouselItem.displayName = 'CarouselItem';
 Carousel.displayName = 'Carousel';
 
+var TimesIcon = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+  var pti = IconBase.getPTI(inProps);
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
+    ref: ref,
+    width: "14",
+    height: "14",
+    viewBox: "0 0 14 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, pti), /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M8.01186 7.00933L12.27 2.75116C12.341 2.68501 12.398 2.60524 12.4375 2.51661C12.4769 2.42798 12.4982 2.3323 12.4999 2.23529C12.5016 2.13827 12.4838 2.0419 12.4474 1.95194C12.4111 1.86197 12.357 1.78024 12.2884 1.71163C12.2198 1.64302 12.138 1.58893 12.0481 1.55259C11.9581 1.51625 11.8617 1.4984 11.7647 1.50011C11.6677 1.50182 11.572 1.52306 11.4834 1.56255C11.3948 1.60204 11.315 1.65898 11.2488 1.72997L6.99067 5.98814L2.7325 1.72997C2.59553 1.60234 2.41437 1.53286 2.22718 1.53616C2.03999 1.53946 1.8614 1.61529 1.72901 1.74767C1.59663 1.88006 1.5208 2.05865 1.5175 2.24584C1.5142 2.43303 1.58368 2.61419 1.71131 2.75116L5.96948 7.00933L1.71131 11.2675C1.576 11.403 1.5 11.5866 1.5 11.7781C1.5 11.9696 1.576 12.1532 1.71131 12.2887C1.84679 12.424 2.03043 12.5 2.2219 12.5C2.41338 12.5 2.59702 12.424 2.7325 12.2887L6.99067 8.03052L11.2488 12.2887C11.3843 12.424 11.568 12.5 11.7594 12.5C11.9509 12.5 12.1346 12.424 12.27 12.2887C12.4053 12.1532 12.4813 11.9696 12.4813 11.7781C12.4813 11.5866 12.4053 11.403 12.27 11.2675L8.01186 7.00933Z",
+    fill: "currentColor"
+  }));
+}));
+TimesIcon.displayName = 'TimesIcon';
+
 var classes$14 = {
   root: function root(_ref) {
     var props = _ref.props,
@@ -14377,6 +14436,7 @@ var classes$14 = {
     });
   },
   dropdownIcon: 'p-cascadeselect-trigger-icon',
+  clearIcon: 'p-cascadeselect-clear-icon p-clickable',
   loadingIcon: 'p-cascadeselect-trigger-icon',
   dropdownButton: 'p-cascadeselect-trigger',
   loadingButton: 'p-cascadeselect-trigger',
@@ -14387,7 +14447,7 @@ var classes$14 = {
   text: 'p-cascadeselect-item-text',
   transition: 'p-connected-overlay'
 };
-var styles$U = "\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-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-wrapper {\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-wrapper {\n        display: block;\n        left: 100%;\n        top: 0;\n    }\n}\n";
+var styles$U = "\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-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-wrapper {\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-wrapper {\n        display: block;\n        left: 100%;\n        top: 0;\n    }\n    .p-cascadeselect-clear-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -.5rem;\n        right: 3rem;\n    }\n}\n";
 var CascadeSelectBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'CascadeSelect',
@@ -14395,6 +14455,7 @@ var CascadeSelectBase = ComponentBase.extend({
     ariaLabelledBy: null,
     autoFocus: false,
     breakpoint: undefined,
+    showClear: false,
     className: null,
     dataKey: null,
     disabled: false,
@@ -14420,6 +14481,8 @@ var CascadeSelectBase = ComponentBase.extend({
     optionLabel: null,
     optionValue: null,
     options: null,
+    panelClassName: null,
+    panelStyle: null,
     placeholder: null,
     scrollHeight: '400px',
     style: null,
@@ -14732,6 +14795,7 @@ var CascadeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
   var styleElementRef = React__namespace.useRef(null);
   var dirty = React__namespace.useRef(false);
   var selectionPath = React__namespace.useRef(null);
+  var selfChange = React__namespace.useRef(null);
   var _useOverlayListener = useOverlayListener({
       target: elementRef,
       overlay: overlayRef,
@@ -14761,6 +14825,7 @@ var CascadeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
   });
   var onOptionSelect = function onOptionSelect(event) {
     if (props.onChange) {
+      selfChange.current = true;
       props.onChange({
         originalEvent: event,
         value: event.value
@@ -14987,6 +15052,48 @@ var CascadeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
     }, ariaProps), ptm('input'));
     return /*#__PURE__*/React__namespace.createElement("div", hiddenSelectedMessageProps, /*#__PURE__*/React__namespace.createElement("input", inputProps));
   };
+  var clear = function clear(event) {
+    if (props.onChange) {
+      selfChange.current = true;
+      props.onChange({
+        originalEvent: event,
+        value: undefined,
+        stopPropagation: function stopPropagation() {
+          event === null || event === void 0 || event.stopPropagation();
+        },
+        preventDefault: function preventDefault() {
+          event === null || event === void 0 || event.preventDefault();
+        },
+        target: {
+          name: props.name,
+          id: props.id,
+          value: undefined
+        }
+      });
+    }
+  };
+  var onClearIconKeyDown = function onClearIconKeyDown(event) {
+    if (event.key === 'Enter' || event.code === 'Space') {
+      clear(event);
+      event.preventDefault();
+    }
+  };
+  var createClearIcon = function createClearIcon() {
+    if (props.value != null && props.showClear && !props.disabled) {
+      var clearIconProps = mergeProps({
+        className: cx('clearIcon'),
+        onPointerUp: clear,
+        tabIndex: props.tabIndex || '0',
+        onKeyDown: onClearIconKeyDown,
+        'aria-label': localeOption('clear')
+      }, ptm('clearIcon'));
+      var icon = props.clearIcon || /*#__PURE__*/React__namespace.createElement(TimesIcon, clearIconProps);
+      return IconUtils.getJSXIcon(icon, _objectSpread$1H({}, clearIconProps), {
+        props: props
+      });
+    }
+    return null;
+  };
   var createLabel = function createLabel() {
     var label = props.value ? getOptionLabel(props.value) : props.placeholder || 'p-emptylabel';
     var labelProps = mergeProps({
@@ -15040,7 +15147,8 @@ var CascadeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
   }, ptm('wrapper'));
   var panelProps = mergeProps({
     ref: overlayRef,
-    className: cx('panel'),
+    className: classNames(props.panelClassName, cx('panel')),
+    style: props.panelStyle,
     onClick: function onClick(e) {
       return onPanelClick(e);
     }
@@ -15089,6 +15197,7 @@ var CascadeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
   var createElement = function createElement() {
     var keyboardHelper = createKeyboardHelper();
     var labelElement = createLabel();
+    var clearIcon = createClearIcon();
     var dropdownIcon = props.loading ? createLoadingIcon() : createDropdownIcon();
     var overlay = createOverlay();
     var rootProps = mergeProps({
@@ -15104,7 +15213,7 @@ var CascadeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
         return _onClick(e);
       }
     }, otherProps, ptm('root'));
-    return /*#__PURE__*/React__namespace.createElement("div", rootProps, keyboardHelper, labelElement, dropdownIcon, overlay);
+    return /*#__PURE__*/React__namespace.createElement("div", rootProps, keyboardHelper, labelElement, clearIcon, dropdownIcon, overlay);
   };
   var otherProps = CascadeSelectBase.getOtherProps(props);
   ObjectUtils.reduceKeys(otherProps, DomHandler.DATA_PROPS);
@@ -16211,7 +16320,8 @@ var ColorPickerPanel = /*#__PURE__*/React__namespace.forwardRef(function (props,
         context: context
       }),
       style: props.panelStyle,
-      onClick: props.onClick
+      onClick: props.onClick,
+      'data-pr-is-overlay': true
     }, ptm('panel', {
       hostName: props.hostName
     }));
@@ -16953,22 +17063,6 @@ var FocusTrap = /*#__PURE__*/React__default["default"].memo(/*#__PURE__*/React__
 }));
 var FocusTrap$1 = FocusTrap;
 
-var TimesIcon = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
-  var pti = IconBase.getPTI(inProps);
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
-    ref: ref,
-    width: "14",
-    height: "14",
-    viewBox: "0 0 14 14",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, pti), /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M8.01186 7.00933L12.27 2.75116C12.341 2.68501 12.398 2.60524 12.4375 2.51661C12.4769 2.42798 12.4982 2.3323 12.4999 2.23529C12.5016 2.13827 12.4838 2.0419 12.4474 1.95194C12.4111 1.86197 12.357 1.78024 12.2884 1.71163C12.2198 1.64302 12.138 1.58893 12.0481 1.55259C11.9581 1.51625 11.8617 1.4984 11.7647 1.50011C11.6677 1.50182 11.572 1.52306 11.4834 1.56255C11.3948 1.60204 11.315 1.65898 11.2488 1.72997L6.99067 5.98814L2.7325 1.72997C2.59553 1.60234 2.41437 1.53286 2.22718 1.53616C2.03999 1.53946 1.8614 1.61529 1.72901 1.74767C1.59663 1.88006 1.5208 2.05865 1.5175 2.24584C1.5142 2.43303 1.58368 2.61419 1.71131 2.75116L5.96948 7.00933L1.71131 11.2675C1.576 11.403 1.5 11.5866 1.5 11.7781C1.5 11.9696 1.576 12.1532 1.71131 12.2887C1.84679 12.424 2.03043 12.5 2.2219 12.5C2.41338 12.5 2.59702 12.424 2.7325 12.2887L6.99067 8.03052L11.2488 12.2887C11.3843 12.424 11.568 12.5 11.7594 12.5C11.9509 12.5 12.1346 12.424 12.27 12.2887C12.4053 12.1532 12.4813 11.9696 12.4813 11.7781C12.4813 11.5866 12.4053 11.403 12.27 11.2675L8.01186 7.00933Z",
-    fill: "currentColor"
-  }));
-}));
-TimesIcon.displayName = 'TimesIcon';
-
 var WindowMaximizeIcon = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
   var pti = IconBase.getPTI(inProps);
   return /*#__PURE__*/React__namespace.createElement("svg", _extends({
@@ -17122,6 +17216,7 @@ var DialogBase = ComponentBase.extend({
     resizable: true,
     rtl: false,
     showHeader: true,
+    showCloseIcon: true,
     style: null,
     transitionOptions: null,
     visible: false,
@@ -17253,7 +17348,7 @@ var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
   var focus = function focus() {
     var activeElement = document.activeElement;
     var isActiveElementInDialog = activeElement && dialogRef.current && dialogRef.current.contains(activeElement);
-    if (!isActiveElementInDialog && props.closable && props.showHeader && closeRef.current) {
+    if (!isActiveElementInDialog && props.closable && props.showCloseIcon && props.showHeader && closeRef.current) {
       closeRef.current.focus();
     }
   };
@@ -17312,7 +17407,7 @@ var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
           lastPageX.current = event.pageX;
           dialogRef.current.style.left = leftPos - leftMargin + 'px';
         }
-        if (topPos >= props.minY && topPos + height < viewport.height) {
+        if (topPos >= props.minY && (deltaY < 0 || topPos + height < viewport.height)) {
           lastPageY.current = event.pageY;
           dialogRef.current.style.top = topPos - topMargin + 'px';
         }
@@ -17366,10 +17461,10 @@ var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
         newWidth = newWidth + deltaX;
         newHeight = newHeight + deltaY;
       }
-      if ((!minWidth || newWidth > minWidth) && offset.left + newWidth < viewport.width) {
+      if ((!minWidth || newWidth > minWidth) && (deltaX < 0 || offset.left + newWidth < viewport.width)) {
         dialogRef.current.style.width = newWidth + 'px';
       }
-      if ((!minHeight || newHeight > minHeight) && offset.top + newHeight < viewport.height) {
+      if ((!minHeight || newHeight > minHeight) && (deltaY < 0 || offset.top + newHeight < viewport.height)) {
         dialogRef.current.style.height = newHeight + 'px';
       }
       lastPageX.current = event.pageX;
@@ -17559,7 +17654,7 @@ var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
     };
   });
   var createCloseIcon = function createCloseIcon() {
-    if (props.closable) {
+    if (props.closable && props.showCloseIcon) {
       var labelAria = props.ariaCloseIconLabel || ariaLabel('close');
       var closeButtonIconProps = mergeProps({
         className: cx('closeButtonIcon'),
@@ -18643,13 +18738,14 @@ var ContextMenuSub = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__name
     var key = props.id + '_separator_' + index;
     var separatorProps = mergeProps({
       id: key,
-      key: key,
       className: cx('separator'),
       role: 'separator'
     }, ptm('separator', {
       hostName: props.hostName
     }));
-    return /*#__PURE__*/React__namespace.createElement("li", separatorProps);
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, separatorProps, {
+      key: key
+    }));
   };
   var createSubmenu = function createSubmenu(item, index) {
     if (isItemGroup(item)) {
@@ -18734,9 +18830,8 @@ var ContextMenuSub = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__name
       },
       className: cx('content')
     }, getPTOptions(processedItem, 'content', index));
-    var menuitemProps = mergeProps(_defineProperty({
+    var menuitemProps = mergeProps({
       id: key,
-      key: key,
       role: 'menuitem',
       'aria-label': item.label,
       'aria-disabled': disabled,
@@ -18755,8 +18850,10 @@ var ContextMenuSub = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__name
         disabled: isItemDisabled(item)
       }),
       style: item.style
-    }, "key", key), getPTOptions(processedItem, 'menuitem', index));
-    return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, /*#__PURE__*/React__namespace.createElement("div", contentProps, content), submenu);
+    }, getPTOptions(processedItem, 'menuitem', index));
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, menuitemProps, {
+      key: key
+    }), /*#__PURE__*/React__namespace.createElement("div", contentProps, content), submenu);
   };
   var createItem = function createItem(processedItem, index) {
     if (processedItem.visible === false) {
@@ -20377,7 +20474,7 @@ var InputNumber = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
   var stacked = props.showButtons && props.buttonLayout === 'stacked';
   var horizontal = props.showButtons && props.buttonLayout === 'horizontal';
   var vertical = props.showButtons && props.buttonLayout === 'vertical';
-  var inputMode = props.inputMode || (props.mode === 'decimal' && !props.minFractionDigits ? 'numeric' : 'decimal');
+  var inputMode = props.inputMode || (props.mode === 'decimal' && !props.minFractionDigits && !props.maxFractionDigits ? 'numeric' : 'decimal');
   var getOptions = function getOptions() {
     var _props$minFractionDig, _props$maxFractionDig;
     return {
@@ -20518,6 +20615,10 @@ var InputNumber = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     }
     return null;
   };
+  var addWithPrecision = function addWithPrecision(base, increment) {
+    var precision = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 10;
+    return Math.round((base + increment) * precision) / precision;
+  };
   var _repeat = function repeat(event, interval, dir) {
     var i = interval || 500;
     clearTimer();
@@ -20530,7 +20631,7 @@ var InputNumber = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     if (inputRef.current) {
       var step = props.step * dir;
       var currentValue = parseValue(inputRef.current.value) || 0;
-      var newValue = validateValue(currentValue + step);
+      var newValue = validateValue(addWithPrecision(currentValue, step));
       if (props.maxLength && props.maxLength < formatValue(newValue).length) {
         return;
       }
@@ -20812,6 +20913,10 @@ var InputNumber = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
         event.preventDefault();
         var _char2 = event.key;
         if (_char2) {
+          // get decimal separator in current locale
+          if (_char2 === '.') {
+            _char2 = _decimalSeparator.current;
+          }
           var _isDecimalSign = isDecimalSign(_char2);
           var _isMinusSign = isMinusSign(_char2);
           if (Number(_char2) >= 0 && Number(_char2) <= 9 || _isMinusSign || _isDecimalSign) {
@@ -20926,6 +21031,7 @@ var InputNumber = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
       suffixCharIndex = _getCharIndexes2.suffixCharIndex,
       currencyCharIndex = _getCharIndexes2.currencyCharIndex;
     var maxFractionDigits = numberFormat.current.resolvedOptions().maximumFractionDigits;
+    var hasBoundOrAffix = props.min || props.max || props.suffix || props.prefix; //only exception
     var newValueStr;
     if (sign.isMinusSign) {
       var isNewMinusSign = minusCharIndex === -1;
@@ -20945,7 +21051,7 @@ var InputNumber = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
         newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);
         updateValue(event, newValueStr, text, 'insert');
       } else if (decimalCharIndex === -1 && (maxFractionDigits || props.maxFractionDigits)) {
-        var allowedDecimal = inputMode !== 'numeric' || inputMode === 'numeric' && (props.min || props.max);
+        var allowedDecimal = inputMode !== 'numeric' || inputMode === 'numeric' && hasBoundOrAffix;
         if (allowedDecimal) {
           newValueStr = insertText(inputValue, text, selectionStart, selectionEnd);
           updateValue(event, newValueStr, text, 'insert');
@@ -21912,6 +22018,7 @@ var DropdownBase = ComponentBase.extend({
     name: null,
     onBlur: null,
     onChange: null,
+    onClick: null,
     onContextMenu: null,
     onFilter: null,
     onFocus: null,
@@ -22287,8 +22394,9 @@ var DropdownPanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
           return item && createItem(item, options.index, options);
         },
         contentTemplate: function contentTemplate(options) {
+          var children = options.children || [];
           var emptyMessage = props.hasFilter ? props.emptyFilterMessage : props.emptyMessage;
-          var content = isEmptyFilter ? createEmptyMessage(emptyMessage) : options.children;
+          var content = isEmptyFilter || (children === null || children === void 0 ? void 0 : children.length) === 0 ? createEmptyMessage(emptyMessage) : children;
           var listProps = mergeProps({
             ref: options.contentRef,
             style: options.style,
@@ -22328,7 +22436,8 @@ var DropdownPanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
         context: context
       })),
       style: sx('panel'),
-      onClick: props.onClick
+      onClick: props.onClick,
+      'data-pr-is-overlay': true
     }, getPTOptions('panel'));
     var transitionProps = mergeProps({
       classNames: cx('transition'),
@@ -22801,15 +22910,24 @@ var Dropdown = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     !pressedInInputText && onEnterKey(event);
   };
   var onEnterKey = function onEnterKey(event) {
+    event.preventDefault();
     if (!overlayVisibleState) {
       setFocusedOptionIndex(-1);
       onArrowDownKey(event);
     } else {
-      if (focusedOptionIndex !== -1) {
-        onOptionSelect(event, visibleOptions[focusedOptionIndex]);
+      if (focusedOptionIndex === -1) {
+        return;
+      }
+      var focusedOption = visibleOptions[focusedOptionIndex];
+      var optionValue = getOptionValue(focusedOption);
+      if (optionValue == null || optionValue == undefined) {
+        hide();
+        resetFilter();
+        updateEditableLabel(selectedOption);
+        return;
       }
+      onOptionSelect(event, focusedOption);
     }
-    event.preventDefault();
   };
   var onEscapeKey = function onEscapeKey(event) {
     overlayVisibleState && hide();
@@ -23932,6 +24050,9 @@ var DataTableBase = ComponentBase.extend({
     alwaysShowPaginator: true,
     breakpoint: '960px',
     cellClassName: null,
+    cellMemo: true,
+    cellMemoProps: ['rowData', 'field', 'allowCellSelection', 'isCellSelected', 'editMode', 'index', 'tabIndex', 'editing', 'expanded', 'editingMeta', 'frozenCol', 'alignFrozenCol'],
+    cellMemoPropsDepth: 1,
     cellSelection: false,
     checkIcon: null,
     className: null,
@@ -24448,8 +24569,6 @@ var Cell = function Cell(props) {
     setStyleObjectState = _React$useState6[1];
   var elementRef = React__namespace.useRef(null);
   var keyHelperRef = React__namespace.useRef(null);
-  var overlayEventListener = React__namespace.useRef(null);
-  var selfClick = React__namespace.useRef(false);
   var focusTimeout = React__namespace.useRef(null);
   var initFocusTimeout = React__namespace.useRef(null);
   var editingRowDataStateRef = React__namespace.useRef(null);
@@ -24486,17 +24605,20 @@ var Cell = function Cell(props) {
   var cellEditValidateOnClose = function cellEditValidateOnClose() {
     return getColumnProp('cellEditValidateOnClose');
   };
+  var isIgnoredElement = function isIgnoredElement(element) {
+    var isOverlay = function isOverlay(el) {
+      return el.getAttribute && el.getAttribute('data-pr-is-overlay');
+    };
+    return isOverlay(element) || DomHandler.getParents(element).find(function (el) {
+      return isOverlay(el);
+    });
+  };
   var _useEventListener = useEventListener({
       type: 'click',
       listener: function listener(e) {
-        setTimeout(function () {
-          if (!selfClick.current && isOutsideClicked(e.target)) {
-            // #2666 for overlay components and outside is clicked
-
-            switchCellToViewMode(e, true);
-          }
-        }, 0);
-        selfClick.current = false;
+        if (!isIgnoredElement(e.target) && isOutsideClicked(e.target)) {
+          switchCellToViewMode(e, true);
+        }
       },
       options: true,
       when: isEditable()
@@ -24541,10 +24663,6 @@ var Cell = function Cell(props) {
     setTimeout(function () {
       setEditingState(false);
       unbindDocumentClickListener();
-      OverlayService.off('overlay-click', overlayEventListener.current);
-      overlayEventListener.current = null;
-      editingRowDataStateRef.current = null;
-      selfClick.current = false;
     }, 1);
   };
   var switchCellToViewMode = function switchCellToViewMode(event, submit) {
@@ -24588,7 +24706,7 @@ var Cell = function Cell(props) {
     editingRowDataStateRef.current = editingRowData;
   };
   var _onClick = function onClick(event) {
-    props.onClick(event, getCellCallbackParams(event), isEditable(), editingState, setEditingState, selfClick, props.column, bindDocumentClickListener, overlayEventListener);
+    props.onClick(event, getCellCallbackParams(event), isEditable(), editingState, setEditingState, props.column, bindDocumentClickListener);
   };
   var _onMouseDown = function onMouseDown(event) {
     var params = getCellCallbackParams(event);
@@ -24660,7 +24778,6 @@ var Cell = function Cell(props) {
     }
   };
   var _onBlur = function onBlur(event) {
-    selfClick.current = false;
     if (props.editMode !== 'row' && editingState && getColumnProp('cellEditValidatorEvent') === 'blur') {
       switchCellToViewMode(event, true);
     }
@@ -24710,7 +24827,7 @@ var Cell = function Cell(props) {
       field: props.field,
       index: props.rowIndex
     });
-    props.focusOnInit();
+    props.focusOnInit(initFocusTimeout, elementRef);
   };
   React__namespace.useEffect(function () {
     if (props.frozenCol) props.updateStickyPosition(elementRef, props.frozenCol, props.alignFrozenCol, styleObjectState, setStyleObjectState);
@@ -24741,9 +24858,8 @@ var Cell = function Cell(props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [editingState]);
   useUnmountEffect(function () {
-    if (overlayEventListener.current) {
-      OverlayService.off('overlay-click', overlayEventListener.current);
-      overlayEventListener.current = null;
+    if (editingRowDataStateRef.current) {
+      editingRowDataStateRef.current = null;
     }
   });
   var createLoading = function createLoading() {
@@ -25047,15 +25163,23 @@ var Cell = function Cell(props) {
 var RadioCheckCell = /*#__PURE__*/React__namespace.memo(function (props) {
   return /*#__PURE__*/React__namespace.createElement(Cell, props);
 }, function (prevProps, nextProps) {
+  if (nextProps.cellMemo === false) return false;
   var keysToCompare = ['isRowSelected', 'field', 'allowCellSelection', 'isCellSelected', 'editMode', 'index', 'tabIndex', 'editing', 'expanded', 'editingMeta', 'rowData'];
   return ObjectUtils.selectiveCompare(prevProps, nextProps, keysToCompare);
 });
 RadioCheckCell.displayName = 'RadioCheckCell';
+var defaultKeysToCompare = ['rowData', 'field', 'allowCellSelection', 'isCellSelected', 'editMode', 'index', 'tabIndex', 'editing', 'expanded', 'editingMeta', 'frozenCol', 'alignFrozenCol'];
 var BodyCell = /*#__PURE__*/React__namespace.memo(function (props) {
   return /*#__PURE__*/React__namespace.createElement(Cell, props);
 }, function (prevProps, nextProps) {
-  var keysToCompare = ['field', 'allowCellSelection', 'isCellSelected', 'editMode', 'index', 'tabIndex', 'editing', 'expanded', 'editingMeta', 'rowData', 'frozenCol', 'alignFrozenCol'];
-  return ObjectUtils.selectiveCompare(prevProps, nextProps, keysToCompare);
+  if (nextProps.cellMemo === false) return false;
+  var memoProps = nextProps.cellMemoProps;
+  var keysToCompare = Array.isArray(memoProps) && memoProps.every(function (prop) {
+    return typeof prop === 'string';
+  }) ? memoProps : defaultKeysToCompare;
+  var memoPropsDepth = nextProps.cellMemoPropsDepth;
+  var depth = typeof memoPropsDepth === 'number' && memoPropsDepth > 0 ? memoPropsDepth : 1;
+  return ObjectUtils.selectiveCompare(prevProps, nextProps, keysToCompare, depth);
 });
 BodyCell.displayName = 'BodyCell';
 
@@ -25523,8 +25647,13 @@ var BodyRow = /*#__PURE__*/React__namespace.memo(function (props) {
       } else {
         var left = 0;
         var prev = elementRef.current && elementRef.current.previousElementSibling;
-        if (prev && prev.classList.contains('p-frozen-column')) {
-          left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+        while (prev) {
+          if (prev.classList.contains('p-frozen-column')) {
+            left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+            elementRef.current.style.left = left + 'px';
+            break;
+          }
+          prev = prev.previousElementSibling;
         }
         styleObject.left = left + 'px';
       }
@@ -25532,9 +25661,8 @@ var BodyRow = /*#__PURE__*/React__namespace.memo(function (props) {
       !isSameStyle && setStyleObjectState(styleObject);
     }
   }, []);
-  var onCellClick = function onCellClick(event, params, isEditable, editingState, setEditingState, selfClick, column, bindDocumentClickListener, overlayEventListener) {
+  var onCellClick = function onCellClick(event, params, isEditable, editingState, setEditingState, column, bindDocumentClickListener) {
     if (props.editMode !== 'row' && isEditable && !editingState && (props.selectOnEdit || !props.selectOnEdit && props.isRowSelected)) {
-      selfClick.current = true;
       var onBeforeCellEditShow = getColumnProp(column, 'onBeforeCellEditShow');
       var onCellEditInit = getColumnProp(column, 'onCellEditInit');
       var cellEditValidatorEvent = getColumnProp(column, 'cellEditValidatorEvent');
@@ -25565,12 +25693,6 @@ var BodyRow = /*#__PURE__*/React__namespace.memo(function (props) {
         }
         if (cellEditValidatorEvent === 'click') {
           bindDocumentClickListener();
-          overlayEventListener.current = function (e) {
-            if (!isOutsideClicked(e.target)) {
-              selfClick.current = true;
-            }
-          };
-          OverlayService.on('overlay-click', overlayEventListener.current);
         }
       }, 1);
     }
@@ -25591,6 +25713,9 @@ var BodyRow = /*#__PURE__*/React__namespace.memo(function (props) {
         var cellProps = mergeProps({
           hostName: props.hostName,
           allowCellSelection: props.allowCellSelection,
+          cellMemo: props.cellMemo,
+          cellMemoProps: props.cellMemoProps,
+          cellMemoPropsDepth: props.cellMemoPropsDepth,
           cellClassName: props.cellClassName,
           checkIcon: props.checkIcon,
           collapsedRowIcon: props.collapsedRowIcon,
@@ -25958,9 +26083,6 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     options = options || props.virtualScrollerOptions;
     return options ? options[option] : null;
   };
-  var getProcessedDataIndex = function getProcessedDataIndex(rowIndex) {
-    return props.lazy ? rowIndex - props.first : rowIndex;
-  };
   var findIndex = function findIndex(collection, rowData) {
     return (collection || []).findIndex(function (data) {
       return equals(rowData, data);
@@ -26131,16 +26253,14 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     var rangeStart;
     var rangeEnd;
     var isAllowCellSelection = allowCellSelection();
-    var rangeRowIndexInProcessedData = getProcessedDataIndex(rangeRowIndex.current);
-    var anchorRowIndexInProcessedData = getProcessedDataIndex(anchorRowIndex.current);
-    if (rangeRowIndexInProcessedData > anchorRowIndexInProcessedData) {
-      rangeStart = anchorRowIndexInProcessedData;
-      rangeEnd = rangeRowIndexInProcessedData;
-    } else if (rangeRowIndexInProcessedData < anchorRowIndexInProcessedData) {
-      rangeStart = rangeRowIndexInProcessedData;
-      rangeEnd = anchorRowIndexInProcessedData;
+    if (rangeRowIndex.current > anchorRowIndex.current) {
+      rangeStart = anchorRowIndex.current;
+      rangeEnd = rangeRowIndex.current;
+    } else if (rangeRowIndex.current < anchorRowIndex.current) {
+      rangeStart = rangeRowIndex.current;
+      rangeEnd = anchorRowIndex.current;
     } else {
-      rangeStart = rangeEnd = rangeRowIndexInProcessedData;
+      rangeStart = rangeEnd = rangeRowIndex.current;
     }
     return isAllowCellSelection ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
   };
@@ -26181,7 +26301,7 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
       var rowData = value[i];
       var columns = props.columns;
-      var rowIndex = props.lazy ? i + props.first : i;
+      var rowIndex = props.paginator ? i + props.first : i;
       for (var j = cellRangeStart; j <= cellRangeEnd; j++) {
         var field = getColumnProp(columns[j], 'field');
         var _value = ObjectUtils.resolveFieldData(rowData, field);
@@ -26380,13 +26500,17 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
       onRangeSelection(event, 'row');
     }
   };
+  var expandedRowsRef = React__namespace.useRef(props.expandedRows);
+  React__namespace.useEffect(function () {
+    expandedRowsRef.current = props.expandedRows;
+  }, [props.expandedRows]);
   var onRowToggle = function onRowToggle(event) {
     var expandedRows;
     var dataKey = props.dataKey;
     var hasDataKey = props.groupRowsBy ? dataKey === props.groupRowsBy : !!dataKey;
     if (hasDataKey) {
       var dataKeyValue = String(ObjectUtils.resolveFieldData(event.data, dataKey));
-      expandedRows = props.expandedRows ? _objectSpread$1f({}, props.expandedRows) : {};
+      expandedRows = expandedRowsRef.current ? _objectSpread$1f({}, expandedRowsRef.current) : {};
       if (expandedRows[dataKeyValue] != null) {
         delete expandedRows[dataKeyValue];
         if (props.onRowCollapse) {
@@ -26405,8 +26529,8 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
         }
       }
     } else {
-      var expandedRowIndex = findIndex(props.expandedRows, event.data);
-      expandedRows = props.expandedRows ? _toConsumableArray(props.expandedRows) : [];
+      var expandedRowIndex = findIndex(expandedRowsRef.current, event.data);
+      expandedRows = expandedRowsRef.current ? _toConsumableArray(expandedRowsRef.current) : [];
       if (expandedRowIndex !== -1) {
         expandedRows = expandedRows.filter(function (_, i) {
           return i !== expandedRowIndex;
@@ -26656,7 +26780,7 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     return null;
   };
   var createGroupHeader = function createGroupHeader(rowData, rowIndex, expanded, colSpan) {
-    if (isSubheaderGrouping && shouldRenderRowGroupHeader(props.value, rowData, getProcessedDataIndex(rowIndex))) {
+    if (isSubheaderGrouping && shouldRenderRowGroupHeader(props.value, rowData, rowIndex - props.first)) {
       var style = rowGroupHeaderStyle();
       var toggler = props.expandableRowGroups && /*#__PURE__*/React__namespace.createElement(RowTogglerButton, {
         hostName: props.hostName,
@@ -26706,6 +26830,9 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
         hostName: props.hostName,
         allowCellSelection: _allowCellSelection,
         allowRowSelection: _allowRowSelection,
+        cellMemo: props.cellMemo,
+        cellMemoProps: props.cellMemoProps,
+        cellMemoPropsDepth: props.cellMemoPropsDepth,
         cellClassName: props.cellClassName,
         checkIcon: props.checkIcon,
         collapsedRowIcon: props.collapsedRowIcon,
@@ -26925,16 +27052,21 @@ var FooterCell = /*#__PURE__*/React__namespace.memo(function (props) {
       var _align = getColumnProp('alignFrozen');
       if (_align === 'right') {
         var right = 0;
-        var next = elementRef.current.nextElementSibling;
+        var next = elementRef.current && elementRef.current.nextElementSibling;
         if (next && next.classList.contains('p-frozen-column')) {
           right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
         }
         styleObject.right = right + 'px';
       } else {
         var left = 0;
-        var prev = elementRef.current.previousElementSibling;
-        if (prev && prev.classList.contains('p-frozen-column')) {
-          left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+        var prev = elementRef.current && elementRef.current.previousElementSibling;
+        while (prev) {
+          if (prev && prev.classList.contains('p-frozen-column')) {
+            left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+            elementRef.current.style.left = left + 'px';
+            break;
+          }
+          prev = prev.previousElementSibling;
         }
         styleObject.left = left + 'px';
       }
@@ -27305,7 +27437,7 @@ var ColumnFilter = /*#__PURE__*/React__namespace.memo(function (props) {
       };
     } else {
       filters[field].value = null;
-      filters[field].matchMode = defaultConstraint.matchMode;
+      filters[field].matchMode = defaultConstraint ? defaultConstraint.matchMode : filters[field].matchMode;
     }
     filterClearCallback && filterClearCallback();
     props.onFilterChange(filters);
@@ -27372,6 +27504,7 @@ var ColumnFilter = /*#__PURE__*/React__namespace.memo(function (props) {
     }
   };
   var onRowMatchModeChange = function onRowMatchModeChange(matchMode) {
+    var _iconRef$current;
     var filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange');
     var filters = _objectSpread$1c({}, props.filters);
     filters[field].matchMode = matchMode;
@@ -27382,6 +27515,7 @@ var ColumnFilter = /*#__PURE__*/React__namespace.memo(function (props) {
     props.onFilterChange(filters);
     props.onFilterApply();
     hide();
+    (_iconRef$current = iconRef.current) === null || _iconRef$current === void 0 || _iconRef$current.focus();
   };
   var onRowMatchModeKeyDown = function onRowMatchModeKeyDown(event, matchMode, clear) {
     var item = event.target;
@@ -28198,16 +28332,21 @@ var HeaderCell = /*#__PURE__*/React__namespace.memo(function (props) {
       var align = getColumnProp('alignFrozen');
       if (align === 'right') {
         var right = 0;
-        var next = elementRef.current.nextElementSibling;
+        var next = elementRef.current && elementRef.current.nextElementSibling;
         if (next && next.classList.contains('p-frozen-column')) {
           right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
         }
         styleObject.right = right + 'px';
       } else {
         var left = 0;
-        var prev = elementRef.current.previousElementSibling;
-        if (prev && prev.classList.contains('p-frozen-column')) {
-          left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+        var prev = elementRef.current && elementRef.current.previousElementSibling;
+        while (prev) {
+          if (prev && prev.classList.contains('p-frozen-column')) {
+            left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
+            elementRef.current.style.left = left + 'px';
+            break;
+          }
+          prev = prev.previousElementSibling;
         }
         styleObject.left = left + 'px';
       }
@@ -29058,6 +29197,20 @@ var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
             multiSortMeta: restoredState.multiSortMeta
           }));
         } else {
+          var lastMeta = restoredState.multiSortMeta[restoredState.multiSortMeta.length - 1];
+          var field = lastMeta && lastMeta.field ? lastMeta.field : null;
+          if (field) {
+            var sortColumn = findColumnByKey(getColumns(), field);
+            if (sortColumn) {
+              var sortFunction = getColumnProp(sortColumn, 'sortFunction');
+              var sortable = getColumnProp(sortColumn, 'sortable');
+              if (sortFunction && sortable) {
+                columnSortFunction.current = sortFunction;
+                columnSortable.current = sortable;
+                columnField.current = field;
+              }
+            }
+          }
           setMultiSortMetaState(restoredState.multiSortMeta);
         }
       }
@@ -29956,58 +30109,60 @@ var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
   var exportCSV = function exportCSV(options) {
     var data;
     var csv = "\uFEFF";
-    var columns = getColumns();
     if (options && options.selectionOnly) {
       data = props.selection || [];
     } else {
       data = [].concat(_toConsumableArray(props.frozenValue || []), _toConsumableArray(processedData() || []));
     }
 
-    //headers
-    columns.forEach(function (column, i) {
-      var _ref5 = [getColumnProp(column, 'field'), getColumnProp(column, 'header'), getColumnProp(column, 'exportHeader'), getColumnProp(column, 'exportable')],
+    // First build collection of exportable columns
+    var exportableColumns = getColumns().filter(function (column) {
+      var exportable = getColumnProp(column, 'exportable');
+      var field = getColumnProp(column, 'field');
+
+      // Column must be exportable (or undefined/not set) and have a field defined
+      return exportable !== false && field;
+    });
+
+    // headers
+    exportableColumns.forEach(function (column, i) {
+      var _ref5 = [getColumnProp(column, 'field'), getColumnProp(column, 'header'), getColumnProp(column, 'exportHeader')],
         field = _ref5[0],
         header = _ref5[1],
-        exportHeader = _ref5[2],
-        exportable = _ref5[3];
-      if (exportable && field) {
-        var columnHeader = String(exportHeader || header || field).replace(/"/g, '""').replace(/\n/g, "\u2028");
-        csv = csv + ('"' + columnHeader + '"');
-        if (i < columns.length - 1) {
-          csv = csv + props.csvSeparator;
-        }
+        exportHeader = _ref5[2];
+      var columnHeader = String(exportHeader || header || field).replace(/"/g, '""').replace(/\n/g, "\u2028");
+      csv = csv + ('"' + columnHeader + '"');
+      if (i < exportableColumns.length - 1) {
+        csv = csv + props.csvSeparator;
       }
     });
 
-    //body
+    // body
     data.forEach(function (record) {
       csv = csv + '\n';
-      columns.forEach(function (column, i) {
-        var _ref6 = [getColumnProp(column, 'field'), getColumnProp(column, 'exportField'), getColumnProp(column, 'exportable')],
+      exportableColumns.forEach(function (column, i) {
+        var _ref6 = [getColumnProp(column, 'field'), getColumnProp(column, 'exportField')],
           colField = _ref6[0],
-          exportField = _ref6[1],
-          exportable = _ref6[2];
+          exportField = _ref6[1];
         var field = exportField || colField;
-        if (exportable && field) {
-          var cellData = ObjectUtils.resolveFieldData(record, field);
-          if (cellData != null) {
-            if (props.exportFunction) {
-              cellData = props.exportFunction({
-                data: cellData,
-                field: field,
-                rowData: record,
-                column: column
-              });
-            } else {
-              cellData = String(cellData).replace(/"/g, '""').replace(/\n/g, "\u2028");
-            }
+        var cellData = ObjectUtils.resolveFieldData(record, field);
+        if (cellData != null) {
+          if (props.exportFunction) {
+            cellData = props.exportFunction({
+              data: cellData,
+              field: field,
+              rowData: record,
+              column: column
+            });
           } else {
-            cellData = '';
-          }
-          csv = csv + ('"' + cellData + '"');
-          if (i < columns.length - 1) {
-            csv = csv + props.csvSeparator;
+            cellData = String(cellData).replace(/"/g, '""').replace(/\n/g, "\u2028");
           }
+        } else {
+          cellData = '';
+        }
+        csv = csv + ('"' + cellData + '"');
+        if (i < exportableColumns.length - 1) {
+          csv = csv + props.csvSeparator;
         }
       });
     });
@@ -30171,6 +30326,9 @@ var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
       },
       getVirtualScroller: function getVirtualScroller() {
         return virtualScrollerRef.current;
+      },
+      getProcessedData: function getProcessedData() {
+        return processedData();
       }
     };
   });
@@ -30272,6 +30430,9 @@ var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
     var frozenBody = ObjectUtils.isNotEmpty(props.frozenValue) && /*#__PURE__*/React__namespace.createElement(TableBody, {
       hostName: "DataTable",
       ref: frozenBodyRef,
+      cellMemo: props.cellMemo,
+      cellMemoProps: props.cellMemoProps,
+      cellMemoPropsDepth: props.cellMemoPropsDepth,
       cellClassName: props.cellClassName,
       cellSelection: props.cellSelection,
       checkIcon: props.checkIcon,
@@ -30356,6 +30517,9 @@ var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
     var body = /*#__PURE__*/React__namespace.createElement(TableBody, {
       hostName: "DataTable",
       ref: bodyRef,
+      cellMemo: props.cellMemo,
+      cellMemoProps: props.cellMemoProps,
+      cellMemoPropsDepth: props.cellMemoPropsDepth,
       cellClassName: props.cellClassName,
       cellSelection: props.cellSelection,
       checkIcon: props.checkIcon,
@@ -32776,7 +32940,7 @@ var FileUpload = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespac
     var k = 1024;
     var dm = 3;
     var sizes = localeOption('fileSizeTypes');
-    if (bytes === 0) {
+    if (bytes <= 0) {
       return "0 ".concat(sizes[0]);
     }
     var i = Math.floor(Math.log(bytes) / Math.log(k));
@@ -32798,7 +32962,8 @@ var FileUpload = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespac
     var selectedFiles = event.dataTransfer ? event.dataTransfer.files : event.target.files;
     for (var i = 0; i < selectedFiles.length; i++) {
       var file = selectedFiles[i];
-      if (!isFileSelected(file) && validate(file)) {
+      var shouldAddFile = props.multiple ? !isFileSelected(file) && validate(file) : validate(file);
+      if (shouldAddFile) {
         file.objectURL = window.URL.createObjectURL(file);
         currentFiles.push(file);
       }
@@ -32814,6 +32979,7 @@ var FileUpload = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespac
       });
     }
     clearInput();
+    setFocusedState(false);
     if (props.mode === 'basic' && currentFiles.length > 0) {
       fileInputRef.current.style.display = 'none';
     }
@@ -34540,6 +34706,7 @@ var Galleria = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
         },
         options: props.transitionOptions,
         unmountOnExit: true,
+        appear: true,
         onEnter: onEnter,
         onEntering: onEntering,
         onEntered: onEntered,
@@ -38615,11 +38782,12 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     var key = idState + '_separator__' + index;
     var separatorProps = mergeProps({
       id: key,
-      key: key,
       className: cx('separator'),
       role: 'separator'
     }, ptm('separator'));
-    return /*#__PURE__*/React__namespace.createElement("li", separatorProps);
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, separatorProps, {
+      key: key
+    }));
   };
   var createSubmenuIcon = function createSubmenuIcon(item) {
     if (item.items) {
@@ -38670,7 +38838,6 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     var isGroup = isItemGroup(processedItem);
     var isActive = isItemActive(processedItem);
     var submenuItemProps = mergeProps({
-      key: key,
       id: key,
       'aria-label': getItemLabel(processedItem),
       'aria-disabled': isDisabled,
@@ -38710,7 +38877,9 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       };
       content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
     }
-    return /*#__PURE__*/React__namespace.createElement("li", submenuItemProps, /*#__PURE__*/React__namespace.createElement("div", contentProps, content));
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, submenuItemProps, {
+      key: key
+    }), /*#__PURE__*/React__namespace.createElement("div", contentProps, content));
   };
   var createSubmenu = function createSubmenu(submenu, index) {
     if (!isItemVisible(submenu)) {
@@ -38722,7 +38891,6 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     var isDisabled = isItemDisabled(submenu);
     var submenuHeaderProps = mergeProps({
       id: key,
-      key: key,
       className: classNames(submenu.className, cx('submenuHeader', {
         disabled: isDisabled
       })),
@@ -38734,7 +38902,7 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       key: key
     }, /*#__PURE__*/React__namespace.createElement("li", submenuHeaderProps, label), items);
   };
-  var createSubmenus = function createSubmenus(column) {
+  var createSubmenus = function createSubmenus(column, index) {
     return column.map(createSubmenu);
   };
   var createColumn = function createColumn(processedItem, processedColumn, index) {
@@ -38742,7 +38910,6 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     var key = category.label + '_column_' + index;
     var submenus = createSubmenus(processedColumn);
     var columnProps = mergeProps({
-      key: key,
       className: cx('column', {
         category: category
       })
@@ -38756,12 +38923,16 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
         display: display
       }
     }, ptm('submenu'));
-    return /*#__PURE__*/React__namespace.createElement("div", columnProps, /*#__PURE__*/React__namespace.createElement("ul", submenuProps, submenus));
+    return /*#__PURE__*/React__namespace.createElement("div", _extends({}, columnProps, {
+      key: key
+    }), /*#__PURE__*/React__namespace.createElement("ul", submenuProps, submenus));
   };
   var createColumns = function createColumns(category) {
     if (category.items) {
       return category.items.map(function (column, index) {
-        return createColumn(category, column, index);
+        return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
+          key: index
+        }, createColumn(category, column, index));
       });
     }
     return null;
@@ -38822,7 +38993,6 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     var isFocused = isItemFocused(processedItem);
     var isDisabled = isItemDisabled(processedItem);
     var menuItemProps = mergeProps(_defineProperty({
-      key: key,
       id: key,
       className: classNames(category.className, cx('menuitem', {
         category: category,
@@ -38858,7 +39028,9 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       },
       className: cx('content')
     }, getPTOptions(processedItem, 'content', index));
-    return /*#__PURE__*/React__namespace.createElement("li", menuItemProps, /*#__PURE__*/React__namespace.createElement("div", contentProps, itemContent), panel);
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, menuItemProps, {
+      key: key
+    }), /*#__PURE__*/React__namespace.createElement("div", contentProps, itemContent), panel);
   };
   var createMenu = function createMenu() {
     var menuProps = mergeProps({
@@ -38877,7 +39049,9 @@ var MegaMenu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     }, ptm('menu'));
     if (processedItems) {
       return /*#__PURE__*/React__namespace.createElement("ul", menuProps, processedItems.map(function (item, index) {
-        return createCategory(item, index);
+        return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
+          key: index
+        }, createCategory(item, index));
       }));
     }
     return null;
@@ -39421,7 +39595,6 @@ var Mention = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.f
     }) : formatValue(suggestion);
     var isSelected = highlightState[index];
     var itemProps = mergeProps({
-      key: key,
       className: cx('item', {
         isSelected: isSelected
       }),
@@ -39432,7 +39605,9 @@ var Mention = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.f
     }, getPTOptions(suggestion, 'item', {
       selected: isSelected
     }));
-    return /*#__PURE__*/React__namespace.createElement("li", itemProps, content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, itemProps, {
+      key: key
+    }), content, /*#__PURE__*/React__namespace.createElement(Ripple, null));
   };
   var createList = function createList() {
     var itemsProps = mergeProps({
@@ -39984,6 +40159,9 @@ var Menu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
       className: classNames(item.className, cx('menuitem', {
         focused: focusedOptionIndex === key
       })),
+      onClick: function onClick(event) {
+        return onItemClick(event, item, key);
+      },
       style: sx('menuitem', {
         item: item
       }),
@@ -40443,9 +40621,11 @@ var Menubar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.f
   var _useEventListener = useEventListener({
       type: 'click',
       listener: function listener(event) {
-        var isOutsideButton = menuButtonRef.current && !menuButtonRef.current.contains(event.target);
-        if (isOutsideButton) {
-          hide();
+        if (isOutsideClicked(event)) {
+          var isOutsideContainer = elementRef.current && !elementRef.current.contains(event.target);
+          if (isOutsideContainer) {
+            hide();
+          }
         }
       },
       options: {
@@ -40504,6 +40684,9 @@ var Menubar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.f
   var menuButtonKeydown = function menuButtonKeydown(event) {
     (event.code === 'Enter' || event.code === 'NumpadEnter' || event.code === 'Space') && toggle(event);
   };
+  var isOutsideClicked = function isOutsideClicked(event) {
+    return rootMenuRef.current !== event.target && !rootMenuRef.current.contains(event.target) && menuButtonRef.current !== event.target && !menuButtonRef.current.contains(event.target);
+  };
   var getItemProp = function getItemProp(item, name) {
     return item ? ObjectUtils.getItemValue(item[name]) : undefined;
   };
@@ -41591,6 +41774,7 @@ var MultiSelectHeader = /*#__PURE__*/React__namespace.memo(function (props) {
         role: "searchbox",
         value: props.filterValue,
         onChange: onFilter,
+        onKeyDown: props.onFilterKeyDown,
         className: "p-multiselect-filter",
         placeholder: props.filterPlaceholder,
         pt: ptm('filterInput'),
@@ -41605,6 +41789,7 @@ var MultiSelectHeader = /*#__PURE__*/React__namespace.memo(function (props) {
           element: content,
           filterOptions: filterOptions,
           onFilter: onFilter,
+          filterInputKeyDown: props.onFilterKeyDown,
           filterIconClassName: props.filterIconClassName,
           props: props
         };
@@ -41746,9 +41931,7 @@ var MultiSelectItem = /*#__PURE__*/React__namespace.memo(function (props) {
     'data-p-highlight': props.selected,
     'data-p-disabled': props.disabled
   }, getPTOptions('item'));
-  return /*#__PURE__*/React__namespace.createElement("li", _extends({}, itemProps, {
-    key: props.index + '_multiselectitem'
-  }), /*#__PURE__*/React__namespace.createElement("div", checkboxContainerProps, /*#__PURE__*/React__namespace.createElement(Checkbox, {
+  return /*#__PURE__*/React__namespace.createElement("li", itemProps, /*#__PURE__*/React__namespace.createElement("div", checkboxContainerProps, /*#__PURE__*/React__namespace.createElement(Checkbox, {
     ref: checkboxRef,
     checked: props.selected,
     icon: checkboxIcon,
@@ -41816,6 +41999,7 @@ var MultiSelectPanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
       getOptionValue: props.getOptionValue,
       updateModel: props.updateModel,
       onFilter: onFilterInputChange,
+      onFilterKeyDown: props.onFilterKeyDown,
       filterPlaceholder: props.filterPlaceholder,
       onClose: props.onCloseClick,
       showSelectAll: props.showSelectAll,
@@ -41981,7 +42165,8 @@ var MultiSelectPanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
         allowOptionSelect: allowOptionSelect
       })),
       style: props.panelStyle,
-      onClick: props.onClick
+      onClick: props.onClick,
+      'data-pr-is-overlay': true
     }, getPTOptions('panel'));
     if (props.inline) {
       return /*#__PURE__*/React__namespace.createElement("div", _extends({
@@ -42383,6 +42568,52 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     }
     setClicked(false);
   };
+  var onFilterKeyDown = function onFilterKeyDown(event) {
+    switch (event.code) {
+      case 'ArrowUp':
+        if (props.inline) {
+          break;
+        }
+        onArrowUpKey(event);
+        break;
+      case 'ArrowDown':
+        if (props.inline) {
+          break;
+        }
+        onArrowDownKey(event);
+        break;
+      case 'NumpadEnter':
+      case 'Enter':
+        if (props.inline) {
+          break;
+        }
+        onEnterKey(event);
+        break;
+      case 'Home':
+        if (props.inline) {
+          break;
+        }
+        onHomeKey(event);
+        event.preventDefault();
+        break;
+      case 'End':
+        if (props.inline) {
+          break;
+        }
+        onEndKey(event);
+        event.preventDefault();
+        break;
+      case 'Escape':
+        if (props.inline) {
+          break;
+        }
+        hide();
+        break;
+      case 'Tab':
+        onTabKey(event);
+        break;
+    }
+  };
   var onSelectAll = function onSelectAll(event) {
     if (props.onSelectAll) {
       props.onSelectAll(event);
@@ -42795,20 +43026,19 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     return selectedItemsLabel;
   };
   var getLabel = function getLabel() {
-    var label;
-    if (!empty && !props.fixedPlaceholder) {
-      var _props$value;
-      if (ObjectUtils.isNotEmpty(props.maxSelectedLabels) && ((_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.length) > props.maxSelectedLabels) {
-        return getSelectedItemsLabel();
-      }
-      if (ObjectUtils.isArray(props.value)) {
-        return props.value.reduce(function (acc, value, index) {
-          return acc + (index !== 0 ? ', ' : '') + getLabelByValue(value);
-        }, '');
-      }
+    var _props$value;
+    if (empty || props.fixedPlaceholder) {
       return '';
     }
-    return label;
+    if (ObjectUtils.isNotEmpty(props.maxSelectedLabels) && ((_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.length) > props.maxSelectedLabels) {
+      return getSelectedItemsLabel();
+    }
+    if (ObjectUtils.isArray(props.value)) {
+      return props.value.reduce(function (acc, value, index) {
+        return acc + (index !== 0 ? ', ' : '') + getLabelByValue(value);
+      }, '');
+    }
+    return '';
   };
   var getLabelContent = function getLabelContent() {
     var valueLength = props.value ? props.value.length : 0;
@@ -43081,6 +43311,7 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     getOptionValue: getOptionValue,
     updateModel: updateModel,
     onFilterInputChange: onFilterInputChange,
+    onFilterKeyDown: onFilterKeyDown,
     resetFilter: resetFilter,
     onCloseClick: onCloseClick,
     onSelectAll: onSelectAll,
@@ -43121,12 +43352,20 @@ var classes$v = {
   },
   root: function root(_ref2) {
     var props = _ref2.props;
-    return classNames('p-multistatecheckbox p-checkbox p-component', props.classNames);
+    return classNames('p-multistatecheckbox p-checkbox p-component', props.classNames, {
+      'p-variant-filled': props.variant === 'filled'
+    });
+  },
+  checkbox: function checkbox(_ref3) {
+    var props = _ref3.props;
+    return classNames(props.className, {
+      'p-invalid': props.invalid
+    });
   }
 };
 var inlineStyles$9 = {
-  checkbox: function checkbox(_ref3) {
-    var selectedOption = _ref3.selectedOption;
+  checkbox: function checkbox(_ref4) {
+    var selectedOption = _ref4.selectedOption;
     return selectedOption && selectedOption.style;
   }
 };
@@ -43151,7 +43390,9 @@ var MultiStateCheckboxBase = ComponentBase.extend({
     tooltip: null,
     tooltipOptions: null,
     value: null,
-    children: undefined
+    children: undefined,
+    invalid: false,
+    variant: null
   },
   css: {
     classes: classes$v,
@@ -43300,7 +43541,6 @@ var MultiStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__
   var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
   var icon = createIcon();
   var ariaValueLabel = selectedOption ? getOptionAriaLabel(selectedOption) : ariaLabel('nullLabel');
-  var ariaChecked = selectedOption ? 'true' : 'false';
   var rootProps = mergeProps({
     ref: elementRef,
     id: props.id,
@@ -43309,7 +43549,8 @@ var MultiStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__
     onClick: onClick
   }, MultiStateCheckboxBase.getOtherProps(props), ptm('root'));
   var checkboxProps = mergeProps(_objectSpread$I({
-    className: classNames(props.className),
+    id: props.id + '_checkbox',
+    className: cx('checkbox'),
     style: sx('checkbox', {
       selectedOption: selectedOption
     }),
@@ -43317,8 +43558,6 @@ var MultiStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__
     onFocus: onFocus,
     onBlur: onBlur,
     onKeyDown: onKeyDown,
-    role: 'checkbox',
-    'aria-checked': ariaChecked,
     onChange: onClick,
     checked: !!selectedOption,
     disabled: props === null || props === void 0 ? void 0 : props.disabled,
@@ -49864,13 +50103,14 @@ var SlideMenuSub = /*#__PURE__*/React__namespace.memo(function (props) {
     var key = props.id + '_sep_' + index;
     var separatorProps = mergeProps({
       id: key,
-      key: key,
       className: cx('separator'),
       role: 'separator'
     }, ptm('separator', {
       hostName: props.hostName
     }));
-    return /*#__PURE__*/React__namespace.createElement("li", separatorProps);
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, separatorProps, {
+      key: key
+    }));
   };
   var createSubmenu = function createSubmenu(item, index) {
     var shouldRender = renderSubMenu[createKey(item, index)];
@@ -49946,14 +50186,15 @@ var SlideMenuSub = /*#__PURE__*/React__namespace.memo(function (props) {
     }
     var menuitemProps = mergeProps({
       id: key,
-      key: key,
       className: cx('menuitem', {
         active: active,
         item: item
       }),
       style: item.style
     }, getPTOptions(item, 'menuitem'));
-    return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, content, submenu);
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, menuitemProps, {
+      key: key
+    }), content, submenu);
   };
   var createItem = function createItem(item, index) {
     if (item.visible === false) {
@@ -51386,6 +51627,9 @@ var TieredMenuSub = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
     }
   };
   var getItemId = function getItemId(processedItem) {
+    if (processedItem.item && processedItem.item.id) {
+      return processedItem.item.id;
+    }
     return "".concat(props.menuId, "_").concat(processedItem.key);
   };
   var getItemProp = function getItemProp(processedItem, name, params) {
@@ -51439,13 +51683,14 @@ var TieredMenuSub = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
   var createSeparator = function createSeparator(index) {
     var key = 'separator_' + index;
     var separatorProps = mergeProps({
-      key: key,
       className: cx('separator'),
       role: 'separator'
     }, ptm('separator', {
       hostName: props.hostName
     }));
-    return /*#__PURE__*/React__namespace.createElement("li", separatorProps);
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, separatorProps, {
+      key: key
+    }));
   };
   var createSubmenu = function createSubmenu(processedItem, index) {
     if (isItemGroup(processedItem)) {
@@ -51539,7 +51784,6 @@ var TieredMenuSub = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
       className: cx('content')
     }, getPTOptions(processedItem, 'content'));
     var menuitemProps = mergeProps({
-      key: key,
       id: key,
       'aria-label': item.label,
       'aria-disabled': disabled,
@@ -51562,7 +51806,9 @@ var TieredMenuSub = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
       },
       role: 'menuitem'
     }, getPTOptions(processedItem, 'menuitem'));
-    return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, /*#__PURE__*/React__namespace.createElement("div", contentProps, content), submenu);
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, menuitemProps, {
+      key: key
+    }), /*#__PURE__*/React__namespace.createElement("div", contentProps, content), submenu);
   };
   var createItem = function createItem(processedItem, index) {
     if (processedItem.visible === false) {
@@ -52394,10 +52640,11 @@ var SplitButtonBase = ComponentBase.extend({
 function ownKeys$n(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$n(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$n(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$n(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SplitButton = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+  var _props$id;
   var mergeProps = useMergeProps();
   var context = React__namespace.useContext(PrimeReactContext);
   var props = SplitButtonBase.getProps(inProps, context);
-  var _React$useState = React__namespace.useState(props.id),
+  var _React$useState = React__namespace.useState((_props$id = props.id) !== null && _props$id !== void 0 ? _props$id : UniqueComponentId),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     idState = _React$useState2[0],
     setIdState = _React$useState2[1];
@@ -55995,14 +56242,14 @@ var ToggleButton = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namesp
     onBlur: onBlur,
     onKeyDown: onKeyDown,
     tabIndex: tabIndex,
-    role: 'switch',
     type: 'checkbox',
-    'aria-pressed': props.checked,
     'aria-invalid': props.invalid,
     disabled: props.disabled,
     readOnly: props.readonly,
     value: props.checked,
-    checked: props.checked
+    checked: props.checked,
+    'aria-label': props['aria-label'],
+    'aria-labelledby': props['aria-labelledby']
   }, ptm('input'));
   var boxProps = mergeProps({
     className: classNames(props.className, cx('box', {
@@ -57007,11 +57254,11 @@ var UITreeNode = /*#__PURE__*/React__namespace.memo(function (props) {
 });
 UITreeNode.displayName = 'UITreeNode';
 
-function ownKeys$9(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$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _createForOfIteratorHelper$5(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray$5(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray$5(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$5(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$5(r, a) : void 0; } }
 function _arrayLikeToArray$5(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function ownKeys$9(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$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Tree = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
   var mergeProps = useMergeProps();
   var context = React__namespace.useContext(PrimeReactContext);
@@ -57025,18 +57272,14 @@ var Tree = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
     _React$useState2 = _slicedToArray(_React$useState, 2),
     expandedKeysState = _React$useState2[0],
     setExpandedKeysState = _React$useState2[1];
-  var _React$useState3 = React__namespace.useState({}),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    filterExpandedKeys = _React$useState4[0],
-    setFilterExpandedKeys = _React$useState4[1];
   var elementRef = React__namespace.useRef(null);
   var filteredNodes = React__namespace.useRef([]);
   var dragState = React__namespace.useRef(null);
   var filterChanged = React__namespace.useRef(false);
   var filteredValue = props.onFilterValueChange ? props.filterValue : filterValueState;
   var isFiltering = props.filter && filteredValue;
-  var expandedKeys = isFiltering ? filterExpandedKeys : props.onToggle ? props.expandedKeys : expandedKeysState;
-  var currentFilterExpandedKeys = {};
+  var expandedKeys = props.onToggle ? props.expandedKeys : expandedKeysState;
+  var currentFilterExpandedKeys = React__namespace.useRef({});
   var childFocusEvent = React__namespace.useRef(null);
   var _TreeBase$setMetaData = TreeBase.setMetaData({
       props: props,
@@ -57066,7 +57309,16 @@ var Tree = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
     var originalEvent = event.originalEvent,
       value = event.value,
       navigateFocusToChild = event.navigateFocusToChild;
-    if (props.onToggle) {
+    if (originalEvent == null && isFiltering) {
+      if (props.onToggle) {
+        props.onToggle({
+          originalEvent: originalEvent,
+          value: _objectSpread$9(_objectSpread$9({}, props.expandedKeys), value)
+        });
+      } else {
+        setExpandedKeysState(_objectSpread$9(_objectSpread$9({}, expandedKeysState), value));
+      }
+    } else if (props.onToggle) {
       props.onToggle({
         originalEvent: originalEvent,
         value: value
@@ -57075,11 +57327,7 @@ var Tree = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
       if (navigateFocusToChild) {
         childFocusEvent.current = originalEvent;
       }
-      if (isFiltering) {
-        setFilterExpandedKeys(value);
-      } else {
-        setExpandedKeysState(value);
-      }
+      setExpandedKeysState(value);
     }
   };
   useUpdateEffect(function () {
@@ -57318,7 +57566,12 @@ var Tree = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
         _iterator.f();
       }
     }
-    setFilterExpandedKeys(currentFilterExpandedKeys);
+    onToggle({
+      originalEvent: null,
+      value: currentFilterExpandedKeys.current,
+      navigateFocusToChild: false
+    });
+    currentFilterExpandedKeys.current = {};
     filterChanged.current = false;
   };
   var findFilteredNodes = function findFilteredNodes(node, paramsWithoutNode) {
@@ -57345,7 +57598,7 @@ var Tree = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
         }
       }
       if (matched) {
-        currentFilterExpandedKeys[node.key] = true;
+        currentFilterExpandedKeys.current[node.key] = true;
         return true;
       }
     }
@@ -57671,7 +57924,9 @@ var TreeSelectBase = ComponentBase.extend({
     onBlur: null,
     onFilterValueChange: null,
     onHide: null,
+    onNodeClick: null,
     onNodeCollapse: null,
+    onNodeDoubleClick: null,
     onNodeExpand: null,
     onNodeSelect: null,
     onNodeUnselect: null,
@@ -58363,6 +58618,8 @@ var TreeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespac
       onCollapse: props.onNodeCollapse,
       onExpand: props.onNodeExpand,
       onFilterValueChange: onFilterValueChange,
+      onNodeClick: props.onNodeClick,
+      onNodeDoubleClick: props.onNodeDoubleClick,
       onSelect: onNodeSelect,
       onSelectionChange: onSelectionChange,
       onToggle: onNodeToggle,
@@ -61922,6 +62179,7 @@ var TriStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
   var ariaValueLabel = checkBoxValue ? ariaLabel('trueLabel') : checkBoxValue === false ? ariaLabel('falseLabel') : ariaLabel('nullLabel');
   var ariaChecked = checkBoxValue ? 'true' : 'false';
   var boxProps = mergeProps(_objectSpread({
+    id: props.id + '_box',
     className: cx('box'),
     tabIndex: props.disabled ? '-1' : props.tabIndex,
     onFocus: onFocus,