primereact 8.7.0 → 8.7.2

package/primereact.all.esm.js

@@ -1970,6 +1970,8 @@ var ObjectUtils = /*#__PURE__*/function () {
       if (data && Object.keys(data).length && field) {
         if (this.isFunction(field)) {
           return field(data);
+        } else if (ObjectUtils.isNotEmpty(data[field])) {
+          return data[field];
         } else if (field.indexOf('.') === -1) {
           return data[field];
         } else {
@@ -3648,11 +3650,25 @@ var Ripple = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function ()
   };
 
   var onTouchStart = function onTouchStart(event) {
-    onMouseDown(event);
-    event.preventDefault();
+    var offset = DomHandler.getOffset(targetRef.current);
+    var offsetX = event.targetTouches[0].pageX - offset.left + document.body.scrollTop - DomHandler.getWidth(inkRef.current) / 2;
+    var offsetY = event.targetTouches[0].pageY - offset.top + document.body.scrollLeft - DomHandler.getHeight(inkRef.current) / 2;
+    activateRipple(offsetX, offsetY);
   };
 
   var onMouseDown = function onMouseDown(event) {
+    if (DomHandler.isTouchDevice()) {
+      // already started ripple with onTouchStart
+      return;
+    }
+
+    var offset = DomHandler.getOffset(targetRef.current);
+    var offsetX = event.pageX - offset.left + document.body.scrollTop - DomHandler.getWidth(inkRef.current) / 2;
+    var offsetY = event.pageY - offset.top + document.body.scrollLeft - DomHandler.getHeight(inkRef.current) / 2;
+    activateRipple(offsetX, offsetY);
+  };
+
+  var activateRipple = function activateRipple(offsetX, offsetY) {
     if (!inkRef.current || getComputedStyle(inkRef.current, null).display === 'none') {
       return;
     }
@@ -3665,11 +3681,8 @@ var Ripple = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function ()
       inkRef.current.style.width = d + 'px';
     }
 
-    var offset = DomHandler.getOffset(targetRef.current);
-    var x = event.pageX - offset.left + document.body.scrollTop - DomHandler.getWidth(inkRef.current) / 2;
-    var y = event.pageY - offset.top + document.body.scrollLeft - DomHandler.getHeight(inkRef.current) / 2;
-    inkRef.current.style.top = y + 'px';
-    inkRef.current.style.left = x + 'px';
+    inkRef.current.style.top = offsetY + 'px';
+    inkRef.current.style.left = offsetX + 'px';
     DomHandler.addClass(inkRef.current, 'p-ink-active');
   };
 
@@ -4181,14 +4194,13 @@ var Tooltip = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (p
     }
   };
 
