@progress/kendo-angular-dropdowns 16.7.1-develop.5 → 16.7.1-develop.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dropdownlist/dropdownlist.component.d.ts +2 -5
  2. package/dropdowntrees/multiselecttree.component.d.ts +0 -2
  3. package/esm2020/dropdownlist/dropdownlist.component.mjs +28 -30
  4. package/esm2020/dropdowntrees/multiselecttree.component.mjs +9 -19
  5. package/esm2020/multiselect/multiselect.component.mjs +2 -2
  6. package/esm2020/package-metadata.mjs +2 -2
  7. package/fesm2015/progress-kendo-angular-dropdowns.mjs +41 -53
  8. package/fesm2020/progress-kendo-angular-dropdowns.mjs +41 -53
  9. package/package.json +8 -8
  10. package/schematics/ngAdd/index.js +2 -2
package/dropdownlist/dropdownlist.component.d.ts CHANGED
@@ -106,9 +106,6 @@ export declare class DropDownListComponent implements ControlValueAccessor, Afte
106
106
  get width(): any;
107
107
  get height(): any;
108
108
  get widgetTabIndex(): number;
109
- get ariaExpanded(): boolean;
110
- listBoxId: string;
111
- get ariaControls(): string;
112
109
  get ariaActivedescendant(): string;
113
110
  get appendTo(): ViewContainerRef;
114
111
  /**
@@ -400,9 +397,7 @@ export declare class DropDownListComponent implements ControlValueAccessor, Afte
400
397
  get isBusy(): boolean;
401
398
  role: string;
402
399
  haspopup: string;
403
- get isAriaExpanded(): boolean;
404
400
  get hostAriaInvalid(): string;
405
- get hostAriaActivedescendant(): string;
406
401
  /**
407
402
  * @hidden
408
403
  */
@@ -419,6 +414,7 @@ export declare class DropDownListComponent implements ControlValueAccessor, Afte
419
414
  optionPrefix: string;
420
415
  valueLabelId: string;
421
416
  filterText: string;
417
+ listBoxId: string;
422
418
  private subs;
423
419
  private _isFocused;
424
420
  set isFocused(isFocused: boolean);
@@ -568,6 +564,7 @@ export declare class DropDownListComponent implements ControlValueAccessor, Afte
568
564
  private resetSelection;
569
565
  private onSelectionChange;
570
566
  private subscribeEvents;
567
+ private setAriaactivedescendant;
571
568
  private subscribeTouchEvents;
572
569
  private subscribeFocusEvents;
573
570
  private unSubscribeFocusEvents;
package/dropdowntrees/multiselecttree.component.d.ts CHANGED
@@ -63,7 +63,6 @@ export declare class MultiSelectTreeComponent implements OnInit, OnDestroy, OnCh
63
63
  hostClasses: boolean;
64
64
  get isDisabled(): boolean;
65
65
  treeViewId: string;
66
- get hostAriaControls(): string;
67
66
  get hostAriaAutocomplete(): string;
68
67
  get isLoading(): boolean;
69
68
  get hostAriaInvalid(): string;
@@ -72,7 +71,6 @@ export declare class MultiSelectTreeComponent implements OnInit, OnDestroy, OnCh
72
71
  direction: Direction;
73
72
  get hostTabIndex(): number;
74
73
  role: string;
75
- get isAriaExpanded(): boolean;
76
74
  ariaHasPopup: string;
77
75
  get isReadonly(): string;
78
76
  get ariaDescribedBy(): string;
