primevue 3.32.2 → 3.33.0

package/calendar/calendar.cjs.js

@@ -28,7 +28,7 @@ var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
 var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
 
 var _classes;
-function _typeof$2(obj) { "@babel/helpers - typeof"; return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$2(obj); }
+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); }
@@ -364,7 +364,7 @@ var script$1 = {
   }
 };
 
-function _typeof$1(obj) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$1(obj); }
+function _typeof$1(o) { "@babel/helpers - typeof"; return _typeof$1 = "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$1(o); }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
@@ -2605,9 +2605,9 @@ var script = {
   }
 };
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "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(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
@@ -2710,7 +2710,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     "default": vue.withCtx(function () {
       return [vue.createVNode(vue.Transition, vue.mergeProps({
         name: "p-connected-overlay",
-        onEnter: _cache[68] || (_cache[68] = function ($event) {
+        onEnter: _cache[70] || (_cache[70] = function ($event) {
           return $options.onOverlayEnter($event);
         }),
         onAfterEnter: $options.onOverlayEnterComplete,
@@ -2727,13 +2727,13 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             role: _ctx.inline ? null : 'dialog',
             "aria-modal": _ctx.inline ? null : 'true',
             "aria-label": _ctx.$primevue.config.locale.chooseDate,
-            onClick: _cache[65] || (_cache[65] = function () {
+            onClick: _cache[67] || (_cache[67] = function () {
               return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
             }),
-            onKeydown: _cache[66] || (_cache[66] = function () {
+            onKeydown: _cache[68] || (_cache[68] = function () {
               return $options.onOverlayKeyDown && $options.onOverlayKeyDown.apply($options, arguments);
             }),
-            onMouseup: _cache[67] || (_cache[67] = function () {
+            onMouseup: _cache[69] || (_cache[69] = function () {
               return $options.onOverlayMouseUp && $options.onOverlayMouseUp.apply($options, arguments);
             })
           }, _objectSpread(_objectSpread({}, _ctx.panelProps), _ctx.ptm('panel'))), [!_ctx.timeOnly ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
@@ -2759,7 +2759,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               }),
               disabled: _ctx.disabled,
               "aria-label": $data.currentView === 'year' ? _ctx.$primevue.config.locale.prevDecade : $data.currentView === 'month' ? _ctx.$primevue.config.locale.prevYear : _ctx.$primevue.config.locale.prevMonth
-            }, _ctx.ptm('previousButton')), [vue.renderSlot(_ctx.$slots, "previousicon", {
+            }, _ctx.ptm('previousButton'), {
+              "data-pc-group-section": "navigator"
+            }), [vue.renderSlot(_ctx.$slots, "previousicon", {
               "class": vue.normalizeClass(_ctx.cx('previousIcon'))
             }, function () {
               return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.previousIcon ? 'span' : 'ChevronLeftIcon'), vue.mergeProps({
@@ -2779,7 +2781,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               "class": _ctx.cx('monthTitle'),
               disabled: $options.switchViewButtonDisabled,
               "aria-label": _ctx.$primevue.config.locale.chooseMonth
-            }, _ctx.ptm('monthTitle')), vue.toDisplayString($options.getMonthName(month.month)), 17, _hoisted_5)) : vue.createCommentVNode("", true), $data.currentView !== 'year' ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+            }, _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({
               key: 1,
               type: "button",
               onClick: _cache[9] || (_cache[9] = function () {
@@ -2791,7 +2795,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               "class": _ctx.cx('yearTitle'),
               disabled: $options.switchViewButtonDisabled,
               "aria-label": _ctx.$primevue.config.locale.chooseYear
-            }, _ctx.ptm('yearTitle')), vue.toDisplayString($options.getYear(month)), 17, _hoisted_6)) : vue.createCommentVNode("", true), $data.currentView === 'year' ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+            }, _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({
               key: 2,
               "class": _ctx.cx('decadeTitle')
             }, _ctx.ptm('decadeTitle')), [vue.renderSlot(_ctx.$slots, "decade", {
@@ -2811,7 +2817,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               }),
               disabled: _ctx.disabled,
               "aria-label": $data.currentView === 'year' ? _ctx.$primevue.config.locale.nextDecade : $data.currentView === 'month' ? _ctx.$primevue.config.locale.nextYear : _ctx.$primevue.config.locale.nextMonth
-            }, _ctx.ptm('nextButton')), [vue.renderSlot(_ctx.$slots, "nexticon", {
+            }, _ctx.ptm('nextButton'), {
+              "data-pc-group-section": "navigator"
+            }), [vue.renderSlot(_ctx.$slots, "nexticon", {
               "class": vue.normalizeClass(_ctx.cx('nextIcon'))
             }, function () {
               return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.nextIcon ? 'span' : 'ChevronRightIcon'), vue.mergeProps({
@@ -2832,27 +2840,37 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 disabled: _ctx.showWeek
               }
             }), {
-              "data-p-disabled": _ctx.showWeek
-            }), [vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('weekLabel'))), 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) {
+              "data-p-disabled": _ctx.showWeek,
+              "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) {
               return vue.openBlock(), vue.createElementBlock("th", vue.mergeProps({
                 key: weekDay,
                 scope: "col",
                 abbr: weekDay
-              }, _ctx.ptm('tableHeaderCell')), [vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('weekDay'))), vue.toDisplayString(weekDay), 17)], 16, _hoisted_9);
+              }, _ctx.ptm('tableHeaderCell'), {
+                "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);
             }), 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
               }, _ctx.ptm('tableBodyRow')), [_ctx.showWeek ? (vue.openBlock(), vue.createElementBlock("td", vue.mergeProps({
                 key: 0,
                 "class": _ctx.cx('weekNumber')
-              }, _ctx.ptm('weekNumber')), [vue.createElementVNode("span", vue.mergeProps({
+              }, _ctx.ptm('weekNumber'), {
+                "data-pc-group-section": "tablebodycell"
+              }), [vue.createElementVNode("span", vue.mergeProps({
                 "class": _ctx.cx('weekLabelContainer')
               }, _ctx.ptm('weekLabelContainer', {
                 context: {
                   disabled: _ctx.showWeek
                 }
               }), {
-                "data-p-disabled": _ctx.showWeek
+                "data-p-disabled": _ctx.showWeek,
+                "data-pc-group-section": "tablebodycelllabel"
               }), [month.weekNumbers[i] < 10 ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
                 key: 0,
                 style: {
@@ -2873,7 +2891,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   }
                 }), {
                   "data-p-today": date.today,
-                  "data-p-other-month": date.otherMonth
+                  "data-p-other-month": date.otherMonth,
+                  "data-pc-group-section": "tablebodycell"
                 }), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
                   "class": _ctx.cx('dayLabel', {
                     date: date
@@ -2895,7 +2914,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   }
                 }), {
                   "data-p-disabled": !date.selectable,
-                  "data-p-highlight": $options.isSelected(date)
+                  "data-p-highlight": $options.isSelected(date),
+                  "data-pc-group-section": "tablebodycelllabel"
                 }), [vue.renderSlot(_ctx.$slots, "date", {
                   date: date
                 }, function () {
@@ -2984,7 +3004,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             "class": _ctx.cx('timePicker')
           }, _ctx.ptm('timePicker')), [vue.createElementVNode("div", vue.mergeProps({
             "class": _ctx.cx('hourPicker')
-          }, _ctx.ptm('hourPicker')), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+          }, _ctx.ptm('hourPicker'), {
+            "data-pc-group-section": "timepickerContainer"
+          }), [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) {
@@ -3009,11 +3031,17 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               return $options.onTimePickerElementMouseUp($event);
             }, ["space"]))],
             type: "button"
-          }, _ctx.ptm('incrementButton')), [vue.renderSlot(_ctx.$slots, "incrementicon", {}, function () {
+          }, _ctx.ptm('incrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "incrementicon", {}, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.incrementIcon ? 'span' : 'ChevronUpIcon'), vue.mergeProps({
               "class": _ctx.incrementIcon
-            }, _ctx.ptm('incrementIcon')), null, 16, ["class"]))];
-          })], 16, _hoisted_15)), [[_directive_ripple]]), vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('hour'))), vue.toDisplayString($options.formattedCurrentHour), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+            }, _ctx.ptm('incrementIcon'), {
+              "data-pc-group-section": "timepickerlabel"
+            }), null, 16, ["class"]))];
+          })], 16, _hoisted_15)), [[_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) {
@@ -3038,15 +3066,25 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               return $options.onTimePickerElementMouseUp($event);
             }, ["space"]))],
             type: "button"
