primereact 10.6.5 → 10.7.0

package/core/core.js

@@ -196,7 +196,7 @@ this.primereact.utils = (function (exports, React) {
     function DomHandler() {
       _classCallCheck(this, DomHandler);
     }
-    _createClass(DomHandler, null, [{
+    return _createClass(DomHandler, null, [{
       key: "innerWidth",
       value: function innerWidth(el) {
         if (el) {
@@ -1426,7 +1426,6 @@ this.primereact.utils = (function (exports, React) {
         return false;
       }
     }]);
-    return DomHandler;
   }();
   /**
    * All data- properties like data-test-id
@@ -1484,7 +1483,7 @@ this.primereact.utils = (function (exports, React) {
     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') {
@@ -2006,7 +2005,6 @@ this.primereact.utils = (function (exports, React) {
         }
       }
     }]);
-    return ObjectUtils;
   }();
 
   function ownKeys$2(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; }
@@ -2015,7 +2013,7 @@ this.primereact.utils = (function (exports, React) {
     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] : {};
@@ -2038,7 +2036,6 @@ this.primereact.utils = (function (exports, React) {
         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; }
@@ -4497,7 +4494,8 @@ this.primereact.hooks = (function (exports, React, utils, PrimeReact) {
     PASSWORD: 700,
     CASCADE_SELECT: 800,
     SPLIT_BUTTON: 900,
-    SPEED_DIAL: 1000
+    SPEED_DIAL: 1000,
+    TOOLTIP: 1200
   };
 
   /**
@@ -5812,32 +5810,26 @@ this.primereact.csstransition = (function (exports, React, reactTransitionGroup,
       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
     };
-
     hooks.useUpdateEffect(function () {
       if (disabled) {
         // no animation
@@ -6090,7 +6082,7 @@ this.primereact.keyfilter = (function (exports, utils) {
       if (validateOnly || utils.DomHandler.isAndroid()) {
         return;
       }
-      if (e.ctrlKey || e.altKey) {
+      if (e.ctrlKey || e.altKey || e.metaKey) {
         return;
       }
       this.validateKey(e, e.key, keyfilter);
@@ -9337,6 +9329,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
       autoZIndex: true,
       baseZIndex: 0,
       className: null,
+      closeOnEscape: false,
       content: null,
       disabled: false,
       event: null,
@@ -9377,7 +9370,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
       _React$useState2 = _slicedToArray(_React$useState, 2),
       visibleState = _React$useState2[0],
       setVisibleState = _React$useState2[1];
-    var _React$useState3 = React__namespace.useState(props.position),
+    var _React$useState3 = React__namespace.useState(props.position || 'right'),
       _React$useState4 = _slicedToArray(_React$useState3, 2),
       positionState = _React$useState4[0],
       setPositionState = _React$useState4[1];
@@ -9407,6 +9400,13 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
     componentbase.useHandleStyle(TooltipBase.css.styles, isUnstyled, {
       name: 'tooltip'
     });
+    hooks.useGlobalOnEscapeKey({
+      callback: function callback() {
+        hide();
+      },
+      when: props.closeOnEscape,
+      priority: [hooks.ESC_KEY_HANDLING_PRIORITIES.TOOLTIP, 0]
+    });
     var elementRef = React__namespace.useRef(null);
     var textRef = React__namespace.useRef(null);
     var currentTargetRef = React__namespace.useRef(null);
@@ -9792,7 +9792,7 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
         bindWindowResizeListener();
         bindOverlayScrollListener();
       } else {
-        setPositionState(props.position);
+        setPositionState(props.position || 'right');
         setClassNameState('');
         currentTargetRef.current = null;
         containerSize.current = null;
@@ -9804,7 +9804,8 @@ this.primereact.tooltip = (function (exports, React, PrimeReact, componentbase,
       };
     }, [visibleState]);
     hooks.useUpdateEffect(function () {
-      if (visibleState) {
+      var position = getPosition(currentTargetRef.current);
+      if (visibleState && position !== 'mouse') {
         applyDelay('updateDelay', function () {
           updateText(currentTargetRef.current, function () {
             align(currentTargetRef.current);
@@ -10704,7 +10705,29 @@ this.primereact.virtualscroller = (function (exports, React, api, hooks, spinner
       }
     }, [numToleratedItemsState]);
     hooks.useUpdateEffect(function () {
-      if (!prevProps.items || prevProps.items.length !== (props.items || []).length) {
+      // Check if the previous/current rows array exists
+      var prevRowsExist = prevProps.items !== undefined && prevProps.items !== null;
+      var currentRowsExist = props.items !== undefined && props.items !== null;
+
+      // Get the length of the previous/current rows array, or 0 if it doesn't exist
+      var prevRowsLength = prevRowsExist ? prevProps.items.length : 0;
+      var currentRowsLength = currentRowsExist ? props.items.length : 0;
+
+      // Check if the length of the rows arrays has changed
+      var valuesChanged = prevRowsLength !== currentRowsLength;
+
+      // If both is true, we also need to check the lengths of the first element (assuming it's a matrix)
+      if (both && !valuesChanged) {
+        // Get the length of the columns or 0
+        var prevColumnsLength = prevRowsExist && prevProps.items.length > 0 ? prevProps.items[0].length : 0;
+        var currentColumnsLength = currentRowsExist && props.items.length > 0 ? props.items[0].length : 0;
+
+        // Check if the length of the columns has changed
+        valuesChanged = prevColumnsLength !== currentColumnsLength;
+      }
+
+      // If the previous items array doesn't exist or if any values have changed, call the init function
+      if (!prevRowsExist || valuesChanged) {
         init();
       }
       var loading = loadingState;
@@ -10990,6 +11013,61 @@ this.primereact.checkbox = (function (exports, React, api, componentbase, hooks,
     return obj;
   }
 
+  function _arrayWithHoles(arr) {
+    if (Array.isArray(arr)) return arr;
+  }
+
+  function _iterableToArrayLimit(r, l) {
+    var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+    if (null != t) {
+      var e,
+        n,
+        i,
+        u,
+        a = [],
+        f = !0,
+        o = !1;
+      try {
+        if (i = (t = t.call(r)).next, 0 === l) {
+          if (Object(t) !== t) return;
+          f = !1;
+        } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+      } catch (r) {
+        o = !0, n = r;
+      } finally {
+        try {
+          if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return;
+        } finally {
+          if (o) throw n;
+        }
+      }
+      return a;
+    }
+  }
+
+  function _arrayLikeToArray(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;
+  }
+
+  function _unsupportedIterableToArray(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _arrayLikeToArray(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(o, minLen);
+  }
+
+  function _nonIterableRest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  }
+
+  function _slicedToArray(arr, i) {
+    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+  }
+
   var classes = {
     box: 'p-checkbox-box',
     input: 'p-checkbox-input',
@@ -11045,8 +11123,15 @@ this.primereact.checkbox = (function (exports, React, api, componentbase, hooks,
     var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = CheckboxBase.getProps(inProps, context);
+    var _React$useState = React__namespace.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
@@ -11100,10 +11185,12 @@ this.primereact.checkbox = (function (exports, React, api, componentbase, hooks,
     };
     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__namespace.useImperativeHandle(ref, function () {
@@ -11503,6 +11590,7 @@ this.primereact.button = (function (exports, React, api, componentbase, hooks, u
     var rootProps = mergeProps({
       ref: elementRef,
       'aria-label': defaultAriaLabel,
+      'data-pc-autofocus': props.autoFocus,
       className: utils.classNames(props.className, cx('root', {
         size: size,
         disabled: disabled
@@ -12033,14 +12121,15 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     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
       };
     };
@@ -12308,7 +12397,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       if (props.onKeyDown) {
         props.onKeyDown(event);
 
-        // do not continue if the user defined event wants to prevent
+        // Do not continue if the user-defined event wants to prevent
         if (event.defaultPrevented) {
           return;
         }
@@ -12352,7 +12441,6 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
 
         //enter and tab
         case 'Tab':
-        case 'NumpadEnter':
         case 'Enter':
         case 'NumpadEnter':
           newValueStr = validateValue(parseValue(inputValue));
@@ -12456,13 +12544,15 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
         default:
           event.preventDefault();
           var _char2 = event.key;
-          var _isDecimalSign = isDecimalSign(_char2);
-          var _isMinusSign = isMinusSign(_char2);
-          if ((event.code.startsWith('Digit') || event.code.startsWith('Numpad')) && Number(_char2) >= 0 && Number(_char2) <= 9 || _isMinusSign || _isDecimalSign) {
-            insert(event, _char2, {
-              isDecimalSign: _isDecimalSign,
-              isMinusSign: _isMinusSign
-            });
+          if (_char2) {
+            var _isDecimalSign = isDecimalSign(_char2);
+            var _isMinusSign = isMinusSign(_char2);
+            if (Number(_char2) >= 0 && Number(_char2) <= 9 || _isMinusSign || _isDecimalSign) {
+              insert(event, _char2, {
+                isDecimalSign: _isDecimalSign,
+                isMinusSign: _isMinusSign
+              });
+            }
           }
           break;
       }
@@ -12565,7 +12655,9 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
       var newValueStr;
       if (sign.isMinusSign) {
         var isNewMinusSign = minusCharIndex === -1;
-        if (isNewMinusSign && (selectionStart === 0 || selectionStart === currencyCharIndex + 1)) {
+
+        // #6522 - Selected negative value can't be overwritten with a minus ('-') symbol
+        if (selectionStart === 0 || selectionStart === currencyCharIndex + 1) {
           newValueStr = inputValue;
           if (isNewMinusSign || selectionEnd !== 0) {
             newValueStr = insertText(inputValue, text, 0, selectionEnd);
@@ -12935,7 +13027,7 @@ this.primereact.inputnumber = (function (exports, React, PrimeReact, componentba
     hooks.useUpdateEffect(function () {
       constructParser();
       changeValue();
-    }, [props.locale, props.localeMatcher, props.mode, props.currency, props.currencyDisplay, props.useGrouping, props.minFractionDigits, props.maxFractionDigits, props.suffix, props.prefix]);
+    }, [_locale, props.locale, props.localeMatcher, props.mode, props.currency, props.currencyDisplay, props.useGrouping, props.minFractionDigits, props.maxFractionDigits, props.suffix, props.prefix]);
     hooks.useUpdateEffect(function () {
       changeValue();
     }, [props.value]);
@@ -14165,7 +14257,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       if (selected) {
         var checkIconProps = mergeProps({
           className: cx('checkIcon')
-        }, getPTOptions('checIcon'));
+        }, getPTOptions('checkIcon'));
         return /*#__PURE__*/React__namespace.createElement(check.CheckIcon, checkIconProps);
       }
       var blankIconProps = mergeProps({
@@ -14252,7 +14344,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
       };
       style = _objectSpread$1(_objectSpread$1({}, style), option.style);
-      if (option.group && props.optionGroupLabel) {
+      if (option.group && option.optionGroup && props.optionGroupLabel) {
         var optionGroupLabel = props.optionGroupLabel;
         var groupContent = props.optionGroupTemplate ? utils.ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : props.getOptionGroupLabel(option);
         var key = index + '_' + props.getOptionGroupRenderKey(option);
@@ -14633,10 +14725,9 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
     };
     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();
     };
@@ -14919,8 +15010,9 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       }
     };
     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());
         });
@@ -15126,10 +15218,12 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
       }
     };
     var getOptionLabel = function getOptionLabel(option) {
-      return props.optionLabel ? utils.ObjectUtils.resolveFieldData(option, props.optionLabel) : utils.ObjectUtils.resolveFieldData(option, 'label');
+      var optionLabel = props.optionLabel ? utils.ObjectUtils.resolveFieldData(option, props.optionLabel) : utils.ObjectUtils.resolveFieldData(option, 'label');
+      return utils.ObjectUtils.isNotEmpty(optionLabel) ? optionLabel : option;
     };
     var getOptionValue = function getOptionValue(option) {
-      return props.optionValue ? utils.ObjectUtils.resolveFieldData(option, props.optionValue) : utils.ObjectUtils.resolveFieldData(option, 'value') || option;
+      var optionValue = props.OptionValue ? utils.ObjectUtils.resolveFieldData(option, props.optionValue) : utils.ObjectUtils.resolveFieldData(option, 'value');
+      return utils.ObjectUtils.isNotEmpty(optionValue) ? optionValue : option;
     };
     var getOptionRenderKey = function getOptionRenderKey(option) {
       return props.dataKey ? utils.ObjectUtils.resolveFieldData(option, props.dataKey) : getOptionLabel(option);
@@ -15302,7 +15396,7 @@ this.primereact.dropdown = (function (exports, React, PrimeReact, componentbase,
         }, ariaProps), ptm('input'));
         return /*#__PURE__*/React__namespace.createElement("input", _inputProps);
       }
