primevue 3.18.0 → 3.19.0

package/calendar/calendar.cjs.js

@@ -47,6 +47,22 @@ var script = {
             type: String,
             default: 'pi pi-calendar'
         },
+        previousIcon: {
+            type: String,
+            default: 'pi pi-chevron-left'
+        },
+        nextIcon: {
+            type: String,
+            default: 'pi pi-chevron-right'
+        },
+        incrementIcon: {
+            type: String,
+            default: 'pi pi-chevron-up'
+        },
+        decrementIcon: {
+            type: String,
+            default: 'pi pi-chevron-down'
+        },
         numberOfMonths: {
             type: Number,
             default: 1
@@ -793,7 +809,10 @@ var script = {
 
             if (this.isSingleSelection() && (!this.showTime || this.hideOnDateTimeSelect)) {
                 setTimeout(() => {
-                    this.input.focus();
+                    if (this.input) {
+                        this.input.focus();
+                    }
+
                     this.overlayVisible = false;
                 }, 150);
             }
@@ -1457,7 +1476,6 @@ var script = {
                 throw 'Invalid Time';
             }
 
-            //DEBUG: 2952
             this.pm = ampm === this.$primevue.config.locale.am || ampm === this.$primevue.config.locale.am.toLowerCase();
             let time = this.parseTime(timeString);
 
@@ -2359,7 +2377,7 @@ var script = {
 
             if (propValue && Array.isArray(propValue)) {
                 if (this.isRangeSelection()) {
-                    propValue = propValue[1] || propValue[0];
+                    propValue = this.inline ? propValue[0] : propValue[1] || propValue[0];
                 } else if (this.isMultipleSelection()) {
                     propValue = propValue[propValue.length - 1];
                 }
@@ -2596,136 +2614,96 @@ const _hoisted_3 = ["id", "role", "aria-modal", "aria-label"];
 const _hoisted_4 = { class: "p-datepicker-group-container" };
 const _hoisted_5 = { class: "p-datepicker-header" };
 const _hoisted_6 = ["disabled", "aria-label"];
-const _hoisted_7 = /*#__PURE__*/vue.createElementVNode("span", { class: "p-datepicker-prev-icon pi pi-chevron-left" }, null, -1);
-const _hoisted_8 = [
-  _hoisted_7
-];
-const _hoisted_9 = { class: "p-datepicker-title" };
-const _hoisted_10 = ["disabled", "aria-label"];
-const _hoisted_11 = ["disabled", "aria-label"];
-const _hoisted_12 = {
+const _hoisted_7 = { class: "p-datepicker-title" };
+const _hoisted_8 = ["disabled", "aria-label"];
+const _hoisted_9 = ["disabled", "aria-label"];
+const _hoisted_10 = {
   key: 2,
   class: "p-datepicker-decade"
 };
-const _hoisted_13 = ["disabled", "aria-label"];
-const _hoisted_14 = /*#__PURE__*/vue.createElementVNode("span", { class: "p-datepicker-next-icon pi pi-chevron-right" }, null, -1);
-const _hoisted_15 = [
-  _hoisted_14
-];
-const _hoisted_16 = {
+const _hoisted_11 = ["disabled", "aria-label"];
+const _hoisted_12 = {
   key: 0,
   class: "p-datepicker-calendar-container"
 };
-const _hoisted_17 = {
+const _hoisted_13 = {
   class: "p-datepicker-calendar",
   role: "grid"
 };
-const _hoisted_18 = {
+const _hoisted_14 = {
   key: 0,
   scope: "col",
   class: "p-datepicker-weekheader p-disabled"
 };
-const _hoisted_19 = ["abbr"];
-const _hoisted_20 = {
+const _hoisted_15 = ["abbr"];
+const _hoisted_16 = {
   key: 0,
   class: "p-datepicker-weeknumber"
 };
-const _hoisted_21 = { class: "p-disabled" };
-const _hoisted_22 = {
+const _hoisted_17 = { class: "p-disabled" };
+const _hoisted_18 = {
   key: 0,
   style: {"visibility":"hidden"}
 };
-const _hoisted_23 = ["aria-label"];
-const _hoisted_24 = ["onClick", "onKeydown", "aria-selected"];
-const _hoisted_25 = {
+const _hoisted_19 = ["aria-label"];
+const _hoisted_20 = ["onClick", "onKeydown", "aria-selected"];
+const _hoisted_21 = {
   key: 0,
   class: "p-hidden-accessible",
   "aria-live": "polite"
 };
-const _hoisted_26 = {
+const _hoisted_22 = {
   key: 0,
   class: "p-monthpicker"
 };
-const _hoisted_27 = ["onClick", "onKeydown"];
-const _hoisted_28 = {
+const _hoisted_23 = ["onClick", "onKeydown"];
+const _hoisted_24 = {
   key: 0,
   class: "p-hidden-accessible",
   "aria-live": "polite"
 };
-const _hoisted_29 = {
+const _hoisted_25 = {
   key: 1,
   class: "p-yearpicker"
 };
-const _hoisted_30 = ["onClick", "onKeydown"];
-const _hoisted_31 = {
+const _hoisted_26 = ["onClick", "onKeydown"];
+const _hoisted_27 = {
   key: 0,
   class: "p-hidden-accessible",
   "aria-live": "polite"
 };
-const _hoisted_32 = {
+const _hoisted_28 = {
   key: 1,
   class: "p-timepicker"
 };
-const _hoisted_33 = { class: "p-hour-picker" };
-const _hoisted_34 = ["aria-label"];
-const _hoisted_35 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-up" }, null, -1);
-const _hoisted_36 = [
-  _hoisted_35
-];
-const _hoisted_37 = ["aria-label"];
-const _hoisted_38 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-down" }, null, -1);
-const _hoisted_39 = [
-  _hoisted_38
-];
-const _hoisted_40 = { class: "p-separator" };
-const _hoisted_41 = { class: "p-minute-picker" };
-const _hoisted_42 = ["aria-label", "disabled"];
-const _hoisted_43 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-up" }, null, -1);
-const _hoisted_44 = [
-  _hoisted_43
-];
-const _hoisted_45 = ["aria-label", "disabled"];
-const _hoisted_46 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-down" }, null, -1);
-const _hoisted_47 = [
-  _hoisted_46
-];
-const _hoisted_48 = {
+const _hoisted_29 = { class: "p-hour-picker" };
+const _hoisted_30 = ["aria-label"];
+const _hoisted_31 = ["aria-label"];
+const _hoisted_32 = { class: "p-separator" };
+const _hoisted_33 = { class: "p-minute-picker" };
+const _hoisted_34 = ["aria-label", "disabled"];
+const _hoisted_35 = ["aria-label", "disabled"];
+const _hoisted_36 = {
   key: 0,
   class: "p-separator"
 };
-const _hoisted_49 = {
+const _hoisted_37 = {
   key: 1,
   class: "p-second-picker"
 };
-const _hoisted_50 = ["aria-label", "disabled"];
-const _hoisted_51 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-up" }, null, -1);
-const _hoisted_52 = [
-  _hoisted_51
-];
-const _hoisted_53 = ["aria-label", "disabled"];
-const _hoisted_54 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-down" }, null, -1);
-const _hoisted_55 = [
-  _hoisted_54
-];
-const _hoisted_56 = {
+const _hoisted_38 = ["aria-label", "disabled"];
+const _hoisted_39 = ["aria-label", "disabled"];
+const _hoisted_40 = {
   key: 2,
   class: "p-separator"
 };
-const _hoisted_57 = {
+const _hoisted_41 = {
   key: 3,
   class: "p-ampm-picker"
 };
-const _hoisted_58 = ["aria-label", "disabled"];
-const _hoisted_59 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-up" }, null, -1);
-const _hoisted_60 = [
-  _hoisted_59
-];
-const _hoisted_61 = ["aria-label", "disabled"];
-const _hoisted_62 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-down" }, null, -1);
-const _hoisted_63 = [
-  _hoisted_62
-];
-const _hoisted_64 = {
+const _hoisted_42 = ["aria-label", "disabled"];
+const _hoisted_43 = ["aria-label", "disabled"];
+const _hoisted_44 = {
   key: 2,
   class: "p-datepicker-buttonbar"
 };
@@ -2758,7 +2736,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           "aria-label": _ctx.ariaLabel,
           inputmode: "none",
           disabled: $props.disabled,
-          readonly: !$props.manualInput,
+          readonly: !$props.manualInput || $props.readonly,
           tabindex: 0,
           onInput: _cache[0] || (_cache[0] = (...args) => ($options.onInput && $options.onInput(...args))),
           onClick: _cache[1] || (_cache[1] = (...args) => ($options.onInputClick && $options.onInputClick(...args))),
@@ -2825,11 +2803,15 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                   onKeydown: _cache[6] || (_cache[6] = (...args) => ($options.onContainerButtonKeydown && $options.onContainerButtonKeydown(...args))),
                                   disabled: $props.disabled,
                                   "aria-label": $data.currentView === 'year' ? _ctx.$primevue.config.locale.prevDecade : $data.currentView === 'month' ? _ctx.$primevue.config.locale.prevYear : _ctx.$primevue.config.locale.prevMonth
-                                }, _hoisted_8, 40, _hoisted_6)), [
+                                }, [
+                                  vue.createElementVNode("span", {
+                                    class: vue.normalizeClass(['p-datepicker-prev-icon', $props.previousIcon])
+                                  }, null, 2)
+                                ], 40, _hoisted_6)), [
                                   [vue.vShow, $props.showOtherMonths ? groupIndex === 0 : false],
                                   [_directive_ripple]
                                 ]),
-                                vue.createElementVNode("div", _hoisted_9, [
+                                vue.createElementVNode("div", _hoisted_7, [
                                   ($data.currentView === 'date')
                                     ? (vue.openBlock(), vue.createElementBlock("button", {
                                         key: 0,
@@ -2839,7 +2821,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                         class: "p-datepicker-month p-link",
                                         disabled: $options.switchViewButtonDisabled,
                                         "aria-label": _ctx.$primevue.config.locale.chooseMonth
-                                      }, vue.toDisplayString($options.getMonthName(month.month)), 41, _hoisted_10))
+                                      }, vue.toDisplayString($options.getMonthName(month.month)), 41, _hoisted_8))
                                     : vue.createCommentVNode("", true),
                                   ($data.currentView !== 'year')
                                     ? (vue.openBlock(), vue.createElementBlock("button", {
@@ -2850,10 +2832,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                         class: "p-datepicker-year p-link",
                                         disabled: $options.switchViewButtonDisabled,
                                         "aria-label": _ctx.$primevue.config.locale.chooseYear
-                                      }, vue.toDisplayString($options.getYear(month)), 41, _hoisted_11))
+                                      }, vue.toDisplayString($options.getYear(month)), 41, _hoisted_9))
                                     : vue.createCommentVNode("", true),
                                   ($data.currentView === 'year')
-                                    ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_12, [
+                                    ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_10, [
                                         vue.renderSlot(_ctx.$slots, "decade", { years: $options.yearPickerValues }, () => [
                                           vue.createTextVNode(vue.toDisplayString($options.yearPickerValues[0]) + " - " + vue.toDisplayString($options.yearPickerValues[$options.yearPickerValues.length - 1]), 1)
                                         ])
@@ -2867,18 +2849,22 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                   onKeydown: _cache[12] || (_cache[12] = (...args) => ($options.onContainerButtonKeydown && $options.onContainerButtonKeydown(...args))),
                                   disabled: $props.disabled,
                                   "aria-label": $data.currentView === 'year' ? _ctx.$primevue.config.locale.nextDecade : $data.currentView === 'month' ? _ctx.$primevue.config.locale.nextYear : _ctx.$primevue.config.locale.nextMonth
-                                }, _hoisted_15, 40, _hoisted_13)), [
+                                }, [
+                                  vue.createElementVNode("span", {
+                                    class: vue.normalizeClass(['p-datepicker-next-icon', $props.nextIcon])
+                                  }, null, 2)
+                                ], 40, _hoisted_11)), [
                                   [vue.vShow, $props.showOtherMonths ? ($props.numberOfMonths === 1 ? true : groupIndex === $props.numberOfMonths - 1) : false],
                                   [_directive_ripple]
                                 ])
                               ]),
                               ($data.currentView === 'date')
-                                ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_16, [
-                                    vue.createElementVNode("table", _hoisted_17, [
+                                ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12, [
+                                    vue.createElementVNode("table", _hoisted_13, [
                                       vue.createElementVNode("thead", null, [
                                         vue.createElementVNode("tr", null, [
                                           ($props.showWeek)
-                                            ? (vue.openBlock(), vue.createElementBlock("th", _hoisted_18, [
+                                            ? (vue.openBlock(), vue.createElementBlock("th", _hoisted_14, [
                                                 vue.createElementVNode("span", null, vue.toDisplayString($options.weekHeaderLabel), 1)
                                               ]))
                                             : vue.createCommentVNode("", true),
@@ -2889,7 +2875,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                               abbr: weekDay
                                             }, [
                                               vue.createElementVNode("span", null, vue.toDisplayString(weekDay), 1)
-                                            ], 8, _hoisted_19))
+                                            ], 8, _hoisted_15))
                                           }), 128))
                                         ])
                                       ]),
@@ -2899,10 +2885,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                             key: week[0].day + '' + week[0].month
                                           }, [
                                             ($props.showWeek)
-                                              ? (vue.openBlock(), vue.createElementBlock("td", _hoisted_20, [
-                                                  vue.createElementVNode("span", _hoisted_21, [
+                                              ? (vue.openBlock(), vue.createElementBlock("td", _hoisted_16, [
+                                                  vue.createElementVNode("span", _hoisted_17, [
                                                     (month.weekNumbers[i] < 10)
-                                                      ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_22, "0"))
+                                                      ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_18, "0"))
                                                       : vue.createCommentVNode("", true),
                                                     vue.createTextVNode(" " + vue.toDisplayString(month.weekNumbers[i]), 1)
                                                   ])
@@ -2924,13 +2910,13 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                                   vue.renderSlot(_ctx.$slots, "date", { date: date }, () => [
                                                     vue.createTextVNode(vue.toDisplayString(date.day), 1)
                                                   ])
-                                                ], 42, _hoisted_24)), [
+                                                ], 42, _hoisted_20)), [
                                                   [_directive_ripple]
                                                 ]),
                                                 ($options.isSelected(date))
-                                                  ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_25, vue.toDisplayString(date.day), 1))
+                                                  ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_21, vue.toDisplayString(date.day), 1))
                                                   : vue.createCommentVNode("", true)
