primereact 9.6.0 → 9.6.2

package/primereact.all.js

@@ -224,16 +224,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     }
     _createClass(DomHandler, null, [{
       key: "innerWidth",
-      value:
-      /**
-       * All data- properties like data-test-id
-       */
-
-      /**
-       * All ARIA properties like aria-label and focus-target for https://www.npmjs.com/package/@q42/floating-focus-a11y
-       */
-
-      function innerWidth(el) {
+      value: function innerWidth(el) {
         if (el) {
           var width = el.offsetWidth;
           var style = getComputedStyle(el);
@@ -1279,7 +1270,13 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     }]);
     return DomHandler;
   }();
+  /**
+   * All data- properties like data-test-id
+   */
   _defineProperty(DomHandler, "DATA_PROPS", ['data-']);
+  /**
+   * All ARIA properties like aria-label and focus-target for https://www.npmjs.com/package/@q42/floating-focus-a11y
+   */
   _defineProperty(DomHandler, "ARIA_PROPS", ['aria', 'focus-target']);
 
   var ConnectedOverlayScrollHandler = /*#__PURE__*/function () {
@@ -6081,7 +6078,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
           return _onMouseEnter();
         },
         onMouseLeave: function onMouseLeave(e) {
-          return _onMouseLeave;
+          return _onMouseLeave(e);
         }
       }, TooltipBase.getOtherProps(props), ptm('root'));
       var arrowProps = mergeProps({
@@ -8809,7 +8806,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       }
     };
     var onInputBlur = function onInputBlur(event) {
-      setFocusedState(false);
       !props.keepInvalid && updateInputfield(props.value);
       props.onBlur && props.onBlur(event);
     };
@@ -9900,6 +9896,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       }
     };
     var show = function show(type) {
+      setFocusedState(false);
       if (props.onVisibleChange) {
         props.onVisibleChange({
           visible: true,
@@ -10792,7 +10789,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         }, 200);
       }
     });
