@progress/kendo-vue-dropdowns 5.2.0 → 5.3.0-dev.202408221437

package/dist/es/DropDownList/DropDownList.js

@@ -1099,7 +1099,9 @@ var DropDownListVue2 = {
           value: filterText,
           size: this.$props.size,
           rounded: this.$props.rounded,
-          fillMode: this.$props.fillMode
+          fillMode: this.$props.fillMode,
+          ariaControlsId: this.base.listBoxId,
+          ariaActivedescendantId: "option-".concat(this.base.guid, "-").concat(this.focusedIndex())
         },
         ref: 'filterInput',
         onChange: this.handleListFilterChange,
@@ -1110,7 +1112,9 @@ var DropDownListVue2 = {
         onKeydown: this.handleKeyDown,
         size: this.$props.size,
         rounded: this.$props.rounded,
-        fillMode: this.$props.fillMode
+        fillMode: this.$props.fillMode,
+        ariaControlsId: this.base.listBoxId,
+        ariaActivedescendantId: "option-".concat(this.base.guid, "-").concat(this.focusedIndex())
       });
     };
     var renderScrollElement = function renderScrollElement() {

package/dist/es/common/ListFilter.d.ts

@@ -14,6 +14,8 @@ export interface ListFilterProps {
     rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
     fillMode?: null | 'solid' | 'flat' | 'outline' | string;
     adaptiveMode?: boolean;
+    ariaControlsId?: string;
+    ariaActivedescendantId?: string;
 }
 /**
  * @hidden

package/dist/es/common/ListFilter.js

@@ -19,6 +19,8 @@ var ref = allVue.ref;
 import { getRef, Icon, kendoThemeMaps, setRef } from '@progress/kendo-vue-common';
 import { searchIcon } from '@progress/kendo-svg-icons';
 import { TextBox } from '@progress/kendo-vue-inputs';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { filterLabel, messages } from '../messages/main';
 var sizeMap = kendoThemeMaps.sizeMap,
   roundedMap = kendoThemeMaps.roundedMap;
 /**
@@ -59,7 +61,9 @@ var ListFilterVue2 = {
     adaptiveMode: {
       type: Boolean,
       default: false
-    }
+    },
+    ariaControlsId: String,
+    ariaActivedescendantId: String
   },
   computed: {
     spanClass: function spanClass() {
@@ -116,7 +120,10 @@ var ListFilterVue2 = {
       size = _a.size,
       rounded = _a.rounded,
       fillMode = _a.fillMode,
-      adaptiveMode = _a.adaptiveMode;
+      adaptiveMode = _a.adaptiveMode,
+      ariaControlsId = _a.ariaControlsId,
+      ariaActivedescendantId = _a.ariaActivedescendantId;
+    var ariaLabel = provideLocalizationService(this).toLanguageString(filterLabel, messages[filterLabel]);
     var listFilterComponent = function listFilterComponent() {
       return h(TextBox, {
         ref: setRef(this, 'input'),
@@ -126,7 +133,13 @@ var ListFilterVue2 = {
           size: size,
           fillMode: fillMode,
           rounded: rounded,
-          inputPrefix: this.prefixRender
+          inputPrefix: this.prefixRender,
+          role: "searchbox",
+          "aria-label": ariaLabel,
+          "aria-haspopup": "listbox",
+          "aria-autocomplete": "list",
+          "aria-activedescendant": ariaActivedescendantId,
+          "aria-controls": ariaControlsId
         },
         onInput: this.onChange,
         on: this.v3 ? undefined : {
@@ -141,7 +154,13 @@ var ListFilterVue2 = {
         size: size,
         fillMode: fillMode,
         rounded: rounded,
-        inputPrefix: this.prefixRender
+        inputPrefix: this.prefixRender,
+        role: "searchbox",
+        "aria-label": ariaLabel,
+        "aria-haspopup": "listbox",
+        "aria-autocomplete": "list",
+        "aria-activedescendant": ariaActivedescendantId,
+        "aria-controls": ariaControlsId
       });
     };
     return !adaptiveMode ? h("div", {

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

@@ -14,6 +14,10 @@ export declare const clear = "dropdowns.clear";
  * @hidden
  */
 export declare const selectButton = "dropdowns.select";
+/**
+ * @hidden
+ */
+export declare const filterLabel = "dropdowns.defaultLabel";
 /**
  * @hidden
  */
@@ -30,6 +34,7 @@ export declare const messages: {
     "dropdowns.expandbutton": string;
     "dropdowns.nodata": string;
     "dropdowns.select": string;
+    "dropdowns.defaultLabel": string;
     "dropdowns.adaptiveModeFooterApply": string;
     "dropdowns.adaptiveModeFooterCancel": string;
 };

package/dist/es/messages/main.js

@@ -15,6 +15,10 @@ export var clear = 'dropdowns.clear';
  * @hidden
  */
 export var selectButton = 'dropdowns.select';
+/**
+ * @hidden
+ */
+export var filterLabel = 'dropdowns.defaultLabel';
 /**
  * @hidden
  */
@@ -31,6 +35,7 @@ export var messages = (_a = {},
     _a[expandButton] = 'expand button',
     _a[nodata] = 'NO DATA FOUND.',
     _a[selectButton] = 'Select',
+    _a[filterLabel] = 'Filter',
     _a[adaptiveModeFooterApply] = 'Apply',
     _a[adaptiveModeFooterCancel] = 'Cancel',
     _a);

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-dropdowns',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1722941610,
+    publishDate: 1724336903,
     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/DropDownList/DropDownList.js

@@ -1099,7 +1099,9 @@ var DropDownListVue2 = {
           value: filterText,
           size: this.$props.size,
           rounded: this.$props.rounded,
-          fillMode: this.$props.fillMode
+          fillMode: this.$props.fillMode,
+          ariaControlsId: this.base.listBoxId,
+          ariaActivedescendantId: "option-".concat(this.base.guid, "-").concat(this.focusedIndex())
         },
         ref: 'filterInput',
         onChange: this.handleListFilterChange,
@@ -1110,7 +1112,9 @@ var DropDownListVue2 = {
         onKeydown: this.handleKeyDown,
         size: this.$props.size,
         rounded: this.$props.rounded,
-        fillMode: this.$props.fillMode
+        fillMode: this.$props.fillMode,
+        ariaControlsId: this.base.listBoxId,
+        ariaActivedescendantId: "option-".concat(this.base.guid, "-").concat(this.focusedIndex())
       });
     };
     var renderScrollElement = function renderScrollElement() {

package/dist/esm/common/ListFilter.d.ts

@@ -14,6 +14,8 @@ export interface ListFilterProps {
     rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
     fillMode?: null | 'solid' | 'flat' | 'outline' | string;
     adaptiveMode?: boolean;
+    ariaControlsId?: string;
+    ariaActivedescendantId?: string;
 }
 /**
  * @hidden

package/dist/esm/common/ListFilter.js

@@ -19,6 +19,8 @@ var ref = allVue.ref;
 import { getRef, Icon, kendoThemeMaps, setRef } from '@progress/kendo-vue-common';
 import { searchIcon } from '@progress/kendo-svg-icons';
 import { TextBox } from '@progress/kendo-vue-inputs';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { filterLabel, messages } from '../messages/main.js';
 var sizeMap = kendoThemeMaps.sizeMap,
   roundedMap = kendoThemeMaps.roundedMap;
 /**
@@ -59,7 +61,9 @@ var ListFilterVue2 = {
     adaptiveMode: {
       type: Boolean,
       default: false
-    }
+    },
+    ariaControlsId: String,
+    ariaActivedescendantId: String
   },
   computed: {
     spanClass: function spanClass() {
@@ -116,7 +120,10 @@ var ListFilterVue2 = {
       size = _a.size,
       rounded = _a.rounded,
       fillMode = _a.fillMode,
-      adaptiveMode = _a.adaptiveMode;
+      adaptiveMode = _a.adaptiveMode,
+      ariaControlsId = _a.ariaControlsId,
+      ariaActivedescendantId = _a.ariaActivedescendantId;
+    var ariaLabel = provideLocalizationService(this).toLanguageString(filterLabel, messages[filterLabel]);
     var listFilterComponent = function listFilterComponent() {
       return h(TextBox, {
         ref: setRef(this, 'input'),
@@ -126,7 +133,13 @@ var ListFilterVue2 = {
           size: size,
           fillMode: fillMode,
           rounded: rounded,
-          inputPrefix: this.prefixRender
+          inputPrefix: this.prefixRender,
+          role: "searchbox",
+          "aria-label": ariaLabel,
+          "aria-haspopup": "listbox",
+          "aria-autocomplete": "list",
+          "aria-activedescendant": ariaActivedescendantId,
+          "aria-controls": ariaControlsId
         },
         onInput: this.onChange,
         on: this.v3 ? undefined : {
@@ -141,7 +154,13 @@ var ListFilterVue2 = {
         size: size,
         fillMode: fillMode,
         rounded: rounded,
-        inputPrefix: this.prefixRender
+        inputPrefix: this.prefixRender,
+        role: "searchbox",
+        "aria-label": ariaLabel,
+        "aria-haspopup": "listbox",
+        "aria-autocomplete": "list",
+        "aria-activedescendant": ariaActivedescendantId,
+        "aria-controls": ariaControlsId
       });
     };
     return !adaptiveMode ? h("div", {

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

@@ -14,6 +14,10 @@ export declare const clear = "dropdowns.clear";
  * @hidden
  */
 export declare const selectButton = "dropdowns.select";
+/**
+ * @hidden
+ */
+export declare const filterLabel = "dropdowns.defaultLabel";
 /**
  * @hidden
  */
@@ -30,6 +34,7 @@ export declare const messages: {
     "dropdowns.expandbutton": string;
     "dropdowns.nodata": string;
     "dropdowns.select": string;
+    "dropdowns.defaultLabel": string;
     "dropdowns.adaptiveModeFooterApply": string;
     "dropdowns.adaptiveModeFooterCancel": string;
 };

package/dist/esm/messages/main.js

@@ -15,6 +15,10 @@ export var clear = 'dropdowns.clear';
  * @hidden
  */
 export var selectButton = 'dropdowns.select';
+/**
+ * @hidden
+ */
+export var filterLabel = 'dropdowns.defaultLabel';
 /**
  * @hidden
  */
@@ -31,6 +35,7 @@ export var messages = (_a = {},
     _a[expandButton] = 'expand button',
     _a[nodata] = 'NO DATA FOUND.',
     _a[selectButton] = 'Select',
+    _a[filterLabel] = 'Filter',
     _a[adaptiveModeFooterApply] = 'Apply',
     _a[adaptiveModeFooterCancel] = 'Cancel',
     _a);

package/dist/esm/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-dropdowns',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1722941610,
+    publishDate: 1724336903,
     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/npm/DropDownList/DropDownList.js

@@ -1105,7 +1105,9 @@ var DropDownListVue2 = {
           value: filterText,
           size: this.$props.size,
           rounded: this.$props.rounded,
-          fillMode: this.$props.fillMode
+          fillMode: this.$props.fillMode,
+          ariaControlsId: this.base.listBoxId,
+          ariaActivedescendantId: "option-".concat(this.base.guid, "-").concat(this.focusedIndex())
         },
         ref: 'filterInput',
         onChange: this.handleListFilterChange,
@@ -1116,7 +1118,9 @@ var DropDownListVue2 = {
         onKeydown: this.handleKeyDown,
         size: this.$props.size,
         rounded: this.$props.rounded,
-        fillMode: this.$props.fillMode
+        fillMode: this.$props.fillMode,
+        ariaControlsId: this.base.listBoxId,
+        ariaActivedescendantId: "option-".concat(this.base.guid, "-").concat(this.focusedIndex())
       });
     };
     var renderScrollElement = function renderScrollElement() {

package/dist/npm/common/ListFilter.d.ts

@@ -14,6 +14,8 @@ export interface ListFilterProps {
     rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
     fillMode?: null | 'solid' | 'flat' | 'outline' | string;
     adaptiveMode?: boolean;
+    ariaControlsId?: string;
+    ariaActivedescendantId?: string;
 }
 /**
  * @hidden

package/dist/npm/common/ListFilter.js

@@ -25,6 +25,8 @@ var ref = allVue.ref;
 var kendo_vue_common_1 = require("@progress/kendo-vue-common");
 var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
 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");
 var sizeMap = kendo_vue_common_1.kendoThemeMaps.sizeMap,
   roundedMap = kendo_vue_common_1.kendoThemeMaps.roundedMap;
 /**
@@ -65,7 +67,9 @@ var ListFilterVue2 = {
     adaptiveMode: {
       type: Boolean,
       default: false
-    }
+    },
+    ariaControlsId: String,
+    ariaActivedescendantId: String
   },
   computed: {
     spanClass: function spanClass() {
@@ -122,7 +126,10 @@ var ListFilterVue2 = {
       size = _a.size,
       rounded = _a.rounded,
       fillMode = _a.fillMode,
-      adaptiveMode = _a.adaptiveMode;
+      adaptiveMode = _a.adaptiveMode,
+      ariaControlsId = _a.ariaControlsId,
+      ariaActivedescendantId = _a.ariaActivedescendantId;
+    var ariaLabel = (0, kendo_vue_intl_1.provideLocalizationService)(this).toLanguageString(main_1.filterLabel, main_1.messages[main_1.filterLabel]);
     var listFilterComponent = function listFilterComponent() {
       return h(kendo_vue_inputs_1.TextBox, {
         ref: (0, kendo_vue_common_1.setRef)(this, 'input'),
@@ -132,7 +139,13 @@ var ListFilterVue2 = {
           size: size,
           fillMode: fillMode,
           rounded: rounded,
-          inputPrefix: this.prefixRender
+          inputPrefix: this.prefixRender,
+          role: "searchbox",
+          "aria-label": ariaLabel,
+          "aria-haspopup": "listbox",
+          "aria-autocomplete": "list",
+          "aria-activedescendant": ariaActivedescendantId,
+          "aria-controls": ariaControlsId
         },
         onInput: this.onChange,
         on: this.v3 ? undefined : {
@@ -147,7 +160,13 @@ var ListFilterVue2 = {
         size: size,
         fillMode: fillMode,
         rounded: rounded,
-        inputPrefix: this.prefixRender
+        inputPrefix: this.prefixRender,
+        role: "searchbox",
+        "aria-label": ariaLabel,
+        "aria-haspopup": "listbox",
+        "aria-autocomplete": "list",
+        "aria-activedescendant": ariaActivedescendantId,
+        "aria-controls": ariaControlsId
       });
     };
     return !adaptiveMode ? h("div", {

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

@@ -14,6 +14,10 @@ export declare const clear = "dropdowns.clear";
  * @hidden
  */
 export declare const selectButton = "dropdowns.select";
+/**
+ * @hidden
+ */
+export declare const filterLabel = "dropdowns.defaultLabel";
 /**
  * @hidden
  */
@@ -30,6 +34,7 @@ export declare const messages: {
     "dropdowns.expandbutton": string;
     "dropdowns.nodata": string;
     "dropdowns.select": string;
+    "dropdowns.defaultLabel": string;
     "dropdowns.adaptiveModeFooterApply": string;
     "dropdowns.adaptiveModeFooterCancel": string;
 };

package/dist/npm/messages/main.js

@@ -1,7 +1,7 @@
 "use strict";
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.messages = exports.adaptiveModeFooterCancel = exports.adaptiveModeFooterApply = exports.selectButton = exports.clear = exports.expandButton = exports.nodata = void 0;
+exports.messages = exports.adaptiveModeFooterCancel = exports.adaptiveModeFooterApply = exports.filterLabel = exports.selectButton = exports.clear = exports.expandButton = exports.nodata = void 0;
 /**
  * @hidden
  */
@@ -18,6 +18,10 @@ exports.clear = 'dropdowns.clear';
  * @hidden
  */
 exports.selectButton = 'dropdowns.select';
+/**
+ * @hidden
+ */
+exports.filterLabel = 'dropdowns.defaultLabel';
 /**
  * @hidden
  */
@@ -34,6 +38,7 @@ exports.messages = (_a = {},
     _a[exports.expandButton] = 'expand button',
     _a[exports.nodata] = 'NO DATA FOUND.',
     _a[exports.selectButton] = 'Select',
+    _a[exports.filterLabel] = 'Filter',
     _a[exports.adaptiveModeFooterApply] = 'Apply',
     _a[exports.adaptiveModeFooterCancel] = 'Cancel',
     _a);

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-vue-dropdowns',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1722941610,
+    publishDate: 1724336903,
     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/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-vue-dropdowns",
   "description": "Kendo UI for Vue Dropdowns package",
-  "version": "5.2.0",
+  "version": "5.3.0-dev.202408221437",
   "repository": {
     "type": "git",
     "url": "https://github.com/telerik/kendo-vue.git"
@@ -54,21 +54,21 @@
     "vue": "^2.6.12 || ^3.0.2"
   },
   "dependencies": {
-    "@progress/kendo-vue-buttons": "5.2.0",
-    "@progress/kendo-vue-common": "5.2.0",
-    "@progress/kendo-vue-layout": "5.2.0",
-    "@progress/kendo-vue-popup": "5.2.0"
+    "@progress/kendo-vue-buttons": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-common": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-layout": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-popup": "5.3.0-dev.202408221437"
   },
   "devDependencies": {
     "@progress/kendo-data-query": "^1.7.0",
     "@progress/kendo-licensing": "^1.3.0",
     "@progress/kendo-svg-icons": "^3.0.0",
-    "@progress/kendo-vue-data-tools": "5.2.0",
-    "@progress/kendo-vue-inputs": "5.2.0",
-    "@progress/kendo-vue-intl": "5.2.0",
-    "@progress/kendo-vue-labels": "5.2.0",
-    "@progress/kendo-vue-layout": "5.2.0",
-    "@progress/kendo-vue-treeview": "5.2.0"
+    "@progress/kendo-vue-data-tools": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-inputs": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-intl": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-labels": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-layout": "5.3.0-dev.202408221437",
+    "@progress/kendo-vue-treeview": "5.3.0-dev.202408221437"
   },
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",