-                                              ], 10, _hoisted_23))
+                                              ], 10, _hoisted_19))
                                             }), 128))
                                           ]))
                                         }), 128))
@@ -2942,7 +2928,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                           }), 128))
                         ]),
                         ($data.currentView === 'month')
-                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_26, [
+                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_22, [
                               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.monthPickerValues, (m, i) => {
                                 return vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
                                   key: m,
@@ -2952,16 +2938,16 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                 }, [
                                   vue.createTextVNode(vue.toDisplayString(m) + " ", 1),
                                   ($options.isMonthSelected(i))
-                                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_28, vue.toDisplayString(m), 1))
+                                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_24, vue.toDisplayString(m), 1))
                                     : vue.createCommentVNode("", true)
-                                ], 42, _hoisted_27)), [
+                                ], 42, _hoisted_23)), [
                                   [_directive_ripple]
                                 ])
                               }), 128))
                             ]))
                           : vue.createCommentVNode("", true),
                         ($data.currentView === 'year')
-                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_29, [
+                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_25, [
                               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.yearPickerValues, (y) => {
                                 return vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
                                   key: y,
@@ -2971,9 +2957,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                 }, [
                                   vue.createTextVNode(vue.toDisplayString(y) + " ", 1),
                                   ($options.isYearSelected(y))
-                                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_31, vue.toDisplayString(y), 1))
+                                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_27, vue.toDisplayString(y), 1))
                                     : vue.createCommentVNode("", true)
