primereact 10.6.6 → 10.7.0

package/primereact.all.esm.js

@@ -218,7 +218,7 @@ var DomHandler = /*#__PURE__*/function () {
   function DomHandler() {
     _classCallCheck(this, DomHandler);
   }
-  _createClass(DomHandler, null, [{
+  return _createClass(DomHandler, null, [{
     key: "innerWidth",
     value: function innerWidth(el) {
       if (el) {
@@ -1448,7 +1448,6 @@ var DomHandler = /*#__PURE__*/function () {
       return false;
     }
   }]);
-  return DomHandler;
 }();
 /**
  * All data- properties like data-test-id
@@ -1491,7 +1490,7 @@ var ObjectUtils = /*#__PURE__*/function () {
   function ObjectUtils() {
     _classCallCheck(this, ObjectUtils);
   }
-  _createClass(ObjectUtils, null, [{
+  return _createClass(ObjectUtils, null, [{
     key: "equals",
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') {
@@ -2013,7 +2012,6 @@ var ObjectUtils = /*#__PURE__*/function () {
       }
     }
   }]);
-  return ObjectUtils;
 }();
 
 function ownKeys$1$(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -2022,7 +2020,7 @@ var IconUtils = /*#__PURE__*/function () {
   function IconUtils() {
     _classCallCheck(this, IconUtils);
   }
-  _createClass(IconUtils, null, [{
+  return _createClass(IconUtils, null, [{
     key: "getJSXIcon",
     value: function getJSXIcon(icon) {
       var iconProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
@@ -2045,7 +2043,6 @@ var IconUtils = /*#__PURE__*/function () {
       return content;
     }
   }]);
-  return IconUtils;
 }();
 
 function ownKeys$1_(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -3848,7 +3845,8 @@ var ESC_KEY_HANDLING_PRIORITIES = {
   PASSWORD: 700,
   CASCADE_SELECT: 800,
   SPLIT_BUTTON: 900,
-  SPEED_DIAL: 1000
+  SPEED_DIAL: 1000,
+  TOOLTIP: 1200
 };
 
 /**
@@ -5018,32 +5016,26 @@ var CSSTransition = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     props.onEnter && props.onEnter(node, isAppearing); // component
     props.options && props.options.onEnter && props.options.onEnter(node, isAppearing); // user option
   };
-
   var onEntering = function onEntering(node, isAppearing) {
     props.onEntering && props.onEntering(node, isAppearing); // component
     props.options && props.options.onEntering && props.options.onEntering(node, isAppearing); // user option
   };
-
   var onEntered = function onEntered(node, isAppearing) {
     props.onEntered && props.onEntered(node, isAppearing); // component
     props.options && props.options.onEntered && props.options.onEntered(node, isAppearing); // user option
   };
-
   var onExit = function onExit(node) {
     props.onExit && props.onExit(node); // component
     props.options && props.options.onExit && props.options.onExit(node); // user option
   };
-
   var onExiting = function onExiting(node) {
     props.onExiting && props.onExiting(node); // component
     props.options && props.options.onExiting && props.options.onExiting(node); // user option
   };
-
   var onExited = function onExited(node) {
     props.onExited && props.onExited(node); // component
     props.options && props.options.onExited && props.options.onExited(node); // user option
   };
-
   useUpdateEffect(function () {
     if (disabled) {
       // no animation
@@ -5794,6 +5786,7 @@ var TooltipBase = ComponentBase.extend({
     autoZIndex: true,
     baseZIndex: 0,
     className: null,
+    closeOnEscape: false,
     content: null,
     disabled: false,
     event: null,
@@ -5864,6 +5857,13 @@ var Tooltip = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
   useHandleStyle(TooltipBase.css.styles, isUnstyled, {
     name: 'tooltip'
   });
+  useGlobalOnEscapeKey({
+    callback: function callback() {
+      hide();
+    },
+    when: props.closeOnEscape,
+    priority: [ESC_KEY_HANDLING_PRIORITIES.TOOLTIP, 0]
+  });
   var elementRef = React.useRef(null);
   var textRef = React.useRef(null);
   var currentTargetRef = React.useRef(null);
@@ -6261,7 +6261,8 @@ var Tooltip = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
     };
   }, [visibleState]);
   useUpdateEffect(function () {
-    if (visibleState) {
+    var position = getPosition(currentTargetRef.current);
+    if (visibleState && position !== 'mouse') {
       applyDelay('updateDelay', function () {
         updateText(currentTargetRef.current, function () {
           align(currentTargetRef.current);
@@ -6484,6 +6485,7 @@ var Button = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (in
   var rootProps = mergeProps({
     ref: elementRef,
     'aria-label': defaultAriaLabel,
+    'data-pc-autofocus': props.autoFocus,
     className: classNames(props.className, cx('root', {
       size: size,
       disabled: disabled
@@ -9810,24 +9812,33 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     newViewDate.setDate(1);
     if (currentView === 'date') {
       if (newViewDate.getMonth() === 0) {
+        var newYear = decrementYear();
         newViewDate.setMonth(11);
-        newViewDate.setFullYear(decrementYear());
+        newViewDate.setFullYear(newYear);
+        props.onMonthChange && props.onMonthChange({
+          month: 11,
+          year: newYear
+        });
         setCurrentMonth(11);
       } else {
         newViewDate.setMonth(newViewDate.getMonth() - 1);
+        props.onMonthChange && props.onMonthChange({
+          month: currentMonth - 1,
+          year: currentYear
+        });
         setCurrentMonth(function (prevState) {
           return prevState - 1;
         });
       }
     } else if (currentView === 'month') {
-      var newYear = newViewDate.getFullYear() - 1;
+      var _newYear = newViewDate.getFullYear() - 1;
       if (props.yearNavigator) {
         var minYear = parseInt(props.yearRange.split(':')[0], 10);
-        if (newYear < minYear) {
-          newYear = minYear;
+        if (_newYear < minYear) {
+          _newYear = minYear;
         }
       }
-      newViewDate.setFullYear(newYear);
+      newViewDate.setFullYear(_newYear);
     }
     if (currentView === 'month') {
       newViewDate.setFullYear(decrementYear());
@@ -9846,24 +9857,33 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     newViewDate.setDate(1);
     if (currentView === 'date') {
       if (newViewDate.getMonth() === 11) {
+        var newYear = incrementYear();
         newViewDate.setMonth(0);
-        newViewDate.setFullYear(incrementYear());
+        newViewDate.setFullYear(newYear);
+        props.onMonthChange && props.onMonthChange({
+          month: 0,
+          year: newYear
+        });
         setCurrentMonth(0);
       } else {
         newViewDate.setMonth(newViewDate.getMonth() + 1);
+        props.onMonthChange && props.onMonthChange({
+          month: currentMonth + 1,
+          year: currentYear
+        });
         setCurrentMonth(function (prevState) {
           return prevState + 1;
         });
       }
     } else if (currentView === 'month') {
-      var newYear = newViewDate.getFullYear() + 1;
+      var _newYear2 = newViewDate.getFullYear() + 1;
       if (props.yearNavigator) {
         var maxYear = parseInt(props.yearRange.split(':')[1], 10);
-        if (newYear > maxYear) {
-          newYear = maxYear;
+        if (_newYear2 > maxYear) {
+          _newYear2 = maxYear;
         }
       }
-      newViewDate.setFullYear(newYear);
+      newViewDate.setFullYear(_newYear2);
     }
     if (currentView === 'month') {
       newViewDate.setFullYear(incrementYear());
@@ -9901,6 +9921,7 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   var onMonthDropdownChange = function onMonthDropdownChange(event, value) {
     var currentViewDate = getViewDate();
     var newViewDate = cloneDate(currentViewDate);
+    newViewDate.setDate(1);
     newViewDate.setMonth(parseInt(value, 10));
     updateViewDate(event, newViewDate);
   };
@@ -10860,6 +10881,9 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     }
   };
   var onDateSelect = function onDateSelect(event, dateMeta, timeMeta) {
+    if (!event) {
+      return;
+    }
     if (props.disabled || !dateMeta.selectable) {
       event.preventDefault();
       return;
@@ -11484,28 +11508,44 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     return props.value != null && typeof props.value !== 'string';
   };
   var isMonthSelected = function isMonthSelected(month) {
-    if (isComparable()) {
-      var value = isRangeSelection() ? props.value[0] : props.value;
-      if (isMultipleSelection()) {
-        return value.some(function (currentValue) {
-          return currentValue.getMonth() === month && currentValue.getFullYear() === currentYear;
-        });
+    if (!isComparable()) return false;
+    if (isMultipleSelection()) {
+      return props.value.some(function (v) {
+        return v.getMonth() === month && v.getFullYear() === currentYear;
+      });
+    } else if (isRangeSelection()) {
+      var _props$value = _slicedToArray(props.value, 2),
+        start = _props$value[0],
+        end = _props$value[1];
+      var startYear = start ? start.getFullYear() : null;
+      var endYear = end ? end.getFullYear() : null;
+      var startMonth = start ? start.getMonth() : null;
+      var endMonth = end ? end.getMonth() : null;
+      if (!end) {
+        return startYear === currentYear && startMonth === month;
+      } else {
+        var currentDate = new Date(currentYear, month, 1);
+        var startDate = new Date(startYear, startMonth, 1);
+        var endDate = new Date(endYear, endMonth, 1);
+        return currentDate >= startDate && currentDate <= endDate;
       }
-      return value.getMonth() === month && value.getFullYear() === currentYear;
+    } else {
+      return props.value.getMonth() === month && props.value.getFullYear() === currentYear;
     }
-    return false;
   };
   var isYearSelected = function isYearSelected(year) {
-    if (isComparable()) {
-      var value = isRangeSelection() ? props.value[0] : props.value;
-      if (isMultipleSelection()) {
-        return value.some(function (currentValue) {
-          return currentValue.getFullYear() === year;
-        });
-      }
-      return value.getFullYear() === year;
+    if (!isComparable()) return false;
+    if (isMultipleSelection()) {
+      return props.value.some(function (v) {
+        return v.getFullYear() === year;
+      });
+    } else if (isRangeSelection()) {
+      var start = props.value[0] ? props.value[0].getFullYear() : null;
+      var end = props.value[1] ? props.value[1].getFullYear() : null;
+      return start === year || end === year || start < year && end > year;
+    } else {
+      return props.value.getFullYear() === year;
     }
-    return false;
   };
   var switchViewButtonDisabled = function switchViewButtonDisabled() {
     return props.numberOfMonths > 1 || props.disabled;
@@ -11998,7 +12038,6 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     if (date.getFullYear() !== year || date.getMonth() + 1 !== month || date.getDate() !== day) {
       throw new Error('Invalid date'); // E.g. 31/02/00
     }
-
     return date;
   };
   var isInMinYear = function isInMinYear(viewDate) {
@@ -12101,26 +12140,25 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
       isTypingRef.current = false;
 
       // #3516 view date not updated when value set programatically
-      if (!visible && newDate) {
-        var viewDate = newDate;
-        if (isMultipleSelection()) {
-          if (newDate.length) {
-            viewDate = newDate[newDate.length - 1];
-          }
-        } else if (isRangeSelection()) {
-          if (newDate.length) {
-            var startDate = newDate[0];
-            var endDate = newDate[1];
-            viewDate = endDate || startDate;
-          }
+      if (!newDate) return;
+      var viewDate = newDate;
+      if (isMultipleSelection()) {
+        if (newDate.length) {
+          viewDate = newDate[newDate.length - 1];
         }
-        if (viewDate instanceof Date) {
-          validateDate(viewDate);
-          setViewDateState(viewDate);
-          setCurrentMonth(viewDate.getMonth());
-          setCurrentYear(viewDate.getFullYear());
+      } else if (isRangeSelection()) {
+        if (newDate.length) {
+          var startDate = newDate[0];
+          var endDate = newDate[1];
+          viewDate = endDate || startDate;
         }
       }
+      if (viewDate instanceof Date) {
+        validateDate(viewDate);
+        setViewDateState(viewDate);
+        setCurrentMonth(viewDate.getMonth());
+        setCurrentYear(viewDate.getFullYear());
+      }
     }
   }, [props.value, visible]);
   useUpdateEffect(function () {
@@ -14912,8 +14950,15 @@ var Checkbox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   var mergeProps = useMergeProps();
   var context = React.useContext(PrimeReactContext);
   var props = CheckboxBase.getProps(inProps, context);
+  var _React$useState = React.useState(false),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    focusedState = _React$useState2[0],
+    setFocusedState = _React$useState2[1];
   var _CheckboxBase$setMeta = CheckboxBase.setMetaData({
       props: props,
+      state: {
+        focused: focusedState
+      },
       context: {
         checked: props.checked === props.trueValue,
         disabled: props.disabled
@@ -14967,10 +15012,12 @@ var Checkbox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   };
   var _onFocus = function onFocus() {
     var _props$onFocus;
+    setFocusedState(true);
     props === null || props === void 0 || (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props);
   };
   var _onBlur = function onBlur() {
     var _props$onBlur;
+    setFocusedState(false);
     props === null || props === void 0 || (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props);
   };
   React.useImperativeHandle(ref, function () {
@@ -15803,9 +15850,18 @@ var ColorPicker = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
     ptm = _ColorPickerBase$setM.ptm,
     cx = _ColorPickerBase$setM.cx,
     isUnstyled = _ColorPickerBase$setM.isUnstyled;
+  var isCloseOnEscape = overlayVisibleState && props.closeOnEscape;
+  var overlayDisplayOrder = useDisplayOrder('overlay-panel', isCloseOnEscape);
   useHandleStyle(ColorPickerBase.css.styles, isUnstyled, {
     name: 'colorpicker'
   });
+  useGlobalOnEscapeKey({
+    callback: function callback() {
+      hide();
+    },
+    when: overlayVisibleState && overlayDisplayOrder,
+    priority: [ESC_KEY_HANDLING_PRIORITIES.OVERLAY_PANEL, overlayDisplayOrder]
+  });
   var elementRef = React.useRef(null);
   var overlayRef = React.useRef(null);
   var inputRef = React.useRef(props.inputRef);
@@ -15873,12 +15929,17 @@ var ColorPicker = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
     pickHue(event);
     !isUnstyled && DomHandler.addClass(elementRef.current, 'p-colorpicker-dragging');
   };
+  var getPositionY = function getPositionY(event) {
+    if (event.pageY !== undefined) return event.pageY;else if (event.changedTouches !== undefined) return event.changedTouches[0].pageY;else return 0;
+  };
   var pickHue = function pickHue(event) {
-    var top = hueViewRef.current.getBoundingClientRect().top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
+    var top = hueViewRef.current.getBoundingClientRect().top + (window.scrollY || document.documentElement.scrollTop || document.body.scrollTop || 0);
+    var yPos = getPositionY(event);
+    var hue = Math.floor(360 * (150 - Math.max(0, Math.min(150, yPos - top))) / 150);
     hsbValue.current = validateHSB({
-      h: Math.floor(360 * (150 - Math.max(0, Math.min(150, (event.pageY || event.changedTouches[0].pageY) - top))) / 150),
-      s: 100,
-      b: 100
+      h: hue,
+      s: hsbValue.current.s,
+      b: hsbValue.current.b
     });
     updateColorSelector();
     updateHue();
@@ -16401,6 +16462,15 @@ var FocusTrap = /*#__PURE__*/React__default.memo( /*#__PURE__*/React__default.fo
   var getTarget = function getTarget() {
     return firstFocusableElementRef.current && firstFocusableElementRef.current.parentElement;
   };
+
+  /**
+   * This method sets the auto focus on the first focusable element within the target element.
+   * It first tries to find a focusable element using the autoFocusSelector. If no such element is found,
+   * it then tries to find a focusable element using the firstFocusableSelector.
+   * If the autoFocus prop is set to true and a focusable element is found, it sets the focus on that element.
+   *
+   * @param {HTMLElement} target - The target element within which to find a focusable element.
+   */
   var setAutoFocus = function setAutoFocus(target) {
     var _ref = props || {},
       _ref$autoFocusSelecto = _ref.autoFocusSelector,
@@ -16409,7 +16479,9 @@ var FocusTrap = /*#__PURE__*/React__default.memo( /*#__PURE__*/React__default.fo
       firstFocusableSelector = _ref$firstFocusableSe === void 0 ? '' : _ref$firstFocusableSe,
       _ref$autoFocus = _ref.autoFocus,
       autoFocus = _ref$autoFocus === void 0 ? false : _ref$autoFocus;
-    var focusableElement = DomHandler.getFirstFocusableElement(target, "[autofocus]".concat(getComputedSelector(autoFocusSelector)));
+    var defaultAutoFocusSelector = "".concat(getComputedSelector(autoFocusSelector));
+    var computedAutoFocusSelector = "[autofocus]".concat(defaultAutoFocusSelector, ", [data-pc-autofocus='true']").concat(defaultAutoFocusSelector);
+    var focusableElement = DomHandler.getFirstFocusableElement(target, computedAutoFocusSelector);
     autoFocus && !focusableElement && (focusableElement = DomHandler.getFirstFocusableElement(target, getComputedSelector(firstFocusableSelector)));
     DomHandler.focus(focusableElement);
   };
@@ -17083,7 +17155,9 @@ var Dialog = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
         'aria-label': ariaLabel,
         onClick: onClose,
         onKeyDown: function onKeyDown(ev) {
-          return ev.stopPropagation();
+          if (ev.key !== 'Escape') {
+            ev.stopPropagation();
+          }
         }
       }, ptm('closeButton'));
       return /*#__PURE__*/React.createElement("button", closeButtonProps, headerCloseIcon, /*#__PURE__*/React.createElement(Ripple, null));
@@ -19271,6 +19345,19 @@ var DataScroller = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functi
 }));
 DataScroller.displayName = 'DataScroller';
 
+var getStorage = function getStorage(stateStorageProp) {
+  switch (stateStorageProp) {
+    case 'local':
+      return window.localStorage;
+    case 'session':
+      return window.sessionStorage;
+    case 'custom':
+      return null;
+    default:
+      throw new Error(stateStorageProp + ' is not a valid value for the state storage, supported values are "local", "session" and "custom".');
+  }
+};
+
 var ColumnBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'Column',
@@ -19857,14 +19944,15 @@ var InputNumber = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
   var vertical = props.showButtons && props.buttonLayout === 'vertical';
   var inputMode = props.inputMode || (props.mode === 'decimal' && !props.minFractionDigits ? 'numeric' : 'decimal');
   var getOptions = function getOptions() {
+    var _props$minFractionDig, _props$maxFractionDig;
     return {
       localeMatcher: props.localeMatcher,
       style: props.mode,
       currency: props.currency,
       currencyDisplay: props.currencyDisplay,
       useGrouping: props.useGrouping,
-      minimumFractionDigits: props.minFractionDigits,
-      maximumFractionDigits: props.maxFractionDigits,
+      minimumFractionDigits: (_props$minFractionDig = props.minFractionDigits) !== null && _props$minFractionDig !== void 0 ? _props$minFractionDig : undefined,
+      maximumFractionDigits: (_props$maxFractionDig = props.maxFractionDigits) !== null && _props$maxFractionDig !== void 0 ? _props$maxFractionDig : undefined,
       roundingMode: props.roundingMode
     };
   };
@@ -20282,7 +20370,7 @@ var InputNumber = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
         if (_char2) {
           var _isDecimalSign = isDecimalSign(_char2);
           var _isMinusSign = isMinusSign(_char2);
-          if (event.code && (event.code.startsWith('Digit') || event.code.startsWith('Numpad')) && Number(_char2) >= 0 && Number(_char2) <= 9 || _isMinusSign || _isDecimalSign) {
+          if (Number(_char2) >= 0 && Number(_char2) <= 9 || _isMinusSign || _isDecimalSign) {
             insert(event, _char2, {
               isDecimalSign: _isDecimalSign,
               isMinusSign: _isMinusSign
@@ -21966,10 +22054,9 @@ var Dropdown = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   };
   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();
   };
@@ -22252,8 +22339,9 @@ var Dropdown = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     }
   };
   var onEditableInputChange = function onEditableInputChange(event) {
+    !overlayVisibleState && show();
     var searchIndex = null;
-    if (event.target.value) {
+    if (event.target.value && visibleOptions) {
       searchIndex = visibleOptions.findIndex(function (item) {
         return getOptionLabel(item).toLocaleLowerCase().startsWith(event.target.value.toLocaleLowerCase());
       });
@@ -22459,10 +22547,12 @@ var Dropdown = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     }
   };
   var getOptionLabel = function getOptionLabel(option) {
-    return props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : ObjectUtils.resolveFieldData(option, 'label') || option;
+    var optionLabel = props.optionLabel ? ObjectUtils.resolveFieldData(option, props.optionLabel) : ObjectUtils.resolveFieldData(option, 'label');
+    return ObjectUtils.isNotEmpty(optionLabel) ? optionLabel : option;
   };
   var getOptionValue = function getOptionValue(option) {
-    return props.optionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : ObjectUtils.resolveFieldData(option, 'value') || option;
+    var optionValue = props.OptionValue ? ObjectUtils.resolveFieldData(option, props.optionValue) : ObjectUtils.resolveFieldData(option, 'value');
+    return ObjectUtils.isNotEmpty(optionValue) ? optionValue : option;
   };
   var getOptionRenderKey = function getOptionRenderKey(option) {
     return props.dataKey ? ObjectUtils.resolveFieldData(option, props.dataKey) : getOptionLabel(option);
@@ -22635,7 +22725,7 @@ var Dropdown = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
       }, ariaProps), ptm('input'));
       return /*#__PURE__*/React.createElement("input", _inputProps);
     }
-    var content = props.valueTemplate ? ObjectUtils.getJSXElement(props.valueTemplate, selectedOption, props) : label || props.placeholder || 'empty';
+    var content = props.valueTemplate ? ObjectUtils.getJSXElement(props.valueTemplate, selectedOption, props) : label || props.placeholder || props.emptyMessage || /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0");
     var inputProps = mergeProps({
       ref: inputRef,
       className: cx('input', {
@@ -23605,9 +23695,9 @@ var classes$S = {
       'p-variant-filled': props.variant ? props.variant === 'filled' : context && context.inputStyle === 'filled'
     });
   },
-  box: 'p-radiobutton-box',
-  input: 'p-radiobutton-input',
-  icon: 'p-radiobutton-icon'
+  radiobuttonbox: 'p-radiobutton-box',
+  radiobuttoninput: 'p-radiobutton-input',
+  radiobuttonicon: 'p-radiobutton-icon'
 };
 var RadioButtonBase = ComponentBase.extend({
   defaultProps: {
@@ -23746,7 +23836,10 @@ var RadioButton = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
     })),
     style: props.style,
     'data-p-checked': props.checked
-  }, RadioButtonBase.getOtherProps(props), ptm('root'));
+  }, otherProps, ptm('root'));
+  delete rootProps.input;
+  delete rootProps.box;
+  delete rootProps.icon;
   var createInputElement = function createInputElement() {
     var ariaProps = ObjectUtils.reduceKeys(otherProps, DomHandler.ARIA_PROPS);
     var inputProps = mergeProps(_objectSpread$1h({
@@ -23761,19 +23854,19 @@ var RadioButton = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
       readOnly: props.readonly,
       required: props.required,
       tabIndex: props.tabIndex,
-      className: cx('input')
-    }, ariaProps), ptm('input'));
+      className: cx('radiobuttoninput')
+    }, ariaProps), inProps.input, ptm('radiobuttoninput'));
     return /*#__PURE__*/React.createElement("input", _extends({
       ref: inputRef
     }, inputProps));
   };
   var createBoxElement = function createBoxElement() {
     var boxProps = mergeProps({
-      className: cx('box')
-    }, ptm('box'));
+      className: cx('radiobuttonbox')
+    }, inProps.box, ptm('radiobuttonbox'));
     var iconProps = mergeProps({
-      className: cx('icon')
-    }, ptm('icon'));
+      className: cx('radiobuttonicon')
+    }, inProps.icon, ptm('radiobuttonicon'));
     return /*#__PURE__*/React.createElement("div", boxProps, /*#__PURE__*/React.createElement("div", iconProps));
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", _extends({
@@ -23821,7 +23914,11 @@ var RowRadioButton = /*#__PURE__*/React.memo(function (props) {
     checked: props.checked,
     disabled: props.disabled,
     name: "".concat(props.tableSelector, "_dt_radio"),
-    onChange: onChange
+    onChange: onChange,
+    input: getColumnPTOptions('radiobuttoninput'),
+    box: getColumnPTOptions('radiobuttonbox'),
+    icon: getColumnPTOptions('radiobuttonicon'),
+    unstyled: props.unstyled
   }, getColumnPTOptions('radiobutton'));
   return /*#__PURE__*/React.createElement(RadioButton, radioButtonProps);
 });
