@progress/kendo-vue-data-tools 3.5.3 → 3.5.4

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: 1662389045,
+    publishDate: 1662729381,
     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.js

@@ -109,7 +109,8 @@ var PagerVue2 = {
     wrapperClass: {
       get: function get() {
         return {
-          'k-pager-wrap k-pager k-widget': true,
+          'k-widget': true,
+          'k-pager': true,
           'k-pager-sm': this.size === 'small',
           'k-pager-md': this.size === 'medium'
         };
@@ -269,10 +270,10 @@ var PagerVue2 = {
         attrs: this.v3 ? undefined : {
           page: 1,
           title: localizationService.toLanguageString(firstPageMessage.messageKey, firstPageMessage.defaultMessage),
-          icon: 'k-icon k-i-seek-w'
+          icon: 'caret-alt-to-left'
         },
         title: localizationService.toLanguageString(firstPageMessage.messageKey, firstPageMessage.defaultMessage),
-        icon: 'k-icon k-i-seek-w',
+        icon: 'caret-alt-to-left',
         onPagechange: this.changePage,
         on: this.v3 ? undefined : {
           "pagechange": this.changePage
@@ -285,10 +286,10 @@ var PagerVue2 = {
         attrs: this.v3 ? undefined : {
           page: this.currentPage - 1,
           title: localizationService.toLanguageString(previousPageMessage.messageKey, previousPageMessage.defaultMessage),
-          icon: 'k-icon k-i-arrow-w'
+          icon: 'caret-alt-left'
         },
         title: localizationService.toLanguageString(previousPageMessage.messageKey, previousPageMessage.defaultMessage),
-        icon: 'k-icon k-i-arrow-w',
+        icon: 'caret-alt-left',
         onPagechange: this.changePage,
         on: this.v3 ? undefined : {
           "pagechange": this.changePage
@@ -301,10 +302,10 @@ var PagerVue2 = {
         attrs: this.v3 ? undefined : {
           page: this.currentPage + 1,
           title: localizationService.toLanguageString(nextPageMessage.messageKey, nextPageMessage.defaultMessage),
-          icon: 'k-icon k-i-arrow-e'
+          icon: 'caret-alt-right'
         },
         title: localizationService.toLanguageString(nextPageMessage.messageKey, nextPageMessage.defaultMessage),
-        icon: 'k-icon k-i-arrow-e',
+        icon: 'caret-alt-right',
         onPagechange: this.changePage,
         on: this.v3 ? undefined : {
           "pagechange": this.changePage
@@ -317,10 +318,10 @@ var PagerVue2 = {
         attrs: this.v3 ? undefined : {
           page: this.totalPages,
           title: localizationService.toLanguageString(lastPageMessage.messageKey, lastPageMessage.defaultMessage),
-          icon: 'k-icon k-i-seek-e'
+          icon: 'caret-alt-to-right'
         },
         title: localizationService.toLanguageString(lastPageMessage.messageKey, lastPageMessage.defaultMessage),
-        icon: 'k-icon k-i-seek-e',
+        icon: 'caret-alt-to-right',
         onPagechange: this.changePage,
         on: this.v3 ? undefined : {
           "pagechange": this.changePage

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

@@ -29,6 +29,12 @@ export interface PagerNavigationButtonEmits {
 export interface PagerNavigationButtonMethods extends Vue2type {
     changePage: (e: any) => void;
 }
+/**
+ * @hidden
+ */
+export interface PagerNavigationButtonComputed {
+    [key: string]: any;
+}
 /**
  * @hidden
  */
@@ -37,7 +43,7 @@ export interface PagerNavigationButtonState {
 /**
  * @hidden
  */
-export interface PagerNavigationButtonAll extends PagerNavigationButtonMethods, PagerNavigationButtonState {
+export interface PagerNavigationButtonAll extends PagerNavigationButtonMethods, PagerNavigationButtonState, PagerNavigationButtonProps, PagerNavigationButtonComputed {
 }
 /**
  * @hidden

package/dist/esm/pager/PagerNavigationButton.js

@@ -14,6 +14,11 @@ var PagerNavigationButtonVue2 = {
     icon: String,
     page: Number
   },
+  computed: {
+    iconClass: function iconClass() {
+      return 'k-icon k-i-' + this.icon;
+    }
+  },
   inject: {
     kendoLocalizationService: {
       default: null
@@ -47,15 +52,15 @@ var PagerNavigationButtonVue2 = {
       href: "#",
       attrs: this.v3 ? undefined : {
         href: "#",
-        title: this.$props.title
+        role: "button",
+        title: this.$props.title,
+        "aria-label": this.$props.title
       },
-      title: this.$props.title
+      role: "button",
+      title: this.$props.title,
+      "aria-label": this.$props.title
     }, [h("span", {
-      "class": this.$props.icon,
-      "aria-label": this.$props.title,
-      attrs: this.v3 ? undefined : {
-        "aria-label": this.$props.title
-      }
+      "class": this.iconClass
     })]);
   }
 };

package/dist/esm/pager/PagerNumericButtons.js

@@ -135,7 +135,7 @@ var PagerNumericButtonsVue2 = {
     return h("div", {
       "class": "k-pager-numbers-wrap"
     }, [this.$props.size !== 'small' ? h("ul", {
-      "class": "k-pager-numbers k-reset"
+      "class": "k-pager-numbers"
     }, [prevDots, numerics, postDots]) : dropdown.call(this, buttons)]);
   }
 };

package/dist/esm/pager/PagerPageSizes.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, pagerItemPerPage } from '../messages/main.js';
+import { messages, pagerItemPerPage, pagerPageSelection } from '../messages/main.js';
 import { provideLocalizationService } from '@progress/kendo-vue-intl';
 import { DropDownList } from '@progress/kendo-vue-dropdowns';
 /**
@@ -48,6 +48,7 @@ var PagerPageSizesVue2 = {
         value = _a.value,
         pageSizes = _a.pageSizes,
         pageSize = _a.pageSize;
+    var ls = provideLocalizationService(this);
     var sizes = pageSizes.slice();
 
     if (value === undefined && sizes.filter(function (s) {
@@ -60,6 +61,10 @@ var PagerPageSizesVue2 = {
       messageKey: pagerItemPerPage,
       defaultMessage: messages[pagerItemPerPage]
     };
+    var pageSelectionMessage = this.$props.messagesMap ? this.$props.messagesMap(pagerPageSelection) : {
+      messageKey: pagerPageSelection,
+      defaultMessage: messages[pagerPageSelection]
+    };
     return h("span", {
       "class": "k-pager-sizes k-label"
     }, [// @ts-ignore function children
@@ -67,14 +72,16 @@ var PagerPageSizesVue2 = {
       value: value !== undefined ? value : pageSize,
       attrs: this.v3 ? undefined : {
         value: value !== undefined ? value : pageSize,
-        dataItems: sizes
+        dataItems: sizes,
+        ariaLabel: ls.toLanguageString(pageSelectionMessage.messageKey, pageSelectionMessage.defaultMessage)
       },
       dataItems: sizes,
+      ariaLabel: ls.toLanguageString(pageSelectionMessage.messageKey, pageSelectionMessage.defaultMessage),
       onChange: this.pageSizeChange,
       on: this.v3 ? undefined : {
         "change": this.pageSizeChange
       }
-    }), provideLocalizationService(this).toLanguageString(itemPerPageMessage.messageKey, itemPerPageMessage.defaultMessage)]);
+    }), ls.toLanguageString(itemPerPageMessage.messageKey, itemPerPageMessage.defaultMessage)]);
   }
 };
 /**

package/dist/npm/cells/FilterCell.d.ts

@@ -7,7 +7,7 @@ import { FilterCellProps } from '../interfaces/FilterCellProps';
 /**
  * @hidden
  */
-export interface FilterCellMethods extends Vue2type {
+export interface FilterCellMethods {
     triggerClick: () => void;
     inputChange: (value: any, e: any) => void;
     operatorChange: (operatorValue: any, e: any) => void;
@@ -18,7 +18,12 @@ export interface FilterCellMethods extends Vue2type {
 /**
  * @hidden
  */
-declare let FilterCellVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<FilterCellMethods>, {}, RecordPropsDefinition<FilterCellProps>>;
+export interface FilterCellAll extends FilterCellMethods, FilterCellProps, Vue2type {
+}
+/**
+ * @hidden
+ */
+declare let FilterCellVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<FilterCellAll>, {}, RecordPropsDefinition<FilterCellProps>>;
 /**
  * @hidden
  */

package/dist/npm/cells/FilterCell.js

@@ -50,7 +50,8 @@ var FilterCellVue2 = {
     operators: Array,
     booleanValues: Array,
     onChange: Function,
-    render: [String, Function, Object]
+    render: [String, Function, Object],
+    ariaLabel: String
   },
   inject: {
     kendoLocalizationService: {
@@ -102,7 +103,7 @@ var FilterCellVue2 = {
     var _this = this;
 
     var h = gh || createElement;
-    var localizationService = (0, kendo_vue_intl_1.provideLocalizationService)(this);
+    var ls = (0, kendo_vue_intl_1.provideLocalizationService)(this);
     var selectedOperator = this.$props.operators.find(function (item) {
       return item.operator === _this.$props.operator;
     }) || null;
@@ -124,19 +125,21 @@ var FilterCellVue2 = {
             iconClassName: "k-i-filter k-icon",
             "data-items": this.$props.operators,
             textField: "text",
-            title: localizationService.toLanguageString(main_1.columnMenuFilterChooseOperator, main_1.messages[main_1.columnMenuFilterChooseOperator]),
+            title: ls.toLanguageString(main_1.columnMenuFilterChooseOperator, main_1.messages[main_1.columnMenuFilterChooseOperator]),
             popupSettings: {
               width: ''
-            }
+            },
+            "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterDropDownOperatorAriaLabel, main_1.messages[main_1.filterDropDownOperatorAriaLabel])
           },
           "class": "k-dropdown-operator",
           iconClassName: "k-i-filter k-icon",
           "data-items": this.$props.operators,
           textField: "text",
-          title: localizationService.toLanguageString(main_1.columnMenuFilterChooseOperator, main_1.messages[main_1.columnMenuFilterChooseOperator]),
+          title: ls.toLanguageString(main_1.columnMenuFilterChooseOperator, main_1.messages[main_1.columnMenuFilterChooseOperator]),
           popupSettings: {
             width: ''
-          }
+          },
+          "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterDropDownOperatorAriaLabel, main_1.messages[main_1.filterDropDownOperatorAriaLabel])
         })
       );
     };
@@ -151,7 +154,8 @@ var FilterCellVue2 = {
               value: value,
               attrs: this.v3 ? undefined : {
                 value: value,
-                title: this.$props.title
+                title: this.$props.title,
+                "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterNumericFilterAriaLabel, main_1.messages[main_1.filterNumericFilterAriaLabel])
               },
               onChange: function onChange(e) {
                 _this.inputChange(e.value, e.event);
@@ -161,7 +165,8 @@ var FilterCellVue2 = {
                   _this.inputChange(e.value, e.event);
                 }
               },
-              title: this.$props.title
+              title: this.$props.title,
+              "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterNumericFilterAriaLabel, main_1.messages[main_1.filterNumericFilterAriaLabel])
             })
           );
 
@@ -171,7 +176,8 @@ var FilterCellVue2 = {
               value: value,
               attrs: this.v3 ? undefined : {
                 value: value,
-                title: this.$props.title
+                title: this.$props.title,
+                "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterDateFilterAriaLabel, main_1.messages[main_1.filterDateFilterAriaLabel])
               },
               onChange: function onChange(e) {
                 _this.inputChange(e.value, e);
@@ -181,7 +187,8 @@ var FilterCellVue2 = {
                   _this.inputChange(e.value, e);
                 }
               },
-              title: this.$props.title
+              title: this.$props.title,
+              "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterDateFilterAriaLabel, main_1.messages[main_1.filterDateFilterAriaLabel])
             })
           );
 
@@ -202,11 +209,13 @@ var FilterCellVue2 = {
                 }),
                 "data-items": booleanValues,
                 textField: "text",
-                title: this.$props.title
+                title: this.$props.title,
+                "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterEnumFilterDropdownAriaLabel, main_1.messages[main_1.filterEnumFilterDropdownAriaLabel])
               },
               "data-items": booleanValues,
               textField: "text",
-              title: this.$props.title
+              title: this.$props.title,
+              "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterEnumFilterDropdownAriaLabel, main_1.messages[main_1.filterEnumFilterDropdownAriaLabel])
             })
           );
 
@@ -229,35 +238,37 @@ var FilterCellVue2 = {
             },
             title: this.$props.title,
             attrs: this.v3 ? undefined : {
-              title: this.$props.title
-            }
+              title: this.$props.title,
+              "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterTextFilterAriaLabel, main_1.messages[main_1.filterTextFilterAriaLabel])
+            },
+            "aria-label": this.ariaLabel || ls.toLanguageString(main_1.filterTextFilterAriaLabel, main_1.messages[main_1.filterTextFilterAriaLabel])
           })]);
       }
     };
 
     var defaultRendering = h("div", {
       "class": "k-filtercell"
-    }, [h("div", {
-      "class": "k-filtercell-wrapper"
-    }, [filterComponent.call(this, this.$props.filterType, this.$props.value), renderOperatorEditor.call(this), // @ts-ignore function children 
+    }, [h("span", [filterComponent.call(this, this.$props.filterType, this.$props.value), h("div", {
+      "class": "k-filtercell-operator"
+    }, [renderOperatorEditor.call(this), // @ts-ignore function children 
     h(kendo_vue_buttons_1.Button, {
       type: "button",
       attrs: this.v3 ? undefined : {
         type: "button",
         icon: 'filter-clear',
-        title: localizationService.toLanguageString(main_1.columnMenuFilterClearButton, main_1.messages[main_1.columnMenuFilterClearButton])
+        title: ls.toLanguageString(main_1.columnMenuFilterClearButton, main_1.messages[main_1.columnMenuFilterClearButton])
       },
       icon: 'filter-clear',
       "class": {
         /* button is always visible if there is either value or operator */
         'k-disabled': !(!(this.$props.value === null || this.$props.value === '') || this.$props.operator)
       },
-      title: localizationService.toLanguageString(main_1.columnMenuFilterClearButton, main_1.messages[main_1.columnMenuFilterClearButton]),
+      title: ls.toLanguageString(main_1.columnMenuFilterClearButton, main_1.messages[main_1.columnMenuFilterClearButton]),
       onClick: this.clear,
       on: this.v3 ? undefined : {
         "click": this.clear
       }
-    })])]);
+    })])])]);
     var gridListeners = this.$props.grid ? kendo_vue_common_1.getListeners.call(this.$props.grid) : null;
     var cellRenderFunction = kendo_vue_common_1.templateRendering.call(this.$props.grid, this.$props.render, gridListeners);
     return kendo_vue_common_1.getTemplate.call(this, {

package/dist/npm/filter/Expression.js

@@ -205,7 +205,8 @@ var ExpressionVue2 = {
             textField: "label",
             value: fields.find(function (f) {
               return f.name === filter.field;
-            })
+            }),
+            ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
           },
           textField: "label",
           value: fields.find(function (f) {
@@ -214,7 +215,8 @@ var ExpressionVue2 = {
           onChange: _this.onFieldChange,
           on: _this.v3 ? undefined : {
             "change": _this.onFieldChange
-          }
+          },
+          ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
         })];
       } : [h(kendo_vue_dropdowns_1.DropDownList, {
         "class": "k-filter-dropdown",
@@ -224,7 +226,8 @@ var ExpressionVue2 = {
           textField: "label",
           value: fields.find(function (f) {
             return f.name === filter.field;
-          })
+          }),
+          ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
         },
         textField: "label",
         value: fields.find(function (f) {
@@ -233,7 +236,8 @@ var ExpressionVue2 = {
         onChange: _this.onFieldChange,
         on: _this.v3 ? undefined : {
           "change": _this.onFieldChange
-        }
+        },
+        ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
       })]), // @ts-ignore function children 
       h(kendo_vue_buttons_1.ToolbarItem, {
         "class": "k-filter-operator"
@@ -246,7 +250,8 @@ var ExpressionVue2 = {
             textField: "text",
             value: operators.find(function (o) {
               return o.operator === filter.operator;
-            })
+            }),
+            ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
           },
           textField: "text",
           value: operators.find(function (o) {
@@ -255,7 +260,8 @@ var ExpressionVue2 = {
           onChange: _this.onOperatorChange,
           on: _this.v3 ? undefined : {
             "change": _this.onOperatorChange
-          }
+          },
+          ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
         })];
       } : [h(kendo_vue_dropdowns_1.DropDownList, {
         dataItems: operators,
@@ -264,7 +270,8 @@ var ExpressionVue2 = {
           textField: "text",
           value: operators.find(function (o) {
             return o.operator === filter.operator;
-          })
+          }),
+          ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
         },
         textField: "text",
         value: operators.find(function (o) {
@@ -273,7 +280,8 @@ var ExpressionVue2 = {
         onChange: _this.onOperatorChange,
         on: _this.v3 ? undefined : {
           "change": _this.onOperatorChange
-        }
+        },
+        ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
       })]), // @ts-ignore function children 
       h(kendo_vue_buttons_1.ToolbarItem, {
         "class": "k-filter-value"
@@ -325,7 +333,8 @@ var ExpressionVue2 = {
           textField: "label",
           value: fields.find(function (f) {
             return f.name === filter.field;
-          })
+          }),
+          ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
         },
         textField: "label",
         value: fields.find(function (f) {
@@ -334,7 +343,8 @@ var ExpressionVue2 = {
         onChange: _this.onFieldChange,
         on: _this.v3 ? undefined : {
           "change": _this.onFieldChange
-        }
+        },
+        ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
       })];
     } : [h(kendo_vue_dropdowns_1.DropDownList, {
       "class": "k-filter-dropdown",
@@ -344,7 +354,8 @@ var ExpressionVue2 = {
         textField: "label",
         value: fields.find(function (f) {
           return f.name === filter.field;
-        })
+        }),
+        ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
       },
       textField: "label",
       value: fields.find(function (f) {
@@ -353,7 +364,8 @@ var ExpressionVue2 = {
       onChange: _this.onFieldChange,
       on: _this.v3 ? undefined : {
         "change": _this.onFieldChange
-      }
+      },
+      ariaLabel: locService.toLanguageString(main_1.filterExpressionDropdownAriaLabel, main_1.messages[main_1.filterExpressionDropdownAriaLabel])
     })]), h(kendo_vue_buttons_1.ToolbarItem, {
       "class": "k-filter-operator"
     }, _this.v3 ? function () {
@@ -364,7 +376,8 @@ var ExpressionVue2 = {
           textField: "text",
           value: operators.find(function (o) {
             return o.operator === filter.operator;
-          })
+          }),
+          ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
         },
         textField: "text",
         value: operators.find(function (o) {
@@ -373,7 +386,8 @@ var ExpressionVue2 = {
         onChange: _this.onOperatorChange,
         on: _this.v3 ? undefined : {
           "change": _this.onOperatorChange
-        }
+        },
+        ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
       })];
     } : [h(kendo_vue_dropdowns_1.DropDownList, {
       dataItems: operators,
@@ -382,7 +396,8 @@ var ExpressionVue2 = {
         textField: "text",
         value: operators.find(function (o) {
           return o.operator === filter.operator;
-        })
+        }),
+        ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
       },
       textField: "text",
       value: operators.find(function (o) {
@@ -391,7 +406,8 @@ var ExpressionVue2 = {
       onChange: _this.onOperatorChange,
       on: _this.v3 ? undefined : {
         "change": _this.onOperatorChange
-      }
+      },
+      ariaLabel: locService.toLanguageString(main_1.filterExpressionOperatorDropdownAriaLabel, main_1.messages[main_1.filterExpressionOperatorDropdownAriaLabel])
     })]), h(kendo_vue_buttons_1.ToolbarItem, {
       "class": "k-filter-value"
     }, _this.v3 ? function () {

package/dist/npm/filter/filters/EnumFilter.js

@@ -45,7 +45,8 @@ var EnumFilterVue2 = {
       required: true
     },
     dataItems: Array,
-    defaultItem: Object
+    defaultItem: Object,
+    ariaLabel: String
   },
   inject: {
     kendoLocalizationService: {
@@ -66,7 +67,9 @@ var EnumFilterVue2 = {
         filter = _a.filter,
         _b = _a.dataItems,
         dataItems = _b === void 0 ? [] : _b,
-        defaultItem = _a.defaultItem;
+        defaultItem = _a.defaultItem,
+        _c = _a.ariaLabel,
+        ariaLabel = _c === void 0 ? locService.toLanguageString(main_1.filterEnumFilterDropdownAriaLabel, main_1.messages[main_1.filterEnumFilterDropdownAriaLabel]) : _c;
     var locData = dataItems.map(function (item) {
       return __assign(__assign({}, item), {
         text: locService.toLanguageString(item.text, main_1.messages[item.text] || item.text)
@@ -83,7 +86,8 @@ var EnumFilterVue2 = {
           }) || null,
           defaultItem: defaultItem,
           dataItems: locData,
-          textField: "text"
+          textField: "text",
+          ariaLabel: ariaLabel
         },
         onChange: this.onChange,
         on: this.v3 ? undefined : {
@@ -91,7 +95,8 @@ var EnumFilterVue2 = {
         },
         defaultItem: defaultItem,
         dataItems: locData,
-        textField: "text"
+        textField: "text",
+        ariaLabel: ariaLabel
       })
     );
   },

package/dist/npm/filter/filters/NumericFilter.js

@@ -28,6 +28,10 @@ var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 
 var kendo_vue_inputs_1 = require("@progress/kendo-vue-inputs");
+
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
+
+var main_1 = require("../../messages/main");
 /**
  * @hidden
  */
@@ -41,6 +45,11 @@ var NumericFilterVue2 = {
       required: true
     }
   },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    }
+  },
   // @ts-ignore
   setup: !isV3 ? undefined : function () {
     var v3 = !!isV3;
@@ -51,16 +60,20 @@ var NumericFilterVue2 = {
   render: function render(createElement) {
     var h = gh || createElement;
     var filter = this.$props.filter;
+    var ls = (0, kendo_vue_intl_1.provideLocalizationService)(this);
+    var ariaLabel = ls.toLanguageString(main_1.filterNumericFilterAriaLabel, main_1.messages[main_1.filterNumericFilterAriaLabel]);
     return (// @ts-ignore
       h(kendo_vue_inputs_1.NumericTextBox, {
         value: typeof filter.value === 'number' ? filter.value : null,
         attrs: this.v3 ? undefined : {
-          value: typeof filter.value === 'number' ? filter.value : null
+          value: typeof filter.value === 'number' ? filter.value : null,
+          ariaLabel: ariaLabel
         },
         onChange: this.onChange,
         on: this.v3 ? undefined : {
           "change": this.onChange
-        }
+        },
+        ariaLabel: ariaLabel
       })
     );
   },

package/dist/npm/filter/filters/TextFilter.d.ts

@@ -19,6 +19,10 @@ export interface TextFilterProps {
     onFilterchange?: (event: {
         nextFilter: FilterOperator;
     }) => void;
+    /**
+     * The accessible label of the component.
+     */
+    ariaLabel?: string;
 }
 /**
  * @hidden

package/dist/npm/filter/filters/TextFilter.js

@@ -28,6 +28,10 @@ var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 
 var kendo_vue_inputs_1 = require("@progress/kendo-vue-inputs");
+
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
+
+var main_1 = require("../../messages/main");
 /**
  * @hidden
  */
@@ -39,6 +43,12 @@ var TextFilterVue2 = {
     filter: {
       type: Object,
       required: true
+    },
+    ariaLabel: String
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
     }
   },
   // @ts-ignore
@@ -50,16 +60,21 @@ var TextFilterVue2 = {
   },
   render: function render(createElement) {
     var h = gh || createElement;
+    var locService = (0, kendo_vue_intl_1.provideLocalizationService)(this);
+    var _a = this.$props.ariaLabel,
+        ariaLabel = _a === void 0 ? locService.toLanguageString(main_1.filterTextFilterAriaLabel, main_1.messages[main_1.filterTextFilterAriaLabel]) : _a;
     return (// @ts-ignore
       h(kendo_vue_inputs_1.Input, {
         value: this.$props.filter.value || '',
         attrs: this.v3 ? undefined : {
-          value: this.$props.filter.value || ''
+          value: this.$props.filter.value || '',
+          ariaLabel: ariaLabel
         },
         onInput: this.onChange,
         on: this.v3 ? undefined : {
           "input": this.onChange
-        }
+        },
+        ariaLabel: ariaLabel
       })
     );
   },