@progress/kendo-vue-data-tools 3.8.4-dev.202302231256 → 3.8.4-dev.202302231351

package/dist/es/filter/Expression.js

@@ -162,8 +162,10 @@ var ExpressionVue2 = {
     h(Toolbar, {
       keyboardNavigation: false,
       attrs: this.v3 ? undefined : {
-        keyboardNavigation: false
-      }
+        keyboardNavigation: false,
+        ariaLabel: filter.ariaLabel ? filter.ariaLabel : undefined
+      },
+      ariaLabel: filter.ariaLabel ? filter.ariaLabel : undefined
     }, this.v3 ? function () {
       return [
       // @ts-ignore function children 

package/dist/es/filter/Filter.d.ts

@@ -41,6 +41,10 @@ export interface FilterProps {
      * The initial composite filter descriptor which will be used when a new group is created.
      */
     defaultGroupFilter?: CompositeFilterDescriptor;
+    /**
+     * Defines the `aria-label` attribute of the upper-most Toolbar that is part of the Filter component .
+     */
+    upperToolbarAriaLabel?: string;
 }
 /**
  * @hidden

package/dist/es/filter/Filter.js

@@ -45,7 +45,11 @@ var FilterVue2 = {
       default: undefined
     },
     value: Object,
-    defaultGroupFilter: Object
+    defaultGroupFilter: Object,
+    upperToolbarAriaLabel: {
+      type: String,
+      default: undefined
+    }
   },
   inject: {
     kendoLocalizationService: {
@@ -100,8 +104,9 @@ var FilterVue2 = {
     }, [
     // @ts-ignore function children
     h(GroupToolbar, {
-      filter: this.computedValue,
+      "aria-label": this.$props.upperToolbarAriaLabel,
       attrs: this.v3 ? undefined : {
+        "aria-label": this.$props.upperToolbarAriaLabel,
         filter: this.computedValue,
         fields: fields,
         defaultGroupFilter: this.$props.defaultGroupFilter || {
@@ -109,6 +114,7 @@ var FilterVue2 = {
           filters: []
         }
       },
+      filter: this.computedValue,
       fields: fields,
       onChange: this.onFilterChange,
       on: this.v3 ? undefined : {

package/dist/es/filter/GroupFilters.js

@@ -17,6 +17,8 @@ var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 import { isCompositeFilterDescriptor } from '@progress/kendo-data-query';
 import { GroupToolbar } from './GroupToolbar';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { messages, filterGroupFilterAriaLabel } from '../messages/main';
 import { Expression } from './Expression';
 /**
  * @hidden
@@ -56,6 +58,7 @@ var GroupFilterVue2 = {
   },
   render: function render(createElement) {
     var h = gh || createElement;
+    var localizationService = provideLocalizationService(this);
     var _a = this.$props,
       fields = _a.fields,
       filter = _a.filter,
@@ -81,9 +84,11 @@ var GroupFilterVue2 = {
         attrs: this.v3 ? undefined : {
           filter: f,
           fields: fields,
+          ariaLabel: localizationService.toLanguageString(filterGroupFilterAriaLabel, messages[filterGroupFilterAriaLabel]),
           defaultGroupFilter: this.$props.defaultGroupFilter
         },
         fields: fields,
+        ariaLabel: localizationService.toLanguageString(filterGroupFilterAriaLabel, messages[filterGroupFilterAriaLabel]),
         onChange: this.onChange,
         on: this.v3 ? undefined : {
           "change": this.onChange,

package/dist/es/filter/GroupToolbar.d.ts

@@ -29,6 +29,7 @@ export interface GroupProps {
     filter: CompositeFilterDescriptor;
     fields: Array<FieldSettings>;
     defaultGroupFilter: CompositeFilterDescriptor;
+    ariaLabel: String;
 }
 /**
  * @hidden

package/dist/es/filter/GroupToolbar.js

@@ -51,6 +51,10 @@ var GroupToolbarVue2 = {
     defaultGroupFilter: {
       type: Object,
       required: true
+    },
+    ariaLabel: {
+      type: String,
+      default: undefined
     }
   },
   inject: {
@@ -79,8 +83,12 @@ var GroupToolbarVue2 = {
     h(Toolbar, {
       keyboardNavigation: false,
       attrs: this.v3 ? undefined : {
-        keyboardNavigation: false
-      }
+        keyboardNavigation: false,
+        role: "toolbar",
+        "aria-label": this.$props.ariaLabel
+      },
+      role: "toolbar",
+      "aria-label": this.$props.ariaLabel
     }, this.v3 ? function () {
       return [
       // @ts-ignore function children 

package/dist/es/messages/main.d.ts

@@ -26,6 +26,14 @@ export declare const pagerLastPage = "pager.lastPage";
  * @hidden
  */
 export declare const pagerItemPerPage = "pager.itemsPerPage";
+/**
+ * @hidden
+ */
+export declare const pagerPageInputAriaLabel = "pager.pageInputAriaLabel";
+/**
+ * @hidden
+ */
+export declare const pagerSmallPageSelectorAriaLabel = "pager.smallPageSelectorAriaLabel";
 /**
  * @hidden
  */
@@ -46,6 +54,10 @@ export declare const pagerTotalPages = "pager.totalPages";
  * @hidden
  */
 export declare const filterEqOperator = "filter.eqOperator";
+/**
+ * @hidden
+ */
+export declare const filterGroupFilterAriaLabel = "filter.groupFilterAriaLabel";
 /**
  * @hidden
  */
@@ -310,6 +322,9 @@ export declare const filterDropDownOperatorAriaLabel = "filter.dropdownOperatorA
  * @hidden
  */
 export declare const messages: {
+    "filter.groupFilterAriaLabel": string;
+    "pager.smallPageSelectorAriaLabel": string;
+    "pager.pageInputAriaLabel": string;
     "pager.itemsPerPage": string;
     "pager.pageSelection": string;
     "pager.info": string;

package/dist/es/messages/main.js

@@ -27,6 +27,14 @@ export var pagerLastPage = 'pager.lastPage';
  * @hidden
  */
 export var pagerItemPerPage = 'pager.itemsPerPage';
+/**
+ * @hidden
+ */
+export var pagerPageInputAriaLabel = 'pager.pageInputAriaLabel';
+/**
+ * @hidden
+ */
+export var pagerSmallPageSelectorAriaLabel = 'pager.smallPageSelectorAriaLabel';
 /**
  * @hidden
  */
@@ -47,6 +55,10 @@ export var pagerTotalPages = 'pager.totalPages';
  * @hidden
  */
 export var filterEqOperator = 'filter.eqOperator';
+/**
+ * @hidden
+ */
+export var filterGroupFilterAriaLabel = 'filter.groupFilterAriaLabel';
 /**
  * @hidden
  */
@@ -311,6 +323,9 @@ export var filterDropDownOperatorAriaLabel = 'filter.dropdownOperatorAriaLabel';
  * @hidden
  */
 export var messages = (_a = {},
+    _a[filterGroupFilterAriaLabel] = 'Group Filter',
+    _a[pagerSmallPageSelectorAriaLabel] = 'Select page',
+    _a[pagerPageInputAriaLabel] = 'Pager - Page number input',
     _a[pagerItemPerPage] = 'items per page',
     _a[pagerPageSelection] = 'Select page',
     _a[pagerInfo] = '{0} - {1} of {2} items',
@@ -319,7 +334,7 @@ export var messages = (_a = {},
     _a[pagerNextPage] = 'Go to the next page',
     _a[pagerLastPage] = 'Go to the last page',
     _a[pagerPage] = 'Page',
-    _a[pagerOf] = 'Of',
+    _a[pagerOf] = 'of',
     _a[pagerTotalPages] = '{0}',
     _a[searchPlaceholder] = 'Search',
     _a[selectAllRows] = 'Select All Rows',

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-data-tools',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1677156449,
+    publishDate: 1677159743,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/es/pager/Pager.d.ts

@@ -61,6 +61,10 @@ export interface PagerProps extends GridPagerSettings {
      * The event that is emited when the page is changed.
      */
     onPagechange?: (event: any) => any;
+    /**
+     * Defines the `id` of the element that is being controlled by the pager - for example a Grid.
+     */
+    ariaControls?: string;
 }
 /**
  * @hidden

package/dist/es/pager/Pager.js

@@ -77,7 +77,11 @@ var PagerVue2 = {
       }
     },
     pagerRender: [String, Function, Object],
-    width: [Number, String]
+    width: [Number, String],
+    ariaControls: {
+      type: String,
+      default: undefined
+    }
   },
   data: function data() {
     return {
@@ -403,19 +407,29 @@ var PagerVue2 = {
       style: {
         width: width
       },
-      role: "navigation",
+      role: "application",
       attrs: this.v3 ? undefined : {
-        role: "navigation"
-      }
+        role: "application",
+        "aria-roledescription": "pager"
+      },
+      "aria-roledescription": "pager"
     }, [pagerContent]) : h("div", {
       "class": this.wrapperClass,
       style: {
         width: width
       },
-      role: "navigation",
+      role: "application",
       attrs: this.v3 ? undefined : {
-        role: "navigation"
-      }
+        role: "application",
+        "aria-roledescription": "pager",
+        "aria-keyshortcuts": "Enter ArrowRight ArrowLeft",
+        "aria-label": 'Page navigation, page ' + this.currentPage + ' of ' + this.totalPages,
+        "aria-controls": this.$props.ariaControls
+      },
+      "aria-roledescription": "pager",
+      "aria-keyshortcuts": "Enter ArrowRight ArrowLeft",
+      "aria-label": 'Page navigation, page ' + this.currentPage + ' of ' + this.totalPages,
+      "aria-controls": this.$props.ariaControls
     }, [h("div", {
       "class": 'k-pager-numbers-wrap'
     }, [first, prev, changer, next, last]), renderPageSizes, infoElement]);

package/dist/es/pager/PagerInput.js

@@ -4,7 +4,7 @@ var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var inject = allVue.inject;
-import { messages, pagerOf, pagerPage, pagerTotalPages } from '../messages/main';
+import { messages, pagerOf, pagerPage, pagerTotalPages, pagerPageInputAriaLabel } from '../messages/main';
 import { provideIntlService, provideLocalizationService } from '@progress/kendo-vue-intl';
 import { kendoThemeMaps } from '@progress/kendo-vue-common';
 /**
@@ -86,6 +86,10 @@ var PagerInputVue2 = {
       messageKey: pagerTotalPages,
       defaultMessage: messages[pagerTotalPages]
     };
+    var pageInputAriaLabel = this.$props.messagesMap ? this.$props.messagesMap(pagerPageInputAriaLabel) : {
+      messageKey: pagerPageInputAriaLabel,
+      defaultMessage: messages[pagerPageInputAriaLabel]
+    };
     return h("span", {
       "class": "k-pager-input k-label"
     }, [localizationService.toLanguageString(pageMessage.messageKey, pageMessage.defaultMessage), h("span", {
@@ -96,6 +100,10 @@ var PagerInputVue2 = {
       domProps: this.v3 ? undefined : {
         "value": this.value()
       },
+      ariaLabel: localizationService.toLanguageString(pageInputAriaLabel.messageKey, pageInputAriaLabel.defaultMessage),
+      attrs: this.v3 ? undefined : {
+        ariaLabel: localizationService.toLanguageString(pageInputAriaLabel.messageKey, pageInputAriaLabel.defaultMessage)
+      },
       onBlur: this.blurHandler,
       on: this.v3 ? undefined : {
         "blur": this.blurHandler,

package/dist/es/pager/PagerNumericButtons.js

@@ -5,6 +5,8 @@ var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 import { Button as KButton } from '@progress/kendo-vue-buttons';
 import { kendoThemeMaps } from '@progress/kendo-vue-common';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { messages, pagerSmallPageSelectorAriaLabel } from '../messages/main';
 /**
  * @hidden
  */
@@ -65,6 +67,11 @@ var PagerNumericButtonsVue2 = {
   render: function render(createElement) {
     var _this = this;
     var h = gh || createElement;
+    var localizationService = provideLocalizationService(this);
+    var pagerSmallPageSelectoLabel = this.$props.messagesMap ? this.$props.messagesMap(pagerSmallPageSelectorAriaLabel) : {
+      messageKey: pagerSmallPageSelectorAriaLabel,
+      defaultMessage: messages[pagerSmallPageSelectorAriaLabel]
+    };
     var prevDots = this.start > 1 &&
     // @ts-ignore function children
     h(KButton, {
@@ -123,6 +130,7 @@ var PagerNumericButtonsVue2 = {
         // @ts-ignore function children
         h(KButton, {
           key: page,
+          "class": 'k-link',
           onClick: function onClick(e) {
             return _this.click(e, page);
           },
@@ -139,6 +147,7 @@ var PagerNumericButtonsVue2 = {
             size: this.$props.size,
             rounded: null,
             role: "button",
+            title: 'Page ' + page,
             "aria-current": this.$props.currentPage === page ? true : undefined
           },
           fillMode: 'flat',
@@ -146,6 +155,7 @@ var PagerNumericButtonsVue2 = {
           size: this.$props.size,
           rounded: null,
           role: "button",
+          title: 'Page ' + page,
           "aria-current": this.$props.currentPage === page ? true : undefined
         }, this.v3 ? function () {
           return [page];
@@ -155,6 +165,10 @@ var PagerNumericButtonsVue2 = {
     var dropdown = function dropdown(currentButtons) {
       return h("select", {
         "class": this.dropdownClass,
+        ariaLabel: localizationService.toLanguageString(pagerSmallPageSelectoLabel.messageKey, pagerSmallPageSelectoLabel.defaultMessage),
+        attrs: this.v3 ? undefined : {
+          ariaLabel: localizationService.toLanguageString(pagerSmallPageSelectoLabel.messageKey, pagerSmallPageSelectoLabel.defaultMessage)
+        },
         onChange: this.ddlChange,
         on: this.v3 ? undefined : {
           "change": this.ddlChange

package/dist/esm/filter/Expression.js

@@ -162,8 +162,10 @@ var ExpressionVue2 = {
     h(Toolbar, {
       keyboardNavigation: false,
       attrs: this.v3 ? undefined : {
-        keyboardNavigation: false
-      }
+        keyboardNavigation: false,
+        ariaLabel: filter.ariaLabel ? filter.ariaLabel : undefined
+      },
+      ariaLabel: filter.ariaLabel ? filter.ariaLabel : undefined
     }, this.v3 ? function () {
       return [
       // @ts-ignore function children 

package/dist/esm/filter/Filter.d.ts

@@ -41,6 +41,10 @@ export interface FilterProps {
      * The initial composite filter descriptor which will be used when a new group is created.
      */
     defaultGroupFilter?: CompositeFilterDescriptor;
+    /**
+     * Defines the `aria-label` attribute of the upper-most Toolbar that is part of the Filter component .
+     */
+    upperToolbarAriaLabel?: string;
 }
 /**
  * @hidden

package/dist/esm/filter/Filter.js

@@ -45,7 +45,11 @@ var FilterVue2 = {
       default: undefined
     },
     value: Object,
-    defaultGroupFilter: Object
+    defaultGroupFilter: Object,
+    upperToolbarAriaLabel: {
+      type: String,
+      default: undefined
+    }
   },
   inject: {
     kendoLocalizationService: {
@@ -100,8 +104,9 @@ var FilterVue2 = {
     }, [
     // @ts-ignore function children
     h(GroupToolbar, {
-      filter: this.computedValue,
+      "aria-label": this.$props.upperToolbarAriaLabel,
       attrs: this.v3 ? undefined : {
+        "aria-label": this.$props.upperToolbarAriaLabel,
         filter: this.computedValue,
         fields: fields,
         defaultGroupFilter: this.$props.defaultGroupFilter || {
@@ -109,6 +114,7 @@ var FilterVue2 = {
           filters: []
         }
       },
+      filter: this.computedValue,
       fields: fields,
       onChange: this.onFilterChange,
       on: this.v3 ? undefined : {

package/dist/esm/filter/GroupFilters.js

@@ -17,6 +17,8 @@ var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 import { isCompositeFilterDescriptor } from '@progress/kendo-data-query';
 import { GroupToolbar } from './GroupToolbar.js';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { messages, filterGroupFilterAriaLabel } from '../messages/main.js';
 import { Expression } from './Expression.js';
 /**
  * @hidden
@@ -56,6 +58,7 @@ var GroupFilterVue2 = {
   },
   render: function render(createElement) {
     var h = gh || createElement;
+    var localizationService = provideLocalizationService(this);
     var _a = this.$props,
       fields = _a.fields,
       filter = _a.filter,
@@ -81,9 +84,11 @@ var GroupFilterVue2 = {
         attrs: this.v3 ? undefined : {
           filter: f,
           fields: fields,
+          ariaLabel: localizationService.toLanguageString(filterGroupFilterAriaLabel, messages[filterGroupFilterAriaLabel]),
           defaultGroupFilter: this.$props.defaultGroupFilter
         },
         fields: fields,
+        ariaLabel: localizationService.toLanguageString(filterGroupFilterAriaLabel, messages[filterGroupFilterAriaLabel]),
         onChange: this.onChange,
         on: this.v3 ? undefined : {
           "change": this.onChange,

package/dist/esm/filter/GroupToolbar.d.ts

@@ -29,6 +29,7 @@ export interface GroupProps {
     filter: CompositeFilterDescriptor;
     fields: Array<FieldSettings>;
     defaultGroupFilter: CompositeFilterDescriptor;
+    ariaLabel: String;
 }
 /**
  * @hidden

package/dist/esm/filter/GroupToolbar.js

@@ -51,6 +51,10 @@ var GroupToolbarVue2 = {
     defaultGroupFilter: {
       type: Object,
       required: true
+    },
+    ariaLabel: {
+      type: String,
+      default: undefined
     }
   },
   inject: {
@@ -79,8 +83,12 @@ var GroupToolbarVue2 = {
     h(Toolbar, {
       keyboardNavigation: false,
       attrs: this.v3 ? undefined : {
-        keyboardNavigation: false
-      }
+        keyboardNavigation: false,
+        role: "toolbar",
+        "aria-label": this.$props.ariaLabel
+      },
+      role: "toolbar",
+      "aria-label": this.$props.ariaLabel
     }, this.v3 ? function () {
       return [
       // @ts-ignore function children 

package/dist/esm/messages/main.d.ts

@@ -26,6 +26,14 @@ export declare const pagerLastPage = "pager.lastPage";
  * @hidden
  */
 export declare const pagerItemPerPage = "pager.itemsPerPage";
+/**
+ * @hidden
+ */
+export declare const pagerPageInputAriaLabel = "pager.pageInputAriaLabel";
+/**
+ * @hidden
+ */
+export declare const pagerSmallPageSelectorAriaLabel = "pager.smallPageSelectorAriaLabel";
 /**
  * @hidden
  */
@@ -46,6 +54,10 @@ export declare const pagerTotalPages = "pager.totalPages";
  * @hidden
  */
 export declare const filterEqOperator = "filter.eqOperator";
+/**
+ * @hidden
+ */
+export declare const filterGroupFilterAriaLabel = "filter.groupFilterAriaLabel";
 /**
  * @hidden
  */
@@ -310,6 +322,9 @@ export declare const filterDropDownOperatorAriaLabel = "filter.dropdownOperatorA
  * @hidden
  */
 export declare const messages: {
+    "filter.groupFilterAriaLabel": string;
+    "pager.smallPageSelectorAriaLabel": string;
+    "pager.pageInputAriaLabel": string;
     "pager.itemsPerPage": string;
     "pager.pageSelection": string;
     "pager.info": string;

package/dist/esm/messages/main.js

@@ -27,6 +27,14 @@ export var pagerLastPage = 'pager.lastPage';
  * @hidden
  */
 export var pagerItemPerPage = 'pager.itemsPerPage';
+/**
+ * @hidden
+ */
+export var pagerPageInputAriaLabel = 'pager.pageInputAriaLabel';
+/**
+ * @hidden
+ */
+export var pagerSmallPageSelectorAriaLabel = 'pager.smallPageSelectorAriaLabel';
 /**
  * @hidden
  */
@@ -47,6 +55,10 @@ export var pagerTotalPages = 'pager.totalPages';
  * @hidden
  */
 export var filterEqOperator = 'filter.eqOperator';
+/**
+ * @hidden
+ */
+export var filterGroupFilterAriaLabel = 'filter.groupFilterAriaLabel';
 /**
  * @hidden
  */
@@ -311,6 +323,9 @@ export var filterDropDownOperatorAriaLabel = 'filter.dropdownOperatorAriaLabel';
  * @hidden
  */
 export var messages = (_a = {},
+    _a[filterGroupFilterAriaLabel] = 'Group Filter',
+    _a[pagerSmallPageSelectorAriaLabel] = 'Select page',
+    _a[pagerPageInputAriaLabel] = 'Pager - Page number input',
     _a[pagerItemPerPage] = 'items per page',
     _a[pagerPageSelection] = 'Select page',
     _a[pagerInfo] = '{0} - {1} of {2} items',
@@ -319,7 +334,7 @@ export var messages = (_a = {},
     _a[pagerNextPage] = 'Go to the next page',
     _a[pagerLastPage] = 'Go to the last page',
     _a[pagerPage] = 'Page',
-    _a[pagerOf] = 'Of',
+    _a[pagerOf] = 'of',
     _a[pagerTotalPages] = '{0}',
     _a[searchPlaceholder] = 'Search',
     _a[selectAllRows] = 'Select All Rows',

package/dist/esm/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-data-tools',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1677156449,
+    publishDate: 1677159743,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/esm/pager/Pager.d.ts

@@ -61,6 +61,10 @@ export interface PagerProps extends GridPagerSettings {
      * The event that is emited when the page is changed.
      */
     onPagechange?: (event: any) => any;
+    /**
+     * Defines the `id` of the element that is being controlled by the pager - for example a Grid.
+     */
+    ariaControls?: string;
 }
 /**
  * @hidden

package/dist/esm/pager/Pager.js

@@ -77,7 +77,11 @@ var PagerVue2 = {
       }
     },
     pagerRender: [String, Function, Object],
-    width: [Number, String]
+    width: [Number, String],
+    ariaControls: {
+      type: String,
+      default: undefined
+    }
   },
   data: function data() {
     return {
@@ -403,19 +407,29 @@ var PagerVue2 = {
       style: {
         width: width
       },
-      role: "navigation",
+      role: "application",
       attrs: this.v3 ? undefined : {
-        role: "navigation"
-      }
+        role: "application",
+        "aria-roledescription": "pager"
+      },
+      "aria-roledescription": "pager"
     }, [pagerContent]) : h("div", {
       "class": this.wrapperClass,
       style: {
         width: width
       },
-      role: "navigation",
+      role: "application",
       attrs: this.v3 ? undefined : {
-        role: "navigation"
-      }
+        role: "application",
+        "aria-roledescription": "pager",
+        "aria-keyshortcuts": "Enter ArrowRight ArrowLeft",
+        "aria-label": 'Page navigation, page ' + this.currentPage + ' of ' + this.totalPages,
+        "aria-controls": this.$props.ariaControls
+      },
+      "aria-roledescription": "pager",
+      "aria-keyshortcuts": "Enter ArrowRight ArrowLeft",
+      "aria-label": 'Page navigation, page ' + this.currentPage + ' of ' + this.totalPages,
+      "aria-controls": this.$props.ariaControls
     }, [h("div", {
       "class": 'k-pager-numbers-wrap'
     }, [first, prev, changer, next, last]), renderPageSizes, infoElement]);

package/dist/esm/pager/PagerInput.js

@@ -4,7 +4,7 @@ var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var inject = allVue.inject;
-import { messages, pagerOf, pagerPage, pagerTotalPages } from '../messages/main.js';
+import { messages, pagerOf, pagerPage, pagerTotalPages, pagerPageInputAriaLabel } from '../messages/main.js';
 import { provideIntlService, provideLocalizationService } from '@progress/kendo-vue-intl';
 import { kendoThemeMaps } from '@progress/kendo-vue-common';
 /**
@@ -86,6 +86,10 @@ var PagerInputVue2 = {
       messageKey: pagerTotalPages,
       defaultMessage: messages[pagerTotalPages]
     };
+    var pageInputAriaLabel = this.$props.messagesMap ? this.$props.messagesMap(pagerPageInputAriaLabel) : {
+      messageKey: pagerPageInputAriaLabel,
+      defaultMessage: messages[pagerPageInputAriaLabel]
+    };
     return h("span", {
       "class": "k-pager-input k-label"
     }, [localizationService.toLanguageString(pageMessage.messageKey, pageMessage.defaultMessage), h("span", {
@@ -96,6 +100,10 @@ var PagerInputVue2 = {
       domProps: this.v3 ? undefined : {
         "value": this.value()
       },
+      ariaLabel: localizationService.toLanguageString(pageInputAriaLabel.messageKey, pageInputAriaLabel.defaultMessage),
+      attrs: this.v3 ? undefined : {
+        ariaLabel: localizationService.toLanguageString(pageInputAriaLabel.messageKey, pageInputAriaLabel.defaultMessage)
+      },
       onBlur: this.blurHandler,
       on: this.v3 ? undefined : {
         "blur": this.blurHandler,