@@ -23847,7 +23944,6 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
   var keyHelperRef = React.useRef(null);
   var overlayEventListener = React.useRef(null);
   var selfClick = React.useRef(false);
-  var tabindexTimeout = React.useRef(null);
   var initFocusTimeout = React.useRef(null);
   var editingRowDataStateRef = React.useRef(null);
   var _props$ptCallbacks = props.ptCallbacks,
@@ -23884,7 +23980,7 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
   var field = getColumnProp('field') || "field_".concat(props.index);
   var editingKey = props.dataKey ? props.rowData && props.rowData[props.dataKey] || props.rowIndex : props.rowIndex;
   var isEditable = function isEditable() {
-    return getColumnProp('editor');
+    return ObjectUtils.isNotEmpty(props.editMode) && getColumnProp('editor');
   };
   var cellEditValidateOnClose = function cellEditValidateOnClose() {
     return getColumnProp('cellEditValidateOnClose');
@@ -24028,14 +24124,11 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
     }
   };
   var focusOnElement = function focusOnElement() {
-    clearTimeout(tabindexTimeout.current);
-    tabindexTimeout.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);
+    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);
   };
   var focusOnInit = function focusOnInit() {
     clearTimeout(initFocusTimeout.current);
@@ -24077,6 +24170,7 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
     if (currentData) {
       ObjectUtils.mutateFieldData(currentData, field, val);
     }
+    editingRowDataStateRef.current = editingRowData;
   };
   var _onClick = function onClick(event) {
     var params = getCellCallbackParams(event);
@@ -24269,14 +24363,11 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
   }, [props.editMode, props.editing, editingState]);
   useUpdateEffect(function () {
     if (props.editMode === 'cell' || props.editMode === 'row') {
-      setEditingRowDataState(getEditingRowData());
+      var editingRowData = getEditingRowData();
+      setEditingRowDataState(editingRowData);
+      editingRowDataStateRef.current = editingRowData;
     }
   }, [props.editingMeta]);
