primevue 3.34.0 → 3.35.0

package/calendar/calendar.js

@@ -20,7 +20,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
     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.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";
+    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;
@@ -38,7 +38,8 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
           'p-calendar-timeonly': props.timeOnly,
           'p-calendar-disabled': props.disabled,
           'p-inputwrapper-filled': props.modelValue,
-          'p-inputwrapper-focus': state.focused
+          'p-inputwrapper-focus': state.focused,
+          'p-focus': state.focused || state.overlayVisible
         }];
       },
       input: 'p-inputtext p-component',
@@ -86,7 +87,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
         var instance = _ref5.instance,
           date = _ref5.date;
         return [{
-          'p-highlight': instance.isSelected(date),
+          'p-highlight': instance.isSelected(date) && date.selectable,
           'p-disabled': !date.selectable
         }];
       },
@@ -1423,6 +1424,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
             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');
           }
         },
         disableModality: function disableModality() {
@@ -1454,6 +1456,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
           }
           if (!hasBlockerMasks) {
             utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
+            document.body.style.removeProperty('--scrollbar-width');
           }
         },
         updateCurrentMetaData: function updateCurrentMetaData() {
@@ -1764,30 +1767,35 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
             case 'ArrowUp':
               {
                 cellContent.tabIndex = '-1';
-                var prevRow = cell.parentElement.previousElementSibling;
-                if (prevRow) {
-                  var _tableRowIndex = utils.DomHandler.index(cell.parentElement);
-                  var _tableRows = Array.from(cell.parentElement.parentElement.children);
-                  var prevTableRows = _tableRows.slice(0, _tableRowIndex).reverse();
-                  var _hasNextFocusableDate = prevTableRows.find(function (el) {
-                    var focusCell = el.children[cellIndex].children[0];
-                    return !utils.DomHandler.getAttribute(focusCell, 'data-p-disabled');
-                  });
-                  if (_hasNextFocusableDate) {
-                    var _focusCell = _hasNextFocusableDate.children[cellIndex].children[0];
-                    _focusCell.tabIndex = '0';
-                    _focusCell.focus();
+                if (event.altKey) {
+                  this.overlayVisible = false;
+                  this.focused = true;
+                } else {
+                  var prevRow = cell.parentElement.previousElementSibling;
+                  if (prevRow) {
+                    var _tableRowIndex = utils.DomHandler.index(cell.parentElement);
+                    var _tableRows = Array.from(cell.parentElement.parentElement.children);
+                    var prevTableRows = _tableRows.slice(0, _tableRowIndex).reverse();
+                    var _hasNextFocusableDate = prevTableRows.find(function (el) {
+                      var focusCell = el.children[cellIndex].children[0];
+                      return !utils.DomHandler.getAttribute(focusCell, 'data-p-disabled');
+                    });
+                    if (_hasNextFocusableDate) {
+                      var _focusCell = _hasNextFocusableDate.children[cellIndex].children[0];
+                      _focusCell.tabIndex = '0';
+                      _focusCell.focus();
+                    } else {
+                      this.navigationState = {
+                        backward: true
+                      };
+                      this.navBackward(event);
+                    }
                   } else {
                     this.navigationState = {
                       backward: true
                     };
                     this.navBackward(event);
                   }
-                } else {
-                  this.navigationState = {
-                    backward: true
-                  };
-                  this.navBackward(event);
                 }
                 event.preventDefault();
                 break;
@@ -2173,14 +2181,14 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
           } else {
             cell = utils.DomHandler.findSingle(this.overlay, 'span[data-p-highlight="true"]');
             if (!cell) {
-              var todayCell = utils.DomHandler.findSingle(this.overlay, 'td.p-datepicker-today span:not(.p-disabled):not(.p-ink)');
-              if (todayCell) cell = todayCell;else cell = utils.DomHandler.findSingle(this.overlay, '.p-datepicker-calendar td span:not(.p-disabled):not(.p-ink)');
+              var todayCell = utils.DomHandler.findSingle(this.overlay, 'td.p-datepicker-today span:not([data-p-disabled="true"]):not([data-p-ink="true"])');
+              if (todayCell) cell = todayCell;else cell = utils.DomHandler.findSingle(this.overlay, '.p-datepicker-calendar td span:not([data-p-disabled="true"]):not([data-p-ink="true"])');
             }
           }
           if (cell) {
             cell.tabIndex = '0';
             if (!this.inline && (!this.navigationState || !this.navigationState.button) && !this.timePickerChange) {
-              cell.focus();
+              if (!this.manualInput) cell.focus();
             }
             this.preventFocus = false;
           }
@@ -2606,21 +2614,23 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
     var _hoisted_5 = ["disabled", "aria-label"];
     var _hoisted_6 = ["disabled", "aria-label"];
     var _hoisted_7 = ["disabled", "aria-label"];
-    var _hoisted_8 = ["data-p-disabled"];
-    var _hoisted_9 = ["abbr"];
+    var _hoisted_8 = ["disabled", "aria-label"];
+    var _hoisted_9 = ["disabled", "aria-label"];
     var _hoisted_10 = ["data-p-disabled"];
-    var _hoisted_11 = ["aria-label", "data-p-today", "data-p-other-month"];
-    var _hoisted_12 = ["onClick", "onKeydown", "aria-selected", "aria-disabled", "data-p-disabled", "data-p-highlight"];
-    var _hoisted_13 = ["onClick", "onKeydown", "data-p-disabled", "data-p-highlight"];
-    var _hoisted_14 = ["onClick", "onKeydown", "data-p-disabled", "data-p-highlight"];
-    var _hoisted_15 = ["aria-label"];
-    var _hoisted_16 = ["aria-label"];
-    var _hoisted_17 = ["aria-label", "disabled"];
-    var _hoisted_18 = ["aria-label", "disabled"];
+    var _hoisted_11 = ["abbr"];
+    var _hoisted_12 = ["data-p-disabled"];
+    var _hoisted_13 = ["aria-label", "data-p-today", "data-p-other-month"];
+    var _hoisted_14 = ["onClick", "onKeydown", "aria-selected", "aria-disabled", "data-p-disabled", "data-p-highlight"];
+    var _hoisted_15 = ["onClick", "onKeydown", "data-p-disabled", "data-p-highlight"];
+    var _hoisted_16 = ["onClick", "onKeydown", "data-p-disabled", "data-p-highlight"];
+    var _hoisted_17 = ["aria-label"];
+    var _hoisted_18 = ["aria-label"];
     var _hoisted_19 = ["aria-label", "disabled"];
     var _hoisted_20 = ["aria-label", "disabled"];
     var _hoisted_21 = ["aria-label", "disabled"];
     var _hoisted_22 = ["aria-label", "disabled"];
+    var _hoisted_23 = ["aria-label", "disabled"];
+    var _hoisted_24 = ["aria-label", "disabled"];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       var _component_CalendarButton = vue.resolveComponent("CalendarButton");
       var _component_Portal = vue.resolveComponent("Portal");
@@ -2682,11 +2692,13 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
         "data-pc-section": "dropdownbutton"
       }, {
         icon: vue.withCtx(function () {
-          return [vue.renderSlot(_ctx.$slots, "dropdownicon", {}, function () {
+          return [vue.renderSlot(_ctx.$slots, "dropdownicon", {
+            "class": vue.normalizeClass(_ctx.icon)
+          }, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.icon ? 'span' : 'CalendarIcon'), vue.mergeProps({
               "class": _ctx.icon
             }, _ctx.ptm('dropdownButton')['icon'], {
-              "data-pc-section": "icon"
+              "data-pc-section": "dropdownicon"
             }), null, 16, ["class"]))];
           })];
         }),
@@ -2698,7 +2710,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
         "default": vue.withCtx(function () {
           return [vue.createVNode(vue.Transition, vue.mergeProps({
             name: "p-connected-overlay",
-            onEnter: _cache[70] || (_cache[70] = function ($event) {
+            onEnter: _cache[74] || (_cache[74] = function ($event) {
               return $options.onOverlayEnter($event);
             }),
             onAfterEnter: $options.onOverlayEnterComplete,
@@ -2715,13 +2727,13 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 role: _ctx.inline ? null : 'dialog',
                 "aria-modal": _ctx.inline ? null : 'true',
                 "aria-label": _ctx.$primevue.config.locale.chooseDate,
-                onClick: _cache[67] || (_cache[67] = function () {
+                onClick: _cache[71] || (_cache[71] = function () {
                   return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
                 }),
-                onKeydown: _cache[68] || (_cache[68] = function () {
+                onKeydown: _cache[72] || (_cache[72] = function () {
                   return $options.onOverlayKeyDown && $options.onOverlayKeyDown.apply($options, arguments);
                 }),
-                onMouseup: _cache[69] || (_cache[69] = function () {
+                onMouseup: _cache[73] || (_cache[73] = function () {
                   return $options.onOverlayMouseUp && $options.onOverlayMouseUp.apply($options, arguments);
                 })
               }, _objectSpread(_objectSpread({}, _ctx.panelProps), _ctx.ptm('panel'))), [!_ctx.timeOnly ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
@@ -2757,27 +2769,59 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                   }, _ctx.ptm('previousIcon')), null, 16, ["class"]))];
                 })], 16, _hoisted_4)), [[vue.vShow, _ctx.showOtherMonths ? groupIndex === 0 : false], [_directive_ripple]]), vue.createElementVNode("div", vue.mergeProps({
                   "class": _ctx.cx('title')
-                }, _ctx.ptm('title')), [$data.currentView === 'date' ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+                }, _ctx.ptm('title')), [_ctx.$primevue.config.locale.showMonthAfterYear ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+                  key: 0
+                }, [$data.currentView !== 'year' ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                   key: 0,
                   type: "button",
                   onClick: _cache[7] || (_cache[7] = function () {
-                    return $options.switchToMonthView && $options.switchToMonthView.apply($options, arguments);
+                    return $options.switchToYearView && $options.switchToYearView.apply($options, arguments);
                   }),
                   onKeydown: _cache[8] || (_cache[8] = function () {
                     return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
                   }),
+                  "class": _ctx.cx('yearTitle'),
+                  disabled: $options.switchViewButtonDisabled,
+                  "aria-label": _ctx.$primevue.config.locale.chooseYear
+                }, _ctx.ptm('yearTitle'), {
+                  "data-pc-group-section": "view"
+                }), vue.toDisplayString($options.getYear(month)), 17, _hoisted_5)) : vue.createCommentVNode("", true), $data.currentView === 'date' ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+                  key: 1,
+                  type: "button",
+                  onClick: _cache[9] || (_cache[9] = function () {
+                    return $options.switchToMonthView && $options.switchToMonthView.apply($options, arguments);
+                  }),
+                  onKeydown: _cache[10] || (_cache[10] = function () {
+                    return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
+                  }),
+                  "class": _ctx.cx('monthTitle'),
+                  disabled: $options.switchViewButtonDisabled,
+                  "aria-label": _ctx.$primevue.config.locale.chooseMonth
+                }, _ctx.ptm('monthTitle'), {
+                  "data-pc-group-section": "view"
+                }), vue.toDisplayString($options.getMonthName(month.month)), 17, _hoisted_6)) : vue.createCommentVNode("", true)], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+                  key: 1
+                }, [$data.currentView === 'date' ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+                  key: 0,
+                  type: "button",
+                  onClick: _cache[11] || (_cache[11] = function () {
+                    return $options.switchToMonthView && $options.switchToMonthView.apply($options, arguments);
+                  }),
+                  onKeydown: _cache[12] || (_cache[12] = function () {
+                    return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
+                  }),
                   "class": _ctx.cx('monthTitle'),
                   disabled: $options.switchViewButtonDisabled,
                   "aria-label": _ctx.$primevue.config.locale.chooseMonth
                 }, _ctx.ptm('monthTitle'), {
                   "data-pc-group-section": "view"
-                }), vue.toDisplayString($options.getMonthName(month.month)), 17, _hoisted_5)) : vue.createCommentVNode("", true), $data.currentView !== 'year' ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+                }), vue.toDisplayString($options.getMonthName(month.month)), 17, _hoisted_7)) : vue.createCommentVNode("", true), $data.currentView !== 'year' ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                   key: 1,
                   type: "button",
