primereact 10.9.6 → 10.9.7

package/primereact.all.cjs.js

@@ -4918,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");
@@ -5676,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;
   };
@@ -8192,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'),
@@ -9758,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
     }));
@@ -10158,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) {
@@ -10203,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) {
@@ -10287,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);
@@ -11273,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];
@@ -14059,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();
     }
   });
@@ -14436,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    .p-cascadeselect-clear-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -.5rem;\n        right: 3rem;\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',
@@ -14444,6 +14455,7 @@ var CascadeSelectBase = ComponentBase.extend({
     ariaLabelledBy: null,
     autoFocus: false,
     breakpoint: undefined,
+    showClear: false,
     className: null,
     dataKey: null,
     disabled: false,
@@ -16308,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
     }));
@@ -17394,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';
         }
@@ -17448,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;
@@ -18725,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)) {
@@ -18816,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,
@@ -18837,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) {
@@ -20600,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();
@@ -20612,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;
       }
@@ -22375,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,
@@ -22416,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'),
@@ -24029,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,
@@ -24545,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);
@@ -24583,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()
@@ -24638,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) {
@@ -24685,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, isOutsideClicked);
+    props.onClick(event, getCellCallbackParams(event), isEditable(), editingState, setEditingState, props.column, bindDocumentClickListener);
   };
   var _onMouseDown = function onMouseDown(event) {
     var params = getCellCallbackParams(event);
@@ -24757,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);
     }
@@ -24838,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() {
@@ -25144,6 +25163,7 @@ 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);
 });
@@ -25627,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';
       }
@@ -25636,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, isOutsideClicked) {
+  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');
@@ -25669,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);
     }
@@ -27034,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';
       }
@@ -27414,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);
@@ -27481,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;
@@ -27491,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;
@@ -28307,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';
       }
@@ -29167,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);
         }
       }
@@ -30282,6 +30326,9 @@ var DataTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
       },
       getVirtualScroller: function getVirtualScroller() {
         return virtualScrollerRef.current;
+      },
+      getProcessedData: function getProcessedData() {
+        return processedData();
       }
     };
   });
@@ -38735,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) {
@@ -38790,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,
@@ -38830,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)) {
@@ -38842,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
       })),
@@ -38854,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) {
@@ -38862,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
       })
@@ -38876,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;
@@ -38942,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,
@@ -38978,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({
@@ -38997,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;
@@ -39541,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
       }),
@@ -39552,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({
@@ -40566,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: {
@@ -40627,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;
   };
@@ -41729,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
         };
@@ -42104,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({
@@ -50041,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)];
@@ -50123,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) {
@@ -51563,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) {
@@ -51616,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)) {
@@ -51716,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,
@@ -51739,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) {
@@ -52571,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];
@@ -56172,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', {
@@ -57184,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);
@@ -57202,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,
@@ -57243,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
@@ -57252,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 () {
@@ -57495,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) {
@@ -57522,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;
       }
     }