-  React.useEffect(function () {
-    if (editingRowDataState) {
-      editingRowDataStateRef.current = editingRowDataState;
-    }
-  }, [editingRowDataState]);
   React.useEffect(function () {
     if (props.editMode === 'cell' || props.editMode === 'row') {
       var callbackParams = getCellCallbackParams();
@@ -24351,7 +24442,7 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
       if (showSelection) {
         var ariaLabelField = props.selectionAriaLabel || props.tableProps.dataKey;
         var ariaLabelText = ObjectUtils.resolveFieldData(props.rowData, ariaLabelField);
-        label = "".concat(props.selected ? ariaLabel('unselectLabel') : ariaLabel('selectLabel'), " ").concat(ariaLabelText);
+        label = "".concat(props.selected ? ariaLabel('unselectRow') : ariaLabel('selectRow'), " ").concat(ariaLabelText);
       }
       content = showSelection && /*#__PURE__*/React.createElement(React.Fragment, null, selectionMode === 'single' && /*#__PURE__*/React.createElement(RowRadioButton, {
         hostName: props.hostName,
@@ -24366,7 +24457,8 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
         tableSelector: props.tableSelector,
         ariaLabel: label,
         ptCallbacks: props.ptCallbacks,
-        metaData: props.metaData
+        metaData: props.metaData,
+        unstyled: props.unstyled
       }), selectionMode === 'multiple' && /*#__PURE__*/React.createElement(RowCheckbox, {
         hostName: props.hostName,
         column: props.column,
@@ -24380,7 +24472,8 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
         ariaLabel: label,
         checkIcon: props.checkIcon,
         ptCallbacks: props.ptCallbacks,
-        metaData: props.metaData
+        metaData: props.metaData,
+        unstyled: props.unstyled
       }));
     } else if (rowReorder) {
       var showReorder = props.showRowReorderElement ? props.showRowReorderElement(props.rowData, {
@@ -24543,7 +24636,6 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
       }, editorKeyHelperProps), /*#__PURE__*/React.createElement("span", editorKeyHelperLabelProps));
       /* eslint-enable */
     }
-
     var bodyCellProps = mergeProps({
       style: style,
       className: classNames(bodyClassName, getColumnProp('className'), cellClassName, cx('bodyCell', {
@@ -25027,7 +25119,8 @@ var BodyRow = /*#__PURE__*/React.memo(function (props) {
           value: props.value,
           virtualScrollerOptions: props.virtualScrollerOptions,
           ptCallbacks: props.ptCallbacks,
-          metaData: props.metaData
+          metaData: props.metaData,
+          unstyled: props.unstyled
         });
       }
       return null;
@@ -25106,7 +25199,6 @@ var BodyRow = /*#__PURE__*/React.memo(function (props) {
   }, getBodyRowPTOptions('bodyRow'), {
     className: classNames(rowClassName) // #5983 must be last so all unstyled merging takes place first
   });
-
   return /*#__PURE__*/React.createElement("tr", rowProps, content);
 });
 BodyRow.displayName = 'BodyRow';
@@ -25814,7 +25906,6 @@ var TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       event.dataTransfer.setData('text', 'b'); // For firefox
     }
   };
-
   var onRowDragOver = function onRowDragOver(e) {
     var event = e.originalEvent,
       index = e.index;
@@ -26036,7 +26127,8 @@ var TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
         expandedRowIcon: props.expandedRowIcon,
         collapsedRowIcon: props.collapsedRowIcon,
         ptCallbacks: props.ptCallbacks,
-        metaData: props.metaData
+        metaData: props.metaData,
+        unstyled: props.unstyled
       });
       var options = {
         index: rowIndex,
@@ -26141,7 +26233,8 @@ var TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
         value: props.value,
         virtualScrollerOptions: props.virtualScrollerOptions,
         ptCallbacks: props.ptCallbacks,
-        metaData: props.metaData
+        metaData: props.metaData,
+        unstyled: props.unstyled
       });
     }
   };