-                  onClick: _cache[9] || (_cache[9] = function () {
+                  onClick: _cache[13] || (_cache[13] = function () {
                     return $options.switchToYearView && $options.switchToYearView.apply($options, arguments);
                   }),
-                  onKeydown: _cache[10] || (_cache[10] = function () {
+                  onKeydown: _cache[14] || (_cache[14] = function () {
                     return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
                   }),
                   "class": _ctx.cx('yearTitle'),
@@ -2785,7 +2829,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                   "aria-label": _ctx.$primevue.config.locale.chooseYear
                 }, _ctx.ptm('yearTitle'), {
                   "data-pc-group-section": "view"
-                }), vue.toDisplayString($options.getYear(month)), 17, _hoisted_6)) : vue.createCommentVNode("", true), $data.currentView === 'year' ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+                }), vue.toDisplayString($options.getYear(month)), 17, _hoisted_8)) : vue.createCommentVNode("", true)], 64)), $data.currentView === 'year' ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
                   key: 2,
                   "class": _ctx.cx('decadeTitle')
                 }, _ctx.ptm('decadeTitle')), [vue.renderSlot(_ctx.$slots, "decade", {
@@ -2796,11 +2840,11 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                   ref_for: true,
                   ref: $options.nextButtonRef,
                   "class": _ctx.cx('nextButton'),
-                  onClick: _cache[11] || (_cache[11] = function () {
+                  onClick: _cache[15] || (_cache[15] = function () {
                     return $options.onNextButtonClick && $options.onNextButtonClick.apply($options, arguments);
                   }),
                   type: "button",
-                  onKeydown: _cache[12] || (_cache[12] = function () {
+                  onKeydown: _cache[16] || (_cache[16] = function () {
                     return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
                   }),
                   disabled: _ctx.disabled,
@@ -2813,7 +2857,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                   return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.nextIcon ? 'span' : 'ChevronRightIcon'), vue.mergeProps({
                     "class": [_ctx.cx('nextIcon'), _ctx.nextIcon]
                   }, _ctx.ptm('nextIcon')), null, 16, ["class"]))];
-                })], 16, _hoisted_7)), [[vue.vShow, _ctx.showOtherMonths ? _ctx.numberOfMonths === 1 ? true : groupIndex === _ctx.numberOfMonths - 1 : false], [_directive_ripple]])], 16), $data.currentView === 'date' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+                })], 16, _hoisted_9)), [[vue.vShow, _ctx.showOtherMonths ? _ctx.numberOfMonths === 1 ? true : groupIndex === _ctx.numberOfMonths - 1 : false], [_directive_ripple]])], 16), $data.currentView === 'date' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                   key: 0,
                   "class": _ctx.cx('container')
                 }, _ctx.ptm('container')), [vue.createElementVNode("table", vue.mergeProps({
@@ -2832,7 +2876,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                   "data-pc-group-section": "tableheadercell"
                 }), [vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('weekLabel'), {
                   "data-pc-group-section": "tableheadercelllabel"
-                }), vue.toDisplayString($options.weekHeaderLabel), 17)], 16, _hoisted_8)) : vue.createCommentVNode("", true), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.weekDays, function (weekDay) {
+                }), vue.toDisplayString($options.weekHeaderLabel), 17)], 16, _hoisted_10)) : vue.createCommentVNode("", true), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.weekDays, function (weekDay) {
                   return vue.openBlock(), vue.createElementBlock("th", vue.mergeProps({
                     key: weekDay,
                     scope: "col",
@@ -2841,7 +2885,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                     "data-pc-group-section": "tableheadercell"
                   }), [vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('weekDay'), {
                     "data-pc-group-section": "tableheadercelllabel"
-                  }), vue.toDisplayString(weekDay), 17)], 16, _hoisted_9);
+                  }), vue.toDisplayString(weekDay), 17)], 16, _hoisted_11);
                 }), 128))], 16)], 16), vue.createElementVNode("tbody", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('tableBody'))), [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(month.dates, function (week, i) {
                   return vue.openBlock(), vue.createElementBlock("tr", vue.mergeProps({
                     key: week[0].day + '' + week[0].month
@@ -2864,7 +2908,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                     style: {
                       "visibility": "hidden"
                     }
-                  }, _ctx.ptm('weekLabel')), "0", 16)) : vue.createCommentVNode("", true), vue.createTextVNode(" " + vue.toDisplayString(month.weekNumbers[i]), 1)], 16, _hoisted_10)], 16)) : vue.createCommentVNode("", true), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(week, function (date) {
+                  }, _ctx.ptm('weekLabel')), "0", 16)) : vue.createCommentVNode("", true), vue.createTextVNode(" " + vue.toDisplayString(month.weekNumbers[i]), 1)], 16, _hoisted_12)], 16)) : vue.createCommentVNode("", true), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(week, function (date) {
                     return vue.openBlock(), vue.createElementBlock("td", vue.mergeProps({
                       key: date.day + '' + date.month,
                       "aria-label": date.day,
@@ -2908,13 +2952,13 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                       date: date
                     }, function () {
                       return [vue.createTextVNode(vue.toDisplayString(date.day), 1)];
-                    })], 16, _hoisted_12)), [[_directive_ripple]]), $options.isSelected(date) ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+                    })], 16, _hoisted_14)), [[_directive_ripple]]), $options.isSelected(date) ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                       key: 0,
                       "class": "p-hidden-accessible",
                       "aria-live": "polite"
                     }, _ctx.ptm('hiddenSelectedDay'), {
                       "data-p-hidden-accessible": true
-                    }), vue.toDisplayString(date.day), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_11);
+                    }), vue.toDisplayString(date.day), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_13);
                   }), 128))], 16);
                 }), 128))], 16)], 16)], 16)) : vue.createCommentVNode("", true)], 16);
               }), 128))], 16), $data.currentView === 'month' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