-          }, _ctx.ptm('decrementButton')), [vue.renderSlot(_ctx.$slots, "decrementicon", {}, function () {
+          }, _ctx.ptm('decrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "decrementicon", {}, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.decrementIcon ? 'span' : 'ChevronDownIcon'), vue.mergeProps({
               "class": _ctx.decrementIcon
-            }, _ctx.ptm('decrementIcon')), null, 16, ["class"]))];
+            }, _ctx.ptm('decrementIcon'), {
+              "data-pc-group-section": "timepickerlabel"
+            }), null, 16, ["class"]))];
           })], 16, _hoisted_16)), [[_directive_ripple]])], 16), vue.createElementVNode("div", vue.mergeProps({
             "class": _ctx.cx('separatorContainer')
-          }, _ctx.ptm('separatorContainer')), [vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('separator'))), vue.toDisplayString(_ctx.timeSeparator), 17)], 16), vue.createElementVNode("div", vue.mergeProps({
+          }, _ctx.ptm('separatorContainer'), {
+            "data-pc-group-section": "timepickerContainer"
+          }), [vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('separator'), {
+            "data-pc-group-section": "timepickerlabel"
+          }), vue.toDisplayString(_ctx.timeSeparator), 17)], 16), vue.createElementVNode("div", vue.mergeProps({
             "class": _ctx.cx('minutePicker')
-          }, _ctx.ptm('minutePicker')), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+          }, _ctx.ptm('minutePicker'), {
+            "data-pc-group-section": "timepickerContainer"
+          }), [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) {
@@ -3072,11 +3110,17 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               return $options.onTimePickerElementMouseUp($event);
             }, ["space"]))],
             type: "button"