-    useUpdateEffect(function () {
+    React__namespace.useEffect(function () {
       var unbindMaskEvents = null;
       if (props.mask) {
         unbindMaskEvents = mask(inputRef.current, {
@@ -10810,7 +10807,8 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       return function () {
         props.mask && unbindMaskEvents && unbindMaskEvents();
       };
-    }, [props.mask]);
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.disabled, props.mask, props.readOnlyInput]);
     useUpdateEffect(function () {
       setCurrentView(props.view);
     }, [props.view]);
@@ -11606,12 +11604,13 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     var monthPicker = createMonthPicker();
     var yearPicker = createYearPicker();
     var rootProps = mergeProps({
-      ref: elementRef,
       id: props.id,
       className: className,
       style: props.style
     }, CalendarBase.getOtherProps(props), ptm('root'));
-    return /*#__PURE__*/React__namespace.createElement("span", rootProps, content, /*#__PURE__*/React__namespace.createElement(CalendarPanel, {
+    return /*#__PURE__*/React__namespace.createElement("span", _extends({
+      ref: elementRef
+    }, rootProps), content, /*#__PURE__*/React__namespace.createElement(CalendarPanel, {
       ref: overlayRef,
       className: panelClassName,
       style: props.panelStyle,
@@ -11920,7 +11919,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       }
     };
     var changePageOnTouch = function changePageOnTouch(e, diff) {
-      if (Math.abs(diff) > swipeThreshold) {
+      if (Math.abs(diff) > swipeThreshold.current) {
         if (diff < 0) {
           // left
           navForward(e);
@@ -11994,7 +11993,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         attributeSelector.current = UniqueComponentId();
         elementRef.current.setAttribute(attributeSelector.current, '');
       }
-      createStyle();
       calculatePosition();
       changePosition(totalShiftedItemsState);
       bindWindowResizeListener();
@@ -12002,6 +12000,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     useUpdateEffect(function () {
       var stateChanged = false;
       var totalShiftedItems = totalShiftedItemsState;
+      createStyle();
       if (props.autoplayInterval) {
         stopAutoplay();
       }
@@ -12053,12 +12052,12 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (!stateChanged && isAutoplay) {
         startAutoplay();
       }
-    });
-    useUnmountEffect(function () {
-      if (props.autoplayInterval) {
-        stopAutoplay();
-      }
-      destroyStyle();
+      return function () {
+        if (props.autoplayInterval) {
+          stopAutoplay();
+        }
+        destroyStyle();
+      };
     });
     var createItems = function createItems() {
       if (props.value && props.value.length) {
@@ -17855,6 +17854,7 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var style = {
         height: scrollerOptions.props ? scrollerOptions.props.itemSize : undefined
       };
+      style = _objectSpread$13(_objectSpread$13({}, style), option.style);
       if (props.optionGroupLabel) {
         var groupContent = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : props.getOptionGroupLabel(option);
         var groupChildrenContent = createGroupChildren(option, style);
@@ -19411,7 +19411,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     }, getColumnPTOptions('hiddenInputWrapper'));
     var hiddenInputProps = mergeProps({
       name: name,
-      ref: inputRef,
       type: 'radio',
       checked: props.checked,
       onFocus: function onFocus(e) {
@@ -19439,7 +19438,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     var radiobuttonIconProps = mergeProps({
       className: 'p-radiobutton-icon'
     }, getColumnPTOptions('radiobuttonIcon'));
-    return /*#__PURE__*/React__namespace.createElement("div", radiobuttonWrapperProps, /*#__PURE__*/React__namespace.createElement("div", hiddenInputWrapperProps, /*#__PURE__*/React__namespace.createElement("input", hiddenInputProps)), /*#__PURE__*/React__namespace.createElement("div", radiobuttonProps, /*#__PURE__*/React__namespace.createElement("div", radiobuttonIconProps)));
+    return /*#__PURE__*/React__namespace.createElement("div", radiobuttonWrapperProps, /*#__PURE__*/React__namespace.createElement("div", hiddenInputWrapperProps, /*#__PURE__*/React__namespace.createElement("input", _extends({
+      ref: inputRef
+    }, hiddenInputProps))), /*#__PURE__*/React__namespace.createElement("div", radiobuttonProps, /*#__PURE__*/React__namespace.createElement("div", radiobuttonIconProps)));
   });
   RowRadioButton.displayName = 'RowRadioButton';
 
@@ -20132,7 +20133,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       if (!isRowEditor && editor) {
         var editorKeyHelperProps = mergeProps({
           tabIndex: '0',
-          ref: keyHelperRef,
           className: 'p-cell-editor-key-helper p-hidden-accessible',
           onFocus: function onFocus(e) {
             return onEditorFocus(e);
@@ -20140,12 +20140,13 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         }, getColumnPTOptions('editorKeyHelperLabel'));
         var editorKeyHelperLabelProps = mergeProps(getColumnPTOptions('editorKeyHelper'));
         /* eslint-disable */
-        editorKeyHelper = /*#__PURE__*/React__namespace.createElement("a", editorKeyHelperProps, /*#__PURE__*/React__namespace.createElement("span", editorKeyHelperLabelProps));
+        editorKeyHelper = /*#__PURE__*/React__namespace.createElement("a", _extends({
+          ref: keyHelperRef
+        }, editorKeyHelperProps), /*#__PURE__*/React__namespace.createElement("span", editorKeyHelperLabelProps));
         /* eslint-enable */
       }
 
       var bodyCellProps = mergeProps({
-        ref: elementRef,
         style: style,
         className: className,
         rowSpan: props.rowSpan,
@@ -20167,7 +20168,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
           return _onMouseUp(e);
         }
       }, getColumnPTOptions('bodyCell'), getColumnPTOptions('root'));
-      return /*#__PURE__*/React__namespace.createElement("td", bodyCellProps, editorKeyHelper, title, content);
+      return /*#__PURE__*/React__namespace.createElement("td", _extends({
+        ref: elementRef
+      }, bodyCellProps), editorKeyHelper, title, content);
     };
     return getVirtualScrollerOption('loading') ? createLoading() : createElement();
   });
@@ -21599,11 +21602,12 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     var content = props.empty ? createEmptyContent() : createContent();
     var ptKey = props.className === 'p-datatable-virtualscroller-spacer' ? 'virtualScrollerSpacer' : 'tbody';
     var tbodyProps = mergeProps({
-      ref: refCallback,
       style: props.style,
       className: props.className
     }, getColumnPTOptions(ptKey));
-    return /*#__PURE__*/React__namespace.createElement("tbody", tbodyProps, content);
+    return /*#__PURE__*/React__namespace.createElement("tbody", _extends({
+      ref: refCallback
+    }, tbodyProps), content);
   }));
   TableBody.displayName = 'TableBody';
 
@@ -21699,14 +21703,15 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       props: props.tableProps
     });
     var footerCellProps = mergeProps({
-      ref: elementRef,
       style: style,
       className: className,
       role: 'cell',
       colSpan: colSpan,
       rowSpan: rowSpan
     }, getColumnPTOptions('footerCell'), getColumnPTOptions('root'));
-    return /*#__PURE__*/React__namespace.createElement("td", footerCellProps, content);
+    return /*#__PURE__*/React__namespace.createElement("td", _extends({
+      ref: elementRef
+    }, footerCellProps), content);
   });
   FooterCell.displayName = 'FooterCell';
 
@@ -22245,7 +22250,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         });
         var label = filterLabel();
         var filterMenuButtonProps = mergeProps({
-          ref: iconRef,
           type: 'button',
           className: _className,
           'aria-haspopup': true,
@@ -22258,7 +22262,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
           },
           'aria-label': label
         }, getColumnPTOptions('filterMenuButton'));
