primevue 3.35.0 → 3.37.0

package/calendar/calendar.cjs.js

@@ -11,7 +11,7 @@ var Portal = require('primevue/portal');
 var Ripple = require('primevue/ripple');
 var utils = require('primevue/utils');
 var BaseComponent = require('primevue/basecomponent');
-var usestyle = require('primevue/usestyle');
+var CalendarStyle = require('primevue/calendar/style');
 var vue = require('vue');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -26,114 +26,8 @@ var OverlayEventBus__default = /*#__PURE__*/_interopDefaultLegacy(OverlayEventBu
 var Portal__default = /*#__PURE__*/_interopDefaultLegacy(Portal);
 var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
 var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+var CalendarStyle__default = /*#__PURE__*/_interopDefaultLegacy(CalendarStyle);
 
-var _classes;
-function _typeof$2(o) { "@babel/helpers - typeof"; return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$2(o); }
-function _defineProperty$1(obj, key, value) { key = _toPropertyKey$1(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey$1(arg) { var key = _toPrimitive$1(arg, "string"); return _typeof$2(key) === "symbol" ? key : String(key); }
-function _toPrimitive$1(input, hint) { if (_typeof$2(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof$2(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-var styles = "\n@layer primevue {\n    .p-calendar {\n        display: inline-flex;\n        max-width: 100%;\n    }\n    \n    .p-calendar .p-inputtext {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n    \n    .p-calendar-w-btn .p-inputtext {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n    \n    .p-calendar-w-btn .p-datepicker-trigger {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n    \n    /* Fluid */\n    .p-fluid .p-calendar {\n        display: flex;\n    }\n    \n    .p-fluid .p-calendar .p-inputtext {\n        width: 1%;\n    }\n    \n    /* Datepicker */\n    .p-calendar .p-datepicker {\n        min-width: 100%;\n    }\n    \n    .p-datepicker {\n        width: auto;\n    }\n    \n    .p-datepicker-inline {\n        display: inline-block;\n        overflow-x: auto;\n    }\n    \n    /* Header */\n    .p-datepicker-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n    \n    .p-datepicker-header .p-datepicker-title {\n        margin: 0 auto;\n    }\n    \n    .p-datepicker-prev,\n    .p-datepicker-next {\n        cursor: pointer;\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    /* Multiple Month DatePicker */\n    .p-datepicker-multiple-month .p-datepicker-group-container {\n        display: flex;\n    }\n    \n    .p-datepicker-multiple-month .p-datepicker-group-container .p-datepicker-group {\n        flex: 1 1 auto;\n    }\n    \n    /* DatePicker Table */\n    .p-datepicker table {\n        width: 100%;\n        border-collapse: collapse;\n    }\n    \n    .p-datepicker td > span {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        margin: 0 auto;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    /* Month Picker */\n    .p-monthpicker-month {\n        width: 33.3%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    /* Year Picker */\n    .p-yearpicker-year {\n        width: 50%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    /*  Button Bar */\n    .p-datepicker-buttonbar {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n    }\n    \n    /* Time Picker */\n    .p-timepicker {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n    \n    .p-timepicker button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n    \n    .p-timepicker > div {\n        display: flex;\n        align-items: center;\n        flex-direction: column;\n    }\n    \n    /* Touch UI */\n    .p-datepicker-touch-ui,\n    .p-calendar .p-datepicker-touch-ui {\n        min-width: 80vw;\n    }\n}\n";
-var inlineStyles = {
-  root: function root(_ref) {
-    var props = _ref.props;
-    return {
-      position: props.appendTo === 'self' ? 'relative' : undefined
-    };
-  }
-};
-var classes = (_classes = {
-  root: function root(_ref2) {
-    var props = _ref2.props,
-      state = _ref2.state;
-    return ['p-calendar p-component p-inputwrapper', {
-      'p-calendar-w-btn': props.showIcon,
-      'p-calendar-timeonly': props.timeOnly,
-      'p-calendar-disabled': props.disabled,
-      'p-inputwrapper-filled': props.modelValue,
-      'p-inputwrapper-focus': state.focused,
-      'p-focus': state.focused || state.overlayVisible
-    }];
-  },
-  input: 'p-inputtext p-component',
-  dropdownButton: 'p-datepicker-trigger',
-  panel: function panel(_ref3) {
-    var instance = _ref3.instance,
-      props = _ref3.props,
-      state = _ref3.state;
-    return ['p-datepicker p-component', {
-      'p-datepicker-inline': props.inline,
-      'p-disabled': props.disabled,
-      'p-datepicker-timeonly': props.timeOnly,
-      'p-datepicker-multiple-month': props.numberOfMonths > 1,
-      'p-datepicker-monthpicker': state.currentView === 'month',
-      'p-datepicker-yearpicker': state.currentView === 'year',
-      'p-datepicker-touch-ui': props.touchUI,
-      'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
-      'p-ripple-disabled': instance.$primevue.config.ripple === false
-    }];
-  },
-  groupContainer: 'p-datepicker-group-container',
-  group: 'p-datepicker-group',
-  header: 'p-datepicker-header',
-  previousButton: 'p-datepicker-prev p-link',
-  previousIcon: 'p-datepicker-prev-icon',
-  title: 'p-datepicker-title',
-  monthTitle: 'p-datepicker-month p-link',
-  yearTitle: 'p-datepicker-year p-link',
-  decadeTitle: 'p-datepicker-decade',
-  nextButton: 'p-datepicker-next p-link',
-  nextIcon: 'p-datepicker-next-icon',
-  container: 'p-datepicker-calendar-container',
-  table: 'p-datepicker-calendar',
-  weekHeader: 'p-datepicker-weekheader p-disabled',
-  weekNumber: 'p-datepicker-weeknumber',
-  weekLabelContainer: 'p-disabled',
-  day: function day(_ref4) {
-    var date = _ref4.date;
-    return [{
-      'p-datepicker-other-month': date.otherMonth,
-      'p-datepicker-today': date.today
-    }];
-  },
-  dayLabel: function dayLabel(_ref5) {
-    var instance = _ref5.instance,
-      date = _ref5.date;
-    return [{
-      'p-highlight': instance.isSelected(date) && date.selectable,
-      'p-disabled': !date.selectable
-    }];
-  },
-  monthPicker: 'p-monthpicker',
-  month: function month(_ref6) {
-    var instance = _ref6.instance,
-      _month = _ref6.month,
-      index = _ref6.index;
-    return ['p-monthpicker-month', {
-      'p-highlight': instance.isMonthSelected(index),
-      'p-disabled': !_month.selectable
-    }];
-  },
-  yearPicker: 'p-yearpicker',
-  year: function year(_ref7) {
-    var instance = _ref7.instance,
-      _year = _ref7.year;
-    return ['p-yearpicker-year', {
-      'p-highlight': instance.isYearSelected(_year.value),
-      'p-disabled': !_year.selectable
-    }];
-  },
-  timePicker: 'p-timepicker',
-  hourPicker: 'p-hour-picker',
-  incrementButton: 'p-link',
-  decrementButton: 'p-link',
-  separatorContainer: 'p-separator',
-  minutePicker: 'p-minute-picker'
-}, _defineProperty$1(_classes, "incrementButton", 'p-link'), _defineProperty$1(_classes, "decrementButton", 'p-link'), _defineProperty$1(_classes, "secondPicker", 'p-second-picker'), _defineProperty$1(_classes, "ampmPicker", 'p-ampm-picker'), _defineProperty$1(_classes, "buttonbar", 'p-datepicker-buttonbar'), _defineProperty$1(_classes, "todayButton", 'p-button-text'), _defineProperty$1(_classes, "clearButton", 'p-button-text'), _classes);
-var _useStyle = usestyle.useStyle(styles, {
-    name: 'calendar',
-    manual: true
-  }),
-  loadStyle = _useStyle.load;
 var script$1 = {
   name: 'BaseCalendar',
   "extends": BaseComponent__default["default"],
@@ -353,11 +247,7 @@ var script$1 = {
       "default": null
     }
   },
-  css: {
-    inlineStyles: inlineStyles,
-    classes: classes,
-    loadStyle: loadStyle
-  },
+  style: CalendarStyle__default["default"],
   provide: function provide() {
     return {
       $parentInstance: this
@@ -527,16 +417,29 @@ var script = {
       return false;
     },
     isMonthSelected: function isMonthSelected(month) {
+      var _this2 = this;
       if (this.isComparable()) {
         var value = this.isRangeSelection() ? this.modelValue[0] : this.modelValue;
-        return !this.isMultipleSelection() ? value.getMonth() === month && value.getFullYear() === this.currentYear : false;
+        if (this.isMultipleSelection()) {
+          return value.some(function (currentValue) {
+            return currentValue.getMonth() === month && currentValue.getFullYear() === _this2.currentYear;
+          });
+        } else {
+          return value.getMonth() === month && value.getFullYear() === this.currentYear;
+        }
       }
       return false;
     },
     isYearSelected: function isYearSelected(year) {
       if (this.isComparable()) {
         var value = this.isRangeSelection() ? this.modelValue[0] : this.modelValue;
-        return !this.isMultipleSelection() && this.isComparable() ? value.getFullYear() === year : false;
+        if (this.isMultipleSelection()) {
+          return value.some(function (currentValue) {
+            return currentValue.getFullYear() === year;
+          });
+        } else {
+          return value.getFullYear() === year;
+        }
       }
       return false;
     },
@@ -800,11 +703,11 @@ var script = {
       this.currentSecond = Math.floor(date.getSeconds() / this.stepSecond) * this.stepSecond;
     },
     bindOutsideClickListener: function bindOutsideClickListener() {
-      var _this2 = this;
+      var _this3 = this;
       if (!this.outsideClickListener) {
         this.outsideClickListener = function (event) {
-          if (_this2.overlayVisible && _this2.isOutsideClicked(event)) {
-            _this2.overlayVisible = false;
+          if (_this3.overlayVisible && _this3.isOutsideClicked(event)) {
+            _this3.overlayVisible = false;
           }
         };
         document.addEventListener('mousedown', this.outsideClickListener);
@@ -817,11 +720,11 @@ var script = {
       }
     },
     bindScrollListener: function bindScrollListener() {
-      var _this3 = this;
+      var _this4 = this;
       if (!this.scrollHandler) {
         this.scrollHandler = new utils.ConnectedOverlayScrollHandler(this.$refs.container, function () {
-          if (_this3.overlayVisible) {
-            _this3.overlayVisible = false;
+          if (_this4.overlayVisible) {
+            _this4.overlayVisible = false;
           }
         });
       }
@@ -833,11 +736,11 @@ var script = {
       }
     },
     bindResizeListener: function bindResizeListener() {
-      var _this4 = this;
+      var _this5 = this;
       if (!this.resizeListener) {
         this.resizeListener = function () {
-          if (_this4.overlayVisible && !utils.DomHandler.isTouchDevice()) {
-            _this4.overlayVisible = false;
+          if (_this5.overlayVisible && !utils.DomHandler.isTouchDevice()) {
+            _this5.overlayVisible = false;
           }
         };
         window.addEventListener('resize', this.resizeListener);
@@ -924,7 +827,7 @@ var script = {
       });
     },
     onDateSelect: function onDateSelect(event, dateMeta) {
-      var _this5 = this;
+      var _this6 = this;
       if (this.disabled || !dateMeta.selectable) {
         return;
       }
@@ -936,7 +839,7 @@ var script = {
       }
       if (this.isMultipleSelection() && this.isSelected(dateMeta)) {
         var newValue = this.modelValue.filter(function (date) {
-          return !_this5.isDateEquals(date, dateMeta);
+          return !_this6.isDateEquals(date, dateMeta);
         });
         this.updateModel(newValue);
       } else {
@@ -952,15 +855,15 @@ var script = {
       }
       if (this.isSingleSelection() && (!this.showTime || this.hideOnDateTimeSelect)) {
         setTimeout(function () {
-          if (_this5.input) {
-            _this5.input.focus();
+          if (_this6.input) {
+            _this6.input.focus();
           }
-          _this5.overlayVisible = false;
+          _this6.overlayVisible = false;
         }, 150);
       }
     },
     selectDate: function selectDate(dateMeta) {
-      var _this6 = this;
+      var _this7 = this;
       var date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);
       if (this.showTime) {
         if (this.hourFormat === '12' && this.pm && this.currentHour != 12) date.setHours(this.currentHour + 12);else date.setHours(this.currentHour);
@@ -1004,7 +907,7 @@ var script = {
       }
       if (this.isRangeSelection() && this.hideOnRangeSelection && modelVal[1] !== null) {
         setTimeout(function () {
-          _this6.overlayVisible = false;
+          _this7.overlayVisible = false;
         }, 150);
       }
       this.$emit('date-select', date);
@@ -1210,11 +1113,11 @@ var script = {
       this.clearTimePickerTimer();
     },
     repeat: function repeat(event, interval, type, direction) {
-      var _this7 = this;
+      var _this8 = this;
       var i = interval || 500;
       this.clearTimePickerTimer();
       this.timePickerTimer = setTimeout(function () {
-        _this7.repeat(event, 100, type, direction);
+        _this8.repeat(event, 100, type, direction);
       }, i);
       switch (type) {
         case 0:
@@ -1344,7 +1247,7 @@ var script = {
       event.preventDefault();
     },
     updateModelTime: function updateModelTime() {
-      var _this8 = this;
+      var _this9 = this;
       this.timePickerChange = true;
       var value = this.isComparable() ? this.modelValue : this.viewDate;
       if (this.isRangeSelection()) {
@@ -1370,7 +1273,7 @@ var script = {
       this.updateModel(value);
       this.$emit('date-select', value);
       setTimeout(function () {
-        return _this8.timePickerChange = false;
+        return _this9.timePickerChange = false;
       }, 0);
     },
     toggleAMPM: function toggleAMPM(event) {
@@ -1424,30 +1327,29 @@ var script = {
       setTimeout(this.updateFocus, 0);
     },
     enableModality: function enableModality() {
-      var _this9 = this;
+      var _this10 = this;
       if (!this.mask) {
         this.mask = document.createElement('div');
         this.mask.style.zIndex = String(parseInt(this.overlay.style.zIndex, 10) - 1);
         this.mask.setAttribute('data-pc-section', 'datepicker-mask');
         !this.isUnstyled && utils.DomHandler.addMultipleClasses(this.mask, 'p-datepicker-mask p-datepicker-mask-scrollblocker p-component-overlay p-component-overlay-enter');
         this.maskClickListener = function () {
-          _this9.overlayVisible = false;
+          _this10.overlayVisible = false;
         };
         this.mask.addEventListener('click', this.maskClickListener);
         document.body.appendChild(this.mask);
-        utils.DomHandler.addClass(document.body, 'p-overflow-hidden');
-        document.body.style.setProperty('--scrollbar-width', utils.DomHandler.calculateScrollbarWidth() + 'px');
+        utils.DomHandler.blockBodyScroll();
       }
     },
     disableModality: function disableModality() {
-      var _this10 = this;
+      var _this11 = this;
       if (this.mask) {
         if (this.isUnstyled) {
           this.destroyMask();
         } else {
           utils.DomHandler.addClass(this.mask, 'p-component-overlay-leave');
           this.mask.addEventListener('animationend', function () {
-            _this10.destroyMask();
+            _this11.destroyMask();
           });
         }
       }
@@ -1467,8 +1369,7 @@ var script = {
         }
       }
       if (!hasBlockerMasks) {
-        utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
-        document.body.style.removeProperty('--scrollbar-width');
+        utils.DomHandler.unblockBodyScroll();
       }
     },
     updateCurrentMetaData: function updateCurrentMetaData() {
@@ -1480,7 +1381,7 @@ var script = {
       }
     },
     isValidSelection: function isValidSelection(value) {
-      var _this11 = this;
+      var _this12 = this;
       if (value == null) {
         return true;
       }
@@ -1490,7 +1391,7 @@ var script = {
           isValid = false;
         }
       } else if (value.every(function (v) {
-        return _this11.isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false);
+        return _this12.isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false);
       })) {
         if (this.isRangeSelection()) {
           isValid = value.length > 1 && value[1] > value[0] ? true : false;
@@ -1571,6 +1472,8 @@ var script = {
       } else {
         if (this.hourFormat == '12' && h !== 12 && this.pm) {
           h += 12;
+        } else if (this.hourFormat == '12' && h == 12 && !this.pm) {
+          h = 0;
         }
         return {
           hour: h,
@@ -2346,9 +2249,7 @@ var script = {
         }
         var innerHTML = '';
         if (this.responsiveOptions) {
-          var comparer = new Intl.Collator(undefined, {
-            numeric: true
-          }).compare;
+          var comparer = ObjectUtils.localeComparator();
           var responsiveOptions = _toConsumableArray(this.responsiveOptions).filter(function (o) {
             return !!(o.breakpoint && o.numMonths);
           }).sort(function (o1, o2) {
@@ -2520,20 +2421,20 @@ var script = {
       }
     },
     monthPickerValues: function monthPickerValues() {
-      var _this12 = this;
+      var _this13 = this;
       var monthPickerValues = [];
       var isSelectableMonth = function isSelectableMonth(baseMonth) {
-        if (_this12.minDate) {
-          var minMonth = _this12.minDate.getMonth();
-          var minYear = _this12.minDate.getFullYear();
-          if (_this12.currentYear < minYear || _this12.currentYear === minYear && baseMonth < minMonth) {
+        if (_this13.minDate) {
+          var minMonth = _this13.minDate.getMonth();
+          var minYear = _this13.minDate.getFullYear();
+          if (_this13.currentYear < minYear || _this13.currentYear === minYear && baseMonth < minMonth) {
             return false;
           }
         }
-        if (_this12.maxDate) {
-          var maxMonth = _this12.maxDate.getMonth();
-          var maxYear = _this12.maxDate.getFullYear();
-          if (_this12.currentYear > maxYear || _this12.currentYear === maxYear && baseMonth > maxMonth) {
+        if (_this13.maxDate) {
+          var maxMonth = _this13.maxDate.getMonth();
+          var maxYear = _this13.maxDate.getFullYear();
+          if (_this13.currentYear > maxYear || _this13.currentYear === maxYear && baseMonth > maxMonth) {
             return false;
           }
         }
@@ -2548,15 +2449,15 @@ var script = {
       return monthPickerValues;
     },
     yearPickerValues: function yearPickerValues() {
-      var _this13 = this;
+      var _this14 = this;
       var yearPickerValues = [];
       var base = this.currentYear - this.currentYear % 10;
       var isSelectableYear = function isSelectableYear(baseYear) {
-        if (_this13.minDate) {
-          if (_this13.minDate.getFullYear() > baseYear) return false;
+        if (_this14.minDate) {
+          if (_this14.minDate.getFullYear() > baseYear) return false;
         }
-        if (_this13.maxDate) {
-          if (_this13.maxDate.getFullYear() < baseYear) return false;
+        if (_this14.maxDate) {
+          if (_this14.maxDate.getFullYear() < baseYear) return false;
         }
         return true;
       };