-                                ], 42, _hoisted_30)), [
+                                ], 42, _hoisted_26)), [
                                   [_directive_ripple]
                                 ])
                               }), 128))
@@ -2982,8 +2968,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                       ], 64))
                     : vue.createCommentVNode("", true),
                   (($props.showTime || $props.timeOnly) && $data.currentView === 'date')
-                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_32, [
-                        vue.createElementVNode("div", _hoisted_33, [
+                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_28, [
+                        vue.createElementVNode("div", _hoisted_29, [
                           vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
                             class: "p-link",
                             "aria-label": _ctx.$primevue.config.locale.nextHour,
@@ -3000,7 +2986,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                               _cache[20] || (_cache[20] = vue.withKeys($event => ($options.onTimePickerElementMouseUp($event)), ["space"]))
                             ],
                             type: "button"
-                          }, _hoisted_36, 40, _hoisted_34)), [
+                          }, [
+                            vue.createElementVNode("span", {
+                              class: vue.normalizeClass($props.incrementIcon)
+                            }, null, 2)
+                          ], 40, _hoisted_30)), [
                             [_directive_ripple]
                           ]),
                           vue.createElementVNode("span", null, vue.toDisplayString($options.formattedCurrentHour), 1),
@@ -3020,14 +3010,18 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                               _cache[28] || (_cache[28] = vue.withKeys($event => ($options.onTimePickerElementMouseUp($event)), ["space"]))
                             ],
                             type: "button"