@@ -27651,7 +27744,7 @@ var HeaderCell = /*#__PURE__*/React.memo(function (props) {
       column: props.column
     });
   };
-  var onResizerMouseDown = function onResizerMouseDown(event) {
+  var onResizeStart = function onResizeStart(event) {
     props.onColumnResizeStart({
       originalEvent: event,
       column: props.column
@@ -27688,7 +27781,10 @@ var HeaderCell = /*#__PURE__*/React.memo(function (props) {
       var columnResizerProps = mergeProps({
         className: cx('columnResizer'),
         onMouseDown: function onMouseDown(e) {
-          return onResizerMouseDown(e);
+          return onResizeStart(e);
+        },
+        onTouchStart: function onTouchStart(e) {
+          return onResizeStart(e);
         },
         onClick: function onClick(e) {
           return onResizerClick(e);
@@ -27748,7 +27844,8 @@ var HeaderCell = /*#__PURE__*/React.memo(function (props) {
         onChange: props.onColumnCheckboxChange,
         disabled: props.empty,
         ptCallbacks: ptCallbacks,
-        metaData: parentMetaData
+        metaData: parentMetaData,
+        unstyled: props.unstyled
       });
     }
     return null;
@@ -28106,19 +28203,6 @@ var TableHeader = /*#__PURE__*/React.memo(function (props) {
 });
 TableHeader.displayName = 'TableHeader';
 
-var getStorage = function getStorage(stateStorageProp) {
-  switch (stateStorageProp) {
-    case 'local':
-      return window.localStorage;
-    case 'session':
-      return window.sessionStorage;
-    case 'custom':
-      return null;
-    default:
-      throw new Error(stateStorageProp + ' is not a valid value for the state storage, supported values are "local", "session" and "custom".');
-  }
-};
-
 function _createForOfIteratorHelper$b(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$b(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 function _unsupportedIterableToArray$b(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$b(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$b(o, minLen); }
 function _arrayLikeToArray$b(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
@@ -28227,29 +28311,40 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     setRowsState(props.rows);
     setD_rowsState(props.rows);
   }
+  var columnResizeStartListener = function columnResizeStartListener(event) {
+    return columnResizing.current && onColumnResize(event);
+  };
+  var columnResizeEndListener = function columnResizeEndListener() {
+    return columnResizing.current && (columnResizing.current = false, onColumnResizeEnd());
+  };
   var _useEventListener = useEventListener({
       type: 'mousemove',
-      listener: function listener(event) {
-        if (columnResizing.current) {
-          onColumnResize(event);
-        }
-      }
+      listener: columnResizeStartListener
     }),
     _useEventListener2 = _slicedToArray(_useEventListener, 2),
     bindDocumentMouseMoveListener = _useEventListener2[0],
     unbindDocumentMouseMoveListener = _useEventListener2[1];
   var _useEventListener3 = useEventListener({
       type: 'mouseup',
-      listener: function listener() {
-        if (columnResizing.current) {
-          columnResizing.current = false;
-          onColumnResizeEnd();
-        }
-      }
+      listener: columnResizeEndListener
     }),
     _useEventListener4 = _slicedToArray(_useEventListener3, 2),
     bindDocumentMouseUpListener = _useEventListener4[0],
     unbindDocumentMouseUpListener = _useEventListener4[1];
+  var _useEventListener5 = useEventListener({
+      type: 'touchmove',
+      listener: columnResizeStartListener
+    }),
+    _useEventListener6 = _slicedToArray(_useEventListener5, 2),
+    bindDocumentTouchMoveListener = _useEventListener6[0],
+    unbindDocumentTouchMoveListener = _useEventListener6[1];
+  var _useEventListener7 = useEventListener({
+      type: 'touchend',
+      listener: columnResizeEndListener
+    }),
+    _useEventListener8 = _slicedToArray(_useEventListener7, 2),
+    bindDocumentTouchEndListener = _useEventListener8[0],
+    unbindDocumentTouchEndListener = _useEventListener8[1];
   var isCustomStateStorage = function isCustomStateStorage() {
     return props.stateStorage === 'custom';
   };
@@ -28585,7 +28680,7 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     resizeColumn.current = column;
     resizeColumnElement.current = event.currentTarget.parentElement;
     columnResizing.current = true;
-    lastResizeHelperX.current = event.pageX - containerLeft + elementRef.current.scrollLeft;
+    lastResizeHelperX.current = (event.type === 'touchstart' ? event.changedTouches[0].clientX : event.pageX) - containerLeft + elementRef.current.scrollLeft;
     bindColumnResizeEvents();
   };
   var onColumnResize = function onColumnResize(event) {
@@ -28593,7 +28688,7 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     elementRef.current.setAttribute('data-p-unselectable-text', true);
     resizeHelperRef.current.style.height = elementRef.current.offsetHeight + 'px';
     resizeHelperRef.current.style.top = 0 + 'px';
-    resizeHelperRef.current.style.left = event.pageX - containerLeft + elementRef.current.scrollLeft + 'px';
+    resizeHelperRef.current.style.left = (event.type === 'touchmove' ? event.changedTouches[0].clientX : event.pageX) - containerLeft + elementRef.current.scrollLeft + 'px';
     resizeHelperRef.current.style.display = 'block';
   };
   var onColumnResizeEnd = function onColumnResizeEnd() {
@@ -28664,10 +28759,14 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
   var bindColumnResizeEvents = function bindColumnResizeEvents() {
     bindDocumentMouseMoveListener();
     bindDocumentMouseUpListener();
+    bindDocumentTouchMoveListener();
+    bindDocumentTouchEndListener();
   };
   var unbindColumnResizeEvents = function unbindColumnResizeEvents() {
     unbindDocumentMouseMoveListener();
     unbindDocumentMouseUpListener();
+    unbindDocumentTouchMoveListener();
+    unbindDocumentTouchEndListener();
   };
   var onColumnHeaderMouseDown = function onColumnHeaderMouseDown(e) {
     DomHandler.clearSelection();
@@ -28733,7 +28832,6 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     draggedColumnElement.current = findParentHeader(event.currentTarget);
     event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
   };
-
   var onColumnHeaderDragOver = function onColumnHeaderDragOver(e) {
     var event = e.originalEvent,
       column = e.column;
@@ -29498,7 +29596,8 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
         className: ptCallbacks.cx('loadingIcon')
       }, ptCallbacks.ptm('loadingIcon'));
       var icon = props.loadingIcon || /*#__PURE__*/React.createElement(SpinnerIcon, _extends({}, loadingIconProps, {
-        spin: true
+        spin: true,
+        unstyled: props.unstyled
       }));
       var loadingIcon = IconUtils.getJSXIcon(icon, _objectSpread$17({}, loadingIconProps), {
         props: props
@@ -29665,7 +29764,8 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
       value: props.frozenValue,
       virtualScrollerOptions: options,
       ptCallbacks: ptCallbacks,
-      metaData: metaData
+      metaData: metaData,
+      unstyled: props.unstyled
     });
     var body = /*#__PURE__*/React.createElement(TableBody, {
       hostName: "DataTable",
@@ -29748,7 +29848,8 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
       virtualScrollerContentRef: contentRef,
       virtualScrollerOptions: options,
       ptCallbacks: ptCallbacks,
-      metaData: metaData
+      metaData: metaData,
+      unstyled: props.unstyled
     });
     var spacerBody = ObjectUtils.isNotEmpty(spacerStyle) ? /*#__PURE__*/React.createElement(TableBody, {
       hostName: "DataTable",
@@ -29757,7 +29858,8 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
       },
       className: "p-datatable-virtualscroller-spacer",
       ptCallbacks: ptCallbacks,
-      metaData: metaData
+      metaData: metaData,
+      unstyled: props.unstyled
     }) : null;
     return /*#__PURE__*/React.createElement(React.Fragment, null, frozenBody, body, spacerBody);
   };
@@ -29769,7 +29871,8 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
       columns: columns,
       footerColumnGroup: props.footerColumnGroup,
       ptCallbacks: ptCallbacks,
-      metaData: metaData
+      metaData: metaData,
+      unstyled: props.unstyled
     });
   };
   var createContent = function createContent(processedData, columns, selectionModeInColumn, empty) {
@@ -29804,6 +29907,7 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
         parent: metaData
       },
       showSpacer: false,
+      unstyled: props.unstyled,
       contentTemplate: function contentTemplate(options) {
         var ref = function ref(el) {
           tableRef.current = el;
@@ -36766,7 +36870,24 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
   var getOptionGroupChildren = function getOptionGroupChildren(optionGroup) {
     return ObjectUtils.resolveFieldData(optionGroup, props.optionGroupChildren);
   };
+  var flatOptions = function flatOptions(options) {
+    return (options || []).reduce(function (result, option, index) {
+      result.push({
+        optionGroup: option,
+        group: true,
+        index: index,
+        code: option.code,
+        label: option.label
+      });
+      var optionGroupChildren = getOptionGroupChildren(option);
+      optionGroupChildren && optionGroupChildren.forEach(function (o) {
+        return result.push(o);
+      });
+      return result;
+    }, []);
+  };
   var getVisibleOptions = function getVisibleOptions() {
+    var options = props.optionGroupLabel ? flatOptions(props.options) : props.options;
     if (hasFilter) {
       var filterValue = filteredValue.trim().toLocaleLowerCase(props.filterLocale);
       var searchFields = props.filterBy ? props.filterBy.split(',') : [props.optionLabel || 'label'];
@@ -36789,11 +36910,11 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
         } finally {
           _iterator.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 props.options;
+    return options;
   };
   var scrollToSelectedIndex = function scrollToSelectedIndex() {
     if (virtualScrollerRef.current) {
@@ -36838,42 +36959,13 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
       metaData: metaData
     }) : null;
   };
-  var createGroupChildren = function createGroupChildren(optionGroup, style) {
-    var groupChildren = getOptionGroupChildren(optionGroup);
-    return groupChildren.map(function (option, j) {
-      var optionLabel = getOptionLabel(option);
-      var optionKey = j + '_' + getOptionRenderKey(option);
-      var disabled = isOptionDisabled(option);
-      return /*#__PURE__*/React.createElement(ListBoxItem, {
-        id: id.current + '_' + j,
-        hostName: "ListBox",
-        optionKey: optionKey,
-        key: optionKey,
-        label: optionLabel,
-        option: option,
-        style: style,
-        template: props.itemTemplate,
-        selected: isSelected(option),
-        onOptionMouseDown: onOptionMouseDown,
-        onOptionMouseMove: onOptionMouseMove,
-        onClick: onOptionSelect,
-        index: j,
-        focusedOptionIndex: focusedOptionIndex,
-        onTouchEnd: onOptionTouchEnd,
-        disabled: disabled,
-        ptCallbacks: ptCallbacks,
-        metaData: metaData
-      });
-    });
-  };
   var createItem = function createItem(option, index) {
     var scrollerOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
     var style = {
       height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
     };
-    if (props.optionGroupLabel) {
+    if (option.group && option.optionGroup && props.optionGroupLabel) {
       var groupContent = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : getOptionGroupLabel(option);
-      var groupChildrenContent = createGroupChildren(option, style);
       var key = index + '_' + getOptionGroupRenderKey(option);
       var itemGroupProps = mergeProps({
         className: ptCallbacks.cx('itemGroup'),
@@ -36882,9 +36974,9 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
         }),
         role: 'group'
       }, ptCallbacks.ptm('itemGroup'));
-      return /*#__PURE__*/React.createElement(React.Fragment, {
+      return /*#__PURE__*/React.createElement("li", _extends({
         key: key
-      }, /*#__PURE__*/React.createElement("li", itemGroupProps, groupContent), groupChildrenContent);
+      }, itemGroupProps), groupContent);
     }
     var optionLabel = getOptionLabel(option);
     var optionKey = index + '_' + getOptionRenderKey(option);
@@ -40497,10 +40589,10 @@ var MeterGroup = function MeterGroup(inProps) {
     name: 'metergroup'
   });
   var totalPercent = 0;
-  var precentages = [];
+  var percentages = [];
   values.map(function (item) {
     totalPercent = totalPercent + item.value;
-    precentages.push(Math.round(item.value / totalPercent * 100));
+    percentages.push(Math.round(item.value / totalPercent * 100));
   });
   var calculatePercentage = function calculatePercentage() {
     var meterValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
@@ -40574,7 +40666,7 @@ var MeterGroup = function MeterGroup(inProps) {
   };
   var templateProps = {
     totalPercent: totalPercent,
-    precentages: precentages,
+    percentages: percentages,
     values: values
   };
   var labelListContent = labelList || createLabelList();
@@ -43666,7 +43758,6 @@ var OrganizationChartNode = /*#__PURE__*/React.memo(function (props) {
         /* eslint-enable */
       );
     }
-
     return null;
   };
   var createNodeLabel = function createNodeLabel() {
@@ -50688,7 +50779,6 @@ var TieredMenuSub = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(funct
       'aria-disabled': disabled,
       'aria-expanded': grouped ? active : undefined,
       'aria-haspopup': grouped && !url ? 'menu' : undefined,
-      'aria-level': props.level + 1,
       'aria-setsize': getAriaSetSize(),
       'aria-posinset': getAriaPosInset(index),
       'data-p-highlight': active,
@@ -53967,7 +54057,6 @@ var TabView = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     React.createElement("a", headerActionProps, leftIconElement, titleElement, rightIconElement, closableIconElement, /*#__PURE__*/React.createElement(Ripple, null))
     // eslint-enable /
     ;
-
     if (headerTemplate) {
       var defaultContentOptions = {
         className: 'p-tabview-nav-link',
@@ -55778,18 +55867,18 @@ var UITreeNode = /*#__PURE__*/React.memo(function (props) {
     }
   };
   var onDropPointDragOver = function onDropPointDragOver(event) {
-    if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
+    if (props.dragdropScope && event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
       event.dataTransfer.dropEffect = 'move';
       event.preventDefault();
     }
   };
   var onDropPointDragEnter = function onDropPointDragEnter(event) {
-    if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
+    if (props.dragdropScope && event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
       DomHandler.addClass(event.target, 'p-treenode-droppoint-active');
     }
   };
   var onDropPointDragLeave = function onDropPointDragLeave(event) {
-    if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
+    if (props.dragdropScope && event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase()) {
       DomHandler.removeClass(event.target, 'p-treenode-droppoint-active');
     }
   };
@@ -55808,19 +55897,19 @@ var UITreeNode = /*#__PURE__*/React.memo(function (props) {
     }
   };
   var onDragOver = function onDragOver(event) {
-    if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
+    if (props.dragdropScope && event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
       event.dataTransfer.dropEffect = 'move';
       event.preventDefault();
       event.stopPropagation();
     }
   };
   var onDragEnter = function onDragEnter(event) {
-    if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
+    if (props.dragdropScope && event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
       DomHandler.addClass(contentRef.current, 'p-treenode-dragover');
     }
   };
   var onDragLeave = function onDragLeave(event) {
-    if (event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
+    if (props.dragdropScope && event.dataTransfer.types[1] === props.dragdropScope.toLocaleLowerCase() && props.node.droppable !== false) {
       var rect = event.currentTarget.getBoundingClientRect();
       if (event.nativeEvent.x > rect.left + rect.width || event.nativeEvent.x < rect.left || event.nativeEvent.y >= Math.floor(rect.top + rect.height) || event.nativeEvent.y < rect.top) {
         DomHandler.removeClass(contentRef.current, 'p-treenode-dragover');
@@ -57000,7 +57089,6 @@ var TreeSelect = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
         event.preventDefault();
         focusInputRef.current && DomHandler.focus(focusInputRef.current);
         break;
-      case 'Space':
       case 'Enter':
       case 'NumpadEnter':
         event.preventDefault();
@@ -58599,7 +58687,6 @@ var TreeTableRow = /*#__PURE__*/React.memo(function (props) {
   }, getRowPTOptions('row'), {
     className: classNames(rowClassName, props.node.className) // #5983 must be last so all unstyled merging takes place first
   });
-
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("tr", _extends({
     ref: elementRef
   }, rowProps), cells), children);
@@ -60123,7 +60210,6 @@ var TreeTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     draggedColumn.current = column;
     event.dataTransfer.setData('text', 'b'); // Firefox requires this to make dragging possible
   };
-
   var onColumnDragOver = function onColumnDragOver(e) {
     var event = e.originalEvent,
       column = e.column;