primereact 10.8.4 → 10.9.0

package/primereact.all.cjs.js

@@ -3,7 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
+var React$1 = require('react');
 var reactTransitionGroup = require('react-transition-group');
 var ReactDOM = require('react-dom');
 
@@ -27,8 +27,8 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React$1);
+var React__namespace = /*#__PURE__*/_interopNamespace(React$1);
 var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 
 function _extends() {
@@ -2046,6 +2046,13 @@ var ObjectUtils = /*#__PURE__*/function () {
   }]);
 }();
 
+var lastId = 0;
+function UniqueComponentId() {
+  var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'pr_id_';
+  lastId++;
+  return "".concat(prefix).concat(lastId);
+}
+
 function ownKeys$21(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$21(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$21(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$21(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var IconUtils = /*#__PURE__*/function () {
@@ -2061,8 +2068,9 @@ var IconUtils = /*#__PURE__*/function () {
       if (icon !== null) {
         var iconType = _typeof(icon);
         var className = classNames(iconProps.className, iconType === 'string' && icon);
-        content = /*#__PURE__*/React__namespace.createElement("span", _extends({}, iconProps, {
-          className: className
+        content = /*#__PURE__*/React.createElement("span", _extends({}, iconProps, {
+          className: className,
+          key: UniqueComponentId('icon')
         }));
         if (iconType !== 'string') {
           var defaultContentOptions = _objectSpread$21({
@@ -2585,13 +2593,6 @@ function mergeProps(props) {
   }, {});
 }
 
-var lastId = 0;
-function UniqueComponentId() {
-  var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'pr_id_';
-  lastId++;
-  return "".concat(prefix).concat(lastId);
-}
-
 function handler() {
   var zIndexes = [];
   var generateZIndex = function generateZIndex(key, autoZIndex) {
@@ -3468,48 +3469,49 @@ var SortOrder = Object.freeze({
 
 var PrimeReactContext = /*#__PURE__*/React__default["default"].createContext();
 var PrimeReactProvider = function PrimeReactProvider(props) {
-  var propsValue = props.value || {};
-  var _useState = React.useState(propsValue.ripple || false),
+  var _props$value, _propsValue$ripple, _propsValue$inputStyl, _propsValue$locale, _propsValue$appendTo, _propsValue$styleCont, _propsValue$cssTransi, _propsValue$autoZInde, _propsValue$hideOverl, _propsValue$nonce, _propsValue$nullSortO, _propsValue$zIndex, _propsValue$ptOptions, _propsValue$pt, _propsValue$unstyled, _propsValue$filterMat;
+  var propsValue = (_props$value = props.value) !== null && _props$value !== void 0 ? _props$value : {};
+  var _useState = React$1.useState((_propsValue$ripple = propsValue.ripple) !== null && _propsValue$ripple !== void 0 ? _propsValue$ripple : false),
     _useState2 = _slicedToArray(_useState, 2),
     ripple = _useState2[0],
     setRipple = _useState2[1];
-  var _useState3 = React.useState(propsValue.inputStyle || 'outlined'),
+  var _useState3 = React$1.useState((_propsValue$inputStyl = propsValue.inputStyle) !== null && _propsValue$inputStyl !== void 0 ? _propsValue$inputStyl : 'outlined'),
     _useState4 = _slicedToArray(_useState3, 2),
     inputStyle = _useState4[0],
     setInputStyle = _useState4[1];
-  var _useState5 = React.useState(propsValue.locale || 'en'),
+  var _useState5 = React$1.useState((_propsValue$locale = propsValue.locale) !== null && _propsValue$locale !== void 0 ? _propsValue$locale : 'en'),
     _useState6 = _slicedToArray(_useState5, 2),
     locale = _useState6[0],
     setLocale = _useState6[1];
-  var _useState7 = React.useState(propsValue.appendTo || null),
+  var _useState7 = React$1.useState((_propsValue$appendTo = propsValue.appendTo) !== null && _propsValue$appendTo !== void 0 ? _propsValue$appendTo : null),
     _useState8 = _slicedToArray(_useState7, 2),
     appendTo = _useState8[0],
     setAppendTo = _useState8[1];
-  var _useState9 = React.useState(propsValue.styleContainer || null),
+  var _useState9 = React$1.useState((_propsValue$styleCont = propsValue.styleContainer) !== null && _propsValue$styleCont !== void 0 ? _propsValue$styleCont : null),
     _useState10 = _slicedToArray(_useState9, 2),
     styleContainer = _useState10[0],
     setStyleContainer = _useState10[1];
-  var _useState11 = React.useState(propsValue.cssTransition || true),
+  var _useState11 = React$1.useState((_propsValue$cssTransi = propsValue.cssTransition) !== null && _propsValue$cssTransi !== void 0 ? _propsValue$cssTransi : true),
     _useState12 = _slicedToArray(_useState11, 2),
     cssTransition = _useState12[0],
     setCssTransition = _useState12[1];
-  var _useState13 = React.useState(propsValue.autoZIndex || true),
+  var _useState13 = React$1.useState((_propsValue$autoZInde = propsValue.autoZIndex) !== null && _propsValue$autoZInde !== void 0 ? _propsValue$autoZInde : true),
     _useState14 = _slicedToArray(_useState13, 2),
     autoZIndex = _useState14[0],
     setAutoZIndex = _useState14[1];
-  var _useState15 = React.useState(propsValue.hideOverlaysOnDocumentScrolling || false),
+  var _useState15 = React$1.useState((_propsValue$hideOverl = propsValue.hideOverlaysOnDocumentScrolling) !== null && _propsValue$hideOverl !== void 0 ? _propsValue$hideOverl : false),
     _useState16 = _slicedToArray(_useState15, 2),
     hideOverlaysOnDocumentScrolling = _useState16[0],
     setHideOverlaysOnDocumentScrolling = _useState16[1];
-  var _useState17 = React.useState(propsValue.nonce || null),
+  var _useState17 = React$1.useState((_propsValue$nonce = propsValue.nonce) !== null && _propsValue$nonce !== void 0 ? _propsValue$nonce : null),
     _useState18 = _slicedToArray(_useState17, 2),
     nonce = _useState18[0],
     setNonce = _useState18[1];
-  var _useState19 = React.useState(propsValue.nullSortOrder || 1),
+  var _useState19 = React$1.useState((_propsValue$nullSortO = propsValue.nullSortOrder) !== null && _propsValue$nullSortO !== void 0 ? _propsValue$nullSortO : 1),
     _useState20 = _slicedToArray(_useState19, 2),
     nullSortOrder = _useState20[0],
     setNullSortOrder = _useState20[1];
-  var _useState21 = React.useState(propsValue.zIndex || {
+  var _useState21 = React$1.useState((_propsValue$zIndex = propsValue.zIndex) !== null && _propsValue$zIndex !== void 0 ? _propsValue$zIndex : {
       modal: 1100,
       overlay: 1000,
       menu: 1000,
@@ -3519,22 +3521,22 @@ var PrimeReactProvider = function PrimeReactProvider(props) {
     _useState22 = _slicedToArray(_useState21, 2),
     zIndex = _useState22[0],
     setZIndex = _useState22[1];
-  var _useState23 = React.useState(propsValue.ptOptions || {
+  var _useState23 = React$1.useState((_propsValue$ptOptions = propsValue.ptOptions) !== null && _propsValue$ptOptions !== void 0 ? _propsValue$ptOptions : {
       mergeSections: true,
       mergeProps: true
     }),
     _useState24 = _slicedToArray(_useState23, 2),
     ptOptions = _useState24[0],
     setPtOptions = _useState24[1];
-  var _useState25 = React.useState(propsValue.pt || undefined),
+  var _useState25 = React$1.useState((_propsValue$pt = propsValue.pt) !== null && _propsValue$pt !== void 0 ? _propsValue$pt : undefined),
     _useState26 = _slicedToArray(_useState25, 2),
     pt = _useState26[0],
     setPt = _useState26[1];
-  var _useState27 = React.useState(propsValue.unstyled || false),
+  var _useState27 = React$1.useState((_propsValue$unstyled = propsValue.unstyled) !== null && _propsValue$unstyled !== void 0 ? _propsValue$unstyled : false),
     _useState28 = _slicedToArray(_useState27, 2),
     unstyled = _useState28[0],
     setUnstyled = _useState28[1];
-  var _useState29 = React.useState(propsValue.filterMatchModeOptions || {
+  var _useState29 = React$1.useState((_propsValue$filterMat = propsValue.filterMatchModeOptions) !== null && _propsValue$filterMat !== void 0 ? _propsValue$filterMat : {
       text: [FilterMatchMode.STARTS_WITH, FilterMatchMode.CONTAINS, FilterMatchMode.NOT_CONTAINS, FilterMatchMode.ENDS_WITH, FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS],
       numeric: [FilterMatchMode.EQUALS, FilterMatchMode.NOT_EQUALS, FilterMatchMode.LESS_THAN, FilterMatchMode.LESS_THAN_OR_EQUAL_TO, FilterMatchMode.GREATER_THAN, FilterMatchMode.GREATER_THAN_OR_EQUAL_TO],
       date: [FilterMatchMode.DATE_IS, FilterMatchMode.DATE_IS_NOT, FilterMatchMode.DATE_BEFORE, FilterMatchMode.DATE_AFTER]
@@ -3964,7 +3966,7 @@ var useGlobalOnEscapeKey = function useGlobalOnEscapeKey(_ref3) {
   var callback = _ref3.callback,
     when = _ref3.when,
     priority = _ref3.priority;
-  React.useEffect(function () {
+  React$1.useEffect(function () {
     if (!when) {
       return;
     }
@@ -4057,7 +4059,7 @@ var useMatchMedia = function useMatchMedia(query) {
  * Hook to merge properties including custom merge function for things like Tailwind merge.
  */
 var useMergeProps = function useMergeProps() {
-  var context = React.useContext(PrimeReactContext);
+  var context = React$1.useContext(PrimeReactContext);
   return function () {
     for (var _len = arguments.length, props = new Array(_len), _key = 0; _key < _len; _key++) {
       props[_key] = arguments[_key];
@@ -4623,12 +4625,12 @@ var useSessionStorage = function useSessionStorage(initialValue, key) {
 var _id = 0;
 var useStyle = function useStyle(css) {
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  var _useState = React.useState(false),
+  var _useState = React$1.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isLoaded = _useState2[0],
     setIsLoaded = _useState2[1];
-  var styleRef = React.useRef(null);
-  var context = React.useContext(PrimeReactContext);
+  var styleRef = React$1.useRef(null);
+  var context = React$1.useContext(PrimeReactContext);
   var defaultDocument = DomHandler.isClient() ? window.document : undefined;
   var _options$document = options.document,
     document = _options$document === void 0 ? defaultDocument : _options$document,
@@ -4688,7 +4690,7 @@ var useStyle = function useStyle(css) {
     DomHandler.removeInlineStyle(styleRef.current);
     setIsLoaded(false);
   };
-  React.useEffect(function () {
+  React$1.useEffect(function () {
     if (!manual) {
       load();
     }
@@ -4751,11 +4753,11 @@ var useUpdateEffect = function useUpdateEffect(fn, deps) {
 
 function ownKeys$1X(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$1X(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1X(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1X(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    padding: 0;\n    margin: -1px;\n    position: absolute;\n    height: 1px;\n    width: 1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    clip-path: inset(50%);\n    white-space: nowrap;\n}\n\n.p-hidden-accessible input,\n.p-hidden-accessible select {\n    transform: scale(0);\n}\n\n.p-overflow-hidden {\n    overflow: hidden;\n    padding-right: var(--scrollbar-width);\n}\n";
+var baseStyle = "\n.p-hidden-accessible {\n    position: absolute;\n    pointer-events: none;\n    opacity: 0;\n    white-space: nowrap;\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";
 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    .p-sr-only {\n        border: 0;\n        clip: rect(1px, 1px, 1px, 1px);\n        clip-path: inset(50%);\n        height: 1px;\n        margin: -1px;\n        overflow: hidden;\n        padding: 0;\n        position: absolute;\n        width: 1px;\n        word-wrap: normal;\n    }\n\n    /* @todo Refactor */\n    .p-menu .p-menuitem-link {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    ".concat(buttonStyles, "\n    ").concat(inputTextStyles, "\n    ").concat(iconStyles, "\n}\n");
+var commonStyle = "\n@layer primereact {\n    .p-component, .p-component * {\n        box-sizing: border-box;\n    }\n\n    .p-hidden {\n        display: none;\n    }\n\n    .p-hidden-space {\n        visibility: hidden;\n    }\n\n    .p-reset {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        outline: 0;\n        text-decoration: none;\n        font-size: 100%;\n        list-style: none;\n    }\n\n    .p-disabled, .p-disabled * {\n        cursor: default;\n        pointer-events: none;\n        user-select: none;\n    }\n\n    .p-component-overlay {\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n    }\n\n    .p-unselectable-text {\n        user-select: none;\n    }\n\n    .p-scrollbar-measure {\n        width: 100px;\n        height: 100px;\n        overflow: scroll;\n        position: absolute;\n        top: -9999px;\n    }\n\n    @-webkit-keyframes p-fadein {\n      0%   { opacity: 0; }\n      100% { opacity: 1; }\n    }\n    @keyframes p-fadein {\n      0%   { opacity: 0; }\n      100% { opacity: 1; }\n    }\n\n    .p-link {\n        text-align: left;\n        background-color: transparent;\n        margin: 0;\n        padding: 0;\n        border: none;\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-link:disabled {\n        cursor: default;\n    }\n\n    /* Non react overlay animations */\n    .p-connected-overlay {\n        opacity: 0;\n        transform: scaleY(0.8);\n        transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-connected-overlay-visible {\n        opacity: 1;\n        transform: scaleY(1);\n    }\n\n    .p-connected-overlay-hidden {\n        opacity: 0;\n        transform: scaleY(1);\n        transition: opacity .1s linear;\n    }\n\n    /* React based overlay animations */\n    .p-connected-overlay-enter {\n        opacity: 0;\n        transform: scaleY(0.8);\n    }\n\n    .p-connected-overlay-enter-active {\n        opacity: 1;\n        transform: scaleY(1);\n        transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-connected-overlay-enter-done {\n        transform: none;\n    }\n\n    .p-connected-overlay-exit {\n        opacity: 1;\n    }\n\n    .p-connected-overlay-exit-active {\n        opacity: 0;\n        transition: opacity .1s linear;\n    }\n\n    /* Toggleable Content */\n    .p-toggleable-content-enter {\n        max-height: 0;\n    }\n\n    .p-toggleable-content-enter-active {\n        overflow: hidden;\n        max-height: 1000px;\n        transition: max-height 1s ease-in-out;\n    }\n\n    .p-toggleable-content-enter-done {\n        transform: none;\n    }\n\n    .p-toggleable-content-exit {\n        max-height: 1000px;\n    }\n\n    .p-toggleable-content-exit-active {\n        overflow: hidden;\n        max-height: 0;\n        transition: max-height 0.45s cubic-bezier(0, 1, 0, 1);\n    }\n\n    /* @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");
 var ComponentBase = {
   cProps: undefined,
   cParams: undefined,
@@ -5130,7 +5132,7 @@ var IconBase = {
       }, props.className),
       role: !isLabelEmpty ? 'img' : undefined,
       'aria-label': !isLabelEmpty ? props.label : undefined,
-      'aria-hidden': isLabelEmpty
+      'aria-hidden': props.label ? isLabelEmpty : undefined
     };
     return ObjectUtils.getMergedProps(otherProps, ptiProps);
   }
@@ -5873,6 +5875,8 @@ var Tooltip = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.f
     _React$useState8 = _slicedToArray(_React$useState7, 2),
     multipleFocusEvents = _React$useState8[0],
     setMultipleFocusEvents = _React$useState8[1];
+  var isCloseOnEscape = visibleState && props.closeOnEscape;
+  var overlayDisplayOrder = useDisplayOrder('tooltip', isCloseOnEscape);
   var metaData = {
     props: props,
     state: {
@@ -5899,8 +5903,8 @@ var Tooltip = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.f
     callback: function callback() {
       hide();
     },
-    when: props.closeOnEscape,
-    priority: [ESC_KEY_HANDLING_PRIORITIES.TOOLTIP, 0]
+    when: isCloseOnEscape,
+    priority: [ESC_KEY_HANDLING_PRIORITIES.TOOLTIP, overlayDisplayOrder]
   });
   var elementRef = React__namespace.useRef(null);
   var textRef = React__namespace.useRef(null);
@@ -6726,6 +6730,13 @@ var InputText = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     return ObjectUtils.isNotEmpty(props.value) || ObjectUtils.isNotEmpty(props.defaultValue);
   }, [props.value, props.defaultValue]);
   var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
+  React__namespace.useEffect(function () {
+    if (isFilled) {
+      DomHandler.addClass(elementRef.current, 'p-filled');
+    } else {
+      DomHandler.removeClass(elementRef.current, 'p-filled');
+    }
+  }, [props.disabled, isFilled]);
   var rootProps = mergeProps({
     className: classNames(props.className, cx('root', {
       context: context,
@@ -6797,11 +6808,16 @@ var classes$1c = {
   emptyMessage: 'p-autocomplete-item',
   item: function item(_ref6) {
     var suggestion = _ref6.suggestion,
-      optionGroupLabel = _ref6.optionGroupLabel;
+      optionGroupLabel = _ref6.optionGroupLabel,
+      selected = _ref6.selected;
     return optionGroupLabel ? classNames('p-autocomplete-item', {
       'p-disabled': suggestion.disabled
+    }, {
+      selected: selected
     }) : classNames('p-autocomplete-item', {
       'p-disabled': suggestion.disabled
+    }, {
+      'p-highlight': selected
     });
   },
   itemGroup: 'p-autocomplete-item-group',
@@ -7010,6 +7026,7 @@ var VirtualScroller = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__nam
   var defaultContentHeight = React__namespace.useRef(null);
   var isItemRangeChanged = React__namespace.useRef(false);
   var lazyLoadState = React__namespace.useRef(null);
+  var viewInitialized = React__namespace.useRef(false);
   var _useResizeListener = useResizeListener({
       listener: function listener(event) {
         return onResize();
@@ -7549,14 +7566,24 @@ var VirtualScroller = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__nam
     }
   };
   var init = function init() {
-    if (!props.disabled) {
+    if (!props.disabled && isVisible(elementRef.current)) {
       setSize();
       calculateOptions();
       setSpacerSize();
     }
   };
-  useMountEffect(function () {
-    viewInit();
+  var isVisible = function isVisible() {
+    if (DomHandler.isVisible(elementRef.current)) {
+      var rect = elementRef.current.getBoundingClientRect();
+      return rect.width > 0 && rect.height > 0;
+    }
+    return false;
+  };
+  React__namespace.useEffect(function () {
+    if (!viewInitialized.current && isVisible(elementRef.current)) {
+      viewInit();
+      viewInitialized.current = true;
+    }
   });
   useUpdateEffect(function () {
     init();
@@ -7821,15 +7848,25 @@ var AutoCompletePanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__n
       key: key ? key : null
     }), content);
   };
+  var isOptionSelected = function isOptionSelected(item) {
+    if (props.selectedItem && props.selectedItem.current && Array.isArray(props.selectedItem.current)) {
+      return props.selectedItem.current.some(function (selectedItem) {
+        return ObjectUtils.deepEquals(selectedItem, item);
+      });
+    } else {
+      return ObjectUtils.deepEquals(props.selectedItem.current, item);
+    }
+  };
   var createListItem = function createListItem(item, key, index, listItemProps) {
-    var selected = ObjectUtils.deepEquals(props.selectedItem, item);
+    var selected = isOptionSelected(item);
     var content = props.itemTemplate ? ObjectUtils.getJSXElement(props.itemTemplate, item, index) : props.field ? ObjectUtils.resolveFieldData(item, props.field) : item;
     var itemProps = mergeProps(_objectSpread$1O({
       index: index,
       role: 'option',
       className: cx('item', {
         optionGroupLabel: props.optionGroupLabel,
-        suggestion: item
+        suggestion: item,
+        selected: selected
       }),
       onClick: function onClick(e) {
         return props.onItemClick(e, item);
@@ -8153,19 +8190,17 @@ var AutoComplete = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namesp
     selectedItem.current = ObjectUtils.isNotEmpty(value) ? value : null;
   };
   var formatValue = function formatValue(value) {
-    if (ObjectUtils.isNotEmpty(value)) {
-      if (typeof value === 'string') {
-        return value;
-      } else if (props.selectedItemTemplate) {
-        var resolvedFieldData = ObjectUtils.getJSXElement(props.selectedItemTemplate, value);
-        return resolvedFieldData ? resolvedFieldData : value;
-      } else if (props.field) {
-        var _resolvedFieldData = ObjectUtils.resolveFieldData(value, props.field);
-        return _resolvedFieldData !== null && _resolvedFieldData !== undefined ? _resolvedFieldData : value;
-      }
-      return value;
+    if (ObjectUtils.isEmpty(value)) return '';
+    if (typeof value === 'string') return value;
+    var valueFromTemplate = ObjectUtils.getJSXElement(props.selectedItemTemplate, value);
+    if (typeof valueFromTemplate === 'string') {
+      return valueFromTemplate;
     }
-    return '';
+    if (props.field) {
+      var _ObjectUtils$resolveF;
+      return (_ObjectUtils$resolveF = ObjectUtils.resolveFieldData(value, props.field)) !== null && _ObjectUtils$resolveF !== void 0 ? _ObjectUtils$resolveF : value;
+    }
+    return value;
   };
   var updateInputField = function updateInputField(value) {
     inputRef.current.value = formatValue(value);
@@ -9989,7 +10024,8 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     setYearOptions(_yearOptions);
   };
   var decrementYear = function decrementYear() {
-    var _currentYear = currentYear - 1;
+    var year = getViewYear();
+    var _currentYear = year - 1;
     setCurrentYear(_currentYear);
     if (props.yearNavigator && _currentYear < yearOptions[0]) {
       var difference = yearOptions[yearOptions.length - 1] - yearOptions[0];
@@ -9998,7 +10034,8 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     return _currentYear;
   };
   var incrementYear = function incrementYear() {
-    var _currentYear = currentYear + 1;
+    var year = getViewYear();
+    var _currentYear = year + 1;
     setCurrentYear(_currentYear);
     if (props.yearNavigator && _currentYear.current > yearOptions[yearOptions.length - 1]) {
       var difference = yearOptions[yearOptions.length - 1] - yearOptions[0];
@@ -11050,7 +11087,6 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
         if (props.hideOnRangeSelection && endDate !== null) {
           setTimeout(function () {
             setOverlayVisibleState(false);
-            isOverlayClicked.current = false;
           }, 150);
         }
       } else {
@@ -11092,8 +11128,9 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
   };
   var onMonthSelect = function onMonthSelect(event, month) {
     if (props.view === 'month') {
+      var year = getViewYear();
       onDateSelect(event, {
-        year: currentYear,
+        year: year,
         month: month,
         day: 1,
         selectable: true
@@ -11119,6 +11156,9 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       });
     }
   };
+  var getViewYear = function getViewYear() {
+    return props.yearNavigator ? getViewDate().getFullYear() : currentYear;
+  };
   var onYearSelect = function onYearSelect(event, year) {
     if (props.view === 'year') {
       onDateSelect(event, {
@@ -12589,11 +12629,12 @@ var Calendar = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
         'p-disabled': !date.selectable
       });
       var content = date.otherMonth && !props.showOtherMonths ? null : createDateCellContent(date, dateClassName, groupIndex);
+      var formattedValue = formatDate(new Date(date.year, date.month, date.day), getDateFormat());
       var dayProps = mergeProps({
         className: cx('day', {
           date: date
         }),
-        'aria-label': date.day,
+        'aria-label': formattedValue,
         'data-p-today': date.today,
         'data-p-other-month': date.otherMonth
       }, ptm('day', {
@@ -15109,15 +15150,15 @@ var Checkbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       DomHandler.focus(inputRef.current);
     }
   };
-  var _onFocus = function onFocus() {
+  var _onFocus = function onFocus(event) {
     var _props$onFocus;
     setFocusedState(true);
-    props === null || props === void 0 || (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props);
+    props === null || props === void 0 || (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, event);
   };
-  var _onBlur = function onBlur() {
+  var _onBlur = function onBlur(event) {
     var _props$onBlur;
     setFocusedState(false);
-    props === null || props === void 0 || (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props);
+    props === null || props === void 0 || (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, event);
   };
   React__namespace.useImperativeHandle(ref, function () {
     return {
@@ -15168,10 +15209,10 @@ var Checkbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       name: props.name,
       tabIndex: props.tabIndex,
       onFocus: function onFocus(e) {
-        return _onFocus();
+        return _onFocus(e);
       },
       onBlur: function onBlur(e) {
-        return _onBlur();
+        return _onBlur(e);
       },
       onChange: function onChange(e) {
         return _onChange(e);
@@ -15301,7 +15342,9 @@ var Chip = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
       }, ptm('image'));
       content.push(/*#__PURE__*/React__namespace.createElement("img", _extends({
         alt: props.imageAlt
-      }, imageProps)));
+      }, imageProps, {
+        key: UniqueComponentId('image')
+      })));
     } else if (props.icon) {
       var chipIconProps = mergeProps({
         className: cx('icon')
@@ -15315,7 +15358,7 @@ var Chip = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
         className: cx('label')
       }, ptm('label'));
       content.push(/*#__PURE__*/React__namespace.createElement("span", _extends({}, labelProps, {
-        key: "label"
+        key: UniqueComponentId('label')
       }), props.label));
     }
     if (props.removable) {
@@ -15333,7 +15376,9 @@ var Chip = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
       className: classNames(props.className, cx('root')),
       'aria-label': props.label
     }, ChipBase.getOtherProps(props), ptm('root'));
-    return /*#__PURE__*/React__namespace.createElement("div", rootProps, content);
+    return /*#__PURE__*/React__namespace.createElement("div", _extends({}, rootProps, {
+      key: UniqueComponentId('chip')
+    }), content);
   };
   React__namespace.useImperativeHandle(ref, function () {
     return {
@@ -15702,7 +15747,9 @@ var Chips = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.for
         },
         'aria-hidden': 'true'
       }, ptm('removeTokenIcon'));
-      var icon = props.removeIcon || /*#__PURE__*/React__namespace.createElement(TimesCircleIcon, iconProps);
+      var icon = props.removeIcon || /*#__PURE__*/React__namespace.createElement(TimesCircleIcon, _extends({}, iconProps, {
+        key: "".concat(index, "_icon")
+      }));
       var removeIcon = IconUtils.getJSXIcon(icon, _objectSpread$1D({}, iconProps), {
         props: props
       });
@@ -15715,7 +15762,9 @@ var Chips = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.for
     var labelProps = mergeProps({
       className: cx('label')
     }, ptm('label'));
-    var label = /*#__PURE__*/React__namespace.createElement("span", labelProps, content);
+    var label = /*#__PURE__*/React__namespace.createElement("span", _extends({}, labelProps, {
+      key: "".concat(index, "_").concat(value, "_span")
+    }), content);
     var icon = createRemoveIcon(value, index);
     var tokenProps = mergeProps({
       id: props.inputId + '_chips_item_' + index,
@@ -15764,7 +15813,9 @@ var Chips = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.for
       },
       readOnly: props.readOnly
     }, ariaProps), ptm('input'));
-    return /*#__PURE__*/React__namespace.createElement("li", inputTokenProps, /*#__PURE__*/React__namespace.createElement("input", inputProps));
+    return /*#__PURE__*/React__namespace.createElement("li", _extends({}, inputTokenProps, {
+      key: props.inputId + '_chips_input'
+    }), /*#__PURE__*/React__namespace.createElement("input", inputProps));
   };
   var createItems = function createItems() {
     return props.value ? props.value.map(createItem) : null;
@@ -15811,7 +15862,9 @@ var Chips = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.for
     })),
     style: props.style
   }, ptm('root'));
-  return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", rootProps, list), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
+  return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({}, rootProps, {
+    key: "chips"
+  }), list), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
     target: inputRef,
     content: props.tooltip,
     pt: ptm('tooltip')
@@ -16606,9 +16659,9 @@ var FocusTrap = /*#__PURE__*/React__default["default"].memo(/*#__PURE__*/React__
     var _ref2 = props || {},
       _ref2$tabIndex = _ref2.tabIndex,
       tabIndex = _ref2$tabIndex === void 0 ? 0 : _ref2$tabIndex;
-    var createFocusableElement = function createFocusableElement(onFocus, section) {
+    var createFocusableElement = function createFocusableElement(inRef, onFocus, section) {
       return /*#__PURE__*/React__default["default"].createElement("span", {
-        ref: section === 'firstfocusableelement' ? firstFocusableElementRef : lastFocusableElementRef,
+        ref: inRef,
         className: 'p-hidden-accessible p-hidden-focusable',
         tabIndex: tabIndex,
         role: 'presentation',
@@ -16619,11 +16672,11 @@ var FocusTrap = /*#__PURE__*/React__default["default"].memo(/*#__PURE__*/React__
         "data-pc-section": section
       });
     };
-    var firstFocusableElement = createFocusableElement(onFirstHiddenElementFocus, 'firstfocusableelement');
-    var lastFocusableElement = createFocusableElement(onLastHiddenElementFocus, 'lastfocusableelement');
-    if (firstFocusableElement.ref.current && lastFocusableElement.ref.current) {
-      firstFocusableElement.ref.current.$_pfocustrap_lasthiddenfocusableelement = lastFocusableElement.ref.current;
-      lastFocusableElement.ref.current.$_pfocustrap_firsthiddenfocusableelement = firstFocusableElement.ref.current;
+    var firstFocusableElement = createFocusableElement(firstFocusableElementRef, onFirstHiddenElementFocus, 'firstfocusableelement');
+    var lastFocusableElement = createFocusableElement(lastFocusableElementRef, onLastHiddenElementFocus, 'lastfocusableelement');
+    if (firstFocusableElementRef.current && lastFocusableElementRef.current) {
+      firstFocusableElementRef.current.$_pfocustrap_lasthiddenfocusableelement = lastFocusableElementRef.current;
+      lastFocusableElementRef.current.$_pfocustrap_firsthiddenfocusableelement = firstFocusableElementRef.current;
     }
     return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, firstFocusableElement, props.children, lastFocusableElement);
   };
@@ -16925,7 +16978,7 @@ var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
     bindDocumentDragEndListener = _useEventListener8[0],
     unbindDocumentDragEndListener = _useEventListener8[1];
   var onClose = function onClose(event) {
-    props.onHide();
+    props.onHide(event);
     event.preventDefault();
   };
   var focus = function focus() {
@@ -17566,12 +17619,14 @@ var ConfirmDialog = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
   };
   var hide = function hide() {
     var result = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'cancel';
-    setVisibleState(false);
-    callbackFromProp('onHide', {
-      result: result
-    });
-    DomHandler.focus(focusElementOnHide.current);
-    focusElementOnHide.current = null;
+    if (visibleState) {
+      setVisibleState(false);
+      callbackFromProp('onHide', {
+        result: result
+      });
+      DomHandler.focus(focusElementOnHide.current);
+      focusElementOnHide.current = null;
+    }
   };
   var confirm = function confirm(updatedProps) {
     if (updatedProps.tagKey === props.tagKey) {
@@ -20953,6 +21008,9 @@ var InputNumber = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
   React__namespace.useEffect(function () {
     ObjectUtils.combinedRefs(inputRef, props.inputRef);
   }, [inputRef, props.inputRef]);
+  useUnmountEffect(function () {
+    clearTimer();
+  });
   useMountEffect(function () {
     constructParser();
     var newValue = validateValue(props.value);
@@ -21438,7 +21496,7 @@ var classes$U = {
       'p-focus': focusedState,
       'p-variant-filled': props.variant ? props.variant === 'filled' : context && context.inputStyle === 'filled',
       'p-dropdown-clearable': props.showClear && !props.disabled,
-      'p-inputwrapper-filled': ObjectUtils.isNotEmpty(props.value),
+      'p-inputwrapper-filled': props.value !== undefined,
       'p-inputwrapper-focus': focusedState || overlayVisibleState
     });
   },
@@ -21531,17 +21589,17 @@ var DropdownBase = ComponentBase.extend({
     ariaLabel: null,
     ariaLabelledBy: null,
     autoFocus: false,
+    autoOptionFocus: false,
+    checkmark: false,
     children: undefined,
     className: null,
     clearIcon: null,
+    collapseIcon: null,
     dataKey: null,
     disabled: false,
     dropdownIcon: null,
-    collapseIcon: null,
     editable: false,
     emptyFilterMessage: null,
-    highlightOnSelect: true,
-    checkmark: false,
     emptyMessage: null,
     filter: false,
     filterBy: null,
@@ -21553,11 +21611,12 @@ var DropdownBase = ComponentBase.extend({
     filterPlaceholder: null,
     filterTemplate: null,
     focusInputRef: null,
+    focusOnHover: true,
+    highlightOnSelect: true,
     id: null,
     inputId: null,
     inputRef: null,
     invalid: false,
-    variant: null,
     itemTemplate: null,
     loading: false,
     loadingIcon: null,
@@ -21573,14 +21632,11 @@ var DropdownBase = ComponentBase.extend({
     onShow: null,
     optionDisabled: null,
     optionGroupChildren: 'items',
-    selectOnFocus: false,
-    focusOnHover: true,
-    autoOptionFocus: false,
     optionGroupLabel: null,
     optionGroupTemplate: null,
     optionLabel: null,
-    optionValue: null,
     options: null,
+    optionValue: null,
     panelClassName: null,
     panelFooterTemplate: null,
     panelStyle: null,
@@ -21588,6 +21644,7 @@ var DropdownBase = ComponentBase.extend({
     required: false,
     resetFilterOnHide: false,
     scrollHeight: '200px',
+    selectOnFocus: false,
     showClear: false,
     showFilterClear: false,
     showOnFocus: false,
@@ -21596,8 +21653,10 @@ var DropdownBase = ComponentBase.extend({
     tooltip: null,
     tooltipOptions: null,
     transitionOptions: null,
+    useOptionAsValue: false,
     value: null,
     valueTemplate: null,
+    variant: null,
     virtualScrollerOptions: null
   },
   css: {
@@ -21678,7 +21737,6 @@ var DropdownItem = /*#__PURE__*/React__namespace.memo(function (props) {
   var itemProps = mergeProps({
     id: "dropdownItem_".concat(index),
     role: 'option',
-    key: props.label,
     className: classNames(option.className, cx('item', {
       selected: selected,
       disabled: disabled,
@@ -21721,7 +21779,9 @@ var DropdownItem = /*#__PURE__*/React__namespace.memo(function (props) {
     }, getPTOptions('blankIcon'));
     return /*#__PURE__*/React__namespace.createElement(BlankIcon, blankIconProps);
   };
-  return /*#__PURE__*/React__namespace.createElement("li", itemProps, checkmark && iconRenderer(), /*#__PURE__*/React__namespace.createElement("span", itemGroupLabelProps, content), /*#__PURE__*/React__namespace.createElement(Ripple, null));
+  return /*#__PURE__*/React__namespace.createElement("li", _extends({
+    key: props.label
+  }, itemProps), checkmark && iconRenderer(), /*#__PURE__*/React__namespace.createElement("span", itemGroupLabelProps, content), /*#__PURE__*/React__namespace.createElement(Ripple, null));
 });
 DropdownItem.displayName = 'DropdownItem';
 
@@ -22133,7 +22193,6 @@ var Dropdown = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
     if (props.disabled || props.loading) {
       return;
     }
-    event.stopPropagation();
     props.onClick && props.onClick(event);
 
     // do not continue if the user defined click wants to prevent it
@@ -22146,6 +22205,7 @@ var Dropdown = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       DomHandler.focus(focusInputRef.current);
       overlayVisibleState ? hide() : show();
     }
+    event.preventDefault();
     clickedRef.current = true;
   };
   var onInputFocus = function onInputFocus(event) {
@@ -22180,10 +22240,9 @@ var Dropdown = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
   };
   var onOptionSelect = function onOptionSelect(event, option) {
     var isHide = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-    var value = getOptionValue(option);
     selectItem({
       originalEvent: event,
-      option: value
+      option: option
     });
     isHide && hide();
   };
@@ -22471,13 +22530,22 @@ var Dropdown = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
       !overlayVisibleState && show();
     }
   };
+  var findInArray = function findInArray(visibleOptions, searchText) {
+    if (!searchText || !(visibleOptions !== null && visibleOptions !== void 0 && visibleOptions.length)) return -1;
+    var normalizedSearch = searchText.toLocaleLowerCase();
+    var exactMatch = visibleOptions.findIndex(function (item) {
+      return getOptionLabel(item).toLocaleLowerCase() === normalizedSearch;
+    });
+    if (exactMatch !== -1) return exactMatch;
+    return visibleOptions.findIndex(function (item) {
+      return getOptionLabel(item).toLocaleLowerCase().startsWith(normalizedSearch);
+    });
+  };
   var onEditableInputChange = function onEditableInputChange(event) {
     !overlayVisibleState && show();
     var searchIndex = null;
     if (event.target.value && visibleOptions) {
-      searchIndex = visibleOptions.findIndex(function (item) {
-        return getOptionLabel(item).toLocaleLowerCase().startsWith(event.target.value.toLocaleLowerCase());
-      });
+      searchIndex = findInArray(visibleOptions, event.target.value);
     }
     setFocusedOptionIndex(searchIndex);
     if (props.onChange) {
@@ -22582,7 +22650,7 @@ var Dropdown = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
   };
   var getSelectedOptionIndex = function getSelectedOptionIndex(options) {
     options = options || visibleOptions;
-    if (props.value != null && options) {
+    if (options) {
       if (props.optionGroupLabel) {
         for (var i = 0; i < options.length; i++) {
           var selectedOptionIndex = findOptionIndexInList(props.value, getOptionGroupChildren(options[i]));
@@ -24088,6 +24156,7 @@ var BodyCell = /*#__PURE__*/React__namespace.memo(function (props) {
   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);
   var _props$ptCallbacks = props.ptCallbacks,
@@ -24132,12 +24201,13 @@ var BodyCell = /*#__PURE__*/React__namespace.memo(function (props) {
   var _useEventListener = useEventListener({
       type: 'click',
       listener: function listener(e) {
-        if (!selfClick.current && isOutsideClicked(e.target)) {
-          // #2666 for overlay components and outside is clicked
-          setTimeout(function () {
+        setTimeout(function () {
+          if (!selfClick.current && isOutsideClicked(e.target)) {
+            // #2666 for overlay components and outside is clicked
+
             switchCellToViewMode(e, true);
-          }, 0);
-        }
+          }
+        }, 0);
         selfClick.current = false;
       },
       options: true,
@@ -24268,11 +24338,14 @@ var BodyCell = /*#__PURE__*/React__namespace.memo(function (props) {
     }
   };
   var focusOnElement = function focusOnElement() {
-    if (editingState) {
-      var focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : DomHandler.findSingle(elementRef.current, '[data-p-row-editor-save="true"]');
-      focusableEl && focusableEl.focus();
-    }
-    keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
+    clearTimeout(focusTimeout.current);
+    focusTimeout.current = setTimeout(function () {
+      if (editingState) {
+        var focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : DomHandler.findSingle(elementRef.current, '[data-p-row-editor-save="true"]');
+        focusableEl && focusableEl.focus();
+      }
+      keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
+    }, 1);
   };
   var focusOnInit = function focusOnInit() {
     clearTimeout(initFocusTimeout.current);
@@ -24499,7 +24572,8 @@ var BodyCell = /*#__PURE__*/React__namespace.memo(function (props) {
     if (props.editMode === 'cell' || props.editMode === 'row') {
       focusOnElement();
     }
-  });
+  }, [props.editMode, props.editing, editingState]); // eslint-disable-line react-hooks/exhaustive-deps
+
   React__namespace.useEffect(function () {
     if (props.editMode === 'row' && props.editing !== editingState) {
       setEditingState(props.editing);
@@ -25739,10 +25813,10 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     return isAllowCellSelection ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
   };
   var selectRangeOnRow = function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {
-    var value = props.tableProps.value;
     var selection = [];
     for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
-      var rangeRowData = value[i];
+      var _props$value$i;
+      var rangeRowData = (_props$value$i = props.value[i]) !== null && _props$value$i !== void 0 ? _props$value$i : props.tableProps.value[i];
       if (!isSelectable({
         data: rangeRowData,
         index: i
@@ -25960,7 +26034,7 @@ var TableBody = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     var event = e.originalEvent;
     var isDraggableHandle = isUnstyled() ? DomHandler.getAttribute(event.target, 'data-pc-section') === 'rowreordericon' || event.target.closest('[data-pc-section="rowreordericon"]') : DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle') || event.target.closest('.p-datatable-reorderablerow-handle');
     event.currentTarget.draggable = isDraggableHandle;
-    event.target.draggable = !isDraggableHandle;
+    event.target.draggable = isDraggableHandle;
     if (allowRowDrag(e)) {
       enableDragSelection(event);
       anchorRowIndex.current = e.index;
@@ -26572,6 +26646,7 @@ var TableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
   var getRowProps = function getRowProps(row) {
     return ColumnGroupBase.getCProps(row);
   };
+  var context = React__namespace.useContext(PrimeReactContext);
   var getColumnGroupProps = function getColumnGroupProps() {
     return props.footerColumnGroup ? ColumnGroupBase.getCProps(props.footerColumnGroup) : undefined;
   };
@@ -26629,7 +26704,7 @@ var TableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
       return rows.map(function (row, i) {
         var rootProps = mergeProps({
           role: 'row'
-        }, getRowPTOptions(row, 'root'));
+        }, RowBase.getProps(row.props, context), getRowPTOptions(row, 'root'));
         return /*#__PURE__*/React__namespace.createElement("tr", _extends({}, rootProps, {
           key: i
         }), createGroupFooterCells(row));
@@ -27820,7 +27895,7 @@ var HeaderCell = /*#__PURE__*/React__namespace.memo(function (props) {
     });
   };
   var _onKeyDown = function onKeyDown(event) {
-    if ((event.code == 'Enter' || event.code === 'NumpadEnter' || event.code == 'Space') && event.currentTarget === elementRef.current && DomHandler.getAttribute(event.currentTarget, 'data-p-sortable-column') === 'true') {
+    if ((event.code == 'Enter' || event.code === 'NumpadEnter' || event.code == 'Space') && event.target === elementRef.current && DomHandler.getAttribute(event.currentTarget, 'data-p-sortable-column') === true) {
       _onClick(event);
       event.preventDefault();
     }
@@ -28078,6 +28153,7 @@ var TableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
     ptm = _props$ptCallbacks.ptm,
     ptmo = _props$ptCallbacks.ptmo,
     cx = _props$ptCallbacks.cx;
+  var context = React__namespace.useContext(PrimeReactContext);
   var getColumnProp = function getColumnProp(column, name) {
     return ColumnBase.getCProp(column, name);
   };
@@ -28286,7 +28362,7 @@ var TableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       return rows.map(function (row, i) {
         var headerRowProps = mergeProps({
           role: 'row'
-        }, getRowPTOptions(row, 'root'));
+        }, RowBase.getProps(row.props, context), getRowPTOptions(row, 'root'));
         return /*#__PURE__*/React__namespace.createElement("tr", _extends({}, headerRowProps, {
           key: i
         }), createGroupHeaderCells(row));
@@ -31204,7 +31280,7 @@ var Editor = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.fo
       });
     }
   };
-  var initValue = React.useRef(props.value);
+  var initValue = React$1.useRef(props.value);
   initValue.current = props.value;
   var initQuill = function initQuill(quillInstance) {
     quill.current = quillInstance;
@@ -31724,7 +31800,6 @@ var UIMessage = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
   };
   var createCloseIcon = function createCloseIcon() {
     if (closable !== false) {
-      var ariaLabel = localeOption('close');
       var buttonIconProps = mergeProps({
         className: cx('uimessage.buttonicon')
       }, getPTOptions('buttonicon', parentParams), ptmo(pt, 'buttonicon', _objectSpread$14(_objectSpread$14({}, params), {}, {
@@ -31737,7 +31812,7 @@ var UIMessage = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
       var buttonProps = mergeProps({
         type: 'button',
         className: cx('uimessage.button'),
-        'aria-label': ariaLabel,
+        'aria-label': ariaLabel('close'),
         onClick: onClose
       }, getPTOptions('button', parentParams), ptmo(pt, 'button', _objectSpread$14(_objectSpread$14({}, params), {}, {
         hostName: props.hostName
@@ -31880,7 +31955,7 @@ var Messages = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.
   };
   var remove = function remove(messageInfo) {
     // allow removal by ID or by message equality
-    var removeMessage = messageInfo._pId ? messageInfo._pId : messageInfo.message || messageInfo;
+    var removeMessage = ObjectUtils.isNotEmpty(messageInfo._pId) ? messageInfo._pId : messageInfo.message || messageInfo;
     setMessagesState(function (prev) {
       return prev.filter(function (msg) {
         return msg._pId !== messageInfo._pId && !ObjectUtils.deepEquals(msg.message, removeMessage);
@@ -34107,9 +34182,9 @@ var IconFieldBase = ComponentBase.extend({
 function ownKeys$Z(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$Z(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$Z(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$Z(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var IconField = /*#__PURE__*/React__default["default"].memo(/*#__PURE__*/React__default["default"].forwardRef(function (inProps, ref) {
-  var elementRef = React.useRef(ref);
+  var elementRef = React$1.useRef(ref);
   var mergeProps = useMergeProps();
-  var context = React.useContext(PrimeReactContext);
+  var context = React$1.useContext(PrimeReactContext);
   var props = IconFieldBase.getProps(inProps, context);
   var _IconFieldBase$setMet = IconFieldBase.setMetaData(_objectSpread$Z(_objectSpread$Z({
       props: props
@@ -34127,8 +34202,8 @@ var IconField = /*#__PURE__*/React__default["default"].memo(/*#__PURE__*/React__
   }, IconFieldBase.getOtherProps(props), ptm('root'));
   return /*#__PURE__*/React__default["default"].createElement("div", _extends({}, rootProps, {
     ref: elementRef
-  }), React.Children.map(props.children, function (child, index) {
-    return /*#__PURE__*/React.cloneElement(child, {
+  }), React$1.Children.map(props.children, function (child, index) {
+    return /*#__PURE__*/React$1.cloneElement(child, {
       iconPosition: props.iconPosition
     });
   }));
@@ -35509,7 +35584,8 @@ var InputMask = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace
     type: props.type,
     name: props.name,
     style: props.style,
-    className: className
+    className: className,
+    value: props.value
   }, otherProps, {
     placeholder: props.placeholder,
     size: props.size,
@@ -35723,7 +35799,8 @@ var InputTextareaBase = ComponentBase.extend({
     tooltip: null,
     tooltipOptions: null,
     validateOnly: false,
-    children: undefined
+    children: undefined,
+    className: null
   },
   css: {
     classes: classes$D,
@@ -35798,7 +35875,7 @@ var InputTextarea = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
   };
   var resize = function resize(initial) {
     var inputEl = elementRef.current;
-    if (inputEl && DomHandler.isVisible(inputEl)) {
+    if (inputEl && isVisible()) {
       if (!cachedScrollHeight.current) {
         cachedScrollHeight.current = inputEl.scrollHeight;
         inputEl.style.overflow = 'hidden';
@@ -35816,6 +35893,13 @@ var InputTextarea = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
       }
     }
   };
+  var isVisible = function isVisible() {
+    if (DomHandler.isVisible(elementRef.current)) {
+      var rect = elementRef.current.getBoundingClientRect();
+      return rect.width > 0 && rect.height > 0;
+    }
+    return false;
+  };
   React__namespace.useEffect(function () {
     ObjectUtils.combinedRefs(elementRef, ref);
   }, [elementRef, ref]);
@@ -35823,6 +35907,7 @@ var InputTextarea = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__names
     if (props.autoResize) {
       resize(true);
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [props.autoResize]);
   var isFilled = React__namespace.useMemo(function () {
     return ObjectUtils.isNotEmpty(props.value) || ObjectUtils.isNotEmpty(props.defaultValue);
@@ -38991,6 +39076,7 @@ var Mention = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.f
     style: props.inputStyle
   }, inputProps), {}, {
     unstyled: props.unstyled,
+    autoResize: props.autoResize,
     onFocus: onFocus,
     onBlur: onBlur,
     onKeyDown: onKeyDown,
@@ -39026,21 +39112,26 @@ var classes$z = {
     });
   },
   menu: 'p-menu-list p-reset',
-  content: 'p-menuitem-content',
-  action: function action(_ref2) {
+  content: function content(_ref2) {
     var item = _ref2.item;
+    return classNames('p-menuitem-content', {
+      'p-disabled': item.disabled
+    });
+  },
+  action: function action(_ref3) {
+    var item = _ref3.item;
     return classNames('p-menuitem-link', {
       'p-disabled': item.disabled
     });
   },
-  menuitem: function menuitem(_ref3) {
-    var focused = _ref3.focused;
+  menuitem: function menuitem(_ref4) {
+    var focused = _ref4.focused;
     return classNames('p-menuitem', {
       'p-focus': focused
     });
   },
-  submenuHeader: function submenuHeader(_ref4) {
-    var submenu = _ref4.submenu;
+  submenuHeader: function submenuHeader(_ref5) {
+    var submenu = _ref5.submenu;
     return classNames('p-submenu-header', {
       'p-disabled': submenu.disabled
     });
@@ -39051,12 +39142,12 @@ var classes$z = {
   transition: 'p-connected-overlay'
 };
 var inlineStyles$b = {
-  submenuHeader: function submenuHeader(_ref5) {
-    var submenu = _ref5.submenu;
+  submenuHeader: function submenuHeader(_ref6) {
+    var submenu = _ref6.submenu;
     return submenu.style;
   },
-  menuitem: function menuitem(_ref6) {
-    var item = _ref6.item;
+  menuitem: function menuitem(_ref7) {
+    var item = _ref7.item;
     return item.style;
   }
 };
@@ -39424,7 +39515,9 @@ var Menu = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forw
       onMouseMove: function onMouseMove(event) {
         return onItemMouseMove(event, key);
       },
-      className: cx('content')
+      className: cx('content', {
+        item: item
+      })
     }, getMenuItemPTOptions('content', menuContext));
     var actionProps = mergeProps({
       href: item.url || '#',
@@ -41132,7 +41225,7 @@ var MultiSelectHeader = /*#__PURE__*/React__namespace.memo(function (props) {
   var closeButtonProps = mergeProps({
     type: 'button',
     className: cx('closeButton'),
-    'aria-label': localeOption('close'),
+    'aria-label': ariaLabel('close'),
     onClick: props.onClose
   }, getPTOptions('closeButton'));
   var closeElement = /*#__PURE__*/React__namespace.createElement("button", closeButtonProps, closeIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
@@ -41326,34 +41419,6 @@ var MultiSelectPanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
       props === null || props === void 0 || (_props$changeFocusedO = props.changeFocusedOptionIndex) === null || _props$changeFocusedO === void 0 || _props$changeFocusedO.call(props, event, index);
     }
   };
-  var createGroupChildren = function createGroupChildren(optionGroup, style) {
-    var groupChildren = props.getOptionGroupChildren(optionGroup);
-    return groupChildren.map(function (option, j) {
-      var optionLabel = props.getOptionLabel(option);
-      var optionKey = j + '_' + props.getOptionRenderKey(option);
-      var disabled = props.isOptionDisabled(option);
-      var selected = props.isSelected(option);
-      return /*#__PURE__*/React__namespace.createElement(MultiSelectItem, {
-        hostName: props.hostName,
-        index: j,
-        key: optionKey,
-        focusedOptionIndex: props.focusedOptionIndex,
-        label: optionLabel,
-        option: option,
-        style: style,
-        template: props.itemTemplate,
-        selected: selected,
-        onClick: props.onOptionSelect,
-        onMouseMove: changeFocusedItemOnHover,
-        disabled: disabled,
-        className: props.itemClassName,
-        checkboxIcon: props.checkboxIcon,
-        isUnstyled: isUnstyled,
-        ptm: ptm,
-        cx: cx
-      });
-    });
-  };
   var createEmptyFilter = function createEmptyFilter() {
     var emptyFilterMessage = ObjectUtils.getJSXElement(props.emptyFilterMessage, props) || localeOption('emptyFilterMessage');
     var emptyMessageProps = mergeProps({
@@ -41377,9 +41442,8 @@ var MultiSelectPanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
     var style = {
       height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
     };
-    if (props.optionGroupLabel) {
+    if (option.group && props.optionGroupLabel) {
       var groupContent = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : props.getOptionGroupLabel(option);
-      var groupChildrenContent = createGroupChildren(option, style);
       var key = index + '_' + props.getOptionGroupRenderKey(option);
       var itemGroupProps = mergeProps({
         className: cx('itemGroup'),
@@ -41387,11 +41451,9 @@ var MultiSelectPanel = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
           scrollerOptions: scrollerOptions
         })
       }, getPTOptions('itemGroup'));
-      return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
-        key: key
-      }, /*#__PURE__*/React__namespace.createElement("li", _extends({}, itemGroupProps, {
+      return /*#__PURE__*/React__namespace.createElement("li", _extends({
         key: key
-      }), groupContent), groupChildrenContent);
+      }, itemGroupProps), groupContent);
     }
     var optionLabel = props.getOptionLabel(option);
     var optionKey = index + '_' + props.getOptionRenderKey(option);
@@ -41587,8 +41649,9 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
   var firstHiddenFocusableElementOnOverlay = React__namespace.useRef(null);
   var lastHiddenFocusableElementOnOverlay = React__namespace.useRef(null);
   var inputRef = React__namespace.useRef(props.inputRef);
-  var labelRef = React__namespace.useRef(null);
+  var labelContainerRef = React__namespace.useRef(null);
   var overlayRef = React__namespace.useRef(null);
+  var labelRef = React__namespace.useRef(null);
   var hasFilter = filterState && filterState.trim().length > 0;
   var empty = ObjectUtils.isEmpty(props.value);
   var equalityKey = props.optionValue ? null : props.dataKey;
@@ -41894,29 +41957,12 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
       var value = null;
       if (event.checked) {
         value = [];
-        if (visibleOptions) {
-          var selectedOptions = visibleOptions.filter(function (option) {
-            return isOptionDisabled(option) && isSelected(option);
-          });
-          value = selectedOptions.map(function (option) {
-            return getOptionValue(option);
-          });
-        }
-      } else if (visibleOptions) {
-        var options = visibleOptions.filter(function (option) {
-          return !isOptionDisabled(option) || isSelected(option);
+      } else {
+        var validOptions = visibleOptions.filter(function (option) {
+          return isValidOption(option) && !isOptionDisabled(option);
         });
-        if (props.optionGroupLabel) {
-          value = [];
-          options.forEach(function (optionGroup) {
-            return value = [].concat(_toConsumableArray(value), _toConsumableArray(getOptionGroupChildren(optionGroup).filter(function (option) {
-              return !isOptionDisabled(option);
-            }).map(function (option) {
-              return getOptionValue(option);
-            })));
-          });
-        } else {
-          value = options.map(function (option) {
+        if (validOptions) {
+          value = validOptions.map(function (option) {
             return getOptionValue(option);
           });
         }
@@ -42020,7 +42066,7 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     props.onHide && props.onHide();
   };
   var alignOverlay = function alignOverlay() {
-    DomHandler.alignOverlay(overlayRef.current, labelRef.current.parentElement, props.appendTo || context && context.appendTo || PrimeReact.appendTo);
+    !props.inline && DomHandler.alignOverlay(overlayRef.current, labelContainerRef.current.parentElement, props.appendTo || context && context.appendTo || PrimeReact.appendTo);
   };
   var isClearClicked = function isClearClicked(event) {
     return DomHandler.getAttribute(event.target, 'data-pc-section') === 'clearicon';
@@ -42122,31 +42168,8 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
       return false;
     }
     var options = visibleOptions.filter(function (option) {
-      return !isOptionDisabled(option);
+      return !isOptionDisabled(option) && isValidOption(option);
     });
-    if (props.optionGroupLabel) {
-      var areAllSelected = true;
-      var _iterator2 = _createForOfIteratorHelper$7(options),
-        _step2;
-      try {
-        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-          var optionGroup = _step2.value;
-          var visibleOptionsGroupChildren = getOptionGroupChildren(optionGroup).filter(function (option) {
-            return !isOptionDisabled(option);
-          });
-          if (visibleOptionsGroupChildren.some(function (option) {
-            return !isSelected(option);
-          }) === true) {
-            areAllSelected = false;
-          }
-        }
-      } catch (err) {
-        _iterator2.e(err);
-      } finally {
-        _iterator2.f();
-      }
-      return areAllSelected;
-    }
     return !options.some(function (option) {
       return !isSelected(option);
     });
@@ -42196,7 +42219,7 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     return !props.useOptionAsValue && props.optionValue || option && option.value !== undefined;
   };
   var isOptionGroup = function isOptionGroup(option) {
-    return props.optionGroupLabel && option.optionGroup && option.group;
+    return props.optionGroupLabel && option.group;
   };
   var hasSelectedOption = function hasSelectedOption() {
     return ObjectUtils.isNotEmpty(props.value);
@@ -42307,6 +42330,7 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
   };
   var removeChip = function removeChip(event, item) {
     event.stopPropagation();
+    if (!isVisible(event.currentTarget)) return;
     var value = props.value.filter(function (val) {
       return !ObjectUtils.equals(val, item, equalityKey);
     });
@@ -42318,6 +42342,17 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     }
     updateModel(event, value, item);
   };
+  var isVisible = function isVisible(element) {
+    var parentElement = labelRef.current;
+    var isOverflow = parentElement.clientWidth < parentElement.scrollWidth;
+    if (!isOverflow) return true;
+    var target = element.closest('[data-pc-section="token"]');
+    var parentStyles = window.getComputedStyle(parentElement);
+    var targetStyles = window.getComputedStyle(target);
+    var parentWidth = parentElement.clientWidth - parseFloat(parentStyles.paddingLeft) - parseFloat(parentStyles.paddingRight);
+    var targetRight = target.getBoundingClientRect().right + parseFloat(targetStyles.marginRight) - parentElement.getBoundingClientRect().left;
+    return targetRight <= parentWidth;
+  };
   var getSelectedItemsLabel = function getSelectedItemsLabel() {
     var pattern = /{(.*?)}/;
     var selectedItemsLabel = props.selectedItemsLabel || localeOption('selectionMessage');
@@ -42368,10 +42403,15 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
         var label = getLabelByValue(val);
         var labelKey = label + '_' + i;
         var iconProps = mergeProps({
+          'aria-label': localeOption('removeTokenIcon'),
           className: cx('removeTokenIcon'),
           onClick: function onClick(e) {
             return removeChip(e, val);
-          }
+          },
+          onKeyDown: function onKeyDown(e) {
+            return onRemoveTokenIconKeyDown(e, val);
+          },
+          tabIndex: props.tabIndex || '0'
         }, ptm('removeTokenIcon', context));
         var icon = !props.disabled && (props.removeIcon ? IconUtils.getJSXIcon(props.removeIcon, _objectSpread$J({}, iconProps), {
           props: props
@@ -42390,31 +42430,73 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
     return getLabel();
   };
   var getVisibleOptions = function getVisibleOptions() {
+    var options = props.optionGroupLabel ? flatOptions(props.options) : props.options;
     if (hasFilter) {
       var filterValue = filterState.trim().toLocaleLowerCase(props.filterLocale);
       var searchFields = props.filterBy ? props.filterBy.split(',') : [props.optionLabel || 'label'];
       if (props.optionGroupLabel) {
         var filteredGroups = [];
-        var _iterator3 = _createForOfIteratorHelper$7(props.options),
-          _step3;
+        var _iterator2 = _createForOfIteratorHelper$7(props.options),
+          _step2;
         try {
-          for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
-            var optgroup = _step3.value;
+          for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+            var optgroup = _step2.value;
             var filteredSubOptions = FilterService.filter(getOptionGroupChildren(optgroup), searchFields, filterValue, props.filterMatchMode, props.filterLocale);
             if (filteredSubOptions && filteredSubOptions.length) {
               filteredGroups.push(_objectSpread$J(_objectSpread$J({}, optgroup), _defineProperty({}, props.optionGroupChildren, filteredSubOptions)));
             }
           }
         } catch (err) {
-          _iterator3.e(err);
+          _iterator2.e(err);
         } finally {
-          _iterator3.f();
+          _iterator2.f();
         }
-        return filteredGroups;
+        return flatOptions(filteredGroups);
       }
-      return FilterService.filter(props.options, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
+      return FilterService.filter(options, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
+    }
+    return options;
+  };
+  var flatOptions = function flatOptions(options) {
+    return (options || []).reduce(function (result, option, index) {
+      result.push(_objectSpread$J(_objectSpread$J({}, option), {}, {
+        group: true,
+        index: index
+      }));
+      var optionGroupChildren = getOptionGroupChildren(option);
+      optionGroupChildren && optionGroupChildren.forEach(function (o) {
+        return result.push(o);
+      });
+      return result;
+    }, []);
+  };
+  var onClearIconKeyDown = function onClearIconKeyDown(event) {
+    event.preventDefault();
+    event.stopPropagation();
+    switch (event.code) {
+      case 'Space':
+      case 'NumpadEnter':
+      case 'Enter':
+        if (props.inline) {
+          break;
+        }
+        updateModel(event, [], []);
+        break;
+    }
+  };
+  var onRemoveTokenIconKeyDown = function onRemoveTokenIconKeyDown(event, val) {
+    event.preventDefault();
+    event.stopPropagation();
+    switch (event.code) {
+      case 'Space':
+      case 'NumpadEnter':
+      case 'Enter':
+        if (props.inline) {
+          break;
+        }
+        removeChip(event, val);
+        break;
     }
-    return props.options;
   };
   React__namespace.useImperativeHandle(ref, function () {
     return {
@@ -42460,9 +42542,14 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
   var createClearIcon = function createClearIcon() {
     var clearIconProps = mergeProps({
       className: cx('clearIcon'),
+      'aria-label': localeOption('clear'),
       onClick: function onClick(e) {
         return updateModel(e, [], []);
-      }
+      },
+      onKeyDown: function onKeyDown(e) {
+        return onClearIconKeyDown(e);
+      },
+      tabIndex: props.tabIndex || '0'
     }, ptm('clearIcon'));
     var icon = props.clearIcon || /*#__PURE__*/React__namespace.createElement(TimesIcon, clearIconProps);
     var clearIcon = IconUtils.getJSXIcon(icon, _objectSpread$J({}, clearIconProps), {
@@ -42476,10 +42563,11 @@ var MultiSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespa
   var createLabel = function createLabel() {
     var content = getLabelContent();
     var labelContainerProps = mergeProps({
-      ref: labelRef,
+      ref: labelContainerRef,
       className: cx('labelContainer')
     }, ptm('labelContainer'));
     var labelProps = mergeProps({
+      ref: labelRef,
       className: cx('label', {
         empty: empty
       })
@@ -42811,7 +42899,7 @@ var MultiStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__
     icon: icon
   }, ariaProps), ptm('checkbox'));
   var srOnlyAriaProps = mergeProps({
-    className: 'p-sr-only p-hidden-accessible',
+    className: 'p-hidden-accessible',
     'aria-live': 'polite'
   }, ptm('srOnlyAria'));
   return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", rootProps, /*#__PURE__*/React__namespace.createElement(Checkbox, checkboxProps), focusedState && /*#__PURE__*/React__namespace.createElement("span", srOnlyAriaProps, ariaValueLabel)), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
@@ -43920,12 +44008,8 @@ var OrganizationChartNode = /*#__PURE__*/React__namespace.memo(function (props)
         },
         href: '#'
       }, getPTOptions('nodeToggler'));
-      return (
-        /*#__PURE__*/
-        /* eslint-disable */
-        React__namespace.createElement("a", nodeTogglerProps, /*#__PURE__*/React__namespace.createElement("i", null, " ", togglerIcon, " "))
-        /* eslint-enable */
-      );
+      return /*#__PURE__*/ /* eslint-disable */React__namespace.createElement("a", nodeTogglerProps, /*#__PURE__*/React__namespace.createElement("i", null, " ", togglerIcon, " "))
+      /* eslint-enable */;
     }
     return null;
   };
@@ -44312,14 +44396,13 @@ var OverlayPanel = /*#__PURE__*/React__namespace.forwardRef(function (inProps, r
     var closeIcon = IconUtils.getJSXIcon(icon, _objectSpread$F({}, closeIconProps), {
       props: props
     });
-    var ariaLabel = props.ariaCloseLabel || localeOption('close');
     var closeButtonProps = mergeProps({
       type: 'button',
       className: cx('closeButton'),
       onClick: function onClick(e) {
         return onCloseClick(e);
       },
-      'aria-label': ariaLabel
+      'aria-label': props.ariaCloseLabel || ariaLabel('close')
     }, ptm('closeButton'));
     if (props.showCloseIcon) {
       return /*#__PURE__*/React__namespace.createElement("button", closeButtonProps, closeIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
@@ -45748,9 +45831,9 @@ var InputIconBase = ComponentBase.extend({
 function ownKeys$B(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$B(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$B(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$B(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var InputIcon = /*#__PURE__*/React__default["default"].memo(/*#__PURE__*/React__default["default"].forwardRef(function (inProps, ref) {
-  var elementRef = React.useRef(ref);
+  var elementRef = React$1.useRef(ref);
   var mergeProps = useMergeProps();
-  var context = React.useContext(PrimeReactContext);
+  var context = React$1.useContext(PrimeReactContext);
   var props = InputIconBase.getProps(inProps, context);
   var _InputIconBase$setMet = InputIconBase.setMetaData(_objectSpread$B(_objectSpread$B({
       props: props
@@ -48051,6 +48134,7 @@ var ScrollPanel = /*#__PURE__*/React__namespace.forwardRef(function (inProps, re
     }
   };
   var moveBar = function moveBar() {
+    if (!contentRef.current) return;
     // horizontal scroll
     var totalWidth = contentRef.current.scrollWidth;
     var ownWidth = contentRef.current.clientWidth;
@@ -48950,7 +49034,7 @@ var Sidebar = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
       getElement: function getElement() {
         return sidebarRef.current;
       },
-      gteMask: function gteMask() {
+      getMask: function getMask() {
         return maskRef.current;
       },
       getCloseIcon: function getCloseIcon() {
@@ -48991,7 +49075,6 @@ var Sidebar = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
     maskRef.current && ZIndexUtils.clear(maskRef.current);
   });
   var createCloseIcon = function createCloseIcon() {
-    var ariaLabel = props.ariaCloseLabel || localeOption('close');
     var closeButtonProps = mergeProps({
       type: 'button',
       ref: closeIconRef,
@@ -48999,7 +49082,7 @@ var Sidebar = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
       onClick: function onClick(e) {
         return onClose(e);
       },
-      'aria-label': ariaLabel
+      'aria-label': props.ariaCloseLabel || ariaLabel('close')
     }, ptm('closeButton'));
     var closeIconProps = mergeProps({
       className: cx('closeIcon')
@@ -54266,6 +54349,17 @@ var TabView = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
       }
     };
   });
+  var onCloseIconKeyDown = function onCloseIconKeyDown(event, index) {
+    event.preventDefault();
+    event.stopPropagation();
+    switch (event.code) {
+      case 'Space':
+      case 'NumpadEnter':
+      case 'Enter':
+        onTabHeaderClose(event, index);
+        break;
+    }
+  };
   var createTabHeader = function createTabHeader(tab, index) {
     var selected = isSelected(index);
     var _TabPanelBase$getCPro = TabPanelBase.getCProps(tab),
@@ -54297,7 +54391,12 @@ var TabView = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
       className: cx('tab.closeIcon'),
       onClick: function onClick(e) {
         return onTabHeaderClose(e, index);
-      }
+      },
+      onKeyDown: function onKeyDown(e) {
+        return onCloseIconKeyDown(e, index);
+      },
+      tabIndex: 0,
+      'aria-label': ariaLabel('close') || 'Close'
     }, getTabPT(tab, 'closeIcon', index));
     var icon = closeIcon || /*#__PURE__*/React__namespace.createElement(TimesIcon, closeIconProps);
     var closableIconElement = closable ? IconUtils.getJSXIcon(icon, _objectSpread$e({}, closeIconProps), {
@@ -55010,12 +55109,11 @@ var ToastMessage = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namesp
     var closeIcon = IconUtils.getJSXIcon(icon, _objectSpread$c({}, buttonIconProps), {
       props: props
     });
-    var ariaLabel = props.ariaCloseLabel || localeOption('close');
     var closeButtonProps = mergeProps({
       type: 'button',
       className: cx('message.closeButton'),
       onClick: onClose,
-      'aria-label': ariaLabel
+      'aria-label': props.ariaCloseLabel || ariaLabel('close')
     }, getPTOptions('closeButton', parentParams), ptmo(pt, 'closeButton', _objectSpread$c(_objectSpread$c({}, params), {}, {
       hostName: props.hostName
     })));
@@ -55168,7 +55266,7 @@ var Toast = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.for
   };
   var remove = function remove(messageInfo) {
     // allow removal by ID or by message equality
-    var removeMessage = messageInfo._pId ? messageInfo._pId : messageInfo.message || messageInfo;
+    var removeMessage = ObjectUtils.isNotEmpty(messageInfo._pId) ? messageInfo._pId : messageInfo.message || messageInfo;
     setMessagesState(function (prev) {
       return prev.filter(function (msg) {
         return msg._pId !== messageInfo._pId && !ObjectUtils.deepEquals(msg.message, removeMessage);
@@ -55325,7 +55423,7 @@ var ToggleButton = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namesp
   });
   var hasLabel = props.onLabel && props.onLabel.length > 0 && props.offLabel && props.offLabel.length > 0;
   var hasIcon = props.onIcon && props.offIcon;
-  var label = hasLabel ? props.checked ? props.onLabel : props.offLabel : '&nbsp;';
+  var label = hasLabel ? props.checked ? props.onLabel : props.offLabel : "\xA0";
   var icon = props.checked ? props.onIcon : props.offIcon;
   var toggle = function toggle(e) {
     if (!props.disabled && props.onChange && !props.readonly) {
@@ -56272,7 +56370,7 @@ var UITreeNode = /*#__PURE__*/React__namespace.memo(function (props) {
       type: 'button',
       className: cx('toggler'),
       tabIndex: -1,
-      'aria-hidden': true,
+      'aria-hidden': false,
       onClick: onTogglerClick
     }, getPTOptions('toggler'));
     var content = /*#__PURE__*/React__namespace.createElement("button", togglerProps, togglerIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
@@ -57530,7 +57628,8 @@ var TreeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespac
     }
   };
   var setFocusToFocusableFirstNode = function setFocusToFocusableFirstNode() {
-    var treeNodeEl = DomHandler.find(treeRef.current.getElement(), '[data-pc-section="node"]');
+    var _treeRef$current;
+    var treeNodeEl = DomHandler.find((_treeRef$current = treeRef.current) === null || _treeRef$current === void 0 ? void 0 : _treeRef$current.getElement(), '[data-pc-section="node"]');
     var focusedElement = _toConsumableArray(treeNodeEl).find(function (item) {
       return item.getAttribute('tabindex') === '0';
     });
@@ -57837,7 +57936,7 @@ var TreeSelect = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespac
         return onHeaderElementKeyDown(event, true);
       },
       onClick: hide,
-      'aria-label': localeOption('close')
+      'aria-label': ariaLabel('close')
     }, ptm('closeButton'));
     var headerProps = mergeProps({
       className: cx('header')
@@ -57950,6 +58049,7 @@ var classes$1 = {
   loadingWrapper: 'p-treetable-loading',
   loadingOverlay: 'p-treetable-loading-overlay p-component-overlay',
   header: 'p-treetable-header',
+  checkIcon: 'p-checkbox-icon',
   footer: 'p-treetable-footer',
   resizeHelper: 'p-column-resizer-helper',
   reorderIndicatorUp: 'p-treetable-reorder-indicator-up',
@@ -58125,7 +58225,8 @@ var TreeTableBase = ComponentBase.extend({
     tableStyle: null,
     totalRecords: null,
     value: null,
-    children: undefined
+    children: undefined,
+    togglerTemplate: null
   },
   css: {
     classes: classes$1,
@@ -58384,8 +58485,6 @@ function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymb
 function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
   var elementRef = React__namespace.useRef(null);
-  React__namespace.useRef(null);
-  React__namespace.useRef(null);
   var nodeTouched = React__namespace.useRef(false);
   var mergeProps = useMergeProps();
   var expanded = props.expandedKeys ? props.expandedKeys[props.node.key] !== undefined : false;
@@ -58775,10 +58874,13 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
     }
   };
   var isSelected = function isSelected() {
-    if (props.selectionMode === 'single' || props.selectionMode === 'multiple' && props.selectionKeys) {
-      return props.selectionMode === 'single' ? props.selectionKeys === props.node.key : props.selectionKeys[props.node.key] !== undefined;
+    if (props.selectionMode === 'single') {
+      return props.selectionKeys === props.node.key;
+    } else if ((props.selectionMode === 'multiple' || props.selectionMode === 'checkbox') && props.selectionKeys) {
+      return props.selectionKeys[props.node.key] !== undefined;
+    } else {
+      return false;
     }
-    return false;
   };
   var isChecked = function isChecked() {
     return props.selectionKeys ? props.selectionKeys[props.node.key] && props.selectionKeys[props.node.key].checked : false;
@@ -58831,7 +58933,10 @@ var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
     if (props.selectionMode === 'checkbox' && props.node.selectable !== false) {
       var checked = isChecked();
       var partialChecked = isPartialChecked();
-      var icon = checked ? props.checkboxIcon || /*#__PURE__*/React__namespace.createElement(CheckIcon, null) : partialChecked ? props.checkboxIcon || /*#__PURE__*/React__namespace.createElement(MinusIcon, null) : null;
+      var checkboxIconProps = mergeProps({
+        className: cx('checkIcon')
+      }, getColumnPTOptions('rowCheckbox.icon'));
+      var icon = checked ? props.checkboxIcon || /*#__PURE__*/React__namespace.createElement(CheckIcon, checkboxIconProps) : partialChecked ? props.checkboxIcon || /*#__PURE__*/React__namespace.createElement(MinusIcon, null) : null;
       var checkIcon = IconUtils.getJSXIcon(icon, {}, {
         props: props,
         checked: checked,
@@ -59208,6 +59313,7 @@ var TreeTableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
     ptm = _props$ptCallbacks.ptm,
     ptmo = _props$ptCallbacks.ptmo,
     cx = _props$ptCallbacks.cx;
+  var context = React__namespace.useContext(PrimeReactContext);
   var getColumnProp = function getColumnProp(column, name) {
     return ColumnBase.getCProp(column, name);
   };
@@ -59244,7 +59350,7 @@ var TreeTableFooter = /*#__PURE__*/React__namespace.memo(function (props) {
     var footerRowProps = mergeProps(ptm('footerRow', {
       hostName: props.hostName,
       role: 'row'
-    }));
+    }), RowBase.getProps(row.props, context));
     return /*#__PURE__*/React__namespace.createElement("tr", _extends({}, footerRowProps, {
       key: index
     }), rowFooterCells);
@@ -59294,6 +59400,7 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
     ptmo = _props$ptCallbacks.ptmo,
     cx = _props$ptCallbacks.cx;
   var filterTimeout = React__namespace.useRef(null);
+  var context = React__namespace.useContext(PrimeReactContext);
   var getColumnProp = function getColumnProp(column) {
     return column ? typeof (arguments.length <= 1 ? undefined : arguments[1]) === 'string' ? ColumnBase.getCProp(column, arguments.length <= 1 ? undefined : arguments[1]) : ColumnBase.getCProp((arguments.length <= 1 ? undefined : arguments[1]) || column, arguments.length <= 2 ? undefined : arguments[2]) : null;
   };
@@ -59567,6 +59674,7 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
       style: getColumnProp(column, 'headerStyle') || getColumnProp(column, 'style'),
       tabIndex: sortable ? props.tabIndex : null,
       'aria-sort': ariaSort,
+      //TODO: aria-sort is defined here two times (ariaSort, ariaSortData) ?
       onClick: function onClick(e) {
         return onHeaderClick(e, column);
       },
@@ -59619,7 +59727,7 @@ var TreeTableHeader = /*#__PURE__*/React__namespace.memo(function (props) {
     });
     var headerRowProps = mergeProps(ptm('headerRow', {
       hostName: props.hostName
-    }));
+    }), RowBase.getProps(row.props, context));
     return /*#__PURE__*/React__namespace.createElement("tr", _extends({
       role: "row"
     }, headerRowProps, {
@@ -60284,29 +60392,31 @@ var TreeTable = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref)
     });
   };
   var onFilter = function onFilter(event) {
-    var filters = getFilters();
-    var newFilters = filters ? _objectSpread$1({}, filters) : {};
-    if (!isFilterBlank(event.value)) {
-      newFilters[event.field] = {
-        value: event.value,
-        matchMode: event.matchMode
-      };
-    } else if (newFilters[event.field]) {
-      delete newFilters[event.field];
-    }
-    if (props.onFilter) {
-      props.onFilter({
-        filters: newFilters
-      });
-    } else {
-      setFirstState(0);
-      setFiltersState(newFilters);
-    }
-    if (props.onValueChange) {
-      props.onValueChange(processedData({
-        filters: filters
-      }));
-    }
+    setFiltersState(function (prevFilters) {
+      var filters = props.onFilter ? props.filters : prevFilters;
+      var newFilters = filters ? _objectSpread$1({}, filters) : {};
+      if (!isFilterBlank(event.value)) {
+        newFilters[event.field] = {
+          value: event.value,
+          matchMode: event.matchMode
+        };
+      } else if (newFilters[event.field]) {
+        delete newFilters[event.field];
+      }
+      if (props.onFilter) {
+        props.onFilter({
+          filters: newFilters
+        });
+      } else {
+        setFirstState(0);
+      }
+      if (props.onValueChange) {
+        props.onValueChange(processedData({
+          filters: newFilters
+        }));
+      }
+      return newFilters;
+    });
   };
   var cloneFilters = function cloneFilters(filters) {
     filters = filters || props.filters;
@@ -61196,7 +61306,7 @@ var TriStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
   var mergeProps = useMergeProps();
   var context = React__namespace.useContext(PrimeReactContext);
   var props = TriStateCheckboxBase.getProps(inProps, context);
-  var _useState = React.useState(''),
+  var _useState = React$1.useState(''),
     _useState2 = _slicedToArray(_useState, 2),
     checkBoxValue = _useState2[0],
     setCheckBoxValue = _useState2[1];
@@ -61210,7 +61320,7 @@ var TriStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
   useHandleStyle(TriStateCheckboxBase.css.styles, isUnstyled, {
     name: 'tristatecheckbox'
   });
-  React.useEffect(function () {
+  React$1.useEffect(function () {
     if ([true, false, ''].includes(props.value)) {
       setCheckBoxValue(props.value);
     } else {
@@ -61307,7 +61417,7 @@ var TriStateCheckbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__na
     'aria-checked': ariaChecked
   }, ariaProps), ptm('box'));
   var srOnlyAriaProps = mergeProps({
-    className: 'p-sr-only p-hidden-accessible',
+    className: 'p-hidden-accessible',
     'aria-live': 'polite'
   }, ptm('srOnlyAria'));
   var rootProps = mergeProps({