-                          }, _hoisted_39, 40, _hoisted_37)), [
+                          }, [
+                            vue.createElementVNode("span", {
+                              class: vue.normalizeClass($props.decrementIcon)
+                            }, null, 2)
+                          ], 40, _hoisted_31)), [
                             [_directive_ripple]
                           ])
                         ]),
-                        vue.createElementVNode("div", _hoisted_40, [
+                        vue.createElementVNode("div", _hoisted_32, [
                           vue.createElementVNode("span", null, vue.toDisplayString($props.timeSeparator), 1)
                         ]),
-                        vue.createElementVNode("div", _hoisted_41, [
+                        vue.createElementVNode("div", _hoisted_33, [
                           vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
                             class: "p-link",
                             "aria-label": _ctx.$primevue.config.locale.nextMinute,
@@ -3045,7 +3039,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                               _cache[36] || (_cache[36] = vue.withKeys($event => ($options.onTimePickerElementMouseUp($event)), ["space"]))
                             ],
                             type: "button"
-                          }, _hoisted_44, 40, _hoisted_42)), [
+                          }, [
+                            vue.createElementVNode("span", {
+                              class: vue.normalizeClass($props.incrementIcon)
+                            }, null, 2)
+                          ], 40, _hoisted_34)), [
                             [_directive_ripple]
                           ]),
                           vue.createElementVNode("span", null, vue.toDisplayString($options.formattedCurrentMinute), 1),