@@ -2955,7 +2999,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                   "aria-live": "polite"
                 }, _ctx.ptm('hiddenMonth'), {
                   "data-p-hidden-accessible": true
-                }), vue.toDisplayString(m.value), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_13)), [[_directive_ripple]]);
+                }), vue.toDisplayString(m.value), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_15)), [[_directive_ripple]]);
               }), 128))], 16)) : vue.createCommentVNode("", true), $data.currentView === 'year' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 1,
                 "class": _ctx.cx('yearPicker')
@@ -2986,7 +3030,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                   "aria-live": "polite"
                 }, _ctx.ptm('hiddenYear'), {
                   "data-p-hidden-accessible": true
-                }), vue.toDisplayString(y.value), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_14)), [[_directive_ripple]]);
+                }), vue.toDisplayString(y.value), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_16)), [[_directive_ripple]]);
               }), 128))], 16)) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true), (_ctx.showTime || _ctx.timeOnly) && $data.currentView === 'date' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 1,
                 "class": _ctx.cx('timePicker')
@@ -2997,25 +3041,25 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
               }), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('incrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.nextHour,
-                onMousedown: _cache[13] || (_cache[13] = function ($event) {
+                onMousedown: _cache[17] || (_cache[17] = function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 0, 1);
                 }),
-                onMouseup: _cache[14] || (_cache[14] = function ($event) {
+                onMouseup: _cache[18] || (_cache[18] = function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }),
-                onKeydown: [_cache[15] || (_cache[15] = function () {
+                onKeydown: [_cache[19] || (_cache[19] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
-                }), _cache[17] || (_cache[17] = vue.withKeys(function ($event) {
+                }), _cache[21] || (_cache[21] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 0, 1);
-                }, ["enter"])), _cache[18] || (_cache[18] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[22] || (_cache[22] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 0, 1);
                 }, ["space"]))],
