primereact 6.5.0 → 7.0.0-rc.1

package/calendar/calendar.js

@@ -133,6 +133,8 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
   function _possibleConstructorReturn(self, call) {
     if (call && (_typeof(call) === "object" || typeof call === "function")) {
       return call;
+    } else if (call !== void 0) {
+      throw new TypeError("Derived constructors may only return object or undefined");
     }
 
     return _assertThisInitialized(self);
@@ -196,7 +198,8 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           ref: this.props.forwardRef,
           className: this.props.className,
           style: this.props.style,
-          onClick: this.props.onClick
+          onClick: this.props.onClick,
+          onMouseUp: this.props.onMouseUp
         }, this.props.children));
       }
     }, {
@@ -283,6 +286,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
       _this.onTodayButtonClick = _this.onTodayButtonClick.bind(_assertThisInitialized(_this));
       _this.onClearButtonClick = _this.onClearButtonClick.bind(_assertThisInitialized(_this));
       _this.onPanelClick = _this.onPanelClick.bind(_assertThisInitialized(_this));
+      _this.onPanelMouseUp = _this.onPanelMouseUp.bind(_assertThisInitialized(_this));
       _this.incrementHour = _this.incrementHour.bind(_assertThisInitialized(_this));
       _this.decrementHour = _this.decrementHour.bind(_assertThisInitialized(_this));
       _this.incrementMinute = _this.incrementMinute.bind(_assertThisInitialized(_this));
@@ -825,6 +829,11 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           });
         }
       }