@@ -3066,17 +3064,21 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                               _cache[44] || (_cache[44] = vue.withKeys($event => ($options.onTimePickerElementMouseUp($event)), ["space"]))
                             ],
                             type: "button"
-                          }, _hoisted_47, 40, _hoisted_45)), [
+                          }, [
+                            vue.createElementVNode("span", {
+                              class: vue.normalizeClass($props.decrementIcon)
+                            }, null, 2)
+                          ], 40, _hoisted_35)), [
                             [_directive_ripple]
                           ])
                         ]),
                         ($props.showSeconds)
-                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_48, [
+                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_36, [
                               vue.createElementVNode("span", null, vue.toDisplayString($props.timeSeparator), 1)
                             ]))
                           : vue.createCommentVNode("", true),
                         ($props.showSeconds)
-                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_49, [
+                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_37, [
                               vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
                                 class: "p-link",
                                 "aria-label": _ctx.$primevue.config.locale.nextSecond,
@@ -3094,7 +3096,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                   _cache[52] || (_cache[52] = vue.withKeys($event => ($options.onTimePickerElementMouseUp($event)), ["space"]))
                                 ],
                                 type: "button"
-                              }, _hoisted_52, 40, _hoisted_50)), [
+                              }, [
+                                vue.createElementVNode("span", {
+                                  class: vue.normalizeClass($props.incrementIcon)
+                                }, null, 2)
+                              ], 40, _hoisted_38)), [
                                 [_directive_ripple]
                               ]),
                               vue.createElementVNode("span", null, vue.toDisplayString($options.formattedCurrentSecond), 1),