-                onMouseleave: _cache[16] || (_cache[16] = function ($event) {
+                onMouseleave: _cache[20] || (_cache[20] = function ($event) {
                   return $options.onTimePickerElementMouseLeave();
                 }),
-                onKeyup: [_cache[19] || (_cache[19] = vue.withKeys(function ($event) {
+                onKeyup: [_cache[23] || (_cache[23] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
-                }, ["enter"])), _cache[20] || (_cache[20] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[24] || (_cache[24] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }, ["space"]))],
                 type: "button"
@@ -3027,30 +3071,30 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('incrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_15)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('hour'), {
+              })], 16, _hoisted_17)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('hour'), {
                 "data-pc-group-section": "timepickerlabel"
               }), vue.toDisplayString($options.formattedCurrentHour), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('decrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.prevHour,
-                onMousedown: _cache[21] || (_cache[21] = function ($event) {
+                onMousedown: _cache[25] || (_cache[25] = function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 0, -1);
                 }),
-                onMouseup: _cache[22] || (_cache[22] = function ($event) {
+                onMouseup: _cache[26] || (_cache[26] = function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }),
-                onKeydown: [_cache[23] || (_cache[23] = function () {
+                onKeydown: [_cache[27] || (_cache[27] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
-                }), _cache[25] || (_cache[25] = vue.withKeys(function ($event) {
+                }), _cache[29] || (_cache[29] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 0, -1);
-                }, ["enter"])), _cache[26] || (_cache[26] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[30] || (_cache[30] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 0, -1);
                 }, ["space"]))],