-      var content = props.valueTemplate ? utils.ObjectUtils.getJSXElement(props.valueTemplate, selectedOption, props) : label || props.placeholder || 'empty';
+      var content = props.valueTemplate ? utils.ObjectUtils.getJSXElement(props.valueTemplate, selectedOption, props) : label || props.placeholder || props.emptyMessage || /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, "\xA0");
       var inputProps = mergeProps({
         ref: inputRef,
         className: cx('input', {
@@ -15681,6 +15775,15 @@ this.primereact.dialog = (function (exports, React, PrimeReact, componentbase, c
     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,
@@ -15689,7 +15792,9 @@ this.primereact.dialog = (function (exports, React, PrimeReact, componentbase, c
         firstFocusableSelector = _ref$firstFocusableSe === void 0 ? '' : _ref$firstFocusableSe,
         _ref$autoFocus = _ref.autoFocus,
         autoFocus = _ref$autoFocus === void 0 ? false : _ref$autoFocus;
-      var focusableElement = utils.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 = utils.DomHandler.getFirstFocusableElement(target, computedAutoFocusSelector);
       autoFocus && !focusableElement && (focusableElement = utils.DomHandler.getFirstFocusableElement(target, getComputedSelector(firstFocusableSelector)));
       utils.DomHandler.focus(focusableElement);
     };
@@ -15788,7 +15893,7 @@ this.primereact.dialog = (function (exports, React, PrimeReact, componentbase, c
     },
     transition: 'p-dialog'
   };
-  var styles = "\n@layer primereact {\n    .p-dialog-mask {\n        background-color: transparent;\n        transition-property: background-color;\n    }\n    \n    .p-dialog-visible {\n        display: flex;\n    }\n    \n    .p-dialog-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n    \n    .p-dialog {\n        display: flex;\n        flex-direction: column;\n        pointer-events: auto;\n        max-height: 90%;\n        transform: scale(1);\n        position: relative;\n    }\n    \n    .p-dialog-content {\n        overflow-y: auto;\n        flex-grow: 1;\n    }\n    \n    .p-dialog-header {\n        display: flex;\n        align-items: center;\n        flex-shrink: 0;\n    }\n    \n    .p-dialog-footer {\n        flex-shrink: 0;\n    }\n    \n    .p-dialog .p-dialog-header-icons {\n        display: flex;\n        align-items: center;\n        align-self: flex-start;\n        flex-shrink: 0;\n    }\n    \n    .p-dialog .p-dialog-header-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-dialog .p-dialog-title {\n        flex-grow: 1;\n    }\n    \n    /* Fluid */\n    .p-fluid .p-dialog-footer .p-button {\n        width: auto;\n    }\n    \n    /* Animation */\n    /* Center */\n    .p-dialog-enter {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n    \n    .p-dialog-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n    \n    .p-dialog-enter-done {\n        transform: none;\n    }\n    \n    .p-dialog-exit-active {\n        opacity: 0;\n        transform: scale(0.7);\n        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    \n    /* Top, Bottom, Left, Right, Top* and Bottom* */\n    .p-dialog-top .p-dialog,\n    .p-dialog-bottom .p-dialog,\n    .p-dialog-left .p-dialog,\n    .p-dialog-right .p-dialog,\n    .p-dialog-top-left .p-dialog,\n    .p-dialog-top-right .p-dialog,\n    .p-dialog-bottom-left .p-dialog,\n    .p-dialog-bottom-right .p-dialog {\n        margin: 0.75em;\n    }\n    \n    .p-dialog-top .p-dialog-enter,\n    .p-dialog-top .p-dialog-exit-active {\n        transform: translate3d(0px, -100%, 0px);\n    }\n    \n    .p-dialog-bottom .p-dialog-enter,\n    .p-dialog-bottom .p-dialog-exit-active {\n        transform: translate3d(0px, 100%, 0px);\n    }\n    \n    .p-dialog-left .p-dialog-enter,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-enter,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-enter,\n    .p-dialog-bottom-left .p-dialog-exit-active {\n        transform: translate3d(-100%, 0px, 0px);\n    }\n    \n    .p-dialog-right .p-dialog-enter,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-enter,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-enter,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transform: translate3d(100%, 0px, 0px);\n    }\n    \n    .p-dialog-top .p-dialog-enter-active,\n    .p-dialog-bottom .p-dialog-enter-active,\n    .p-dialog-left .p-dialog-enter-active,\n    .p-dialog-top-left .p-dialog-enter-active,\n    .p-dialog-bottom-left .p-dialog-enter-active,\n    .p-dialog-right .p-dialog-enter-active,\n    .p-dialog-top-right .p-dialog-enter-active,\n    .p-dialog-bottom-right .p-dialog-enter-active {\n        transform: translate3d(0px, 0px, 0px);\n        transition: all 0.3s ease-out;\n    }\n    \n    .p-dialog-top .p-dialog-exit-active,\n    .p-dialog-bottom .p-dialog-exit-active,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-exit-active,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transition: all 0.3s ease-out;\n    }\n    \n    /* Maximize */\n    .p-dialog-maximized {\n        transition: none;\n        transform: none;\n        margin: 0;\n        width: 100vw !important;\n        height: 100vh !important;\n        max-height: 100%;\n        top: 0px !important;\n        left: 0px !important;\n    }\n    \n    .p-dialog-maximized .p-dialog-content {\n        flex-grow: 1;\n    }\n    \n    .p-confirm-dialog .p-dialog-content {\n        display: flex;\n        align-items: center;\n    }\n    \n    /* Resizable */\n    .p-dialog .p-resizable-handle {\n        position: absolute;\n        font-size: 0.1px;\n        display: block;\n        cursor: se-resize;\n        width: 12px;\n        height: 12px;\n        right: 1px;\n        bottom: 1px;\n    }\n    \n    .p-dialog-draggable .p-dialog-header {\n        cursor: move;\n    }        \n}\n";
+  var styles = "\n@layer primereact {\n    .p-dialog-mask {\n        background-color: transparent;\n        transition-property: background-color;\n    }\n\n    .p-dialog-visible {\n        display: flex;\n    }\n\n    .p-dialog-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n\n    .p-dialog {\n        display: flex;\n        flex-direction: column;\n        pointer-events: auto;\n        max-height: 90%;\n        transform: scale(1);\n        position: relative;\n    }\n\n    .p-dialog-content {\n        overflow-y: auto;\n        flex-grow: 1;\n    }\n\n    .p-dialog-header {\n        display: flex;\n        align-items: center;\n        flex-shrink: 0;\n    }\n\n    .p-dialog-footer {\n        flex-shrink: 0;\n    }\n\n    .p-dialog .p-dialog-header-icons {\n        display: flex;\n        align-items: center;\n        align-self: flex-start;\n        flex-shrink: 0;\n    }\n\n    .p-dialog .p-dialog-header-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-dialog .p-dialog-title {\n        flex-grow: 1;\n    }\n\n    /* Fluid */\n    .p-fluid .p-dialog-footer .p-button {\n        width: auto;\n    }\n\n    /* Animation */\n    /* Center */\n    .p-dialog-enter {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n\n    .p-dialog-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-dialog-enter-done {\n        transform: none;\n    }\n\n    .p-dialog-exit-active {\n        opacity: 0;\n        transform: scale(0.7);\n        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    /* Top, Bottom, Left, Right, Top* and Bottom* */\n    .p-dialog-top .p-dialog,\n    .p-dialog-bottom .p-dialog,\n    .p-dialog-left .p-dialog,\n    .p-dialog-right .p-dialog,\n    .p-dialog-top-left .p-dialog,\n    .p-dialog-top-right .p-dialog,\n    .p-dialog-bottom-left .p-dialog,\n    .p-dialog-bottom-right .p-dialog {\n        margin: 0.75em;\n    }\n\n    .p-dialog-top .p-dialog-enter,\n    .p-dialog-top .p-dialog-exit-active {\n        transform: translate3d(0px, -100%, 0px);\n    }\n\n    .p-dialog-bottom .p-dialog-enter,\n    .p-dialog-bottom .p-dialog-exit-active {\n        transform: translate3d(0px, 100%, 0px);\n    }\n\n    .p-dialog-left .p-dialog-enter,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-enter,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-enter,\n    .p-dialog-bottom-left .p-dialog-exit-active {\n        transform: translate3d(-100%, 0px, 0px);\n    }\n\n    .p-dialog-right .p-dialog-enter,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-enter,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-enter,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transform: translate3d(100%, 0px, 0px);\n    }\n\n    .p-dialog-top .p-dialog-enter-active,\n    .p-dialog-bottom .p-dialog-enter-active,\n    .p-dialog-left .p-dialog-enter-active,\n    .p-dialog-top-left .p-dialog-enter-active,\n    .p-dialog-bottom-left .p-dialog-enter-active,\n    .p-dialog-right .p-dialog-enter-active,\n    .p-dialog-top-right .p-dialog-enter-active,\n    .p-dialog-bottom-right .p-dialog-enter-active {\n        transform: translate3d(0px, 0px, 0px);\n        transition: all 0.3s ease-out;\n    }\n\n    .p-dialog-top .p-dialog-exit-active,\n    .p-dialog-bottom .p-dialog-exit-active,\n    .p-dialog-left .p-dialog-exit-active,\n    .p-dialog-top-left .p-dialog-exit-active,\n    .p-dialog-bottom-left .p-dialog-exit-active,\n    .p-dialog-right .p-dialog-exit-active,\n    .p-dialog-top-right .p-dialog-exit-active,\n    .p-dialog-bottom-right .p-dialog-exit-active {\n        transition: all 0.3s ease-out;\n    }\n\n    /* Maximize */\n    .p-dialog-maximized {\n        transition: none;\n        transform: none;\n        margin: 0;\n        width: 100vw !important;\n        height: 100vh !important;\n        max-height: 100%;\n        top: 0px !important;\n        left: 0px !important;\n    }\n\n    .p-dialog-maximized .p-dialog-content {\n        flex-grow: 1;\n    }\n\n    .p-confirm-dialog .p-dialog-content {\n        display: flex;\n        align-items: center;\n    }\n\n    /* Resizable */\n    .p-dialog .p-resizable-handle {\n        position: absolute;\n        font-size: 0.1px;\n        display: block;\n        cursor: se-resize;\n        width: 12px;\n        height: 12px;\n        right: 1px;\n        bottom: 1px;\n    }\n\n    .p-dialog-draggable .p-dialog-header {\n        cursor: move;\n    }\n}\n";
   var inlineStyles = {
     mask: function mask(_ref6) {
       var props = _ref6.props;
@@ -16141,7 +16246,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, componentbase, c
       }
     };
     var onExited = function onExited() {
-      props.onHide && props.onHide();
       dragging.current = false;
       utils.ZIndexUtils.clear(maskRef.current);
       setMaskVisibleState(false);
@@ -16310,7 +16414,12 @@ this.primereact.dialog = (function (exports, React, PrimeReact, componentbase, c
           type: 'button',
           className: cx('closeButton'),
           'aria-label': ariaLabel,
-          onClick: onClose
+          onClick: onClose,
+          onKeyDown: function onKeyDown(ev) {
+            if (ev.key !== 'Escape') {
+              ev.stopPropagation();
+            }
+          }
         }, ptm('closeButton'));
         return /*#__PURE__*/React__namespace.createElement("button", closeButtonProps, headerCloseIcon, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
       }
@@ -17321,7 +17430,7 @@ this.primereact.paginator = (function (exports, React, api, componentbase, hooks
             },
             page: pageLink - 1,
             currentPage: props.page,
-            totalPages: props.pageCount,
+            totalPages: props.totalPages,
             ariaLabel: api.ariaLabel('pageLabel', {
               page: pageLink
             }),
@@ -18056,8 +18165,15 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
     var mergeProps = hooks.useMergeProps();
     var context = React__namespace.useContext(api.PrimeReactContext);
     var props = CheckboxBase.getProps(inProps, context);
+    var _React$useState = React__namespace.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
@@ -18111,10 +18227,12 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
     };
     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__namespace.useImperativeHandle(ref, function () {
@@ -18281,14 +18399,33 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
         });
       }
     };
+    var findNextNonDroppointSibling = function findNextNonDroppointSibling(nodeElement) {
+      var nextNodeSibling = nodeElement.nextSibling;
+      if (nextNodeSibling) {
+        var isNextDropPoint = nextNodeSibling.getAttribute('data-pc-section') === 'droppoint';
+        if (isNextDropPoint) {
+          //skip drop point and return next elemnt
+          if (nextNodeSibling.nextElementSibling) {
+            return nextNodeSibling.nextElementSibling;
+          } else {
+            //nothing after droppoint go outside
+            return null;
+          }
+        }
+        return nextNodeSibling;
+      }
+      return null;
+    };
     var findNextSiblingOfAncestor = function findNextSiblingOfAncestor(nodeElement) {
       var parentNodeElement = getParentNodeElement(nodeElement);
-      return parentNodeElement ? parentNodeElement.nextElementSibling || findNextSiblingOfAncestor(parentNodeElement) : null;
+      return parentNodeElement ? findNextNonDroppointSibling(parentNodeElement) || findNextSiblingOfAncestor(parentNodeElement) : null;
     };
     var findLastVisibleDescendant = function findLastVisibleDescendant(nodeElement) {
       var childrenListElement = nodeElement.children[1];
       if (childrenListElement) {
-        var lastChildElement = childrenListElement.children[childrenListElement.children.length - 1];
+        //skip droppoint
+        var offset = props.dragdropScope ? 2 : 1;
+        var lastChildElement = childrenListElement.children[childrenListElement.children.length - offset];
         return findLastVisibleDescendant(lastChildElement);
       }
       return nodeElement;
@@ -18492,10 +18629,11 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
     var onArrowDown = function onArrowDown(event) {
       var nodeElement = event.target.getAttribute('data-pc-section') === 'toggler' ? event.target.closest('[role="treeitem"]') : event.target;
       var listElement = nodeElement.children[1];
+      var nextElement = getNextElement(nodeElement);
       if (listElement) {
-        focusRowChange(nodeElement, listElement.children[0]);
-      } else if (nodeElement.nextElementSibling) {
-        focusRowChange(nodeElement, nodeElement.nextElementSibling);
+        focusRowChange(nodeElement, props.dragdropScope ? listElement.children[1] : listElement.children[0]);
+      } else if (nextElement) {
+        focusRowChange(nodeElement, nextElement);
       } else {
         var nextSiblingAncestor = findNextSiblingOfAncestor(nodeElement);
         if (nextSiblingAncestor) {
@@ -18504,10 +18642,25 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
       }
       event.preventDefault();
     };
+    var getPreviousElement = function getPreviousElement(element) {
+      var prev = element.previousElementSibling;
+      if (prev) {
+        return !props.dragdropScope ? prev : prev.previousElementSibling;
+      }
+      return null;
+    };
+    var getNextElement = function getNextElement(element) {
+      var next = element.nextElementSibling;
+      if (next) {
+        return !props.dragdropScope ? next : next.nextElementSibling;
+      }
+      return null;
+    };
     var onArrowUp = function onArrowUp(event) {
       var nodeElement = event.target;
-      if (nodeElement.previousElementSibling) {
-        focusRowChange(nodeElement, nodeElement.previousElementSibling, findLastVisibleDescendant(nodeElement.previousElementSibling));
+      var previous = getPreviousElement(nodeElement);
+      if (previous) {
+        focusRowChange(nodeElement, previous, findLastVisibleDescendant(previous));
       } else {
         var parentNodeElement = getParentNodeElement(nodeElement);
         if (parentNodeElement) {
@@ -18695,18 +18848,18 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
       }
     };
     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()) {
         utils.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()) {
         utils.DomHandler.removeClass(event.target, 'p-treenode-droppoint-active');
       }
     };
@@ -18725,19 +18878,19 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
       }
     };
     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) {
         utils.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) {
           utils.DomHandler.removeClass(contentRef.current, 'p-treenode-dragover');
@@ -19054,7 +19207,9 @@ this.primereact.tree = (function (exports, React, api, componentbase, hooks, sea
           if (nodeElement) {
             nodeElement.tabIndex = '-1';
           }
-          var childElement = listElement.children[0];
+
+          //skip droppoint
+          var childElement = props.dragdropScope ? listElement.children[1] : listElement.children[0];
           if (childElement) {
             childElement.tabIndex = '0';
             childElement.focus();