@@ -3115,25 +3121,33 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                   _cache[60] || (_cache[60] = vue.withKeys($event => ($options.onTimePickerElementMouseUp($event)), ["space"]))
                                 ],
                                 type: "button"
-                              }, _hoisted_55, 40, _hoisted_53)), [
+                              }, [
+                                vue.createElementVNode("span", {
+                                  class: vue.normalizeClass($props.decrementIcon)
+                                }, null, 2)
+                              ], 40, _hoisted_39)), [
                                 [_directive_ripple]
                               ])
                             ]))
                           : vue.createCommentVNode("", true),
                         ($props.hourFormat == '12')
-                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_56, [
+                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_40, [
                               vue.createElementVNode("span", null, vue.toDisplayString($props.timeSeparator), 1)
                             ]))
                           : vue.createCommentVNode("", true),
                         ($props.hourFormat == '12')
-                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_57, [
+                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_41, [
                               vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
                                 class: "p-link",
                                 "aria-label": _ctx.$primevue.config.locale.am,
                                 onClick: _cache[61] || (_cache[61] = $event => ($options.toggleAMPM($event))),
                                 type: "button",
                                 disabled: $props.disabled
-                              }, _hoisted_60, 8, _hoisted_58)), [
+                              }, [
+                                vue.createElementVNode("span", {
+                                  class: vue.normalizeClass($props.incrementIcon)
+                                }, null, 2)
+                              ], 8, _hoisted_42)), [
                                 [_directive_ripple]
                               ]),
                               vue.createElementVNode("span", null, vue.toDisplayString($data.pm ? _ctx.$primevue.config.locale.pm : _ctx.$primevue.config.locale.am), 1),
@@ -3143,7 +3157,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                 onClick: _cache[62] || (_cache[62] = $event => ($options.toggleAMPM($event))),
                                 type: "button",
                                 disabled: $props.disabled
-                              }, _hoisted_63, 8, _hoisted_61)), [
+                              }, [
+                                vue.createElementVNode("span", {
+                                  class: vue.normalizeClass($props.decrementIcon)
+                                }, null, 2)
+                              ], 8, _hoisted_43)), [
                                 [_directive_ripple]
                               ])
                             ]))
@@ -3151,7 +3169,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                       ]))
                     : vue.createCommentVNode("", true),
                   ($props.showButtonBar)
-                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_64, [
+                    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_44, [
                         vue.createVNode(_component_CalendarButton, {
                           type: "button",
                           label: $options.todayLabel,