-                onMouseleave: _cache[24] || (_cache[24] = function ($event) {
+                onMouseleave: _cache[28] || (_cache[28] = function ($event) {
                   return $options.onTimePickerElementMouseLeave();
                 }),
-                onKeyup: [_cache[27] || (_cache[27] = vue.withKeys(function ($event) {
+                onKeyup: [_cache[31] || (_cache[31] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
-                }, ["enter"])), _cache[28] || (_cache[28] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[32] || (_cache[32] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }, ["space"]))],
                 type: "button"
@@ -3062,7 +3106,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('decrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_16)), [[_directive_ripple]])], 16), vue.createElementVNode("div", vue.mergeProps({
+              })], 16, _hoisted_18)), [[_directive_ripple]])], 16), vue.createElementVNode("div", vue.mergeProps({
                 "class": _ctx.cx('separatorContainer')
               }, _ctx.ptm('separatorContainer'), {
                 "data-pc-group-section": "timepickerContainer"
@@ -3075,26 +3119,26 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
               }), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('incrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.nextMinute,
-                onMousedown: _cache[29] || (_cache[29] = function ($event) {
+                onMousedown: _cache[33] || (_cache[33] = function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 1, 1);
                 }),
-                onMouseup: _cache[30] || (_cache[30] = function ($event) {
+                onMouseup: _cache[34] || (_cache[34] = function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }),
-                onKeydown: [_cache[31] || (_cache[31] = function () {
+                onKeydown: [_cache[35] || (_cache[35] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
-                }), _cache[33] || (_cache[33] = vue.withKeys(function ($event) {
+                }), _cache[37] || (_cache[37] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 1, 1);
-                }, ["enter"])), _cache[34] || (_cache[34] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[38] || (_cache[38] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 1, 1);
                 }, ["space"]))],
                 disabled: _ctx.disabled,
-                onMouseleave: _cache[32] || (_cache[32] = function ($event) {
+                onMouseleave: _cache[36] || (_cache[36] = function ($event) {
                   return $options.onTimePickerElementMouseLeave();
                 }),
-                onKeyup: [_cache[35] || (_cache[35] = vue.withKeys(function ($event) {
+                onKeyup: [_cache[39] || (_cache[39] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
-                }, ["enter"])), _cache[36] || (_cache[36] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[40] || (_cache[40] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }, ["space"]))],
                 type: "button"
@@ -3106,31 +3150,31 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('incrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_17)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('minute'), {
+              })], 16, _hoisted_19)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('minute'), {
                 "data-pc-group-section": "timepickerlabel"
               }), vue.toDisplayString($options.formattedCurrentMinute), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('decrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.prevMinute,
-                onMousedown: _cache[37] || (_cache[37] = function ($event) {
+                onMousedown: _cache[41] || (_cache[41] = function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 1, -1);
                 }),
-                onMouseup: _cache[38] || (_cache[38] = function ($event) {
+                onMouseup: _cache[42] || (_cache[42] = function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }),
-                onKeydown: [_cache[39] || (_cache[39] = function () {
+                onKeydown: [_cache[43] || (_cache[43] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
-                }), _cache[41] || (_cache[41] = vue.withKeys(function ($event) {
+                }), _cache[45] || (_cache[45] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 1, -1);
-                }, ["enter"])), _cache[42] || (_cache[42] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[46] || (_cache[46] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 1, -1);
                 }, ["space"]))],
                 disabled: _ctx.disabled,