package/esm2020/dropdownlist/dropdownlist.component.mjs CHANGED
@@ -106,7 +106,6 @@ export class DropDownListComponent {
106
106
  * @hidden
107
107
  */
108
108
  this.caretAltDownSVGIcon = caretAltDownIcon;
109
- this.listBoxId = `k-${guid()}`;
110
109
  /**
111
110
  * Shows or hides the current group sticky header when using grouped data.
112
111
  * By default the sticky header is displayed ([see example]({% slug grouping_autocomplete %}#toc-sticky-header)).
@@ -214,6 +213,7 @@ export class DropDownListComponent {
214
213
  this.groupIndices = [];
215
214
  this.optionPrefix = `k-${guid()}`;
216
215
  this.filterText = '';
216
+ this.listBoxId = `k-${guid()}`;
217
217
  this.subs = new Subscription();
218
218
  this._isFocused = false;
219
219
  this.onTouchedCallback = (_) => { };
@@ -268,15 +268,6 @@ export class DropDownListComponent {
268
268
  const defaultTabIndex = 0;
269
269
  return !isNaN(providedTabIndex) ? providedTabIndex : defaultTabIndex;
270
270
  }
271
- get ariaExpanded() {
272
- return this.isOpen;
273
- }
274
- get ariaControls() {
275
- if (!this.isOpen) {
276
- return;
277
- }
278
- return this.listBoxId;
279
- }
280
271
  get ariaActivedescendant() {
281
272
  if (!isPresent(this.dataItem) || !this.isOpen) {
282
273
  return;
@@ -577,15 +568,9 @@ export class DropDownListComponent {
577
568
  get isBusy() {
578
569
  return this.isLoading;
579
570
  }
580
- get isAriaExpanded() {
581
- return this.ariaExpanded;
582
- }
583
571
  get hostAriaInvalid() {
584
572
  return this.formControl ? this.formControl?.invalid.toString() : null;
585
573
  }
586
- get hostAriaActivedescendant() {
587
- return this.ariaActivedescendant;
588
- }
589
574
  /**
590
575
  * @hidden
591
576
  */
@@ -667,6 +652,10 @@ export class DropDownListComponent {
667
652
  }
668
653
  ngOnInit() {
669
654
  this.renderer.removeAttribute(this.wrapper.nativeElement, "tabindex");
655
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
656
+ if (this.ariaActivedescendant) {
657
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-activedescendant', this.ariaActivedescendant);
658
+ }
670
659
  this.subs.add(this.localization
671
660
  .changes.subscribe(({ rtl }) => {
672
661
  this.direction = rtl ? 'rtl' : 'ltr';
@@ -934,6 +923,9 @@ export class DropDownListComponent {
934
923
  popupClass: this.listContainerClasses,
935
924
  positionMode: 'absolute'
936
925
  });
926
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
927
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.listBoxId);
928
+ this.setAriaactivedescendant();
937
929
  const popupWrapper = this.popupRef.popupElement;
938
930
  const { min, max } = this.width;
939
931
  popupWrapper.addEventListener('mousedown', this.popupMouseDownHandler);
@@ -966,6 +958,9 @@ export class DropDownListComponent {
966
958
  }
967
959
  destroyPopup() {
968
960
  if (this.popupRef) {
961
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
962
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
963
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-activedescendant');
969
964
  this.popupRef.popupElement
970
965
  .removeEventListener('mousedown', this.popupMouseDownHandler);
971
966
  this.popupRef.close();
@@ -994,6 +989,7 @@ export class DropDownListComponent {
994
989
  // reassigning the value label ID as aria-deascibedby forces firefox/nvda, forefox/jaws to read
995
990
  // the new value when the popup is closed and the value is changed with the arrow keys (up/down)
996
991
  this.assignAriaDescribedBy();
992
+ this.setAriaactivedescendant();
997
993
  }
998
994
  subscribeEvents() {
999
995
  if (!isDocumentAvailable()) {
@@ -1049,6 +1045,15 @@ export class DropDownListComponent {
1049
1045
  .subscribe(() => this.componentBlur()));
1050
1046
  });
1051
1047
  }
1048
+ setAriaactivedescendant() {
1049
+ if (this.ariaActivedescendant) {
1050
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-activedescendant', this.ariaActivedescendant);
1051
+ const searchInput = this.popupRef.popupElement.querySelector('input[role="searchbox"]');
1052
+ if (searchInput) {
1053
+ this.renderer.setAttribute(searchInput, 'aria-activedescendant', this.ariaActivedescendant);
1054
+ }
1055
+ }
1056
+ }
1052
1057
  subscribeTouchEvents() {
1053
1058
  if (!isDocumentAvailable() || !this.touchEnabled) {
1054
1059
  return;
@@ -1185,6 +1190,10 @@ export class DropDownListComponent {
1185
1190
  }
1186
1191
  else {
1187
1192
  this.togglePopup(false);
1193
+ //this is needed for Ang 18 not to throw ng0100 error when closing the popup
1194
+ //the component could be refactored using kendoDropDownSharedEvents directive
1195
+ //once we are able to debug against Angular 18
1196
+ this.cdr.markForCheck();
1188
1197
  }
1189
1198
  }
1190
1199
  }
@@ -1391,7 +1400,7 @@ export class DropDownListComponent {
1391
1400
  }
1392
1401
  }
1393
1402
  DropDownListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DropDownListComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: i3.SelectionService }, { token: i4.NavigationService }, { token: i5.DisabledItemsService }, { token: i6.DataService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
1394
- DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DropDownListComponent, isStandalone: true, selector: "kendo-dropdownlist", inputs: { customIconClass: "customIconClass", showStickyHeader: "showStickyHeader", icon: "icon", svgIcon: "svgIcon", loading: "loading", data: "data", value: "value", textField: "textField", valueField: "valueField", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", popupSettings: "popupSettings", listHeight: "listHeight", defaultItem: "defaultItem", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", filterable: "filterable", virtual: "virtual", ignoreCase: "ignoreCase", delay: "delay", valuePrimitive: "valuePrimitive", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", leftRightArrowsNavigation: "leftRightArrowsNavigation", focusableId: ["id", "focusableId"] }, outputs: { valueChange: "valueChange", filterChange: "filterChange", selectionChange: "selectionChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur" }, host: { listeners: { "keydown": "keydown($event)", "keypress": "keypress($event)", "click": "click()" }, properties: { "attr.aria-controls": "this.ariaControls", "class.k-readonly": "this.readonly", "class.k-dropdownlist": "this.hostClasses", "class.k-picker": "this.hostClasses", "class.k-disabled": "this.isDisabledClass", "attr.disabled": "this.isDisabledAttribute", "class.k-loading": "this.isLoading", "attr.id": "this.focusableId", "attr.dir": "this.dir", "attr.tabindex": "this.hostTabIndex", "attr.readonly": "this.readonlyAttr", "attr.aria-busy": "this.isBusy", "attr.role": "this.role", "attr.aria-haspopup": "this.haspopup", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-activedescendant": "this.hostAriaActivedescendant" } }, providers: [
1403
+ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DropDownListComponent, isStandalone: true, selector: "kendo-dropdownlist", inputs: { customIconClass: "customIconClass", showStickyHeader: "showStickyHeader", icon: "icon", svgIcon: "svgIcon", loading: "loading", data: "data", value: "value", textField: "textField", valueField: "valueField", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", popupSettings: "popupSettings", listHeight: "listHeight", defaultItem: "defaultItem", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", filterable: "filterable", virtual: "virtual", ignoreCase: "ignoreCase", delay: "delay", valuePrimitive: "valuePrimitive", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", leftRightArrowsNavigation: "leftRightArrowsNavigation", focusableId: ["id", "focusableId"] }, outputs: { valueChange: "valueChange", filterChange: "filterChange", selectionChange: "selectionChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur" }, host: { listeners: { "keydown": "keydown($event)", "keypress": "keypress($event)", "click": "click()" }, properties: { "class.k-readonly": "this.readonly", "class.k-dropdownlist": "this.hostClasses", "class.k-picker": "this.hostClasses", "class.k-disabled": "this.isDisabledClass", "attr.disabled": "this.isDisabledAttribute", "class.k-loading": "this.isLoading", "attr.id": "this.focusableId", "attr.dir": "this.dir", "attr.tabindex": "this.hostTabIndex", "attr.readonly": "this.readonlyAttr", "attr.aria-busy": "this.isBusy", "attr.role": "this.role", "attr.aria-haspopup": "this.haspopup", "attr.aria-invalid": "this.hostAriaInvalid" } }, providers: [
1395
1404
  DROPDOWNLIST_VALUE_ACCESSOR,
1396
1405
  DataService,
1397
1406
  SelectionService,
@@ -1491,8 +1500,7 @@ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
1491
1500
  role="searchbox"
1492
1501
  aria-autocomplete="list"
1493
1502
  aria-haspopup="listbox"
1494
- [attr.aria-controls]="isOpen ? ariaControls : undefined"
1495
- [attr.aria-activedescendant]="ariaActivedescendant"
1503
+ [attr.aria-controls]="listBoxId"
1496
1504
  tabindex="-1"
1497
1505
  [filterInput]="isFocused && !touchEnabled"
1498
1506
  [attr.aria-label]="messageFor('filterInputLabel')"
@@ -1684,8 +1692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1684
1692
  role="searchbox"
1685
1693
  aria-autocomplete="list"
1686
1694
  aria-haspopup="listbox"
1687
- [attr.aria-controls]="isOpen ? ariaControls : undefined"
1688
- [attr.aria-activedescendant]="ariaActivedescendant"
1695
+ [attr.aria-controls]="listBoxId"
1689
1696
  tabindex="-1"
1690
1697
  [filterInput]="isFocused && !touchEnabled"
1691
1698
  [attr.aria-label]="messageFor('filterInputLabel')"
@@ -1779,9 +1786,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1779
1786
  }], responsiveRendererComponent: [{
1780
1787
  type: ViewChild,
1781
1788
  args: [ResponsiveRendererComponent]
1782
- }], ariaControls: [{
1783
- type: HostBinding,
1784
- args: ['attr.aria-controls']
1785
1789
  }], showStickyHeader: [{
1786
1790
  type: Input
1787
1791
  }], icon: [{
@@ -1934,15 +1938,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1934
1938
  }], haspopup: [{
1935
1939
  type: HostBinding,
1936
1940
  args: ['attr.aria-haspopup']
1937
- }], isAriaExpanded: [{
1938
- type: HostBinding,
1939
- args: ['attr.aria-expanded']
1940
1941
  }], hostAriaInvalid: [{
1941
1942
  type: HostBinding,
1942
1943
  args: ['attr.aria-invalid']
1943
- }], hostAriaActivedescendant: [{
1944
- type: HostBinding,
1945
- args: ['attr.aria-activedescendant']
1946
1944
  }], keydown: [{
1947
1945
  type: HostListener,
1948
1946
  args: ['keydown', ['$event']]
package/esm2020/dropdowntrees/multiselecttree.component.mjs CHANGED
@@ -277,9 +277,6 @@ export class MultiSelectTreeComponent {
277
277
  get isDisabled() {
278
278
  return this.disabled;
279
279
  }
280
- get hostAriaControls() {
281
- return this.isOpen ? this.treeViewId : null;
282
- }
283
280
  get hostAriaAutocomplete() {
284
281
  return this.filterable ? 'list' : null;
285
282
  }
@@ -298,9 +295,6 @@ export class MultiSelectTreeComponent {
298
295
  get hostTabIndex() {
299
296
  return this.tabindex;
300
297
  }
301
- get isAriaExpanded() {
302
- return this.isOpen;
303
- }
304
298
  get isReadonly() {
305
299
  return this.readonly ? '' : null;
306
300
  }
@@ -958,6 +952,10 @@ export class MultiSelectTreeComponent {
958
952
  }
959
953
  this.isFocused = false;
960
954
  this.togglePopup(false);
955
+ //this is needed for Ang 18 not to throw ng0100 error when closing the popup
956
+ //the component could be refactored using kendoDropDownSharedEvents directive
957
+ //once we are able to debug against Angular 18
958
+ this.cdr.markForCheck();
961
959
  if (hasObservers(this.onBlur) ||
962
960
  isUntouched(this.wrapper.nativeElement) ||
963
961
  this.formControl?.updateOn === 'blur') {
@@ -1228,6 +1226,7 @@ export class MultiSelectTreeComponent {
1228
1226
  popupWrapper.style.minWidth = min;
1229
1227
  popupWrapper.style.width = max;
1230
1228
  popupWrapper.style.height = this.height;
1229
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.treeViewId);
1231
1230
  this.renderer.setAttribute(popupWrapper, 'dir', this.direction);
1232
1231
  this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
1233
1232
  this.popupRef.popupOpen.subscribe(() => {
@@ -1251,6 +1250,7 @@ export class MultiSelectTreeComponent {
1251
1250
  this.popupRef.close();
1252
1251
  this.popupRef = null;
1253
1252
  this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
1253
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
1254
1254
  if (this.filter !== "") {
1255
1255
  this.filter = "";
1256
1256
  this.allNodesHidden = false;
@@ -1571,7 +1571,7 @@ export class MultiSelectTreeComponent {
1571
1571
  }
1572
1572
  }
1573
1573
  MultiSelectTreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MultiSelectTreeComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1.PopupService }, { token: i0.Renderer2 }, { token: i2.NavigationService }, { token: i0.NgZone }, { token: i3.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i4.MultiSelectTreeLookupService }], target: i0.ɵɵFactoryTarget.Component });
1574
- MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", popupSettings: "popupSettings", checkableSettings: "checkableSettings", data: "data", value: "value", dataItems: "dataItems", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", loading: "loading", placeholder: "placeholder", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", loadOnDemand: "loadOnDemand", focusableId: "focusableId", clearButton: "clearButton", filterable: "filterable", checkAll: "checkAll", hasChildren: "hasChildren", fetchChildren: "fetchChildren", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", itemDisabled: "itemDisabled", tagMapper: "tagMapper" }, outputs: { onFocus: "focus", onBlur: "blur", open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", valueChange: "valueChange", removeTag: "removeTag", filterChange: "filterChange" }, host: { properties: { "class.k-multiselecttree": "this.hostClasses", "class.k-input": "this.hostClasses", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "attr.aria-controls": "this.hostAriaControls", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-loading": "this.isLoading", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-busy": "this.isBusy", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-haspopup": "this.ariaHasPopup", "attr.readonly": "this.isReadonly", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-activedescendant": "this.ariaActiveDescendant", "class.k-readonly": "this.readonly" } }, providers: [
1574
+ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", popupSettings: "popupSettings", checkableSettings: "checkableSettings", data: "data", value: "value", dataItems: "dataItems", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", loading: "loading", placeholder: "placeholder", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", loadOnDemand: "loadOnDemand", focusableId: "focusableId", clearButton: "clearButton", filterable: "filterable", checkAll: "checkAll", hasChildren: "hasChildren", fetchChildren: "fetchChildren", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", itemDisabled: "itemDisabled", tagMapper: "tagMapper" }, outputs: { onFocus: "focus", onBlur: "blur", open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", valueChange: "valueChange", removeTag: "removeTag", filterChange: "filterChange" }, host: { properties: { "class.k-multiselecttree": "this.hostClasses", "class.k-input": "this.hostClasses", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-loading": "this.isLoading", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-busy": "this.isBusy", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.readonly": "this.isReadonly", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-activedescendant": "this.ariaActiveDescendant", "class.k-readonly": "this.readonly" } }, providers: [
1575
1575
  LocalizationService,
1576
1576
  NavigationService,
1577
1577
  DataService,
@@ -1715,9 +1715,7 @@ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
1715
1715
  (keydown)="handleKeydown($event, filterInput)"
1716
1716
  [value]="filter"
1717
1717
  class="k-input-inner"
1718
- role="textbox"
1719
- aria-haspopup="true"
1720
- aria-expanded="false"
1718
+ role="searchbox"
1721
1719
  tabindex="0"
1722
1720
  aria-disabled="false"
1723
1721
  aria-readonly="false"
@@ -1972,9 +1970,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1972
1970
  (keydown)="handleKeydown($event, filterInput)"
1973
1971
  [value]="filter"
1974
1972
  class="k-input-inner"
1975
- role="textbox"
1976
- aria-haspopup="true"
1977
- aria-expanded="false"
1973
+ role="searchbox"
1978
1974
  tabindex="0"
1979
1975
  aria-disabled="false"
1980
1976
  aria-readonly="false"
@@ -2094,9 +2090,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
2094
2090
  }, {
2095
2091
  type: HostBinding,
2096
2092
  args: ['attr.aria-disabled']
2097
- }], hostAriaControls: [{
2098
- type: HostBinding,
2099
- args: ['attr.aria-controls']
2100
2093
  }], hostAriaAutocomplete: [{
2101
2094
  type: HostBinding,
2102
2095
  args: ['attr.aria-autocomplete']
@@ -2121,9 +2114,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
2121
2114
  }], role: [{
2122
2115
  type: HostBinding,
2123
2116
  args: ['attr.role']
2124
- }], isAriaExpanded: [{
2125
- type: HostBinding,
2126
- args: ['attr.aria-expanded']
2127
2117
  }], ariaHasPopup: [{
2128
2118
  type: HostBinding,
2129
2119
  args: ['attr.aria-haspopup']
package/esm2020/multiselect/multiselect.component.mjs CHANGED
@@ -829,7 +829,7 @@ export class MultiSelectComponent {
829
829
  if (isPresent(event.added) && event.added.length > 0) {
830
830
  event.added.forEach((itemIndex) => {
831
831
  const dataItem = this.dataService.itemAt(itemIndex);
832
- const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(dataItem[this.valueField])) ? dataItem[this.valueField] : dataItem;
832
+ const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(getter(dataItem, this.valueField))) ? getter(dataItem, this.valueField) : dataItem;
833
833
  if (newItem) {
834
834
  if (!this.isAdaptive || !this.isActionSheetExpanded) {
835
835
  this.value = [...this.value, newItem];
@@ -863,7 +863,7 @@ export class MultiSelectComponent {
863
863
  // Existing items.
864
864
  if (isPresent(event.added)) {
865
865
  const dataItem = this.dataService.itemAt(event.added);
866
- const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(dataItem[this.valueField])) ? dataItem[this.valueField] : dataItem;
866
+ const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(getter(dataItem, this.valueField))) ? getter(dataItem, this.valueField) : dataItem;
867
867
  if (!this.isAdaptive || !this.isActionSheetExpanded) {
868
868
  this.value = [...this.value, newItem];
869
869
  }
package/esm2020/package-metadata.mjs CHANGED
@@ -9,7 +9,7 @@ export const packageMetadata = {
9
9
  name: '@progress/kendo-angular-dropdowns',
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
12
- publishDate: 1723547685,
13
- version: '16.7.1-develop.5',
12
+ publishDate: 1723555638,
13
+ version: '16.7.1-develop.7',
14
14
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
15
15
  };
package/fesm2015/progress-kendo-angular-dropdowns.mjs CHANGED
@@ -34,8 +34,8 @@ const packageMetadata = {
34
34
  name: '@progress/kendo-angular-dropdowns',
35
35
  productName: 'Kendo UI for Angular',
36
36
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
37
- publishDate: 1723547685,
38
- version: '16.7.1-develop.5',
37
+ publishDate: 1723555638,
38
+ version: '16.7.1-develop.7',
39
39
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
40
40
  };
41
41
 
@@ -6715,7 +6715,6 @@ class DropDownListComponent {
6715
6715
  * @hidden
6716
6716
  */
6717
6717
  this.caretAltDownSVGIcon = caretAltDownIcon;
6718
- this.listBoxId = `k-${guid()}`;
6719
6718
  /**
6720
6719
  * Shows or hides the current group sticky header when using grouped data.
6721
6720
  * By default the sticky header is displayed ([see example]({% slug grouping_autocomplete %}#toc-sticky-header)).
@@ -6823,6 +6822,7 @@ class DropDownListComponent {
6823
6822
  this.groupIndices = [];
6824
6823
  this.optionPrefix = `k-${guid()}`;
6825
6824
  this.filterText = '';
6825
+ this.listBoxId = `k-${guid()}`;
6826
6826
  this.subs = new Subscription();
6827
6827
  this._isFocused = false;
6828
6828
  this.onTouchedCallback = (_) => { };
@@ -6879,15 +6879,6 @@ class DropDownListComponent {
6879
6879
  const defaultTabIndex = 0;
6880
6880
  return !isNaN(providedTabIndex) ? providedTabIndex : defaultTabIndex;
6881
6881
  }
6882
- get ariaExpanded() {
6883
- return this.isOpen;
6884
- }
6885
- get ariaControls() {
6886
- if (!this.isOpen) {
6887
- return;
6888
- }
6889
- return this.listBoxId;
6890
- }
6891
6882
  get ariaActivedescendant() {
6892
6883
  if (!isPresent(this.dataItem) || !this.isOpen) {
6893
6884
  return;
@@ -7189,16 +7180,10 @@ class DropDownListComponent {
7189
7180
  get isBusy() {
7190
7181
  return this.isLoading;
7191
7182
  }
7192
- get isAriaExpanded() {
7193
- return this.ariaExpanded;
7194
- }
7195
7183
  get hostAriaInvalid() {
7196
7184
  var _a;
7197
7185
  return this.formControl ? (_a = this.formControl) === null || _a === void 0 ? void 0 : _a.invalid.toString() : null;
7198
7186
  }
7199
- get hostAriaActivedescendant() {
7200
- return this.ariaActivedescendant;
7201
- }
7202
7187
  /**
7203
7188
  * @hidden
7204
7189
  */
@@ -7280,6 +7265,10 @@ class DropDownListComponent {
7280
7265
  }
7281
7266
  ngOnInit() {
7282
7267
  this.renderer.removeAttribute(this.wrapper.nativeElement, "tabindex");
7268
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
7269
+ if (this.ariaActivedescendant) {
7270
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-activedescendant', this.ariaActivedescendant);
7271
+ }
7283
7272
  this.subs.add(this.localization
7284
7273
  .changes.subscribe(({ rtl }) => {
7285
7274
  this.direction = rtl ? 'rtl' : 'ltr';
@@ -7547,6 +7536,9 @@ class DropDownListComponent {
7547
7536
  popupClass: this.listContainerClasses,
7548
7537
  positionMode: 'absolute'
7549
7538
  });
7539
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
7540
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.listBoxId);
7541
+ this.setAriaactivedescendant();
7550
7542
  const popupWrapper = this.popupRef.popupElement;
7551
7543
  const { min, max } = this.width;
7552
7544
  popupWrapper.addEventListener('mousedown', this.popupMouseDownHandler);
@@ -7579,6 +7571,9 @@ class DropDownListComponent {
7579
7571
  }
7580
7572
  destroyPopup() {
7581
7573
  if (this.popupRef) {
7574
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
7575
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
7576
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-activedescendant');
7582
7577
  this.popupRef.popupElement
7583
7578
  .removeEventListener('mousedown', this.popupMouseDownHandler);
7584
7579
  this.popupRef.close();
@@ -7607,6 +7602,7 @@ class DropDownListComponent {
7607
7602
  // reassigning the value label ID as aria-deascibedby forces firefox/nvda, forefox/jaws to read
7608
7603
  // the new value when the popup is closed and the value is changed with the arrow keys (up/down)
7609
7604
  this.assignAriaDescribedBy();
7605
+ this.setAriaactivedescendant();
7610
7606
  }
7611
7607
  subscribeEvents() {
7612
7608
  if (!isDocumentAvailable()) {
@@ -7662,6 +7658,15 @@ class DropDownListComponent {
7662
7658
  .subscribe(() => this.componentBlur()));
7663
7659
  });
7664
7660
  }
7661
+ setAriaactivedescendant() {
7662
+ if (this.ariaActivedescendant) {
7663
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-activedescendant', this.ariaActivedescendant);
7664
+ const searchInput = this.popupRef.popupElement.querySelector('input[role="searchbox"]');
7665
+ if (searchInput) {
7666
+ this.renderer.setAttribute(searchInput, 'aria-activedescendant', this.ariaActivedescendant);
7667
+ }
7668
+ }
7669
+ }
7665
7670
  subscribeTouchEvents() {
7666
7671
  if (!isDocumentAvailable() || !this.touchEnabled) {
7667
7672
  return;
@@ -7799,6 +7804,10 @@ class DropDownListComponent {
7799
7804
  }
7800
7805
  else {
7801
7806
  this.togglePopup(false);
7807
+ //this is needed for Ang 18 not to throw ng0100 error when closing the popup
7808
+ //the component could be refactored using kendoDropDownSharedEvents directive
7809
+ //once we are able to debug against Angular 18
7810
+ this.cdr.markForCheck();
7802
7811
  }
7803
7812
  }
7804
7813
  }
@@ -8005,7 +8014,7 @@ class DropDownListComponent {
8005
8014
  }
8006
8015
  }
8007
8016
  DropDownListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DropDownListComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: DataService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
8008
- DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DropDownListComponent, isStandalone: true, selector: "kendo-dropdownlist", inputs: { customIconClass: "customIconClass", showStickyHeader: "showStickyHeader", icon: "icon", svgIcon: "svgIcon", loading: "loading", data: "data", value: "value", textField: "textField", valueField: "valueField", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", popupSettings: "popupSettings", listHeight: "listHeight", defaultItem: "defaultItem", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", filterable: "filterable", virtual: "virtual", ignoreCase: "ignoreCase", delay: "delay", valuePrimitive: "valuePrimitive", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", leftRightArrowsNavigation: "leftRightArrowsNavigation", focusableId: ["id", "focusableId"] }, outputs: { valueChange: "valueChange", filterChange: "filterChange", selectionChange: "selectionChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur" }, host: { listeners: { "keydown": "keydown($event)", "keypress": "keypress($event)", "click": "click()" }, properties: { "attr.aria-controls": "this.ariaControls", "class.k-readonly": "this.readonly", "class.k-dropdownlist": "this.hostClasses", "class.k-picker": "this.hostClasses", "class.k-disabled": "this.isDisabledClass", "attr.disabled": "this.isDisabledAttribute", "class.k-loading": "this.isLoading", "attr.id": "this.focusableId", "attr.dir": "this.dir", "attr.tabindex": "this.hostTabIndex", "attr.readonly": "this.readonlyAttr", "attr.aria-busy": "this.isBusy", "attr.role": "this.role", "attr.aria-haspopup": "this.haspopup", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-activedescendant": "this.hostAriaActivedescendant" } }, providers: [
8017
+ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DropDownListComponent, isStandalone: true, selector: "kendo-dropdownlist", inputs: { customIconClass: "customIconClass", showStickyHeader: "showStickyHeader", icon: "icon", svgIcon: "svgIcon", loading: "loading", data: "data", value: "value", textField: "textField", valueField: "valueField", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", popupSettings: "popupSettings", listHeight: "listHeight", defaultItem: "defaultItem", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", filterable: "filterable", virtual: "virtual", ignoreCase: "ignoreCase", delay: "delay", valuePrimitive: "valuePrimitive", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", leftRightArrowsNavigation: "leftRightArrowsNavigation", focusableId: ["id", "focusableId"] }, outputs: { valueChange: "valueChange", filterChange: "filterChange", selectionChange: "selectionChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur" }, host: { listeners: { "keydown": "keydown($event)", "keypress": "keypress($event)", "click": "click()" }, properties: { "class.k-readonly": "this.readonly", "class.k-dropdownlist": "this.hostClasses", "class.k-picker": "this.hostClasses", "class.k-disabled": "this.isDisabledClass", "attr.disabled": "this.isDisabledAttribute", "class.k-loading": "this.isLoading", "attr.id": "this.focusableId", "attr.dir": "this.dir", "attr.tabindex": "this.hostTabIndex", "attr.readonly": "this.readonlyAttr", "attr.aria-busy": "this.isBusy", "attr.role": "this.role", "attr.aria-haspopup": "this.haspopup", "attr.aria-invalid": "this.hostAriaInvalid" } }, providers: [
8009
8018
  DROPDOWNLIST_VALUE_ACCESSOR,
8010
8019
  DataService,
8011
8020
  SelectionService,
@@ -8105,8 +8114,7 @@ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
8105
8114
  role="searchbox"
8106
8115
  aria-autocomplete="list"
8107
8116
  aria-haspopup="listbox"
8108
- [attr.aria-controls]="isOpen ? ariaControls : undefined"
8109
- [attr.aria-activedescendant]="ariaActivedescendant"
8117
+ [attr.aria-controls]="listBoxId"
8110
8118
  tabindex="-1"
8111
8119
  [filterInput]="isFocused && !touchEnabled"
8112
8120
  [attr.aria-label]="messageFor('filterInputLabel')"
@@ -8298,8 +8306,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
8298
8306
  role="searchbox"
8299
8307
  aria-autocomplete="list"
8300
8308
  aria-haspopup="listbox"
8301
- [attr.aria-controls]="isOpen ? ariaControls : undefined"
8302
- [attr.aria-activedescendant]="ariaActivedescendant"
8309
+ [attr.aria-controls]="listBoxId"
8303
8310
  tabindex="-1"
8304
8311
  [filterInput]="isFocused && !touchEnabled"
8305
8312
  [attr.aria-label]="messageFor('filterInputLabel')"
@@ -8393,9 +8400,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
8393
8400
  }], responsiveRendererComponent: [{
8394
8401
  type: ViewChild,
8395
8402
  args: [ResponsiveRendererComponent]
8396
- }], ariaControls: [{
8397
- type: HostBinding,
8398
- args: ['attr.aria-controls']
8399
8403
  }], showStickyHeader: [{
8400
8404
  type: Input
8401
8405
  }], icon: [{
@@ -8548,15 +8552,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
8548
8552
  }], haspopup: [{
8549
8553
  type: HostBinding,
8550
8554
  args: ['attr.aria-haspopup']
8551
- }], isAriaExpanded: [{
8552
- type: HostBinding,
8553
- args: ['attr.aria-expanded']
8554
8555
  }], hostAriaInvalid: [{
8555
8556
  type: HostBinding,
8556
8557
  args: ['attr.aria-invalid']
8557
- }], hostAriaActivedescendant: [{
8558
- type: HostBinding,
8559
- args: ['attr.aria-activedescendant']
8560
8558
  }], keydown: [{
8561
8559
  type: HostListener,
8562
8560
  args: ['keydown', ['$event']]
@@ -9760,7 +9758,7 @@ class MultiSelectComponent {
9760
9758
  if (isPresent(event.added) && event.added.length > 0) {
9761
9759
  event.added.forEach((itemIndex) => {
9762
9760
  const dataItem = this.dataService.itemAt(itemIndex);
9763
- const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(dataItem[this.valueField])) ? dataItem[this.valueField] : dataItem;
9761
+ const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(getter(dataItem, this.valueField))) ? getter(dataItem, this.valueField) : dataItem;
9764
9762
  if (newItem) {
9765
9763
  if (!this.isAdaptive || !this.isActionSheetExpanded) {
9766
9764
  this.value = [...this.value, newItem];
@@ -9794,7 +9792,7 @@ class MultiSelectComponent {
9794
9792
  // Existing items.
9795
9793
  if (isPresent(event.added)) {
9796
9794
  const dataItem = this.dataService.itemAt(event.added);
9797
- const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(dataItem[this.valueField])) ? dataItem[this.valueField] : dataItem;
9795
+ const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(getter(dataItem, this.valueField))) ? getter(dataItem, this.valueField) : dataItem;
9798
9796
  if (!this.isAdaptive || !this.isActionSheetExpanded) {
9799
9797
  this.value = [...this.value, newItem];
9800
9798
  }
@@ -14615,9 +14613,6 @@ class MultiSelectTreeComponent {
14615
14613
  get isDisabled() {
14616
14614
  return this.disabled;
14617
14615
  }
14618
- get hostAriaControls() {
14619
- return this.isOpen ? this.treeViewId : null;
14620
- }
14621
14616
  get hostAriaAutocomplete() {
14622
14617
  return this.filterable ? 'list' : null;
14623
14618
  }
@@ -14636,9 +14631,6 @@ class MultiSelectTreeComponent {
14636
14631
  get hostTabIndex() {
14637
14632
  return this.tabindex;
14638
14633
  }
14639
- get isAriaExpanded() {
14640
- return this.isOpen;
14641
- }
14642
14634
  get isReadonly() {
14643
14635
  return this.readonly ? '' : null;
14644
14636
  }
@@ -15297,6 +15289,10 @@ class MultiSelectTreeComponent {
15297
15289
  }
15298
15290
  this.isFocused = false;
15299
15291
  this.togglePopup(false);
15292
+ //this is needed for Ang 18 not to throw ng0100 error when closing the popup
15293
+ //the component could be refactored using kendoDropDownSharedEvents directive
15294
+ //once we are able to debug against Angular 18
15295
+ this.cdr.markForCheck();
15300
15296
  if (hasObservers(this.onBlur) ||
15301
15297
  isUntouched(this.wrapper.nativeElement) ||
15302
15298
  ((_a = this.formControl) === null || _a === void 0 ? void 0 : _a.updateOn) === 'blur') {
@@ -15567,6 +15563,7 @@ class MultiSelectTreeComponent {
15567
15563
  popupWrapper.style.minWidth = min;
15568
15564
  popupWrapper.style.width = max;
15569
15565
  popupWrapper.style.height = this.height;
15566
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.treeViewId);
15570
15567
  this.renderer.setAttribute(popupWrapper, 'dir', this.direction);
15571
15568
  this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
15572
15569
  this.popupRef.popupOpen.subscribe(() => {
@@ -15590,6 +15587,7 @@ class MultiSelectTreeComponent {
15590
15587
  this.popupRef.close();
15591
15588
  this.popupRef = null;
15592
15589
  this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
15590
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
15593
15591
  if (this.filter !== "") {
15594
15592
  this.filter = "";
15595
15593
  this.allNodesHidden = false;
@@ -15910,7 +15908,7 @@ class MultiSelectTreeComponent {
15910
15908
  }
15911
15909
  }
15912
15910
  MultiSelectTreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MultiSelectTreeComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i2.PopupService }, { token: i0.Renderer2 }, { token: NavigationService }, { token: i0.NgZone }, { token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: MultiSelectTreeLookupService }], target: i0.ɵɵFactoryTarget.Component });
15913
- MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", popupSettings: "popupSettings", checkableSettings: "checkableSettings", data: "data", value: "value", dataItems: "dataItems", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", loading: "loading", placeholder: "placeholder", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", loadOnDemand: "loadOnDemand", focusableId: "focusableId", clearButton: "clearButton", filterable: "filterable", checkAll: "checkAll", hasChildren: "hasChildren", fetchChildren: "fetchChildren", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", itemDisabled: "itemDisabled", tagMapper: "tagMapper" }, outputs: { onFocus: "focus", onBlur: "blur", open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", valueChange: "valueChange", removeTag: "removeTag", filterChange: "filterChange" }, host: { properties: { "class.k-multiselecttree": "this.hostClasses", "class.k-input": "this.hostClasses", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "attr.aria-controls": "this.hostAriaControls", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-loading": "this.isLoading", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-busy": "this.isBusy", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-haspopup": "this.ariaHasPopup", "attr.readonly": "this.isReadonly", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-activedescendant": "this.ariaActiveDescendant", "class.k-readonly": "this.readonly" } }, providers: [
15911
+ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", popupSettings: "popupSettings", checkableSettings: "checkableSettings", data: "data", value: "value", dataItems: "dataItems", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", loading: "loading", placeholder: "placeholder", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", loadOnDemand: "loadOnDemand", focusableId: "focusableId", clearButton: "clearButton", filterable: "filterable", checkAll: "checkAll", hasChildren: "hasChildren", fetchChildren: "fetchChildren", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", itemDisabled: "itemDisabled", tagMapper: "tagMapper" }, outputs: { onFocus: "focus", onBlur: "blur", open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", valueChange: "valueChange", removeTag: "removeTag", filterChange: "filterChange" }, host: { properties: { "class.k-multiselecttree": "this.hostClasses", "class.k-input": "this.hostClasses", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-loading": "this.isLoading", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-busy": "this.isBusy", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.readonly": "this.isReadonly", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-activedescendant": "this.ariaActiveDescendant", "class.k-readonly": "this.readonly" } }, providers: [
15914
15912
  LocalizationService,
15915
15913
  NavigationService,
15916
15914
  DataService,
@@ -16054,9 +16052,7 @@ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
16054
16052
  (keydown)="handleKeydown($event, filterInput)"
16055
16053
  [value]="filter"
16056
16054
  class="k-input-inner"
16057
- role="textbox"
16058
- aria-haspopup="true"
16059
- aria-expanded="false"
16055
+ role="searchbox"
16060
16056
  tabindex="0"
16061
16057
  aria-disabled="false"
16062
16058
  aria-readonly="false"
@@ -16311,9 +16307,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16311
16307
  (keydown)="handleKeydown($event, filterInput)"
16312
16308
  [value]="filter"
16313
16309
  class="k-input-inner"
16314
- role="textbox"
16315
- aria-haspopup="true"
16316
- aria-expanded="false"
16310
+ role="searchbox"
16317
16311
  tabindex="0"
16318
16312
  aria-disabled="false"
16319
16313
  aria-readonly="false"
@@ -16433,9 +16427,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16433
16427
  }, {
16434
16428
  type: HostBinding,
16435
16429
  args: ['attr.aria-disabled']
16436
- }], hostAriaControls: [{
16437
- type: HostBinding,
16438
- args: ['attr.aria-controls']
16439
16430
  }], hostAriaAutocomplete: [{
16440
16431
  type: HostBinding,
16441
16432
  args: ['attr.aria-autocomplete']
@@ -16460,9 +16451,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16460
16451
  }], role: [{
16461
16452
  type: HostBinding,
16462
16453
  args: ['attr.role']
16463
- }], isAriaExpanded: [{
16464
- type: HostBinding,
16465
- args: ['attr.aria-expanded']
16466
16454
  }], ariaHasPopup: [{
16467
16455
  type: HostBinding,
16468
16456
  args: ['attr.aria-haspopup']
package/fesm2020/progress-kendo-angular-dropdowns.mjs CHANGED
@@ -34,8 +34,8 @@ const packageMetadata = {
34
34
  name: '@progress/kendo-angular-dropdowns',
35
35
  productName: 'Kendo UI for Angular',
36
36
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
37
- publishDate: 1723547685,
38
- version: '16.7.1-develop.5',
37
+ publishDate: 1723555638,
38
+ version: '16.7.1-develop.7',
39
39
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
40
40
  };
41
41
 
@@ -6704,7 +6704,6 @@ class DropDownListComponent {
6704
6704
  * @hidden
6705
6705
  */
6706
6706
  this.caretAltDownSVGIcon = caretAltDownIcon;
6707
- this.listBoxId = `k-${guid()}`;
6708
6707
  /**
6709
6708
  * Shows or hides the current group sticky header when using grouped data.
6710
6709
  * By default the sticky header is displayed ([see example]({% slug grouping_autocomplete %}#toc-sticky-header)).
@@ -6812,6 +6811,7 @@ class DropDownListComponent {
6812
6811
  this.groupIndices = [];
6813
6812
  this.optionPrefix = `k-${guid()}`;
6814
6813
  this.filterText = '';
6814
+ this.listBoxId = `k-${guid()}`;
6815
6815
  this.subs = new Subscription();
6816
6816
  this._isFocused = false;
6817
6817
  this.onTouchedCallback = (_) => { };
@@ -6866,15 +6866,6 @@ class DropDownListComponent {
6866
6866
  const defaultTabIndex = 0;
6867
6867
  return !isNaN(providedTabIndex) ? providedTabIndex : defaultTabIndex;
6868
6868
  }
6869
- get ariaExpanded() {
6870
- return this.isOpen;
6871
- }
6872
- get ariaControls() {
6873
- if (!this.isOpen) {
6874
- return;
6875
- }
6876
- return this.listBoxId;
6877
- }
6878
6869
  get ariaActivedescendant() {
6879
6870
  if (!isPresent(this.dataItem) || !this.isOpen) {
6880
6871
  return;
@@ -7175,15 +7166,9 @@ class DropDownListComponent {
7175
7166
  get isBusy() {
7176
7167
  return this.isLoading;
7177
7168
  }
7178
- get isAriaExpanded() {
7179
- return this.ariaExpanded;
7180
- }
7181
7169
  get hostAriaInvalid() {
7182
7170
  return this.formControl ? this.formControl?.invalid.toString() : null;
7183
7171
  }
7184
- get hostAriaActivedescendant() {
7185
- return this.ariaActivedescendant;
7186
- }
7187
7172
  /**
7188
7173
  * @hidden
7189
7174
  */
@@ -7265,6 +7250,10 @@ class DropDownListComponent {
7265
7250
  }
7266
7251
  ngOnInit() {
7267
7252
  this.renderer.removeAttribute(this.wrapper.nativeElement, "tabindex");
7253
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
7254
+ if (this.ariaActivedescendant) {
7255
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-activedescendant', this.ariaActivedescendant);
7256
+ }
7268
7257
  this.subs.add(this.localization
7269
7258
  .changes.subscribe(({ rtl }) => {
7270
7259
  this.direction = rtl ? 'rtl' : 'ltr';
@@ -7532,6 +7521,9 @@ class DropDownListComponent {
7532
7521
  popupClass: this.listContainerClasses,
7533
7522
  positionMode: 'absolute'
7534
7523
  });
7524
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
7525
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.listBoxId);
7526
+ this.setAriaactivedescendant();
7535
7527
  const popupWrapper = this.popupRef.popupElement;
7536
7528
  const { min, max } = this.width;
7537
7529
  popupWrapper.addEventListener('mousedown', this.popupMouseDownHandler);
@@ -7564,6 +7556,9 @@ class DropDownListComponent {
7564
7556
  }
7565
7557
  destroyPopup() {
7566
7558
  if (this.popupRef) {
7559
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
7560
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
7561
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-activedescendant');
7567
7562
  this.popupRef.popupElement
7568
7563
  .removeEventListener('mousedown', this.popupMouseDownHandler);
7569
7564
  this.popupRef.close();
@@ -7592,6 +7587,7 @@ class DropDownListComponent {
7592
7587
  // reassigning the value label ID as aria-deascibedby forces firefox/nvda, forefox/jaws to read
7593
7588
  // the new value when the popup is closed and the value is changed with the arrow keys (up/down)
7594
7589
  this.assignAriaDescribedBy();
7590
+ this.setAriaactivedescendant();
7595
7591
  }
7596
7592
  subscribeEvents() {
7597
7593
  if (!isDocumentAvailable()) {
@@ -7647,6 +7643,15 @@ class DropDownListComponent {
7647
7643
  .subscribe(() => this.componentBlur()));
7648
7644
  });
7649
7645
  }
7646
+ setAriaactivedescendant() {
7647
+ if (this.ariaActivedescendant) {
7648
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-activedescendant', this.ariaActivedescendant);
7649
+ const searchInput = this.popupRef.popupElement.querySelector('input[role="searchbox"]');
7650
+ if (searchInput) {
7651
+ this.renderer.setAttribute(searchInput, 'aria-activedescendant', this.ariaActivedescendant);
7652
+ }
7653
+ }
7654
+ }
7650
7655
  subscribeTouchEvents() {
7651
7656
  if (!isDocumentAvailable() || !this.touchEnabled) {
7652
7657
  return;
@@ -7783,6 +7788,10 @@ class DropDownListComponent {
7783
7788
  }
7784
7789
  else {
7785
7790
  this.togglePopup(false);
7791
+ //this is needed for Ang 18 not to throw ng0100 error when closing the popup
7792
+ //the component could be refactored using kendoDropDownSharedEvents directive
7793
+ //once we are able to debug against Angular 18
7794
+ this.cdr.markForCheck();
7786
7795
  }
7787
7796
  }
7788
7797
  }
@@ -7989,7 +7998,7 @@ class DropDownListComponent {
7989
7998
  }
7990
7999
  }
7991
8000
  DropDownListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DropDownListComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: DataService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
7992
- DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DropDownListComponent, isStandalone: true, selector: "kendo-dropdownlist", inputs: { customIconClass: "customIconClass", showStickyHeader: "showStickyHeader", icon: "icon", svgIcon: "svgIcon", loading: "loading", data: "data", value: "value", textField: "textField", valueField: "valueField", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", popupSettings: "popupSettings", listHeight: "listHeight", defaultItem: "defaultItem", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", filterable: "filterable", virtual: "virtual", ignoreCase: "ignoreCase", delay: "delay", valuePrimitive: "valuePrimitive", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", leftRightArrowsNavigation: "leftRightArrowsNavigation", focusableId: ["id", "focusableId"] }, outputs: { valueChange: "valueChange", filterChange: "filterChange", selectionChange: "selectionChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur" }, host: { listeners: { "keydown": "keydown($event)", "keypress": "keypress($event)", "click": "click()" }, properties: { "attr.aria-controls": "this.ariaControls", "class.k-readonly": "this.readonly", "class.k-dropdownlist": "this.hostClasses", "class.k-picker": "this.hostClasses", "class.k-disabled": "this.isDisabledClass", "attr.disabled": "this.isDisabledAttribute", "class.k-loading": "this.isLoading", "attr.id": "this.focusableId", "attr.dir": "this.dir", "attr.tabindex": "this.hostTabIndex", "attr.readonly": "this.readonlyAttr", "attr.aria-busy": "this.isBusy", "attr.role": "this.role", "attr.aria-haspopup": "this.haspopup", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-activedescendant": "this.hostAriaActivedescendant" } }, providers: [
8001
+ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DropDownListComponent, isStandalone: true, selector: "kendo-dropdownlist", inputs: { customIconClass: "customIconClass", showStickyHeader: "showStickyHeader", icon: "icon", svgIcon: "svgIcon", loading: "loading", data: "data", value: "value", textField: "textField", valueField: "valueField", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", popupSettings: "popupSettings", listHeight: "listHeight", defaultItem: "defaultItem", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", filterable: "filterable", virtual: "virtual", ignoreCase: "ignoreCase", delay: "delay", valuePrimitive: "valuePrimitive", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", leftRightArrowsNavigation: "leftRightArrowsNavigation", focusableId: ["id", "focusableId"] }, outputs: { valueChange: "valueChange", filterChange: "filterChange", selectionChange: "selectionChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur" }, host: { listeners: { "keydown": "keydown($event)", "keypress": "keypress($event)", "click": "click()" }, properties: { "class.k-readonly": "this.readonly", "class.k-dropdownlist": "this.hostClasses", "class.k-picker": "this.hostClasses", "class.k-disabled": "this.isDisabledClass", "attr.disabled": "this.isDisabledAttribute", "class.k-loading": "this.isLoading", "attr.id": "this.focusableId", "attr.dir": "this.dir", "attr.tabindex": "this.hostTabIndex", "attr.readonly": "this.readonlyAttr", "attr.aria-busy": "this.isBusy", "attr.role": "this.role", "attr.aria-haspopup": "this.haspopup", "attr.aria-invalid": "this.hostAriaInvalid" } }, providers: [
7993
8002
  DROPDOWNLIST_VALUE_ACCESSOR,
7994
8003
  DataService,
7995
8004
  SelectionService,
@@ -8089,8 +8098,7 @@ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
8089
8098
  role="searchbox"
8090
8099
  aria-autocomplete="list"
8091
8100
  aria-haspopup="listbox"
8092
- [attr.aria-controls]="isOpen ? ariaControls : undefined"
8093
- [attr.aria-activedescendant]="ariaActivedescendant"
8101
+ [attr.aria-controls]="listBoxId"
8094
8102
  tabindex="-1"
8095
8103
  [filterInput]="isFocused && !touchEnabled"
8096
8104
  [attr.aria-label]="messageFor('filterInputLabel')"
@@ -8282,8 +8290,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
8282
8290
  role="searchbox"
8283
8291
  aria-autocomplete="list"
8284
8292
  aria-haspopup="listbox"
8285
- [attr.aria-controls]="isOpen ? ariaControls : undefined"
8286
- [attr.aria-activedescendant]="ariaActivedescendant"
8293
+ [attr.aria-controls]="listBoxId"
8287
8294
  tabindex="-1"
8288
8295
  [filterInput]="isFocused && !touchEnabled"
8289
8296
  [attr.aria-label]="messageFor('filterInputLabel')"
@@ -8377,9 +8384,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
8377
8384
  }], responsiveRendererComponent: [{
8378
8385
  type: ViewChild,
8379
8386
  args: [ResponsiveRendererComponent]
8380
- }], ariaControls: [{
8381
- type: HostBinding,
8382
- args: ['attr.aria-controls']
8383
8387
  }], showStickyHeader: [{
8384
8388
  type: Input
8385
8389
  }], icon: [{
@@ -8532,15 +8536,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
8532
8536
  }], haspopup: [{
8533
8537
  type: HostBinding,
8534
8538
  args: ['attr.aria-haspopup']
8535
- }], isAriaExpanded: [{
8536
- type: HostBinding,
8537
- args: ['attr.aria-expanded']
8538
8539
  }], hostAriaInvalid: [{
8539
8540
  type: HostBinding,
8540
8541
  args: ['attr.aria-invalid']
8541
- }], hostAriaActivedescendant: [{
8542
- type: HostBinding,
8543
- args: ['attr.aria-activedescendant']
8544
8542
  }], keydown: [{
8545
8543
  type: HostListener,
8546
8544
  args: ['keydown', ['$event']]
@@ -9740,7 +9738,7 @@ class MultiSelectComponent {
9740
9738
  if (isPresent(event.added) && event.added.length > 0) {
9741
9739
  event.added.forEach((itemIndex) => {
9742
9740
  const dataItem = this.dataService.itemAt(itemIndex);
9743
- const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(dataItem[this.valueField])) ? dataItem[this.valueField] : dataItem;
9741
+ const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(getter(dataItem, this.valueField))) ? getter(dataItem, this.valueField) : dataItem;
9744
9742
  if (newItem) {
9745
9743
  if (!this.isAdaptive || !this.isActionSheetExpanded) {
9746
9744
  this.value = [...this.value, newItem];
@@ -9774,7 +9772,7 @@ class MultiSelectComponent {
9774
9772
  // Existing items.
9775
9773
  if (isPresent(event.added)) {
9776
9774
  const dataItem = this.dataService.itemAt(event.added);
9777
- const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(dataItem[this.valueField])) ? dataItem[this.valueField] : dataItem;
9775
+ const newItem = (this.valuePrimitive && isPresent(dataItem) && isPresent(getter(dataItem, this.valueField))) ? getter(dataItem, this.valueField) : dataItem;
9778
9776
  if (!this.isAdaptive || !this.isActionSheetExpanded) {
9779
9777
  this.value = [...this.value, newItem];
9780
9778
  }
@@ -14589,9 +14587,6 @@ class MultiSelectTreeComponent {
14589
14587
  get isDisabled() {
14590
14588
  return this.disabled;
14591
14589
  }
14592
- get hostAriaControls() {
14593
- return this.isOpen ? this.treeViewId : null;
14594
- }
14595
14590
  get hostAriaAutocomplete() {
14596
14591
  return this.filterable ? 'list' : null;
14597
14592
  }
@@ -14610,9 +14605,6 @@ class MultiSelectTreeComponent {
14610
14605
  get hostTabIndex() {
14611
14606
  return this.tabindex;
14612
14607
  }
14613
- get isAriaExpanded() {
14614
- return this.isOpen;
14615
- }
14616
14608
  get isReadonly() {
14617
14609
  return this.readonly ? '' : null;
14618
14610
  }
@@ -15270,6 +15262,10 @@ class MultiSelectTreeComponent {
15270
15262
  }
15271
15263
  this.isFocused = false;
15272
15264
  this.togglePopup(false);
15265
+ //this is needed for Ang 18 not to throw ng0100 error when closing the popup
15266
+ //the component could be refactored using kendoDropDownSharedEvents directive
15267
+ //once we are able to debug against Angular 18
15268
+ this.cdr.markForCheck();
15273
15269
  if (hasObservers(this.onBlur) ||
15274
15270
  isUntouched(this.wrapper.nativeElement) ||
15275
15271
  this.formControl?.updateOn === 'blur') {
@@ -15540,6 +15536,7 @@ class MultiSelectTreeComponent {
15540
15536
  popupWrapper.style.minWidth = min;
15541
15537
  popupWrapper.style.width = max;
15542
15538
  popupWrapper.style.height = this.height;
15539
+ this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.treeViewId);
15543
15540
  this.renderer.setAttribute(popupWrapper, 'dir', this.direction);
15544
15541
  this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
15545
15542
  this.popupRef.popupOpen.subscribe(() => {
@@ -15563,6 +15560,7 @@ class MultiSelectTreeComponent {
15563
15560
  this.popupRef.close();
15564
15561
  this.popupRef = null;
15565
15562
  this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
15563
+ this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
15566
15564
  if (this.filter !== "") {
15567
15565
  this.filter = "";
15568
15566
  this.allNodesHidden = false;
@@ -15883,7 +15881,7 @@ class MultiSelectTreeComponent {
15883
15881
  }
15884
15882
  }
15885
15883
  MultiSelectTreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MultiSelectTreeComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i2.PopupService }, { token: i0.Renderer2 }, { token: NavigationService }, { token: i0.NgZone }, { token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: MultiSelectTreeLookupService }], target: i0.ɵɵFactoryTarget.Component });
15886
- MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", popupSettings: "popupSettings", checkableSettings: "checkableSettings", data: "data", value: "value", dataItems: "dataItems", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", loading: "loading", placeholder: "placeholder", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", loadOnDemand: "loadOnDemand", focusableId: "focusableId", clearButton: "clearButton", filterable: "filterable", checkAll: "checkAll", hasChildren: "hasChildren", fetchChildren: "fetchChildren", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", itemDisabled: "itemDisabled", tagMapper: "tagMapper" }, outputs: { onFocus: "focus", onBlur: "blur", open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", valueChange: "valueChange", removeTag: "removeTag", filterChange: "filterChange" }, host: { properties: { "class.k-multiselecttree": "this.hostClasses", "class.k-input": "this.hostClasses", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "attr.aria-controls": "this.hostAriaControls", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-loading": "this.isLoading", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-busy": "this.isBusy", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-haspopup": "this.ariaHasPopup", "attr.readonly": "this.isReadonly", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-activedescendant": "this.ariaActiveDescendant", "class.k-readonly": "this.readonly" } }, providers: [
15884
+ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", popupSettings: "popupSettings", checkableSettings: "checkableSettings", data: "data", value: "value", dataItems: "dataItems", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", loading: "loading", placeholder: "placeholder", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", loadOnDemand: "loadOnDemand", focusableId: "focusableId", clearButton: "clearButton", filterable: "filterable", checkAll: "checkAll", hasChildren: "hasChildren", fetchChildren: "fetchChildren", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", itemDisabled: "itemDisabled", tagMapper: "tagMapper" }, outputs: { onFocus: "focus", onBlur: "blur", open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", valueChange: "valueChange", removeTag: "removeTag", filterChange: "filterChange" }, host: { properties: { "class.k-multiselecttree": "this.hostClasses", "class.k-input": "this.hostClasses", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-loading": "this.isLoading", "attr.aria-invalid": "this.hostAriaInvalid", "attr.aria-busy": "this.isBusy", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.readonly": "this.isReadonly", "attr.aria-describedby": "this.ariaDescribedBy", "attr.aria-activedescendant": "this.ariaActiveDescendant", "class.k-readonly": "this.readonly" } }, providers: [
15887
15885
  LocalizationService,
15888
15886
  NavigationService,
15889
15887
  DataService,
@@ -16027,9 +16025,7 @@ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
16027
16025
  (keydown)="handleKeydown($event, filterInput)"
16028
16026
  [value]="filter"
16029
16027
  class="k-input-inner"
16030
- role="textbox"
16031
- aria-haspopup="true"
16032
- aria-expanded="false"
16028
+ role="searchbox"
16033
16029
  tabindex="0"
16034
16030
  aria-disabled="false"
16035
16031
  aria-readonly="false"
@@ -16284,9 +16280,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16284
16280
  (keydown)="handleKeydown($event, filterInput)"
16285
16281
  [value]="filter"
16286
16282
  class="k-input-inner"
16287
- role="textbox"
16288
- aria-haspopup="true"
16289
- aria-expanded="false"
16283
+ role="searchbox"
16290
16284
  tabindex="0"
16291
16285
  aria-disabled="false"
16292
16286
  aria-readonly="false"
@@ -16406,9 +16400,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16406
16400
  }, {
16407
16401
  type: HostBinding,
16408
16402
  args: ['attr.aria-disabled']
16409
- }], hostAriaControls: [{
16410
- type: HostBinding,
16411
- args: ['attr.aria-controls']
16412
16403
  }], hostAriaAutocomplete: [{
16413
16404
  type: HostBinding,
16414
16405
  args: ['attr.aria-autocomplete']
@@ -16433,9 +16424,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16433
16424
  }], role: [{
16434
16425
  type: HostBinding,
16435
16426
  args: ['attr.role']
16436
- }], isAriaExpanded: [{
16437
- type: HostBinding,
16438
- args: ['attr.aria-expanded']
16439
16427
  }], ariaHasPopup: [{
16440
16428
  type: HostBinding,
16441
16429
  args: ['attr.aria-haspopup']
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-dropdowns",
3
- "version": "16.7.1-develop.5",
3
+ "version": "16.7.1-develop.7",
4
4
  "description": "A wide variety of native Angular dropdown components including AutoComplete, ComboBox, DropDownList, DropDownTree, MultiColumnComboBox, MultiSelect, and MultiSelectTree ",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -25,17 +25,17 @@
25
25
  "@angular/forms": "15 - 18",
26
26
  "@angular/platform-browser": "15 - 18",
27
27
  "@progress/kendo-licensing": "^1.0.2",
28
- "@progress/kendo-angular-common": "16.7.1-develop.5",
29
- "@progress/kendo-angular-l10n": "16.7.1-develop.5",
30
- "@progress/kendo-angular-navigation": "16.7.1-develop.5",
31
- "@progress/kendo-angular-popup": "16.7.1-develop.5",
32
- "@progress/kendo-angular-icons": "16.7.1-develop.5",
33
- "@progress/kendo-angular-treeview": "16.7.1-develop.5",
28
+ "@progress/kendo-angular-common": "16.7.1-develop.7",
29
+ "@progress/kendo-angular-l10n": "16.7.1-develop.7",
30
+ "@progress/kendo-angular-navigation": "16.7.1-develop.7",
31
+ "@progress/kendo-angular-popup": "16.7.1-develop.7",
32
+ "@progress/kendo-angular-icons": "16.7.1-develop.7",
33
+ "@progress/kendo-angular-treeview": "16.7.1-develop.7",
34
34
  "rxjs": "^6.5.3 || ^7.0.0"
35
35
  },
36
36
  "dependencies": {
37
37
  "tslib": "^2.3.1",
38
- "@progress/kendo-angular-schematics": "16.7.1-develop.5",
38
+ "@progress/kendo-angular-schematics": "16.7.1-develop.7",
39
39
  "@progress/kendo-common": "^0.2.1"
40
40
  },
41
41
  "schematics": "./schematics/collection.json",
package/schematics/ngAdd/index.js CHANGED
@@ -4,9 +4,9 @@ const schematics_1 = require("@angular-devkit/schematics");
4
4
  function default_1(options) {
5
5
  const finalOptions = Object.assign(Object.assign({}, options), { mainNgModule: 'DropDownsModule', package: 'dropdowns', peerDependencies: {
6
6
  // peers of the treeview
7
- '@progress/kendo-angular-inputs': '16.7.1-develop.5',
7
+ '@progress/kendo-angular-inputs': '16.7.1-develop.7',
8
8
  // peers of inputs
9
- '@progress/kendo-angular-intl': '16.7.1-develop.5',
9
+ '@progress/kendo-angular-intl': '16.7.1-develop.7',
10
10
  '@progress/kendo-drawing': '^1.17.2',
11
11
  // Peer dependency of icons
12
12
  '@progress/kendo-svg-icons': '^3.0.0'