-          }, _ctx.ptm('incrementButton')), [vue.renderSlot(_ctx.$slots, "incrementicon", {}, function () {
+          }, _ctx.ptm('incrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "incrementicon", {}, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.incrementIcon ? 'span' : 'ChevronUpIcon'), vue.mergeProps({
               "class": _ctx.incrementIcon
-            }, _ctx.ptm('incrementIcon')), null, 16, ["class"]))];
-          })], 16, _hoisted_17)), [[_directive_ripple]]), vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('minute'))), vue.toDisplayString($options.formattedCurrentMinute), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+            }, _ctx.ptm('incrementIcon'), {
+              "data-pc-group-section": "timepickerlabel"
+            }), null, 16, ["class"]))];
+          })], 16, _hoisted_17)), [[_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) {
@@ -3102,17 +3146,27 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               return $options.onTimePickerElementMouseUp($event);
             }, ["space"]))],
             type: "button"
-          }, _ctx.ptm('decrementButton')), [vue.renderSlot(_ctx.$slots, "decrementicon", {}, function () {
+          }, _ctx.ptm('decrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "decrementicon", {}, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.decrementIcon ? 'span' : 'ChevronDownIcon'), vue.mergeProps({
               "class": _ctx.decrementIcon
-            }, _ctx.ptm('decrementIcon')), null, 16, ["class"]))];
+            }, _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({
             key: 0,
             "class": _ctx.cx('separatorContainer')
-          }, _ctx.ptm('separatorContainer')), [vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('separator'))), vue.toDisplayString(_ctx.timeSeparator), 17)], 16)) : vue.createCommentVNode("", true), _ctx.showSeconds ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+          }, _ctx.ptm('separatorContainer'), {
+            "data-pc-group-section": "timepickerContainer"
+          }), [vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('separator'), {
+            "data-pc-group-section": "timepickerlabel"
+          }), vue.toDisplayString(_ctx.timeSeparator), 17)], 16)) : vue.createCommentVNode("", true), _ctx.showSeconds ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
             key: 1,
             "class": _ctx.cx('secondPicker')
-          }, _ctx.ptm('secondPicker')), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+          }, _ctx.ptm('secondPicker'), {
+            "data-pc-group-section": "timepickerContainer"
+          }), [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) {
@@ -3138,11 +3192,17 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               return $options.onTimePickerElementMouseUp($event);
             }, ["space"]))],
             type: "button"
-          }, _ctx.ptm('incrementButton')), [vue.renderSlot(_ctx.$slots, "incrementicon", {}, function () {
+          }, _ctx.ptm('incrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "incrementicon", {}, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.incrementIcon ? 'span' : 'ChevronUpIcon'), vue.mergeProps({
               "class": _ctx.incrementIcon
-            }, _ctx.ptm('incrementIcon')), null, 16, ["class"]))];
-          })], 16, _hoisted_19)), [[_directive_ripple]]), vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('second'))), vue.toDisplayString($options.formattedCurrentSecond), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+            }, _ctx.ptm('incrementIcon'), {
+              "data-pc-group-section": "timepickerlabel"
+            }), null, 16, ["class"]))];
+          })], 16, _hoisted_19)), [[_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) {
@@ -3168,14 +3228,22 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               return $options.onTimePickerElementMouseUp($event);
             }, ["space"]))],
             type: "button"