-  React.useEffect(function () {
+  useMountEffect(function () {
+    loadTargetEvents();
+
     if (visibleState && currentTargetRef.current && isDisabled(currentTargetRef.current)) {
       hide();
     }
   });
-  useMountEffect(function () {
-    loadTargetEvents();
-  });
   useUpdateEffect(function () {
     loadTargetEvents();
     return function () {
@@ -4459,8 +4471,9 @@ var KeyFilter = {
   validate: function validate(e, keyfilter) {
     var value = e.target.value,
         validatePattern = true;
+    var regex = this.getRegex(keyfilter);
 
-    if (value && !keyfilter.test(value)) {
+    if (value && !regex.test(value)) {
       validatePattern = false;
     }
 
@@ -4471,8 +4484,8 @@ var KeyFilter = {
 var InputText = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {
   var elementRef = React.useRef(ref);
 
-  var onKeyPress = function onKeyPress(event) {
-    props.onKeyPress && props.onKeyPress(event);
+  var onKeyDown = function onKeyDown(event) {
+    props.onKeyDown && props.onKeyDown(event);
 
     if (props.keyfilter) {
       KeyFilter.onKeyPress(event, props.keyfilter, props.validateOnly);
@@ -4520,7 +4533,7 @@ var InputText = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
   }, otherProps, {
     className: className,
     onInput: onInput,
-    onKeyPress: onKeyPress,
+    onKeyDown: onKeyDown,
     onPaste: onPaste
   })), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({
     target: elementRef,
@@ -4535,7 +4548,7 @@ InputText.defaultProps = {
   tooltip: null,
   tooltipOptions: null,
   onInput: null,
-  onKeyPress: null,
+  onKeyDown: null,
   onPaste: null
 };
 
@@ -5644,8 +5657,11 @@ var AutoComplete = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functi
       inputRef.current.value = '';
 
       if (!isSelected(option)) {
-        var newValue = props.value ? [].concat(_toConsumableArray(props.value), [option]) : [option];
-        updateModel(event, newValue);
+        // allows empty value/selectionlimit and within sectionlimit
+        if (!props.value || !props.selectionLimit || props.value.length < props.selectionLimit) {
+          var newValue = props.value ? [].concat(_toConsumableArray(props.value), [option]) : [option];
+          updateModel(event, newValue);
+        }
       }
     } else {
       updateInputField(option);
@@ -6247,6 +6263,7 @@ AutoComplete.defaultProps = {
   removeIcon: 'pi pi-times-circle',
   scrollHeight: '200px',
   selectedItemTemplate: null,
+  selectionLimit: null,
   showEmptyMessage: false,
   size: null,
   style: null,
@@ -8636,7 +8653,7 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     if (value) {
       try {
         if (isSingleSelection()) {
-          formattedValue = isValidDate(value) ? formatDateTime(value) : '';
+          formattedValue = isValidDate(value) ? formatDateTime(value) : props.keepInvalid ? value : '';
         } else if (isMultipleSelection()) {
           for (var i = 0; i < value.length; i++) {
             var selectedValue = value[i];
@@ -9191,8 +9208,33 @@ var Calendar = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     }
   }, [props.onViewDateChange, props.value]);
   useUpdateEffect(function () {
-    if (previousValue !== props.value && (!viewStateChanged.current || visible)) {
-      updateInputfield(props.value);
+    var newDate = props.value;
+
+    if (previousValue !== newDate) {
+      updateInputfield(newDate); // #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 (viewDate instanceof Date) {
+          validateDate(viewDate);
+          setViewDateState(viewDate);
+          setCurrentMonth(viewDate.getMonth());
+          setCurrentYear(viewDate.getFullYear());
+        }
+      }
     }
   }, [props.value, visible]);
   useUpdateEffect(function () {
@@ -15000,7 +15042,12 @@ var InputNumber = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
     if (inputRef.current) {
       var step = props.step * dir;
       var currentValue = parseValue(inputRef.current.value) || 0;
-      var newValue = validateValue(currentValue + step); // touch devices trigger the keyboard to display because of setSelectionRange
+      var newValue = validateValue(currentValue + step);
+
+      if (props.maxLength && props.maxLength < formatValue(newValue).length) {
+        return;
+      } // touch devices trigger the keyboard to display because of setSelectionRange
+
 
       !DomHandler.isTouchDevice() && updateInput(newValue, null, 'spin');
       updateModel(event, newValue);
@@ -15605,6 +15652,11 @@ var InputNumber = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
     } else {
       var selectionStart = inputEl.selectionStart;
       var _selectionEnd = inputEl.selectionEnd;
+
+      if (props.maxLength && props.maxLength < newValue.length) {
+        return;
+      }
+
       inputEl.value = newValue;
       var newLength = newValue.length;
 
@@ -15922,6 +15974,7 @@ InputNumber.defaultProps = {
   localeMatcher: undefined,
   max: null,
   maxFractionDigits: undefined,
+  maxLength: null,
   min: null,
   minFractionDigits: undefined,
   mode: 'decimal',
@@ -18525,6 +18578,8 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
       content = value;
     }
 
+    content = typeof content == 'boolean' ? content.toString() : content;
+
     if (!isRowEditor && editor) {
       /* eslint-disable */
       editorKeyHelper = /*#__PURE__*/React.createElement("a", {
@@ -26816,11 +26871,13 @@ Image.defaultProps = {
   imageClassName: null,
   imageStyle: null,
   onError: null,
+  onHide: null,
+  onShow: null,
   preview: false,
-  zoomSrc: null,
   src: null,
   template: null,
-  width: null
+  width: null,
+  zoomSrc: null
 };
 
 var InplaceDisplay = function InplaceDisplay(props) {
@@ -27724,6 +27781,22 @@ var InputTextarea = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(funct
     props.onKeyUp && props.onKeyUp(event);
   };
 
+  var onKeyDown = function onKeyDown(event) {
+    props.onKeyDown && props.onKeyDown(event);
+
+    if (props.keyfilter) {
+      KeyFilter.onKeyPress(event, props.keyfilter, props.validateOnly);
+    }
+  };
+
+  var onPaste = function onPaste(event) {
+    props.onPaste && props.onPaste(event);
+
+    if (props.keyfilter) {
+      KeyFilter.onPaste(event, props.keyfilter, props.validateOnly);
+    }
+  };
+
   var onInput = function onInput(event) {
     if (props.autoResize) {
       resize();
@@ -27785,7 +27858,9 @@ var InputTextarea = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(funct
     onFocus: onFocus,
     onBlur: onBlur,
     onKeyUp: onKeyUp,
-    onInput: onInput
+    onKeyDown: onKeyDown,
+    onInput: onInput,
+    onPaste: onPaste
   })), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({
     target: elementRef,
     content: props.tooltip
@@ -27795,9 +27870,16 @@ InputTextarea.displayName = 'InputTextarea';
 InputTextarea.defaultProps = {
   __TYPE: 'InputTextarea',
   autoResize: false,
+  keyfilter: null,
+  onBlur: null,
+  onFocus: null,
+  onInput: null,
+  onKeyDown: null,
+  onKeyUp: null,
+  onPaste: null,
   tooltip: null,
   tooltipOptions: null,
-  onInput: null
+  validateOnly: false
 };
 
 var radius = 40;
@@ -37071,7 +37153,7 @@ var Splitter = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   var childrenLength = props.children && props.children.length;
 
   var panelSize = function panelSize(sizes, index) {
-    return index in sizes ? sizes[index] : (props.children[index].props.size || 100) / childrenLength;
+    return index in sizes ? sizes[index] : (props.children[index] && props.children[index].props.size || 100) / childrenLength;
   };
 
   var _useEventListener = useEventListener({
@@ -37193,7 +37275,7 @@ var Splitter = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     setPanelSizes(function (prev) {
       var sizes = [];
 
-      for (var index = 0; index < props.children.length; _readOnlyError("index")) {
+      for (var index = 0; index < props.children.length; index++) {
         sizes[index] = panelSize(prev, index);
       }
 
@@ -38587,7 +38669,7 @@ var TieredMenuSub = /*#__PURE__*/React.memo(function (props) {
     }
 
     if (!item.items) {
-      onLeafClick();
+      onLeafClick(event);
     }
   };
 
@@ -38643,9 +38725,10 @@ var TieredMenuSub = /*#__PURE__*/React.memo(function (props) {
     return prevItem ? DomHandler.hasClass(prevItem, 'p-disabled') || !DomHandler.hasClass(prevItem, 'p-menuitem') ? findPrevItem(prevItem) : prevItem : null;
   };
 
-  var onLeafClick = function onLeafClick() {
+  var onLeafClick = function onLeafClick(event) {
     setActiveItemState(null);
-    props.onLeafClick && props.onLeafClick();
+    props.onLeafClick && props.onLeafClick(event);
+    props.onHide && props.onHide(event);
   };
 
   useMountEffect(function () {
@@ -38836,9 +38919,11 @@ var TieredMenu = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
   };
 
   var hide = function hide(event) {
-    targetRef.current = event.currentTarget;
-    setVisibleState(false);
-    props.onHide && props.onHide(event);
+    if (props.popup) {
+      targetRef.current = event.currentTarget;
+      setVisibleState(false);
+      props.onHide && props.onHide(event);
+    }
   };
 
   var onEnter = function onEnter() {
@@ -38907,7 +38992,8 @@ var TieredMenu = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       menuProps: props,
       model: props.model,
       root: true,
-      popup: props.popup
+      popup: props.popup,
+      onHide: hide
     })));
   };
 
@@ -42517,9 +42603,10 @@ var TreeTableHeader = /*#__PURE__*/React.memo(function (props) {
       var headerTooltip = column.props.headerTooltip;
       var hasTooltip = ObjectUtils.isNotEmpty(headerTooltip);
       var resizer = createResizer(column);
-      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("th", {
+      return /*#__PURE__*/React.createElement(React.Fragment, {
+        key: column.columnKey || column.field || options.index
+      }, /*#__PURE__*/React.createElement("th", {
         ref: headerCellRef,
-        key: column.columnKey || column.field || options.index,
         className: className,
         style: column.props.headerStyle || column.props.style,
         tabIndex: column.props.sortable ? props.tabIndex : null,