+    }, {
+      key: "onPanelMouseUp",
+      value: function onPanelMouseUp(event) {
+        this.onPanelClick(event);
+      }
     }, {
       key: "onTimePickerElementMouseDown",
       value: function onTimePickerElementMouseDown(event, type, direction) {
@@ -1879,7 +1888,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
         if (!this.touchUIMask) {
           this.touchUIMask = document.createElement('div');
           this.touchUIMask.style.zIndex = String(core.ZIndexUtils.get(this.overlayRef.current) - 1);
-          core.DomHandler.addMultipleClasses(this.touchUIMask, 'p-component-overlay p-datepicker-mask p-datepicker-mask-scrollblocker');
+          core.DomHandler.addMultipleClasses(this.touchUIMask, 'p-component-overlay p-datepicker-mask p-datepicker-mask-scrollblocker p-component-overlay-enter');
 
           this.touchUIMaskClickListener = function () {
             _this14.disableModality();
@@ -1893,28 +1902,36 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "disableModality",
       value: function disableModality() {
-        if (this.touchUIMask) {
-          this.touchUIMask.removeEventListener('click', this.touchUIMaskClickListener);
-          this.touchUIMaskClickListener = null;
-          document.body.removeChild(this.touchUIMask);
-          this.touchUIMask = null;
-          var bodyChildren = document.body.children;
-          var hasBlockerMasks;
+        var _this15 = this;
 
-          for (var i = 0; i < bodyChildren.length; i++) {
-            var bodyChild = bodyChildren[i];
+        if (this.touchUIMask) {
+          core.DomHandler.addClass(this.touchUIMask, 'p-component-overlay-leave');
+          this.touchUIMask.addEventListener('animationend', function () {
+            _this15.destroyMask();
+          });
+        }
+      }
+    }, {
+      key: "destroyMask",
+      value: function destroyMask() {
+        this.touchUIMask.removeEventListener('click', this.touchUIMaskClickListener);
+        this.touchUIMaskClickListener = null;
+        document.body.removeChild(this.touchUIMask);
+        this.touchUIMask = null;
+        var bodyChildren = document.body.children;
+        var hasBlockerMasks;
 
-            if (core.DomHandler.hasClass(bodyChild, 'p-datepicker-mask-scrollblocker')) {
-              hasBlockerMasks = true;
-              break;
-            }
-          }
+        for (var i = 0; i < bodyChildren.length; i++) {
+          var bodyChild = bodyChildren[i];
 
-          if (!hasBlockerMasks) {
-            core.DomHandler.removeClass(document.body, 'p-overflow-hidden');
+          if (core.DomHandler.hasClass(bodyChild, 'p-datepicker-mask-scrollblocker')) {
+            hasBlockerMasks = true;
+            break;
           }
+        }
 
-          this.hideOverlay();
+        if (!hasBlockerMasks) {
+          core.DomHandler.removeClass(document.body, 'p-overflow-hidden');
         }
       }
     }, {
@@ -2823,12 +2840,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderBackwardNavigator",
       value: function renderBackwardNavigator(isVisible) {
-        var _this15 = this;
+        var _this16 = this;
 
         var navigatorProps = isVisible ? {
           'onClick': this.onPrevButtonClick,
           'onKeyDown': function onKeyDown(e) {
-            return _this15.onContainerButtonKeydown(e);
+            return _this16.onContainerButtonKeydown(e);
           }
         } : {
           'style': {
@@ -2845,12 +2862,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderForwardNavigator",
       value: function renderForwardNavigator(isVisible) {
-        var _this16 = this;
+        var _this17 = this;
 
         var navigatorProps = isVisible ? {
           'onClick': this.onNextButtonClick,
           'onKeyDown': function onKeyDown(e) {
-            return _this16.onContainerButtonKeydown(e);
+            return _this17.onContainerButtonKeydown(e);
           }
         } : {
           'style': {
@@ -2877,7 +2894,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderTitleMonthElement",
       value: function renderTitleMonthElement(month) {
-        var _this17 = this;
+        var _this18 = this;
 
         var monthNames = PrimeReact.localeOption('monthNames', this.props.locale);
 
@@ -2885,7 +2902,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           var viewDate = this.getViewDate();
           var viewMonth = viewDate.getMonth();
           var displayedMonthOptions = monthNames.map(function (month, index) {
-            return (!_this17.isInMinYear(viewDate) || index >= _this17.props.minDate.getMonth()) && (!_this17.isInMaxYear(viewDate) || index <= _this17.props.maxDate.getMonth()) ? {
+            return (!_this18.isInMinYear(viewDate) || index >= _this18.props.minDate.getMonth()) && (!_this18.isInMaxYear(viewDate) || index <= _this18.props.maxDate.getMonth()) ? {
               label: month,
               value: index,
               index: index
@@ -2899,7 +2916,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           var content = /*#__PURE__*/React__default['default'].createElement("select", {
             className: "p-datepicker-month",
             onChange: function onChange(e) {
-              return _this17.onMonthDropdownChange(e, e.target.value);
+              return _this18.onMonthDropdownChange(e, e.target.value);
             },
             value: viewMonth
           }, displayedMonthOptions.map(function (option) {
@@ -2932,7 +2949,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderTitleYearElement",
       value: function renderTitleYearElement(year) {
-        var _this18 = this;
+        var _this19 = this;
 
         if (this.props.yearNavigator) {
           var yearOptions = [];
@@ -2947,12 +2964,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           var viewDate = this.getViewDate();
           var viewYear = viewDate.getFullYear();
           var displayedYearNames = yearOptions.filter(function (year) {
-            return !(_this18.props.minDate && _this18.props.minDate.getFullYear() > year) && !(_this18.props.maxDate && _this18.props.maxDate.getFullYear() < year);
+            return !(_this19.props.minDate && _this19.props.minDate.getFullYear() > year) && !(_this19.props.maxDate && _this19.props.maxDate.getFullYear() < year);
           });
           var content = /*#__PURE__*/React__default['default'].createElement("select", {
             className: "p-datepicker-year",
             onChange: function onChange(e) {
-              return _this18.onYearDropdownChange(e, e.target.value);
+              return _this19.onYearDropdownChange(e, e.target.value);
             },
             value: viewYear
           }, displayedYearNames.map(function (year) {
@@ -3022,26 +3039,26 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderDateCellContent",
       value: function renderDateCellContent(date, className, groupIndex) {
-        var _this19 = this;
+        var _this20 = this;
 
         var content = this.props.dateTemplate ? this.props.dateTemplate(date) : date.day;
         return /*#__PURE__*/React__default['default'].createElement("span", {
           className: className,
           onClick: function onClick(e) {
-            return _this19.onDateSelect(e, date);
+            return _this20.onDateSelect(e, date);
           },
           onKeyDown: function onKeyDown(e) {
-            return _this19.onDateCellKeydown(e, date, groupIndex);
+            return _this20.onDateCellKeydown(e, date, groupIndex);
           }
         }, content, /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
       }
     }, {
       key: "renderWeek",
       value: function renderWeek(weekDates, weekNumber, groupIndex) {
-        var _this20 = this;
+        var _this21 = this;
 
         var week = weekDates.map(function (date) {
-          var selected = _this20.isSelected(date);
+          var selected = _this21.isSelected(date);
 
           var cellClassName = core.classNames({
             'p-datepicker-other-month': date.otherMonth,
@@ -3051,7 +3068,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
             'p-highlight': selected,
             'p-disabled': !date.selectable
           });
-          var content = date.otherMonth && !_this20.props.showOtherMonths ? null : _this20.renderDateCellContent(date, dateClassName, groupIndex);
+          var content = date.otherMonth && !_this21.props.showOtherMonths ? null : _this21.renderDateCellContent(date, dateClassName, groupIndex);
           return /*#__PURE__*/React__default['default'].createElement("td", {
             key: date.day,
             className: cellClassName
@@ -3073,12 +3090,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderDates",
       value: function renderDates(monthMetaData, groupIndex) {
-        var _this21 = this;
+        var _this22 = this;
 
         return monthMetaData.dates.map(function (weekDates, index) {
           return /*#__PURE__*/React__default['default'].createElement("tr", {
             key: index
-          }, _this21.renderWeek(weekDates, monthMetaData.weekNumbers[index], groupIndex));
+          }, _this22.renderWeek(weekDates, monthMetaData.weekNumbers[index], groupIndex));
         });
       }
     }, {
@@ -3111,10 +3128,10 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderMonths",
       value: function renderMonths(monthsMetaData) {
-        var _this22 = this;
+        var _this23 = this;
 
         var groups = monthsMetaData.map(function (monthMetaData, index) {
-          return _this22.renderMonth(monthMetaData, index);
+          return _this23.renderMonth(monthMetaData, index);
         });
         return /*#__PURE__*/React__default['default'].createElement("div", {
           className: "p-datepicker-group-container"
@@ -3131,7 +3148,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderMonthViewMonth",
       value: function renderMonthViewMonth(index) {
-        var _this23 = this;
+        var _this24 = this;
 
         var className = core.classNames('p-monthpicker-month', {
           'p-highlight': this.isMonthSelected(index)
@@ -3142,10 +3159,10 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           key: monthName,
           className: className,
           onClick: function onClick(event) {
-            return _this23.onMonthSelect(event, index);
+            return _this24.onMonthSelect(event, index);
           },
           onKeyDown: function onKeyDown(event) {
-            return _this23.onMonthCellKeydown(event, index);
+            return _this24.onMonthCellKeydown(event, index);
           }
         }, monthName, /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
       }
@@ -3195,7 +3212,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderHourPicker",
       value: function renderHourPicker() {
-        var _this24 = this;
+        var _this25 = this;
 
         var currentTime = this.getCurrentDateTime();
         var hour = currentTime.getHours();
@@ -3211,12 +3228,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           type: "button",
           className: "p-link",
           onMouseDown: function onMouseDown(e) {
-            return _this24.onTimePickerElementMouseDown(e, 0, 1);
+            return _this25.onTimePickerElementMouseDown(e, 0, 1);
           },
           onMouseUp: this.onTimePickerElementMouseUp,
           onMouseLeave: this.onTimePickerElementMouseLeave,
           onKeyDown: function onKeyDown(e) {
-            return _this24.onContainerButtonKeydown(e);
+            return _this25.onContainerButtonKeydown(e);
           }
         }, /*#__PURE__*/React__default['default'].createElement("span", {
           className: "pi pi-chevron-up"
@@ -3224,12 +3241,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           type: "button",
           className: "p-link",
           onMouseDown: function onMouseDown(e) {
-            return _this24.onTimePickerElementMouseDown(e, 0, -1);
+            return _this25.onTimePickerElementMouseDown(e, 0, -1);
           },
           onMouseUp: this.onTimePickerElementMouseUp,
           onMouseLeave: this.onTimePickerElementMouseLeave,
           onKeyDown: function onKeyDown(e) {
-            return _this24.onContainerButtonKeydown(e);
+            return _this25.onContainerButtonKeydown(e);
           }
         }, /*#__PURE__*/React__default['default'].createElement("span", {
           className: "pi pi-chevron-down"
@@ -3238,7 +3255,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderMinutePicker",
       value: function renderMinutePicker() {
-        var _this25 = this;
+        var _this26 = this;
 
         var currentTime = this.getCurrentDateTime();
         var minute = currentTime.getMinutes();
@@ -3249,12 +3266,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           type: "button",
           className: "p-link",
           onMouseDown: function onMouseDown(e) {
-            return _this25.onTimePickerElementMouseDown(e, 1, 1);
+            return _this26.onTimePickerElementMouseDown(e, 1, 1);
           },
           onMouseUp: this.onTimePickerElementMouseUp,
           onMouseLeave: this.onTimePickerElementMouseLeave,
           onKeyDown: function onKeyDown(e) {
-            return _this25.onContainerButtonKeydown(e);
+            return _this26.onContainerButtonKeydown(e);
           }
         }, /*#__PURE__*/React__default['default'].createElement("span", {
           className: "pi pi-chevron-up"
@@ -3262,12 +3279,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           type: "button",
           className: "p-link",
           onMouseDown: function onMouseDown(e) {
-            return _this25.onTimePickerElementMouseDown(e, 1, -1);
+            return _this26.onTimePickerElementMouseDown(e, 1, -1);
           },
           onMouseUp: this.onTimePickerElementMouseUp,
           onMouseLeave: this.onTimePickerElementMouseLeave,
           onKeyDown: function onKeyDown(e) {
-            return _this25.onContainerButtonKeydown(e);
+            return _this26.onContainerButtonKeydown(e);
           }
         }, /*#__PURE__*/React__default['default'].createElement("span", {
           className: "pi pi-chevron-down"
@@ -3276,7 +3293,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderSecondPicker",
       value: function renderSecondPicker() {
-        var _this26 = this;
+        var _this27 = this;
 
         if (this.props.showSeconds) {
           var currentTime = this.getCurrentDateTime();
@@ -3288,12 +3305,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
             type: "button",
             className: "p-link",
             onMouseDown: function onMouseDown(e) {
-              return _this26.onTimePickerElementMouseDown(e, 2, 1);
+              return _this27.onTimePickerElementMouseDown(e, 2, 1);
             },
             onMouseUp: this.onTimePickerElementMouseUp,
             onMouseLeave: this.onTimePickerElementMouseLeave,
             onKeyDown: function onKeyDown(e) {
-              return _this26.onContainerButtonKeydown(e);
+              return _this27.onContainerButtonKeydown(e);
             }
           }, /*#__PURE__*/React__default['default'].createElement("span", {
             className: "pi pi-chevron-up"
@@ -3301,12 +3318,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
             type: "button",
             className: "p-link",
             onMouseDown: function onMouseDown(e) {
-              return _this26.onTimePickerElementMouseDown(e, 2, -1);
+              return _this27.onTimePickerElementMouseDown(e, 2, -1);
             },
             onMouseUp: this.onTimePickerElementMouseUp,
             onMouseLeave: this.onTimePickerElementMouseLeave,
             onKeyDown: function onKeyDown(e) {
-              return _this26.onContainerButtonKeydown(e);
+              return _this27.onContainerButtonKeydown(e);
             }
           }, /*#__PURE__*/React__default['default'].createElement("span", {
             className: "pi pi-chevron-down"
@@ -3318,7 +3335,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderMiliSecondPicker",
       value: function renderMiliSecondPicker() {
-        var _this27 = this;
+        var _this28 = this;
 
         if (this.props.showMillisec) {
           var currentTime = this.getCurrentDateTime();
@@ -3330,12 +3347,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
             type: "button",
             className: "p-link",
             onMouseDown: function onMouseDown(e) {
-              return _this27.onTimePickerElementMouseDown(e, 3, 1);
+              return _this28.onTimePickerElementMouseDown(e, 3, 1);
             },
             onMouseUp: this.onTimePickerElementMouseUp,
             onMouseLeave: this.onTimePickerElementMouseLeave,
             onKeyDown: function onKeyDown(e) {
-              return _this27.onContainerButtonKeydown(e);
+              return _this28.onContainerButtonKeydown(e);
             }
           }, /*#__PURE__*/React__default['default'].createElement("span", {
             className: "pi pi-chevron-up"
@@ -3343,12 +3360,12 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
             type: "button",
             className: "p-link",
             onMouseDown: function onMouseDown(e) {
-              return _this27.onTimePickerElementMouseDown(e, 3, -1);
+              return _this28.onTimePickerElementMouseDown(e, 3, -1);
             },
             onMouseUp: this.onTimePickerElementMouseUp,
             onMouseLeave: this.onTimePickerElementMouseLeave,
             onKeyDown: function onKeyDown(e) {
-              return _this27.onContainerButtonKeydown(e);
+              return _this28.onContainerButtonKeydown(e);
             }
           }, /*#__PURE__*/React__default['default'].createElement("span", {
             className: "pi pi-chevron-down"
@@ -3447,7 +3464,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "renderButtonBar",
       value: function renderButtonBar() {
-        var _this28 = this;
+        var _this29 = this;
 
         if (this.props.showButtonBar) {
           var todayClassName = core.classNames('p-button-text', this.props.todayButtonClassName);
@@ -3464,7 +3481,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
             label: today,
             onClick: this.onTodayButtonClick,
             onKeyDown: function onKeyDown(e) {
-              return _this28.onContainerButtonKeydown(e);
+              return _this29.onContainerButtonKeydown(e);
             },
             className: todayClassName
           }), /*#__PURE__*/React__default['default'].createElement(button.Button, {
@@ -3472,7 +3489,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
             label: clear,
             onClick: this.onClearButtonClick,
             onKeyDown: function onKeyDown(e) {
-              return _this28.onContainerButtonKeydown(e);
+              return _this29.onContainerButtonKeydown(e);
             },
             className: clearClassName
           }));
@@ -3495,7 +3512,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
     }, {
       key: "render",
       value: function render() {
-        var _this29 = this;
+        var _this30 = this;
 
         var className = core.classNames('p-calendar p-component p-inputwrapper', this.props.className, {
           'p-calendar-w-btn': this.props.showIcon,
@@ -3521,7 +3538,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
         var isVisible = this.props.inline || this.isVisible();
         return /*#__PURE__*/React__default['default'].createElement("span", {
           ref: function ref(el) {
-            return _this29.container = el;
+            return _this30.container = el;
           },
           id: this.props.id,
           className: className,
@@ -3533,6 +3550,7 @@ this.primereact.calendar = (function (exports, React, inputtext, button, core, P
           appendTo: this.props.appendTo,
           inline: this.props.inline,
           onClick: this.onPanelClick,
+          onMouseUp: this.onPanelMouseUp,
           in: isVisible,
           onEnter: this.onOverlayEnter,
           onEntered: this.onOverlayEntered,