-          }, _ctx.ptm('decrementButton')), [vue.renderSlot(_ctx.$slots, "decrementicon", {}, function () {
+          }, _ctx.ptm('decrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "decrementicon", {}, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.decrementIcon ? 'span' : 'ChevronDownIcon'), vue.mergeProps({
               "class": _ctx.decrementIcon
-            }, _ctx.ptm('decrementIcon')), null, 16, ["class"]))];
+            }, _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({
             key: 2,
             "class": _ctx.cx('separatorContainer')
-          }, _ctx.ptm('separatorContainer')), [vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('separator'))), vue.toDisplayString(_ctx.timeSeparator), 17)], 16)) : vue.createCommentVNode("", true), _ctx.hourFormat == '12' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+          }, _ctx.ptm('separatorContainer'), {
+            "data-pc-group-section": "timepickerContainer"
+          }), [vue.createElementVNode("span", vue.mergeProps(_ctx.ptm('separator'), {
+            "data-pc-group-section": "timepickerlabel"
+          }), vue.toDisplayString(_ctx.timeSeparator), 17)], 16)) : vue.createCommentVNode("", true), _ctx.hourFormat == '12' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
             key: 3,
             "class": _ctx.cx('ampmPicker')
           }, _ctx.ptm('ampmPicker')), [vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
@@ -3184,53 +3252,71 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             onClick: _cache[61] || (_cache[61] = function ($event) {
               return $options.toggleAMPM($event);
             }),
+            onKeydown: _cache[62] || (_cache[62] = function () {
+              return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
+            }),
             type: "button",
             disabled: _ctx.disabled
-          }, _ctx.ptm('incrementButton')), [vue.renderSlot(_ctx.$slots, "incrementicon", {
+          }, _ctx.ptm('incrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "incrementicon", {
             "class": vue.normalizeClass(_ctx.cx('incrementIcon'))
           }, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.incrementIcon ? 'span' : 'ChevronUpIcon'), vue.mergeProps({
               "class": _ctx.cx('incrementIcon')
-            }, _ctx.ptm('incrementIcon')), null, 16, ["class"]))];
-          })], 16, _hoisted_21)), [[_directive_ripple]]), vue.createElementVNode("span", vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('ampm'))), vue.toDisplayString($data.pm ? _ctx.$primevue.config.locale.pm : _ctx.$primevue.config.locale.am), 17), vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
+            }, _ctx.ptm('incrementIcon'), {
+              "data-pc-group-section": "timepickerlabel"
+            }), null, 16, ["class"]))];
+          })], 16, _hoisted_21)), [[_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[62] || (_cache[62] = function ($event) {
+            onClick: _cache[63] || (_cache[63] = function ($event) {
               return $options.toggleAMPM($event);
             }),
+            onKeydown: _cache[64] || (_cache[64] = function () {
+              return $options.onContainerButtonKeydown && $options.onContainerButtonKeydown.apply($options, arguments);
+            }),
             type: "button",
             disabled: _ctx.disabled
-          }, _ctx.ptm('decrementButton')), [vue.renderSlot(_ctx.$slots, "decrementicon", {
+          }, _ctx.ptm('decrementButton'), {
+            "data-pc-group-section": "timepickerbutton"
+          }), [vue.renderSlot(_ctx.$slots, "decrementicon", {
             "class": vue.normalizeClass(_ctx.cx('decrementIcon'))
           }, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.decrementIcon ? 'span' : 'ChevronDownIcon'), vue.mergeProps({
               "class": _ctx.cx('decrementIcon')
-            }, _ctx.ptm('decrementIcon')), null, 16, ["class"]))];
+            }, _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({
             key: 2,
             "class": _ctx.cx('buttonbar')
           }, _ctx.ptm('buttonbar')), [vue.createVNode(_component_CalendarButton, {
             type: "button",
             label: $options.todayLabel,
-            onClick: _cache[63] || (_cache[63] = function ($event) {
+            onClick: _cache[65] || (_cache[65] = function ($event) {
               return $options.onTodayButtonClick($event);
             }),
             "class": vue.normalizeClass(_ctx.cx('todayButton')),
             onKeydown: $options.onContainerButtonKeydown,
             unstyled: _ctx.unstyled,
             pt: _ctx.ptm('todayButton'),
-            "data-pc-section": "todaybutton"
+            "data-pc-section": "todaybutton",
+            "data-pc-group-section": "button"
           }, null, 8, ["label", "class", "onKeydown", "unstyled", "pt"]), vue.createVNode(_component_CalendarButton, {
             type: "button",
             label: $options.clearLabel,
-            onClick: _cache[64] || (_cache[64] = function ($event) {
+            onClick: _cache[66] || (_cache[66] = function ($event) {
               return $options.onClearButtonClick($event);
             }),
             "class": vue.normalizeClass(_ctx.cx('clearButton')),
             onKeydown: $options.onContainerButtonKeydown,
             unstyled: _ctx.unstyled,
             pt: _ctx.ptm('clearButton'),
-            "data-pc-section": "clearbutton"
+            "data-pc-section": "clearbutton",
+            "data-pc-group-section": "button"
           }, null, 8, ["label", "class", "onKeydown", "unstyled", "pt"])], 16)) : vue.createCommentVNode("", true), vue.renderSlot(_ctx.$slots, "footer")], 16, _hoisted_3)) : vue.createCommentVNode("", true)];
         }),
         _: 3