-        return /*#__PURE__*/React__namespace.createElement("button", filterMenuButtonProps, columnFilterIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
+        return /*#__PURE__*/React__namespace.createElement("button", _extends({
+          ref: iconRef
+        }, filterMenuButtonProps), columnFilterIcon, /*#__PURE__*/React__namespace.createElement(Ripple, null));
       }
       return null;
     };
@@ -22487,7 +22493,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       });
       var items = props.display === 'row' ? createRowItems() : createItems();
       var filterOverlayProps = mergeProps({
-        ref: overlayRef,
         style: style,
         className: className,
         onKeyDown: function onKeyDown(e) {
@@ -22513,7 +22518,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         onEntered: onOverlayEntered,
         onExit: onOverlayExit,
         onExited: onOverlayExited
-      }, /*#__PURE__*/React__namespace.createElement("div", filterOverlayProps, filterHeader, items, filterFooter)));
+      }, /*#__PURE__*/React__namespace.createElement("div", _extends({
+        ref: overlayRef
+      }, filterOverlayProps), filterHeader, items, filterFooter)));
     };
     var className = classNames('p-column-filter p-fluid', {
       'p-column-filter-row': props.display === 'row',
@@ -22927,7 +22934,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var resizer = createResizer();
       var header = createHeader(sortMeta);
       var headerCellProps = mergeProps({
-        ref: elementRef,
         className: className,
         style: style,
         role: 'columnheader',
@@ -22957,7 +22963,9 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         rowSpan: rowSpan,
         'aria-sort': ariaSort
       }, getColumnPTOptions('headerCell'), getColumnPTOptions('root'));
-      return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("th", headerCellProps, resizer, header), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
+      return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("th", _extends({
+        ref: elementRef
+      }, headerCellProps), resizer, header), hasTooltip && /*#__PURE__*/React__namespace.createElement(Tooltip, _extends({
         target: elementRef,
         content: headerTooltip
       }, headerTooltipOptions, {
@@ -24368,7 +24376,10 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       return data;
     };
     useMountEffect(function () {
-      attributeSelector.current = UniqueComponentId();
+      if (elementRef.current) {
+        attributeSelector.current = UniqueComponentId();
+        elementRef.current.setAttribute(attributeSelector.current, '');
+      }
 
       //setFiltersState(cloneFilters(props.filters)); // Github #4248
       setD_filtersState(cloneFilters(props.filters));
@@ -24380,7 +24391,6 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       }
     });
     useUpdateEffect(function () {
-      elementRef.current.setAttribute(attributeSelector.current, '');
       if (props.responsiveLayout === 'stack' && !props.scrollable) {
         createResponsiveStyle();
       }
@@ -24720,13 +24730,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
       var _isVirtualScrollerDisabled = isVirtualScrollerDisabled();
       var virtualScrollerOptions = props.virtualScrollerOptions || {};
       var wrapperProps = mergeProps({
-        ref: wrapperRef,
         className: 'p-datatable-wrapper',
         style: {
           maxHeight: _isVirtualScrollerDisabled ? props.scrollHeight : null
         }
       }, ptCallbacks.ptm('wrapper'));
-      return /*#__PURE__*/React__namespace.createElement("div", wrapperProps, /*#__PURE__*/React__namespace.createElement(VirtualScroller, _extends({
+      return /*#__PURE__*/React__namespace.createElement("div", _extends({
+        ref: wrapperRef
+      }, wrapperProps), /*#__PURE__*/React__namespace.createElement(VirtualScroller, _extends({
         ref: virtualScrollerRef
       }, virtualScrollerOptions, {
         items: processedData,
@@ -24810,13 +24821,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     var createResizeHelper = function createResizeHelper() {
       if (props.resizableColumns) {
         var resizeHelperProps = mergeProps({
-          ref: resizeHelperRef,
           className: 'p-column-resizer-helper',
           style: {
             display: 'none'
           }
         }, ptCallbacks.ptm('resizeHelper'));
-        return /*#__PURE__*/React__namespace.createElement("div", resizeHelperProps);
+        return /*#__PURE__*/React__namespace.createElement("div", _extends({
+          ref: resizeHelperRef
+        }, resizeHelperProps));
       }
       return null;
     };
@@ -24882,13 +24894,14 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     var resizeHelper = createResizeHelper();
     var reorderIndicators = createReorderIndicators();
     var rootProps = mergeProps({
-      ref: elementRef,
       id: props.id,
       className: className,
       style: props.style,
       'data-scrollselectors': '.p-datatable-wrapper'
     }, DataTableBase.getOtherProps(props), ptCallbacks.ptm('root'));
-    return /*#__PURE__*/React__namespace.createElement("div", rootProps, loader, header, paginatorTop, content, paginatorBottom, footer, resizeHelper, reorderIndicators);
+    return /*#__PURE__*/React__namespace.createElement("div", _extends({
+      ref: elementRef
+    }, rootProps), loader, header, paginatorTop, content, paginatorBottom, footer, resizeHelper, reorderIndicators);
   });
   DataTable.displayName = 'DataTable';
 
@@ -26436,14 +26449,11 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
         duplicateIEEvent.current = false;
         return;
       }
-      var currentFiles = [];
-      if (props.multiple) {
-        currentFiles = filesState ? _toConsumableArray(filesState) : [];
-      }
+      var currentFiles = filesState && props.multiple ? _toConsumableArray(filesState) : [];
       var selectedFiles = event.dataTransfer ? event.dataTransfer.files : event.target.files;
       for (var i = 0; i < selectedFiles.length; i++) {
         var file = selectedFiles[i];
-        if (!isFileSelected(file) && validate(file)) {
+        if ((!props.multiple || !isFileSelected(file)) && validate(file)) {
           if (isImage(file)) {
             file.objectURL = window.URL.createObjectURL(file);
           }
@@ -37850,9 +37860,10 @@ var primereact = (function (exports, React, reactTransitionGroup, ReactDOM) {
     var onDragEnd = function onDragEnd(event) {
       if (dragging.current) {
         dragging.current = false;
+        var newValue = setValue(event);
         props.onSlideEnd && props.onSlideEnd({
           originalEvent: event,
-          value: props.value
+          value: newValue
         });
         unbindDocumentMouseMoveListener();
         unbindDocumentMouseUpListener();