-                onMouseleave: _cache[40] || (_cache[40] = function ($event) {
+                onMouseleave: _cache[44] || (_cache[44] = function ($event) {
                   return $options.onTimePickerElementMouseLeave();
                 }),
-                onKeyup: [_cache[43] || (_cache[43] = vue.withKeys(function ($event) {
+                onKeyup: [_cache[47] || (_cache[47] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
-                }, ["enter"])), _cache[44] || (_cache[44] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[48] || (_cache[48] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }, ["space"]))],
                 type: "button"
@@ -3142,7 +3186,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('decrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_18)), [[_directive_ripple]])], 16), _ctx.showSeconds ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+              })], 16, _hoisted_20)), [[_directive_ripple]])], 16), _ctx.showSeconds ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 0,
                 "class": _ctx.cx('separatorContainer')
               }, _ctx.ptm('separatorContainer'), {
@@ -3157,26 +3201,26 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
               }), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('incrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.nextSecond,
-                onMousedown: _cache[45] || (_cache[45] = function ($event) {
+                onMousedown: _cache[49] || (_cache[49] = function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 2, 1);
                 }),
-                onMouseup: _cache[46] || (_cache[46] = function ($event) {
+                onMouseup: _cache[50] || (_cache[50] = function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }),
-                onKeydown: [_cache[47] || (_cache[47] = function () {
+                onKeydown: [_cache[51] || (_cache[51] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
-                }), _cache[49] || (_cache[49] = vue.withKeys(function ($event) {
+                }), _cache[53] || (_cache[53] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 2, 1);
-                }, ["enter"])), _cache[50] || (_cache[50] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[54] || (_cache[54] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 2, 1);
                 }, ["space"]))],
                 disabled: _ctx.disabled,
-                onMouseleave: _cache[48] || (_cache[48] = function ($event) {
+                onMouseleave: _cache[52] || (_cache[52] = function ($event) {
                   return $options.onTimePickerElementMouseLeave();
                 }),
-                onKeyup: [_cache[51] || (_cache[51] = vue.withKeys(function ($event) {
+                onKeyup: [_cache[55] || (_cache[55] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
-                }, ["enter"])), _cache[52] || (_cache[52] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[56] || (_cache[56] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }, ["space"]))],
                 type: "button"
@@ -3188,31 +3232,31 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('incrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_19)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('second'), {
+              })], 16, _hoisted_21)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('second'), {
                 "data-pc-group-section": "timepickerlabel"
               }), vue.toDisplayString($options.formattedCurrentSecond), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('decrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.prevSecond,
-                onMousedown: _cache[53] || (_cache[53] = function ($event) {
+                onMousedown: _cache[57] || (_cache[57] = function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 2, -1);
                 }),
-                onMouseup: _cache[54] || (_cache[54] = function ($event) {
+                onMouseup: _cache[58] || (_cache[58] = function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }),
-                onKeydown: [_cache[55] || (_cache[55] = function () {
+                onKeydown: [_cache[59] || (_cache[59] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
-                }), _cache[57] || (_cache[57] = vue.withKeys(function ($event) {
+                }), _cache[61] || (_cache[61] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 2, -1);
-                }, ["enter"])), _cache[58] || (_cache[58] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[62] || (_cache[62] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseDown($event, 2, -1);
                 }, ["space"]))],
                 disabled: _ctx.disabled,
-                onMouseleave: _cache[56] || (_cache[56] = function ($event) {
+                onMouseleave: _cache[60] || (_cache[60] = function ($event) {
                   return $options.onTimePickerElementMouseLeave();
                 }),
-                onKeyup: [_cache[59] || (_cache[59] = vue.withKeys(function ($event) {
+                onKeyup: [_cache[63] || (_cache[63] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
-                }, ["enter"])), _cache[60] || (_cache[60] = vue.withKeys(function ($event) {
+                }, ["enter"])), _cache[64] || (_cache[64] = vue.withKeys(function ($event) {
                   return $options.onTimePickerElementMouseUp($event);
                 }, ["space"]))],
                 type: "button"
@@ -3224,7 +3268,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('decrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_20)), [[_directive_ripple]])], 16)) : vue.createCommentVNode("", true), _ctx.hourFormat == '12' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+              })], 16, _hoisted_22)), [[_directive_ripple]])], 16)) : vue.createCommentVNode("", true), _ctx.hourFormat == '12' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 2,
                 "class": _ctx.cx('separatorContainer')
               }, _ctx.ptm('separatorContainer'), {
@@ -3237,10 +3281,10 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
               }, _ctx.ptm('ampmPicker')), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('incrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.am,
-                onClick: _cache[61] || (_cache[61] = function ($event) {
+                onClick: _cache[65] || (_cache[65] = function ($event) {
                   return $options.toggleAMPM($event);
                 }),
-                onKeydown: _cache[62] || (_cache[62] = function () {
+                onKeydown: _cache[66] || (_cache[66] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
                 }),
                 type: "button",
@@ -3255,15 +3299,15 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('incrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_21)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('ampm'), {
+              })], 16, _hoisted_23)), [[_directive_ripple]]), vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('ampm'), {
                 "data-pc-group-section": "timepickerlabel"
               }), vue.toDisplayString($data.pm ? _ctx.$primevue.config.locale.pm : _ctx.$primevue.config.locale.am), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
                 "class": _ctx.cx('decrementButton'),
                 "aria-label": _ctx.$primevue.config.locale.pm,
-                onClick: _cache[63] || (_cache[63] = function ($event) {
+                onClick: _cache[67] || (_cache[67] = function ($event) {
                   return $options.toggleAMPM($event);
                 }),
-                onKeydown: _cache[64] || (_cache[64] = function () {
+                onKeydown: _cache[68] || (_cache[68] = function () {
                   return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
                 }),
                 type: "button",
@@ -3278,13 +3322,13 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
                 }, _ctx.ptm('decrementIcon'), {
                   "data-pc-group-section": "timepickerlabel"
                 }), null, 16, ["class"]))];
-              })], 16, _hoisted_22)), [[_directive_ripple]])], 16)) : vue.createCommentVNode("", true)], 16)) : vue.createCommentVNode("", true), _ctx.showButtonBar ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+              })], 16, _hoisted_24)), [[_directive_ripple]])], 16)) : vue.createCommentVNode("", true)], 16)) : vue.createCommentVNode("", true), _ctx.showButtonBar ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 2,
                 "class": _ctx.cx('buttonbar')
               }, _ctx.ptm('buttonbar')), [vue.createVNode(_component_CalendarButton, {
                 type: "button",
                 label: $options.todayLabel,
-                onClick: _cache[65] || (_cache[65] = function ($event) {
+                onClick: _cache[69] || (_cache[69] = function ($event) {
                   return $options.onTodayButtonClick($event);
                 }),
                 "class": vue.normalizeClass(_ctx.cx('todayButton')),
@@ -3296,7 +3340,7 @@ this.primevue.calendar = (function (Button, CalendarIcon, ChevronDownIcon, Chevr
               }, null, 8, ["label", "class", "onKeydown", "unstyled", "pt"]), vue.createVNode(_component_CalendarButton, {
                 type: "button",
                 label: $options.clearLabel,
-                onClick: _cache[66] || (_cache[66] = function ($event) {
+                onClick: _cache[70] || (_cache[70] = function ($event) {
                   return $options.onClearButtonClick($event);
                 }),
                 "class": vue.normalizeClass(_ctx.cx('clearButton')),