@progress/kendo-angular-dropdowns 25.0.0-develop.2 → 25.0.0-develop.20

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.
@@ -3,9 +3,9 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import * as i0 from '@angular/core';
6
- import { EventEmitter, Output, HostBinding, Input, Component, Directive, Injectable, HostListener, ViewChild, ViewChildren, forwardRef, isDevMode, ViewContainerRef, ContentChild, ContentChildren, ChangeDetectionStrategy, NgModule } from '@angular/core';
6
+ import { EventEmitter, Output, HostBinding, Input, Component, Directive, Injectable, HostListener, afterNextRender, ViewChild, ViewChildren, forwardRef, isDevMode, ViewContainerRef, ContentChild, ContentChildren, signal, ChangeDetectionStrategy, NgModule } from '@angular/core';
7
7
  import * as i10 from '@progress/kendo-angular-common';
8
- import { isDocumentAvailable, isObjectPresent, removeHTMLAttributes, parseAttributes, isSafari, normalizeKeys, Keys, setHTMLAttributes, replaceMessagePlaceholder, isChanged, TemplateContextDirective, ResizeSensorComponent, closest as closest$1, hasFocusableParent, parseCSSClassNames, isControlRequired, guid, hasObservers, SeparatorComponent, SuffixTemplateDirective, PrefixTemplateDirective, KendoInput, KENDO_WEBMCP_HOST, MultiTabStop, anyChanged, EventsOutsideAngularDirective, scrollbarWidth, ToggleButtonTabStopDirective, ResizeBatchService, KENDO_ADORNMENTS, KENDO_TOGGLEBUTTONTABSTOP } from '@progress/kendo-angular-common';
8
+ import { isDocumentAvailable, isObjectPresent, removeHTMLAttributes, parseAttributes, isSafari, normalizeKeys, Keys, setHTMLAttributes, replaceMessagePlaceholder, isChanged, TemplateContextDirective, ResizeSensorComponent, closest as closest$1, hasFocusableParent, parseCSSClassNames, isControlRequired, guid, hasObservers, SeparatorComponent, SuffixTemplateDirective, PrefixTemplateDirective, KendoInput, KENDO_WEBMCP_HOST, provideComponentName, MultiTabStop, anyChanged, EventsOutsideAngularDirective, scrollbarWidth, ToggleButtonTabStopDirective, ResizeBatchService, KENDO_ADORNMENTS, KENDO_TOGGLEBUTTONTABSTOP } from '@progress/kendo-angular-common';
9
9
  export { PrefixTemplateDirective, SeparatorComponent, SuffixTemplateDirective, ToggleButtonTabStopDirective } from '@progress/kendo-angular-common';
10
10
  import * as i7 from '@progress/kendo-angular-utils';
11
11
  import { AdaptiveService } from '@progress/kendo-angular-utils';
@@ -20,10 +20,10 @@ import { map, switchMap, take, auditTime, tap, filter, partition, throttleTime,
20
20
  import * as i2 from '@progress/kendo-angular-popup';
21
21
  import { PopupService } from '@progress/kendo-angular-popup';
22
22
  import { NgStyle, NgClass, NgTemplateOutlet } from '@angular/common';
23
- import { checkIcon, xIcon, chevronDownIcon, searchIcon, xCircleIcon } from '@progress/kendo-svg-icons';
24
- import { IconComponent, IconWrapperComponent, IconsService } from '@progress/kendo-angular-icons';
23
+ import { CheckBoxComponent, TextBoxComponent, TextBoxPrefixTemplateDirective } from '@progress/kendo-angular-inputs';
24
+ import { checkIcon, searchIcon, xIcon, chevronDownIcon, xCircleIcon } from '@progress/kendo-svg-icons';
25
+ import { IconWrapperComponent, IconsService } from '@progress/kendo-angular-icons';
25
26
  import { ActionSheetComponent, ActionSheetTemplateDirective } from '@progress/kendo-angular-navigation';
26
- import { TextBoxComponent, TextBoxPrefixTemplateDirective } from '@progress/kendo-angular-inputs';
27
27
  import { ButtonComponent } from '@progress/kendo-angular-buttons';
28
28
  import * as i1$1 from '@progress/kendo-angular-treeview';
29
29
  import { TreeViewComponent, SelectDirective, DataBoundComponent, ExpandableComponent, FlatDataBindingDirective, HierarchyBindingDirective, ExpandDirective } from '@progress/kendo-angular-treeview';
@@ -37,8 +37,8 @@ const packageMetadata = {
37
37
  productName: 'Kendo UI for Angular',
38
38
  productCode: 'KENDOUIANGULAR',
39
39
  productCodes: ['KENDOUIANGULAR'],
40
- publishDate: 1783688631,
41
- version: '25.0.0-develop.2',
40
+ publishDate: 1785763420,
41
+ version: '25.0.0-develop.20',
42
42
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
43
43
  };
44
44
 
@@ -211,6 +211,17 @@ const hasProps = (obj, props) => {
211
211
  }
212
212
  return props.every(prop => obj.hasOwnProperty(prop));
213
213
  };
214
+ /**
215
+ * @hidden
216
+ *
217
+ * Checks whether an array contains grouped data.
218
+ * GroupResult { aggregates: AggregateResult, field: string, items: object[], value: any }
219
+ * https://www.telerik.com/kendo-angular-ui/components/dataquery/api/GroupResult/
220
+ */
221
+ const isGroupedData = (data) => {
222
+ return isPresent(data) && data.length > 0 && isPresent(data[0])
223
+ && hasProps(data[0], ['aggregates', 'field', 'items', 'value']);
224
+ };
214
225
  /**
215
226
  * @hidden
216
227
  *
@@ -466,12 +477,12 @@ class SearchBarComponent {
466
477
  get isSuggestable() {
467
478
  return this._isSuggestable;
468
479
  }
469
- set isFilterable(isFilterable) {
470
- this._isFilterable = isFilterable;
480
+ set hasListAutocomplete(hasListAutocomplete) {
481
+ this._hasListAutocomplete = hasListAutocomplete;
471
482
  this.setAriaAutocomplete();
472
483
  }
473
- get isFilterable() {
474
- return this._isFilterable;
484
+ get hasListAutocomplete() {
485
+ return this._hasListAutocomplete;
475
486
  }
476
487
  get userInput() {
477
488
  return this._userInput;
@@ -510,7 +521,7 @@ class SearchBarComponent {
510
521
  ariaControls;
511
522
  ariaExpanded = null;
512
523
  get attrAriaInvalid() {
513
- return this.formControl?.invalid ? true : null;
524
+ return (this.formControl?.invalid && (this.formControl?.touched || this.formControl?.dirty)) ? true : null;
514
525
  }
515
526
  set placeholder(text) {
516
527
  this._placeholder = text || '';
@@ -538,7 +549,7 @@ class SearchBarComponent {
538
549
  _previousValue = "";
539
550
  _placeholder = "";
540
551
  _isSuggestable = false;
541
- _isFilterable = false;
552
+ _hasListAutocomplete = false;
542
553
  renderer;
543
554
  subs = new Subscription();
544
555
  _inputAttributes;
@@ -558,7 +569,7 @@ class SearchBarComponent {
558
569
  'aria-controls': this.ariaControls,
559
570
  'aria-activedescendant': this.activeDescendant,
560
571
  'aria-busy': this.isLoading,
561
- 'aria-invalid': this.formControl?.invalid
572
+ 'aria-invalid': this.formControl?.invalid && (this.formControl?.touched || this.formControl?.dirty)
562
573
  };
563
574
  }
564
575
  get mutableAttributes() {
@@ -643,16 +654,16 @@ class SearchBarComponent {
643
654
  }
644
655
  }
645
656
  setAriaAutocomplete() {
646
- if (this.isFilterable) {
657
+ if (this.hasListAutocomplete) {
647
658
  this.renderer.setAttribute(this.input.nativeElement, 'aria-autocomplete', 'list');
648
659
  }
649
660
  if (this.isSuggestable) {
650
661
  this.renderer.setAttribute(this.input.nativeElement, 'aria-autocomplete', 'inline');
651
662
  }
652
- if (this.isFilterable && this.isSuggestable) {
663
+ if (this.hasListAutocomplete && this.isSuggestable) {
653
664
  this.renderer.setAttribute(this.input.nativeElement, 'aria-autocomplete', 'both');
654
665
  }
655
- if (!this.isFilterable && !this.isSuggestable) {
666
+ if (!this.hasListAutocomplete && !this.isSuggestable) {
656
667
  this.renderer.removeAttribute(this.input.nativeElement, 'aria-autocomplete');
657
668
  }
658
669
  }
@@ -702,12 +713,12 @@ class SearchBarComponent {
702
713
  }
703
714
  setInputAttributes() {
704
715
  const attributesToRender = Object.assign({}, this.mutableAttributes, this.parsedAttributes);
705
- setHTMLAttributes(attributesToRender, this.renderer, this.input.nativeElement, this.ngZone);
716
+ setHTMLAttributes(attributesToRender, this.renderer, this.input.nativeElement, this.injector);
706
717
  }
707
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SearchBarComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }, { token: i0.Injector }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
708
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: SearchBarComponent, isStandalone: true, selector: "input[kendoSearchbar]", inputs: { tagListId: "tagListId", readonly: "readonly", disabled: "disabled", isRequired: "isRequired", isSuggestable: "isSuggestable", isFilterable: "isFilterable", userInput: "userInput", suggestedText: "suggestedText", inputAttributes: "inputAttributes", id: "id", activeDescendant: "activeDescendant", tabIndex: "tabIndex", isLoading: "isLoading", ariaControls: "ariaControls", ariaExpanded: "ariaExpanded", placeholder: "placeholder" }, outputs: { valueChange: "valueChange", onBlur: "onBlur", onFocus: "onFocus", onClick: "onClick", onNavigate: "onNavigate" }, host: { properties: { "attr.id": "this.id", "attr.aria-activedescendant": "this.activeDescendant", "attr.tabindex": "this.tabIndex", "attr.aria-busy": "this.isLoading", "attr.aria-controls": "this.ariaControls", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-invalid": "this.attrAriaInvalid", "attr.placeholder": "this.placeholder", "attr.role": "this.role", "attr.dir": "this.dir" } }, usesOnChanges: true, ngImport: i0, template: ``, isInline: true });
718
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SearchBarComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }, { token: i0.Injector }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
719
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.26", type: SearchBarComponent, isStandalone: true, selector: "input[kendoSearchbar]", inputs: { tagListId: "tagListId", readonly: "readonly", disabled: "disabled", isRequired: "isRequired", isSuggestable: "isSuggestable", hasListAutocomplete: "hasListAutocomplete", userInput: "userInput", suggestedText: "suggestedText", inputAttributes: "inputAttributes", id: "id", activeDescendant: "activeDescendant", tabIndex: "tabIndex", isLoading: "isLoading", ariaControls: "ariaControls", ariaExpanded: "ariaExpanded", placeholder: "placeholder" }, outputs: { valueChange: "valueChange", onBlur: "onBlur", onFocus: "onFocus", onClick: "onClick", onNavigate: "onNavigate" }, host: { properties: { "attr.id": "this.id", "attr.aria-activedescendant": "this.activeDescendant", "attr.tabindex": "this.tabIndex", "attr.aria-busy": "this.isLoading", "attr.aria-controls": "this.ariaControls", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-invalid": "this.attrAriaInvalid", "attr.placeholder": "this.placeholder", "attr.role": "this.role", "attr.dir": "this.dir" } }, usesOnChanges: true, ngImport: i0, template: ``, isInline: true });
709
720
  }
710
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SearchBarComponent, decorators: [{
721
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SearchBarComponent, decorators: [{
711
722
  type: Component,
712
723
  args: [{
713
724
  selector: 'input[kendoSearchbar]',
@@ -724,7 +735,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
724
735
  type: Input
725
736
  }], isSuggestable: [{
726
737
  type: Input
727
- }], isFilterable: [{
738
+ }], hasListAutocomplete: [{
728
739
  type: Input
729
740
  }], userInput: [{
730
741
  type: Input
@@ -820,10 +831,10 @@ class ItemTemplateDirective {
820
831
  constructor(templateRef) {
821
832
  this.templateRef = templateRef;
822
833
  }
823
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
824
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: ItemTemplateDirective, isStandalone: true, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]", ngImport: i0 });
834
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
835
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: ItemTemplateDirective, isStandalone: true, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]", ngImport: i0 });
825
836
  }
826
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ItemTemplateDirective, decorators: [{
837
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ItemTemplateDirective, decorators: [{
827
838
  type: Directive,
828
839
  args: [{
829
840
  selector: '[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]',
@@ -864,10 +875,10 @@ class HeaderTemplateDirective {
864
875
  constructor(templateRef) {
865
876
  this.templateRef = templateRef;
866
877
  }
867
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: HeaderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
868
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: HeaderTemplateDirective, isStandalone: true, selector: "[kendoDropDownListHeaderTemplate],[kendoComboBoxHeaderTemplate],[kendoDropDownTreeHeaderTemplate],[kendoMultiColumnComboBoxHeaderTemplate],[kendoAutoCompleteHeaderTemplate],[kendoMultiSelectHeaderTemplate],[kendoMultiSelectTreeHeaderTemplate]", ngImport: i0 });
878
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: HeaderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
879
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: HeaderTemplateDirective, isStandalone: true, selector: "[kendoDropDownListHeaderTemplate],[kendoComboBoxHeaderTemplate],[kendoDropDownTreeHeaderTemplate],[kendoMultiColumnComboBoxHeaderTemplate],[kendoAutoCompleteHeaderTemplate],[kendoMultiSelectHeaderTemplate],[kendoMultiSelectTreeHeaderTemplate]", ngImport: i0 });
869
880
  }
870
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: HeaderTemplateDirective, decorators: [{
881
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: HeaderTemplateDirective, decorators: [{
871
882
  type: Directive,
872
883
  args: [{
873
884
  selector: '[kendoDropDownListHeaderTemplate],[kendoComboBoxHeaderTemplate],[kendoDropDownTreeHeaderTemplate],[kendoMultiColumnComboBoxHeaderTemplate],[kendoAutoCompleteHeaderTemplate],[kendoMultiSelectHeaderTemplate],[kendoMultiSelectTreeHeaderTemplate]',
@@ -908,10 +919,10 @@ class FooterTemplateDirective {
908
919
  constructor(templateRef) {
909
920
  this.templateRef = templateRef;
910
921
  }
911
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FooterTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
912
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: FooterTemplateDirective, isStandalone: true, selector: "[kendoDropDownListFooterTemplate],[kendoComboBoxFooterTemplate],[kendoDropDownTreeFooterTemplate],[kendoMultiColumnComboBoxFooterTemplate],[kendoAutoCompleteFooterTemplate],[kendoMultiSelectFooterTemplate],[kendoMultiSelectTreeFooterTemplate]", ngImport: i0 });
922
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FooterTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
923
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: FooterTemplateDirective, isStandalone: true, selector: "[kendoDropDownListFooterTemplate],[kendoComboBoxFooterTemplate],[kendoDropDownTreeFooterTemplate],[kendoMultiColumnComboBoxFooterTemplate],[kendoAutoCompleteFooterTemplate],[kendoMultiSelectFooterTemplate],[kendoMultiSelectTreeFooterTemplate]", ngImport: i0 });
913
924
  }
914
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FooterTemplateDirective, decorators: [{
925
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FooterTemplateDirective, decorators: [{
915
926
  type: Directive,
916
927
  args: [{
917
928
  selector: '[kendoDropDownListFooterTemplate],[kendoComboBoxFooterTemplate],[kendoDropDownTreeFooterTemplate],[kendoMultiColumnComboBoxFooterTemplate],[kendoAutoCompleteFooterTemplate],[kendoMultiSelectFooterTemplate],[kendoMultiSelectTreeFooterTemplate]',
@@ -958,10 +969,10 @@ class GroupTemplateDirective {
958
969
  constructor(templateRef) {
959
970
  this.templateRef = templateRef;
960
971
  }
961
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: GroupTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
962
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: GroupTemplateDirective, isStandalone: true, selector: "[kendoDropDownListGroupTemplate],[kendoComboBoxGroupTemplate],[kendoMultiColumnComboBoxGroupTemplate],[kendoAutoCompleteGroupTemplate],[kendoMultiSelectGroupTemplate]", ngImport: i0 });
972
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: GroupTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
973
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: GroupTemplateDirective, isStandalone: true, selector: "[kendoDropDownListGroupTemplate],[kendoComboBoxGroupTemplate],[kendoMultiColumnComboBoxGroupTemplate],[kendoAutoCompleteGroupTemplate],[kendoMultiSelectGroupTemplate]", ngImport: i0 });
963
974
  }
964
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: GroupTemplateDirective, decorators: [{
975
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: GroupTemplateDirective, decorators: [{
965
976
  type: Directive,
966
977
  args: [{
967
978
  selector: '[kendoDropDownListGroupTemplate],[kendoComboBoxGroupTemplate],[kendoMultiColumnComboBoxGroupTemplate],[kendoAutoCompleteGroupTemplate],[kendoMultiSelectGroupTemplate]',
@@ -1008,10 +1019,10 @@ class FixedGroupTemplateDirective {
1008
1019
  constructor(templateRef) {
1009
1020
  this.templateRef = templateRef;
1010
1021
  }
1011
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FixedGroupTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
1012
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: FixedGroupTemplateDirective, isStandalone: true, selector: "[kendoDropDownListFixedGroupTemplate],[kendoComboBoxFixedGroupTemplate],[kendoMultiColumnComboBoxFixedGroupTemplate],[kendoAutoCompleteFixedGroupTemplate],[kendoMultiSelectFixedGroupTemplate]", ngImport: i0 });
1022
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FixedGroupTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
1023
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: FixedGroupTemplateDirective, isStandalone: true, selector: "[kendoDropDownListFixedGroupTemplate],[kendoComboBoxFixedGroupTemplate],[kendoMultiColumnComboBoxFixedGroupTemplate],[kendoAutoCompleteFixedGroupTemplate],[kendoMultiSelectFixedGroupTemplate]", ngImport: i0 });
1013
1024
  }
1014
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FixedGroupTemplateDirective, decorators: [{
1025
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FixedGroupTemplateDirective, decorators: [{
1015
1026
  type: Directive,
1016
1027
  args: [{
1017
1028
  selector: '[kendoDropDownListFixedGroupTemplate],[kendoComboBoxFixedGroupTemplate],[kendoMultiColumnComboBoxFixedGroupTemplate],[kendoAutoCompleteFixedGroupTemplate],[kendoMultiSelectFixedGroupTemplate]',
@@ -1058,9 +1069,7 @@ class DataService {
1058
1069
  * Used to determine if the component received grouped data.
1059
1070
  */
1060
1071
  isGrouped(data) {
1061
- // GroupResult { aggregates: AggregateResult, field: string, items: object[], value: any }
1062
- // https://www.telerik.com/kendo-angular-ui/components/dataquery/api/GroupResult/
1063
- return (isPresent(data) && data.length !== 0) && isPresent(data[0]) && hasProps(data[0], ['aggregates', 'field', 'items', 'value']);
1072
+ return isGroupedData(data);
1064
1073
  }
1065
1074
  /**
1066
1075
  * @hidden
@@ -1256,10 +1265,10 @@ class DataService {
1256
1265
  }
1257
1266
  return flat;
1258
1267
  }
1259
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1260
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DataService });
1268
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1269
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DataService });
1261
1270
  }
1262
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DataService, decorators: [{
1271
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DataService, decorators: [{
1263
1272
  type: Injectable
1264
1273
  }] });
1265
1274
 
@@ -1295,10 +1304,10 @@ class DisabledItemsService {
1295
1304
  }
1296
1305
  }
1297
1306
  }
1298
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DisabledItemsService, deps: [{ token: DataService }], target: i0.ɵɵFactoryTarget.Injectable });
1299
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DisabledItemsService });
1307
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DisabledItemsService, deps: [{ token: DataService }], target: i0.ɵɵFactoryTarget.Injectable });
1308
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DisabledItemsService });
1300
1309
  }
1301
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DisabledItemsService, decorators: [{
1310
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DisabledItemsService, decorators: [{
1302
1311
  type: Injectable
1303
1312
  }], ctorParameters: () => [{ type: DataService }] });
1304
1313
 
@@ -1453,10 +1462,10 @@ class SelectionService {
1453
1462
  }
1454
1463
  this.unselectMultiple(indicesToBeUnselected);
1455
1464
  }
1456
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SelectionService, deps: [{ token: DisabledItemsService }], target: i0.ɵɵFactoryTarget.Injectable });
1457
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SelectionService });
1465
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SelectionService, deps: [{ token: DisabledItemsService }], target: i0.ɵɵFactoryTarget.Injectable });
1466
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SelectionService });
1458
1467
  }
1459
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SelectionService, decorators: [{
1468
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SelectionService, decorators: [{
1460
1469
  type: Injectable
1461
1470
  }], ctorParameters: () => [{ type: DisabledItemsService }] });
1462
1471
 
@@ -1657,10 +1666,10 @@ class NavigationService {
1657
1666
  return this.disabledItemsService.isIndexDisabled(index);
1658
1667
  }
1659
1668
  }
1660
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NavigationService, deps: [{ token: DisabledItemsService }, { token: SelectionService }], target: i0.ɵɵFactoryTarget.Injectable });
1661
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NavigationService });
1669
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: NavigationService, deps: [{ token: DisabledItemsService }, { token: SelectionService }], target: i0.ɵɵFactoryTarget.Injectable });
1670
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: NavigationService });
1662
1671
  }
1663
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NavigationService, decorators: [{
1672
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: NavigationService, decorators: [{
1664
1673
  type: Injectable
1665
1674
  }], ctorParameters: () => [{ type: DisabledItemsService }, { type: SelectionService }] });
1666
1675
 
@@ -1697,10 +1706,10 @@ class NoDataTemplateDirective {
1697
1706
  constructor(templateRef) {
1698
1707
  this.templateRef = templateRef;
1699
1708
  }
1700
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NoDataTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
1701
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: NoDataTemplateDirective, isStandalone: true, selector: "[kendoDropDownListNoDataTemplate],[kendoDropDownTreeNoDataTemplate],[kendoComboBoxNoDataTemplate],[kendoMultiColumnComboBoxNoDataTemplate],[kendoAutoCompleteNoDataTemplate],[kendoMultiSelectNoDataTemplate],[kendoMultiSelectTreeNoDataTemplate]", ngImport: i0 });
1709
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: NoDataTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
1710
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: NoDataTemplateDirective, isStandalone: true, selector: "[kendoDropDownListNoDataTemplate],[kendoDropDownTreeNoDataTemplate],[kendoComboBoxNoDataTemplate],[kendoMultiColumnComboBoxNoDataTemplate],[kendoAutoCompleteNoDataTemplate],[kendoMultiSelectNoDataTemplate],[kendoMultiSelectTreeNoDataTemplate]", ngImport: i0 });
1702
1711
  }
1703
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NoDataTemplateDirective, decorators: [{
1712
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: NoDataTemplateDirective, decorators: [{
1704
1713
  type: Directive,
1705
1714
  args: [{
1706
1715
  selector: '[kendoDropDownListNoDataTemplate],[kendoDropDownTreeNoDataTemplate],[kendoComboBoxNoDataTemplate],[kendoMultiColumnComboBoxNoDataTemplate],[kendoAutoCompleteNoDataTemplate],[kendoMultiSelectNoDataTemplate],[kendoMultiSelectTreeNoDataTemplate]',
@@ -1769,10 +1778,10 @@ class ListItemDirective {
1769
1778
  constructor(element) {
1770
1779
  this.element = element;
1771
1780
  }
1772
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ListItemDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
1773
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: ListItemDirective, isStandalone: true, selector: "\"li[role=option], li[role=group], li[role=presentation]\"", ngImport: i0 });
1781
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ListItemDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
1782
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: ListItemDirective, isStandalone: true, selector: "\"li[role=option], li[role=group], li[role=presentation]\"", ngImport: i0 });
1774
1783
  }
1775
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ListItemDirective, decorators: [{
1784
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ListItemDirective, decorators: [{
1776
1785
  type: Directive,
1777
1786
  args: [{
1778
1787
  selector: '"li[role=option], li[role=group], li[role=presentation]"',
@@ -1805,6 +1814,9 @@ class SelectableDirective {
1805
1814
  if (this.checkboxes.enabled && !this.checkboxes.checkOnClick) {
1806
1815
  return;
1807
1816
  }
1817
+ if (this.index === -2) {
1818
+ return;
1819
+ }
1808
1820
  if (this.multipleSelection) {
1809
1821
  if (this.selectionService.isSelected(this.index)) {
1810
1822
  this.selectionService.deselect(this.index);
@@ -1817,10 +1829,10 @@ class SelectableDirective {
1817
1829
  this.selectionService.change(this.index);
1818
1830
  }
1819
1831
  }
1820
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SelectableDirective, deps: [{ token: SelectionService }], target: i0.ɵɵFactoryTarget.Directive });
1821
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: SelectableDirective, isStandalone: true, selector: "[kendoDropDownsSelectable]", inputs: { index: "index", checkboxes: "checkboxes", height: "height", isMultiselect: "isMultiselect", multipleSelection: "multipleSelection" }, host: { listeners: { "click": "onClick($event)" }, properties: { "attr.index": "this.index", "style.height.px": "this.height", "style.minHeight.px": "this.height", "class.k-focus": "this.focusedClassName", "class.k-selected": "this.selectedClassName" } }, ngImport: i0 });
1832
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SelectableDirective, deps: [{ token: SelectionService }], target: i0.ɵɵFactoryTarget.Directive });
1833
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: SelectableDirective, isStandalone: true, selector: "[kendoDropDownsSelectable]", inputs: { index: "index", checkboxes: "checkboxes", height: "height", isMultiselect: "isMultiselect", multipleSelection: "multipleSelection" }, host: { listeners: { "click": "onClick($event)" }, properties: { "attr.index": "this.index", "style.height.px": "this.height", "style.minHeight.px": "this.height", "class.k-focus": "this.focusedClassName", "class.k-selected": "this.selectedClassName" } }, ngImport: i0 });
1822
1834
  }
1823
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SelectableDirective, decorators: [{
1835
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SelectableDirective, decorators: [{
1824
1836
  type: Directive,
1825
1837
  args: [{
1826
1838
  selector: '[kendoDropDownsSelectable]',
@@ -1888,10 +1900,10 @@ class CustomItemTemplateDirective {
1888
1900
  constructor(templateRef) {
1889
1901
  this.templateRef = templateRef;
1890
1902
  }
1891
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CustomItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
1892
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: CustomItemTemplateDirective, isStandalone: true, selector: "[kendoMultiSelectCustomItemTemplate]", ngImport: i0 });
1903
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CustomItemTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
1904
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: CustomItemTemplateDirective, isStandalone: true, selector: "[kendoMultiSelectCustomItemTemplate]", ngImport: i0 });
1893
1905
  }
1894
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CustomItemTemplateDirective, decorators: [{
1906
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CustomItemTemplateDirective, decorators: [{
1895
1907
  type: Directive,
1896
1908
  args: [{
1897
1909
  selector: '[kendoMultiSelectCustomItemTemplate]',
@@ -1911,6 +1923,7 @@ class ListComponent {
1911
1923
  zone;
1912
1924
  renderer;
1913
1925
  localization;
1926
+ injector;
1914
1927
  selected = [];
1915
1928
  focused = -1;
1916
1929
  textField;
@@ -1927,14 +1940,21 @@ class ListComponent {
1927
1940
  type = 'list';
1928
1941
  checkboxes = { enabled: false };
1929
1942
  ariaLive;
1943
+ ariaLabel;
1930
1944
  isMultiselect;
1931
1945
  isActionSheetExpanded;
1932
1946
  showStickyHeader;
1933
1947
  rowWidth;
1948
+ columnsWidths;
1934
1949
  customItemTemplate;
1935
1950
  text;
1936
1951
  allowCustom;
1937
1952
  defaultItem;
1953
+ selectAll = false;
1954
+ selectAllText;
1955
+ isAllSelected = false;
1956
+ isPartiallySelected = false;
1957
+ selectAllClick = new EventEmitter();
1938
1958
  set data(data) {
1939
1959
  this._data = data[0]?.header ? data.slice(0) : data;
1940
1960
  if (this.dataService.grouped) {
@@ -1955,12 +1975,12 @@ class ListComponent {
1955
1975
  }
1956
1976
  set size(size) {
1957
1977
  if (this.type === 'list') {
1958
- this.renderer.removeClass(this.wrapper.nativeElement, getSizeClass('list', this.size));
1978
+ this.renderer.removeClass(this.wrapper.nativeElement, getSizeClass('list', this._size));
1959
1979
  if (size) {
1960
1980
  this.renderer.addClass(this.wrapper.nativeElement, getSizeClass('list', size));
1961
1981
  }
1962
- this._size = size;
1963
1982
  }
1983
+ this._size = size;
1964
1984
  }
1965
1985
  get size() {
1966
1986
  return this._size;
@@ -1992,6 +2012,7 @@ class ListComponent {
1992
2012
  scrollSubscription;
1993
2013
  selectSubscription;
1994
2014
  _size;
2015
+ selectAllCheckboxState = false;
1995
2016
  get pageSize() {
1996
2017
  if (this.virtual.pageSize) {
1997
2018
  return this.virtual.pageSize;
@@ -2021,8 +2042,14 @@ class ListComponent {
2021
2042
  get checkboxClasses() {
2022
2043
  return `${this.size ? getSizeClass('checkbox', this.size) : ''} ${this.rounded ? getRoundedClass(this.rounded) : ''}`;
2023
2044
  }
2045
+ /**
2046
+ * @hidden
2047
+ */
2048
+ isSelectAllFocused() {
2049
+ return this.selectionService.isFocused(-2);
2050
+ }
2024
2051
  /* tslint:disable:member-ordering */
2025
- constructor(dataService, wrapper, selectionService, disabledItemsService, cdr, zone, renderer, localization) {
2052
+ constructor(dataService, wrapper, selectionService, disabledItemsService, cdr, zone, renderer, localization, injector) {
2026
2053
  this.dataService = dataService;
2027
2054
  this.wrapper = wrapper;
2028
2055
  this.selectionService = selectionService;
@@ -2031,12 +2058,14 @@ class ListComponent {
2031
2058
  this.zone = zone;
2032
2059
  this.renderer = renderer;
2033
2060
  this.localization = localization;
2061
+ this.injector = injector;
2034
2062
  this.selectSubscription = merge(this.selectionService.onSelect.pipe(map((args) => args.indices[0])), this.selectionService.onFocus)
2035
2063
  .pipe(
2036
2064
  // handle only the very last onSelect/onFocus emission
2037
2065
  switchMap(event => this.zone.onStable.pipe(take(1), map(() => event))))
2038
2066
  .subscribe(this.scrollToItem.bind(this));
2039
2067
  this.prepareClasses();
2068
+ this.initSelectAllCheckboxState();
2040
2069
  }
2041
2070
  ngOnChanges(changes) {
2042
2071
  if (isChanged('data', changes, false)) {
@@ -2052,6 +2081,9 @@ class ListComponent {
2052
2081
  if (isChanged('type', changes, false)) {
2053
2082
  this.prepareClasses();
2054
2083
  }
2084
+ if (isChanged('isAllSelected', changes, false) || isChanged('isPartiallySelected', changes, false)) {
2085
+ this.updateSelectAllCheckboxState();
2086
+ }
2055
2087
  }
2056
2088
  ngAfterViewInit() {
2057
2089
  this.setComponentClasses();
@@ -2081,8 +2113,8 @@ class ListComponent {
2081
2113
  this.scrollSubscription.unsubscribe();
2082
2114
  }
2083
2115
  }
2084
- onCheckedChange(e, index) {
2085
- const isChecked = e.target['checked'];
2116
+ onCheckboxStateChange(state, index) {
2117
+ const isChecked = state === true;
2086
2118
  if (isChecked && !this.selectionService.isSelected(index)) {
2087
2119
  this.selectionService.add(index);
2088
2120
  }
@@ -2090,6 +2122,13 @@ class ListComponent {
2090
2122
  this.selectionService.deselect(index);
2091
2123
  }
2092
2124
  }
2125
+ handleSelectAllClick() {
2126
+ const newState = !this.isAllSelected;
2127
+ this.selectAllClick.emit(newState);
2128
+ }
2129
+ handleSelectAllStateChange(state) {
2130
+ this.selectAllClick.emit(state);
2131
+ }
2093
2132
  prepareClasses() {
2094
2133
  if (this.type === 'list') {
2095
2134
  this.listContentClass = 'k-list-content';
@@ -2273,6 +2312,10 @@ class ListComponent {
2273
2312
  isItemSelected(index) {
2274
2313
  return this.selectionService.isSelected(index) || null;
2275
2314
  }
2315
+ itemAriaSelected(index) {
2316
+ const selected = this.isItemSelected(index);
2317
+ return this.type === 'list' ? (selected ?? false) : selected;
2318
+ }
2276
2319
  get isDisabledDefaultItem() {
2277
2320
  return this.disabledItemsService.isItemDisabled(this.defaultItem);
2278
2321
  }
@@ -2284,8 +2327,10 @@ class ListComponent {
2284
2327
  */
2285
2328
  setOverflow() {
2286
2329
  if (this.virtual) {
2287
- const overflow = this.hasVirtualScrollbar() ? 'scroll' : 'hidden';
2288
- this.renderer.setStyle(this.content.nativeElement, 'overflow-y', overflow);
2330
+ afterNextRender(() => {
2331
+ const overflow = this.hasVirtualScrollbar() ? 'scroll' : 'hidden';
2332
+ this.renderer.setStyle(this.content.nativeElement, 'overflow-y', overflow);
2333
+ }, { injector: this.injector });
2289
2334
  }
2290
2335
  }
2291
2336
  /**
@@ -2299,7 +2344,7 @@ class ListComponent {
2299
2344
  positionItems() {
2300
2345
  this.items.forEach((item, index) => {
2301
2346
  const offsetY = (index + this.startFrom) * this.virtual.itemHeight;
2302
- this.renderer.setStyle(item.element.nativeElement, "transform", `translateY(${offsetY}px`);
2347
+ this.renderer.setStyle(item.element.nativeElement, "transform", `translateY(${offsetY}px)`);
2303
2348
  });
2304
2349
  }
2305
2350
  setComponentClasses() {
@@ -2311,13 +2356,57 @@ class ListComponent {
2311
2356
  }
2312
2357
  if (this.type === 'dropdowngrid') {
2313
2358
  this.renderer.setStyle(this.wrapper.nativeElement, 'overflow-y', 'scroll');
2359
+ if (this.size) {
2360
+ this.renderer.removeClass(this.wrapper.nativeElement, getSizeClass('list', this.size));
2361
+ }
2314
2362
  }
2315
2363
  if (isPresent(this.virtual)) {
2316
2364
  this.renderer.addClass(this.wrapper.nativeElement, this.listVirtualClass);
2317
2365
  }
2318
2366
  }
2319
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ListComponent, deps: [{ token: DataService }, { token: i0.ElementRef }, { token: SelectionService }, { token: DisabledItemsService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
2320
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ListComponent, isStandalone: true, selector: "kendo-list", inputs: { selected: "selected", focused: "focused", textField: "textField", valueField: "valueField", height: "height", template: "template", groupTemplate: "groupTemplate", fixedGroupTemplate: "fixedGroupTemplate", show: "show", id: "id", optionPrefix: "optionPrefix", multipleSelection: "multipleSelection", virtual: "virtual", type: "type", checkboxes: "checkboxes", ariaLive: "ariaLive", isMultiselect: "isMultiselect", isActionSheetExpanded: "isActionSheetExpanded", showStickyHeader: "showStickyHeader", rowWidth: "rowWidth", customItemTemplate: "customItemTemplate", text: "text", allowCustom: "allowCustom", defaultItem: "defaultItem", data: "data", size: "size", rounded: "rounded" }, outputs: { onClick: "onClick", pageChange: "pageChange", listResize: "listResize", popupListScroll: "popupListScroll" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }, { propertyName: "list", first: true, predicate: ["list"], descendants: true }, { propertyName: "virtualContainer", first: true, predicate: ["virtualContainer"], descendants: true }, { propertyName: "items", predicate: ListItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
2367
+ updateSelectAllCheckboxState() {
2368
+ if (this.isAllSelected) {
2369
+ this.selectAllCheckboxState = true;
2370
+ }
2371
+ else if (this.isPartiallySelected) {
2372
+ this.selectAllCheckboxState = 'indeterminate';
2373
+ }
2374
+ else {
2375
+ this.selectAllCheckboxState = false;
2376
+ }
2377
+ }
2378
+ initSelectAllCheckboxState() {
2379
+ this.updateSelectAllCheckboxState();
2380
+ }
2381
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ListComponent, deps: [{ token: DataService }, { token: i0.ElementRef }, { token: SelectionService }, { token: DisabledItemsService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
2382
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: ListComponent, isStandalone: true, selector: "kendo-list", inputs: { selected: "selected", focused: "focused", textField: "textField", valueField: "valueField", height: "height", template: "template", groupTemplate: "groupTemplate", fixedGroupTemplate: "fixedGroupTemplate", show: "show", id: "id", optionPrefix: "optionPrefix", multipleSelection: "multipleSelection", virtual: "virtual", type: "type", checkboxes: "checkboxes", ariaLive: "ariaLive", ariaLabel: "ariaLabel", isMultiselect: "isMultiselect", isActionSheetExpanded: "isActionSheetExpanded", showStickyHeader: "showStickyHeader", rowWidth: "rowWidth", columnsWidths: "columnsWidths", customItemTemplate: "customItemTemplate", text: "text", allowCustom: "allowCustom", defaultItem: "defaultItem", selectAll: "selectAll", selectAllText: "selectAllText", isAllSelected: "isAllSelected", isPartiallySelected: "isPartiallySelected", data: "data", size: "size", rounded: "rounded" }, outputs: { selectAllClick: "selectAllClick", onClick: "onClick", pageChange: "pageChange", listResize: "listResize", popupListScroll: "popupListScroll" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }, { propertyName: "list", first: true, predicate: ["list"], descendants: true }, { propertyName: "virtualContainer", first: true, predicate: ["virtualContainer"], descendants: true }, { propertyName: "items", predicate: ListItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
2383
+ @if (selectAll) {
2384
+ <div class="k-list-sticky-header">
2385
+ <div
2386
+ class="k-list-sticky-header-item"
2387
+ [class.k-selected]="!checkboxes.enabled && isAllSelected"
2388
+ [class.k-focus]="isSelectAllFocused()"
2389
+ kendoDropDownsSelectable
2390
+ [checkboxes]="checkboxes"
2391
+ [index]="-2"
2392
+ tabindex="0"
2393
+ [attr.aria-selected]="isAllSelected"
2394
+ [attr.aria-label]="selectAllText"
2395
+ (click)="handleSelectAllClick()">
2396
+ @if (checkboxes.enabled) {
2397
+ <kendo-checkbox
2398
+ [checkedState]="selectAllCheckboxState"
2399
+ [ngClass]="checkboxClasses"
2400
+ [inputAttributes]="{ 'aria-label': selectAllText }"
2401
+ (click)="$event.stopPropagation()"
2402
+ (checkedStateChange)="handleSelectAllStateChange($event)"
2403
+ >
2404
+ </kendo-checkbox>
2405
+ }
2406
+ <span class="k-list-item-text">{{ selectAllText }}</span>
2407
+ </div>
2408
+ </div>
2409
+ }
2321
2410
  @if (defaultItem && !template) {
2322
2411
  <div
2323
2412
  class="k-list-optionlabel"
@@ -2387,11 +2476,12 @@ class ListComponent {
2387
2476
  [style.maxHeight.px]="height"
2388
2477
  unselectable="on"
2389
2478
  (scroll)="popupListScroll.emit($event)"
2390
- [attr.role]="dataService.grouped ? 'listbox' : null"
2391
- [attr.id]="dataService.grouped ? id : null"
2392
- [attr.aria-live]="dataService.grouped ? ariaLive : null"
2393
- [attr.aria-multiselectable]="dataService.grouped ? isMultiselect : null"
2394
- [attr.aria-hidden]="dataService.grouped ? !show : null"
2479
+ [attr.role]="(dataService.grouped && type === 'list') ? 'listbox' : null"
2480
+ [attr.id]="(dataService.grouped && type === 'list') ? id : null"
2481
+ [attr.aria-live]="(dataService.grouped && type === 'list') ? ariaLive : null"
2482
+ [attr.aria-multiselectable]="(dataService.grouped && type === 'list') ? isMultiselect : null"
2483
+ [attr.aria-hidden]="(dataService.grouped && type === 'list') ? (!show ? true : null) : null"
2484
+ [attr.aria-label]="(dataService.grouped && type === 'list') ? (ariaLabel || null) : null"
2395
2485
  >
2396
2486
  @if (!dataService.grouped) {
2397
2487
  <ul #list
@@ -2400,7 +2490,8 @@ class ListComponent {
2400
2490
  [attr.id]="id"
2401
2491
  [attr.aria-live]="ariaLive"
2402
2492
  [attr.aria-multiselectable]="isMultiselect"
2403
- [attr.aria-hidden]="!show">
2493
+ [attr.aria-hidden]="!show ? true : null"
2494
+ [attr.aria-label]="ariaLabel || null">
2404
2495
  @for (dataItem of data; track $index; let itemIndex = $index) {
2405
2496
  <li
2406
2497
  role="option"
@@ -2411,7 +2502,7 @@ class ListComponent {
2411
2502
  [multipleSelection]="multipleSelection"
2412
2503
  [attr.id]="optionPrefix + '-' + itemIndex"
2413
2504
  [attr.tabIndex]="-1"
2414
- [attr.aria-selected]="isItemSelected(itemIndex)"
2505
+ [attr.aria-selected]="itemAriaSelected(itemIndex)"
2415
2506
  [class]="listItemClass"
2416
2507
  [ngClass]="{
2417
2508
  'k-disabled': isDisabled(itemIndex),
@@ -2420,15 +2511,14 @@ class ListComponent {
2420
2511
  [style.width.px]="rowWidth ?? null"
2421
2512
  >
2422
2513
  @if (checkboxes.enabled) {
2423
- <input
2424
- type="checkbox"
2425
- class="k-checkbox"
2514
+ <kendo-checkbox
2515
+ [checkedState]="isChecked(itemIndex)"
2426
2516
  role="presentation"
2427
- tabindex="-1"
2517
+ [tabindex]="-1"
2428
2518
  [ngClass]="checkboxClasses"
2429
- (change)="onCheckedChange($event, itemIndex + startFrom)"
2430
- [checked]="isChecked(itemIndex)"
2431
- />
2519
+ (checkedStateChange)="onCheckboxStateChange($event, itemIndex + startFrom)"
2520
+ >
2521
+ </kendo-checkbox>
2432
2522
  }
2433
2523
  @if (template) {
2434
2524
  <ng-template
@@ -2452,7 +2542,7 @@ class ListComponent {
2452
2542
  </ul>
2453
2543
  }
2454
2544
 
2455
- @if (dataService.grouped) {
2545
+ @if (dataService.grouped && type === 'list') {
2456
2546
  <ng-container #list>
2457
2547
  @for (dataItem of groupedData; track dataItem.groupIndex) {
2458
2548
  <ul
@@ -2499,7 +2589,7 @@ class ListComponent {
2499
2589
  [attr.absolute-index]="item.index"
2500
2590
  [attr.id]="optionPrefix + '-' + (item.index - 1 - item.groupIndex)"
2501
2591
  [attr.tabIndex]="-1"
2502
- [attr.aria-selected]="isItemSelected(item.offsetIndex)"
2592
+ [attr.aria-selected]="itemAriaSelected(item.offsetIndex)"
2503
2593
  [class]="listItemClass"
2504
2594
  [ngClass]="{
2505
2595
  'k-disabled': isDisabled(item.offsetIndex),
@@ -2529,21 +2619,130 @@ class ListComponent {
2529
2619
  }
2530
2620
  </ng-container>
2531
2621
  }
2622
+
2623
+ @if (dataService.grouped && type === 'dropdowngrid') {
2624
+ <ul #list
2625
+ [attr.role]="'listbox'"
2626
+ [class]="listClass"
2627
+ [attr.id]="id"
2628
+ [attr.aria-live]="ariaLive"
2629
+ [attr.aria-label]="ariaLabel || null">
2630
+ @if (columnsWidths?.length) {
2631
+ <div
2632
+ role="presentation"
2633
+ aria-hidden="true"
2634
+ [style.display]="'table-column-group'"
2635
+ >
2636
+ @for (columnWidth of columnsWidths; track $index) {
2637
+ <div [style.display]="'table-column'" [style.width.px]="columnWidth ?? null"></div>
2638
+ }
2639
+ </div>
2640
+ }
2641
+ @for (dataItem of groupedData; track dataItem.groupIndex) {
2642
+ @if (dataItem.header) {
2643
+ <li
2644
+ role="presentation"
2645
+ [class]="listGroupItemClass"
2646
+ [attr.group-index]="dataItem.index"
2647
+ [style.width.px]="rowWidth ?? null"
2648
+ >
2649
+ <span [class]="listGroupItemTextClass">
2650
+ @if (groupTemplate) {
2651
+ <ng-template
2652
+ [templateContext]="{
2653
+ templateRef: groupTemplate.templateRef,
2654
+ $implicit: dataItem.value
2655
+ }">
2656
+ </ng-template>
2657
+ }
2658
+ @if (!groupTemplate) {
2659
+ {{ dataItem.value }}
2660
+ }
2661
+ </span>
2662
+ </li>
2663
+ }
2664
+ @for (item of dataItem.items; track item.offsetIndex) {
2665
+ <li
2666
+ role="option"
2667
+ kendoDropDownsSelectable
2668
+ [height]="virtual?.itemHeight"
2669
+ [index]="item.offsetIndex"
2670
+ [multipleSelection]="multipleSelection"
2671
+ [attr.absolute-index]="item.index"
2672
+ [attr.id]="optionPrefix + '-' + (item.index - 1 - item.groupIndex)"
2673
+ [attr.tabIndex]="-1"
2674
+ [attr.aria-selected]="itemAriaSelected(item.offsetIndex)"
2675
+ [class]="listItemClass"
2676
+ [ngClass]="{
2677
+ 'k-disabled': isDisabled(item.offsetIndex),
2678
+ 'k-table-alt-row': isAltRow(item.index - 1)
2679
+ }"
2680
+ [style.width.px]="rowWidth ?? null">
2681
+ @if (template) {
2682
+ <ng-template
2683
+ [templateContext]="{
2684
+ templateRef: template.templateRef,
2685
+ $implicit: item.value
2686
+ }">
2687
+ </ng-template>
2688
+ }
2689
+ @if (!template) {
2690
+ <span class="k-list-item-text">{{ getText(item.value) }}</span>
2691
+ }
2692
+ </li>
2693
+ }
2694
+ }
2695
+ @if (!virtual) {
2696
+ <kendo-resize-sensor
2697
+ (resize)="listResize.emit()"
2698
+ >
2699
+ </kendo-resize-sensor>
2700
+ }
2701
+ </ul>
2702
+ }
2532
2703
  @if (virtual) {
2533
- <div #virtualContainer class="k-height-container" role="presentation">
2704
+ <div #virtualContainer class="k-height-container">
2534
2705
  <div [style.height.px]="scrollHeight">
2535
2706
  <kendo-resize-sensor (resize)="listResize.emit()"></kendo-resize-sensor>
2536
2707
  </div>
2537
2708
  </div>
2538
2709
  }
2539
2710
  </div>
2540
- `, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: ListItemDirective, selector: "\"li[role=option], li[role=group], li[role=presentation]\"" }, { kind: "directive", type: SelectableDirective, selector: "[kendoDropDownsSelectable]", inputs: ["index", "checkboxes", "height", "isMultiselect", "multipleSelection"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
2711
+ <ng-content select=".k-no-data"></ng-content>
2712
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: ListItemDirective, selector: "\"li[role=option], li[role=group], li[role=presentation]\"" }, { kind: "directive", type: SelectableDirective, selector: "[kendoDropDownsSelectable]", inputs: ["index", "checkboxes", "height", "isMultiselect", "multipleSelection"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }] });
2541
2713
  }
2542
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ListComponent, decorators: [{
2714
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ListComponent, decorators: [{
2543
2715
  type: Component,
2544
2716
  args: [{
2545
2717
  selector: 'kendo-list',
2546
2718
  template: `
2719
+ @if (selectAll) {
2720
+ <div class="k-list-sticky-header">
2721
+ <div
2722
+ class="k-list-sticky-header-item"
2723
+ [class.k-selected]="!checkboxes.enabled && isAllSelected"
2724
+ [class.k-focus]="isSelectAllFocused()"
2725
+ kendoDropDownsSelectable
2726
+ [checkboxes]="checkboxes"
2727
+ [index]="-2"
2728
+ tabindex="0"
2729
+ [attr.aria-selected]="isAllSelected"
2730
+ [attr.aria-label]="selectAllText"
2731
+ (click)="handleSelectAllClick()">
2732
+ @if (checkboxes.enabled) {
2733
+ <kendo-checkbox
2734
+ [checkedState]="selectAllCheckboxState"
2735
+ [ngClass]="checkboxClasses"
2736
+ [inputAttributes]="{ 'aria-label': selectAllText }"
2737
+ (click)="$event.stopPropagation()"
2738
+ (checkedStateChange)="handleSelectAllStateChange($event)"
2739
+ >
2740
+ </kendo-checkbox>
2741
+ }
2742
+ <span class="k-list-item-text">{{ selectAllText }}</span>
2743
+ </div>
2744
+ </div>
2745
+ }
2547
2746
  @if (defaultItem && !template) {
2548
2747
  <div
2549
2748
  class="k-list-optionlabel"
@@ -2613,11 +2812,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2613
2812
  [style.maxHeight.px]="height"
2614
2813
  unselectable="on"
2615
2814
  (scroll)="popupListScroll.emit($event)"
2616
- [attr.role]="dataService.grouped ? 'listbox' : null"
2617
- [attr.id]="dataService.grouped ? id : null"
2618
- [attr.aria-live]="dataService.grouped ? ariaLive : null"
2619
- [attr.aria-multiselectable]="dataService.grouped ? isMultiselect : null"
2620
- [attr.aria-hidden]="dataService.grouped ? !show : null"
2815
+ [attr.role]="(dataService.grouped && type === 'list') ? 'listbox' : null"
2816
+ [attr.id]="(dataService.grouped && type === 'list') ? id : null"
2817
+ [attr.aria-live]="(dataService.grouped && type === 'list') ? ariaLive : null"
2818
+ [attr.aria-multiselectable]="(dataService.grouped && type === 'list') ? isMultiselect : null"
2819
+ [attr.aria-hidden]="(dataService.grouped && type === 'list') ? (!show ? true : null) : null"
2820
+ [attr.aria-label]="(dataService.grouped && type === 'list') ? (ariaLabel || null) : null"
2621
2821
  >
2622
2822
  @if (!dataService.grouped) {
2623
2823
  <ul #list
@@ -2626,7 +2826,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2626
2826
  [attr.id]="id"
2627
2827
  [attr.aria-live]="ariaLive"
2628
2828
  [attr.aria-multiselectable]="isMultiselect"
2629
- [attr.aria-hidden]="!show">
2829
+ [attr.aria-hidden]="!show ? true : null"
2830
+ [attr.aria-label]="ariaLabel || null">
2630
2831
  @for (dataItem of data; track $index; let itemIndex = $index) {
2631
2832
  <li
2632
2833
  role="option"
@@ -2637,7 +2838,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2637
2838
  [multipleSelection]="multipleSelection"
2638
2839
  [attr.id]="optionPrefix + '-' + itemIndex"
2639
2840
  [attr.tabIndex]="-1"
2640
- [attr.aria-selected]="isItemSelected(itemIndex)"
2841
+ [attr.aria-selected]="itemAriaSelected(itemIndex)"
2641
2842
  [class]="listItemClass"
2642
2843
  [ngClass]="{
2643
2844
  'k-disabled': isDisabled(itemIndex),
@@ -2646,15 +2847,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2646
2847
  [style.width.px]="rowWidth ?? null"
2647
2848
  >
2648
2849
  @if (checkboxes.enabled) {
2649
- <input
2650
- type="checkbox"
2651
- class="k-checkbox"
2850
+ <kendo-checkbox
2851
+ [checkedState]="isChecked(itemIndex)"
2652
2852
  role="presentation"
2653
- tabindex="-1"
2853
+ [tabindex]="-1"
2654
2854
  [ngClass]="checkboxClasses"
2655
- (change)="onCheckedChange($event, itemIndex + startFrom)"
2656
- [checked]="isChecked(itemIndex)"
2657
- />
2855
+ (checkedStateChange)="onCheckboxStateChange($event, itemIndex + startFrom)"
2856
+ >
2857
+ </kendo-checkbox>
2658
2858
  }
2659
2859
  @if (template) {
2660
2860
  <ng-template
@@ -2678,7 +2878,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2678
2878
  </ul>
2679
2879
  }
2680
2880
 
2681
- @if (dataService.grouped) {
2881
+ @if (dataService.grouped && type === 'list') {
2682
2882
  <ng-container #list>
2683
2883
  @for (dataItem of groupedData; track dataItem.groupIndex) {
2684
2884
  <ul
@@ -2725,7 +2925,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2725
2925
  [attr.absolute-index]="item.index"
2726
2926
  [attr.id]="optionPrefix + '-' + (item.index - 1 - item.groupIndex)"
2727
2927
  [attr.tabIndex]="-1"
2728
- [attr.aria-selected]="isItemSelected(item.offsetIndex)"
2928
+ [attr.aria-selected]="itemAriaSelected(item.offsetIndex)"
2729
2929
  [class]="listItemClass"
2730
2930
  [ngClass]="{
2731
2931
  'k-disabled': isDisabled(item.offsetIndex),
@@ -2755,19 +2955,101 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2755
2955
  }
2756
2956
  </ng-container>
2757
2957
  }
2958
+
2959
+ @if (dataService.grouped && type === 'dropdowngrid') {
2960
+ <ul #list
2961
+ [attr.role]="'listbox'"
2962
+ [class]="listClass"
2963
+ [attr.id]="id"
2964
+ [attr.aria-live]="ariaLive"
2965
+ [attr.aria-label]="ariaLabel || null">
2966
+ @if (columnsWidths?.length) {
2967
+ <div
2968
+ role="presentation"
2969
+ aria-hidden="true"
2970
+ [style.display]="'table-column-group'"
2971
+ >
2972
+ @for (columnWidth of columnsWidths; track $index) {
2973
+ <div [style.display]="'table-column'" [style.width.px]="columnWidth ?? null"></div>
2974
+ }
2975
+ </div>
2976
+ }
2977
+ @for (dataItem of groupedData; track dataItem.groupIndex) {
2978
+ @if (dataItem.header) {
2979
+ <li
2980
+ role="presentation"
2981
+ [class]="listGroupItemClass"
2982
+ [attr.group-index]="dataItem.index"
2983
+ [style.width.px]="rowWidth ?? null"
2984
+ >
2985
+ <span [class]="listGroupItemTextClass">
2986
+ @if (groupTemplate) {
2987
+ <ng-template
2988
+ [templateContext]="{
2989
+ templateRef: groupTemplate.templateRef,
2990
+ $implicit: dataItem.value
2991
+ }">
2992
+ </ng-template>
2993
+ }
2994
+ @if (!groupTemplate) {
2995
+ {{ dataItem.value }}
2996
+ }
2997
+ </span>
2998
+ </li>
2999
+ }
3000
+ @for (item of dataItem.items; track item.offsetIndex) {
3001
+ <li
3002
+ role="option"
3003
+ kendoDropDownsSelectable
3004
+ [height]="virtual?.itemHeight"
3005
+ [index]="item.offsetIndex"
3006
+ [multipleSelection]="multipleSelection"
3007
+ [attr.absolute-index]="item.index"
3008
+ [attr.id]="optionPrefix + '-' + (item.index - 1 - item.groupIndex)"
3009
+ [attr.tabIndex]="-1"
3010
+ [attr.aria-selected]="itemAriaSelected(item.offsetIndex)"
3011
+ [class]="listItemClass"
3012
+ [ngClass]="{
3013
+ 'k-disabled': isDisabled(item.offsetIndex),
3014
+ 'k-table-alt-row': isAltRow(item.index - 1)
3015
+ }"
3016
+ [style.width.px]="rowWidth ?? null">
3017
+ @if (template) {
3018
+ <ng-template
3019
+ [templateContext]="{
3020
+ templateRef: template.templateRef,
3021
+ $implicit: item.value
3022
+ }">
3023
+ </ng-template>
3024
+ }
3025
+ @if (!template) {
3026
+ <span class="k-list-item-text">{{ getText(item.value) }}</span>
3027
+ }
3028
+ </li>
3029
+ }
3030
+ }
3031
+ @if (!virtual) {
3032
+ <kendo-resize-sensor
3033
+ (resize)="listResize.emit()"
3034
+ >
3035
+ </kendo-resize-sensor>
3036
+ }
3037
+ </ul>
3038
+ }
2758
3039
  @if (virtual) {
2759
- <div #virtualContainer class="k-height-container" role="presentation">
3040
+ <div #virtualContainer class="k-height-container">
2760
3041
  <div [style.height.px]="scrollHeight">
2761
3042
  <kendo-resize-sensor (resize)="listResize.emit()"></kendo-resize-sensor>
2762
3043
  </div>
2763
3044
  </div>
2764
3045
  }
2765
3046
  </div>
3047
+ <ng-content select=".k-no-data"></ng-content>
2766
3048
  `,
2767
3049
  standalone: true,
2768
- imports: [NgStyle, TemplateContextDirective, ListItemDirective, SelectableDirective, NgClass, ResizeSensorComponent]
3050
+ imports: [NgStyle, TemplateContextDirective, ListItemDirective, SelectableDirective, NgClass, ResizeSensorComponent, CheckBoxComponent]
2769
3051
  }]
2770
- }], ctorParameters: () => [{ type: DataService }, { type: i0.ElementRef }, { type: SelectionService }, { type: DisabledItemsService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i1.LocalizationService }], propDecorators: { selected: [{
3052
+ }], ctorParameters: () => [{ type: DataService }, { type: i0.ElementRef }, { type: SelectionService }, { type: DisabledItemsService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i1.LocalizationService }, { type: i0.Injector }], propDecorators: { selected: [{
2771
3053
  type: Input
2772
3054
  }], focused: [{
2773
3055
  type: Input
@@ -2799,6 +3081,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2799
3081
  type: Input
2800
3082
  }], ariaLive: [{
2801
3083
  type: Input
3084
+ }], ariaLabel: [{
3085
+ type: Input
2802
3086
  }], isMultiselect: [{
2803
3087
  type: Input
2804
3088
  }], isActionSheetExpanded: [{
@@ -2807,6 +3091,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2807
3091
  type: Input
2808
3092
  }], rowWidth: [{
2809
3093
  type: Input
3094
+ }], columnsWidths: [{
3095
+ type: Input
2810
3096
  }], customItemTemplate: [{
2811
3097
  type: Input
2812
3098
  }], text: [{
@@ -2815,6 +3101,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
2815
3101
  type: Input
2816
3102
  }], defaultItem: [{
2817
3103
  type: Input
3104
+ }], selectAll: [{
3105
+ type: Input
3106
+ }], selectAllText: [{
3107
+ type: Input
3108
+ }], isAllSelected: [{
3109
+ type: Input
3110
+ }], isPartiallySelected: [{
3111
+ type: Input
3112
+ }], selectAllClick: [{
3113
+ type: Output
2818
3114
  }], data: [{
2819
3115
  type: Input
2820
3116
  }], size: [{
@@ -2878,6 +3174,7 @@ class AdaptiveRendererComponent {
2878
3174
  placeholder;
2879
3175
  searchBarValue;
2880
3176
  filterable;
3177
+ showListContainer = true;
2881
3178
  closePopup = new EventEmitter();
2882
3179
  textInputChange = new EventEmitter();
2883
3180
  navigate = new EventEmitter();
@@ -2890,6 +3187,7 @@ class AdaptiveRendererComponent {
2890
3187
  }
2891
3188
  animationDuration = animationDuration;
2892
3189
  checkIcon = checkIcon;
3190
+ searchIcon = searchIcon;
2893
3191
  expanded = false;
2894
3192
  messageFor(key) {
2895
3193
  return this.localization.get(key);
@@ -2914,8 +3212,8 @@ class AdaptiveRendererComponent {
2914
3212
  get windowSize() {
2915
3213
  return this.adaptiveService.size;
2916
3214
  }
2917
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdaptiveRendererComponent, deps: [{ token: i1.LocalizationService }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
2918
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AdaptiveRendererComponent, isStandalone: true, selector: "kendo-adaptive-renderer", inputs: { title: "title", subtitle: "subtitle", showTextInput: "showTextInput", sharedPopupActionSheetTemplate: "sharedPopupActionSheetTemplate", text: "text", placeholder: "placeholder", searchBarValue: "searchBarValue", filterable: "filterable" }, outputs: { closePopup: "closePopup", textInputChange: "textInputChange", navigate: "navigate", onExpand: "onExpand" }, viewQueries: [{ propertyName: "actionSheet", first: true, predicate: ActionSheetComponent, descendants: true }, { propertyName: "actionSheetSearchBar", first: true, predicate: ["actionSheetSearchBar"], descendants: true }], ngImport: i0, template: `
3215
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: AdaptiveRendererComponent, deps: [{ token: i1.LocalizationService }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
3216
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: AdaptiveRendererComponent, isStandalone: true, selector: "kendo-adaptive-renderer", inputs: { title: "title", subtitle: "subtitle", showTextInput: "showTextInput", sharedPopupActionSheetTemplate: "sharedPopupActionSheetTemplate", text: "text", placeholder: "placeholder", searchBarValue: "searchBarValue", filterable: "filterable", showListContainer: "showListContainer" }, outputs: { closePopup: "closePopup", textInputChange: "textInputChange", navigate: "navigate", onExpand: "onExpand" }, viewQueries: [{ propertyName: "actionSheet", first: true, predicate: ActionSheetComponent, descendants: true }, { propertyName: "actionSheetSearchBar", first: true, predicate: ["actionSheetSearchBar"], descendants: true }], ngImport: i0, template: `
2919
3217
  <kendo-actionsheet
2920
3218
  #actionSheet
2921
3219
  [animation]="{ duration: animationDuration }"
@@ -2934,7 +3232,7 @@ class AdaptiveRendererComponent {
2934
3232
  (collapse)="closePopup.emit()"
2935
3233
  >
2936
3234
  <ng-template kendoActionSheetTemplate>
2937
- <div class="k-text-center k-actionsheet-titlebar">
3235
+ <div class="k-actionsheet-titlebar">
2938
3236
  <div class="k-actionsheet-titlebar-group">
2939
3237
  <div class="k-actionsheet-title">
2940
3238
  @if (title) {
@@ -2950,6 +3248,7 @@ class AdaptiveRendererComponent {
2950
3248
  icon="check"
2951
3249
  type="button"
2952
3250
  [attr.title]="messageFor('adaptiveCloseButtonTitle')"
3251
+ [attr.aria-label]="messageFor('adaptiveCloseButtonTitle')"
2953
3252
  [svgIcon]="checkIcon"
2954
3253
  fillMode="flat"
2955
3254
  themeColor="primary"
@@ -2967,13 +3266,13 @@ class AdaptiveRendererComponent {
2967
3266
  [value]="searchBarValue || ''"
2968
3267
  size="large"
2969
3268
  [placeholder]="filterable ? messageFor('filterInputPlaceholder') : placeholder"
2970
- class="k-searchbox"
3269
+ [inputAttributes]="{'aria-label': title}"
2971
3270
  autocomplete="off"
2972
3271
  (valueChange)="onValueChange($event)"
2973
3272
  >
2974
3273
  @if (filterable) {
2975
3274
  <ng-template kendoTextBoxPrefixTemplate>
2976
- <kendo-icon name="search"></kendo-icon>
3275
+ <kendo-icon-wrapper name="search" [svgIcon]="searchIcon"></kendo-icon-wrapper>
2977
3276
  </ng-template>
2978
3277
  }
2979
3278
  </kendo-textbox>
@@ -2981,15 +3280,19 @@ class AdaptiveRendererComponent {
2981
3280
  }
2982
3281
  </div>
2983
3282
  <div class="k-actionsheet-content">
3283
+ @if (showListContainer) {
2984
3284
  <div class="k-list-container">
2985
3285
  <ng-container *ngTemplateOutlet="sharedPopupActionSheetTemplate"></ng-container>
2986
3286
  </div>
3287
+ } @else {
3288
+ <ng-container *ngTemplateOutlet="sharedPopupActionSheetTemplate"></ng-container>
3289
+ }
2987
3290
  </div>
2988
3291
  </ng-template>
2989
3292
  </kendo-actionsheet>
2990
- `, isInline: true, dependencies: [{ kind: "component", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: ["actions", "actionsLayout", "overlayClickClose", "title", "subtitle", "items", "cssClass", "cssStyle", "animation", "expanded", "titleId", "initialFocus"], outputs: ["expandedChange", "action", "expand", "collapse", "itemClick", "overlayClick"], exportAs: ["kendoActionSheet"] }, { kind: "directive", type: ActionSheetTemplateDirective, selector: "[kendoActionSheetTemplate]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: TextBoxPrefixTemplateDirective, selector: "[kendoTextBoxPrefixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: IconComponent, selector: "kendo-icon", inputs: ["name"], exportAs: ["kendoIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
3293
+ `, isInline: true, dependencies: [{ kind: "component", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: ["actions", "actionsLayout", "overlayClickClose", "title", "subtitle", "items", "cssClass", "cssStyle", "animation", "expanded", "titleId", "initialFocus"], outputs: ["expandedChange", "action", "expand", "collapse", "itemClick", "overlayClick"], exportAs: ["kendoActionSheet"] }, { kind: "directive", type: ActionSheetTemplateDirective, selector: "[kendoActionSheetTemplate]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: TextBoxPrefixTemplateDirective, selector: "[kendoTextBoxPrefixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
2991
3294
  }
2992
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdaptiveRendererComponent, decorators: [{
3295
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: AdaptiveRendererComponent, decorators: [{
2993
3296
  type: Component,
2994
3297
  args: [{
2995
3298
  selector: 'kendo-adaptive-renderer',
@@ -3012,7 +3315,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
3012
3315
  (collapse)="closePopup.emit()"
3013
3316
  >
3014
3317
  <ng-template kendoActionSheetTemplate>
3015
- <div class="k-text-center k-actionsheet-titlebar">
3318
+ <div class="k-actionsheet-titlebar">
3016
3319
  <div class="k-actionsheet-titlebar-group">
3017
3320
  <div class="k-actionsheet-title">
3018
3321
  @if (title) {
@@ -3028,6 +3331,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
3028
3331
  icon="check"
3029
3332
  type="button"
3030
3333
  [attr.title]="messageFor('adaptiveCloseButtonTitle')"
3334
+ [attr.aria-label]="messageFor('adaptiveCloseButtonTitle')"
3031
3335
  [svgIcon]="checkIcon"
3032
3336
  fillMode="flat"
3033
3337
  themeColor="primary"
@@ -3045,13 +3349,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
3045
3349
  [value]="searchBarValue || ''"
3046
3350
  size="large"
3047
3351
  [placeholder]="filterable ? messageFor('filterInputPlaceholder') : placeholder"
3048
- class="k-searchbox"
3352
+ [inputAttributes]="{'aria-label': title}"
3049
3353
  autocomplete="off"
3050
3354
  (valueChange)="onValueChange($event)"
3051
3355
  >
3052
3356
  @if (filterable) {
3053
3357
  <ng-template kendoTextBoxPrefixTemplate>
3054
- <kendo-icon name="search"></kendo-icon>
3358
+ <kendo-icon-wrapper name="search" [svgIcon]="searchIcon"></kendo-icon-wrapper>
3055
3359
  </ng-template>
3056
3360
  }
3057
3361
  </kendo-textbox>
@@ -3059,15 +3363,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
3059
3363
  }
3060
3364
  </div>
3061
3365
  <div class="k-actionsheet-content">
3366
+ @if (showListContainer) {
3062
3367
  <div class="k-list-container">
3063
3368
  <ng-container *ngTemplateOutlet="sharedPopupActionSheetTemplate"></ng-container>
3064
3369
  </div>
3370
+ } @else {
3371
+ <ng-container *ngTemplateOutlet="sharedPopupActionSheetTemplate"></ng-container>
3372
+ }
3065
3373
  </div>
3066
3374
  </ng-template>
3067
3375
  </kendo-actionsheet>
3068
3376
  `,
3069
3377
  standalone: true,
3070
- imports: [ActionSheetComponent, ActionSheetTemplateDirective, ButtonComponent, TextBoxComponent, TextBoxPrefixTemplateDirective, IconComponent, NgTemplateOutlet]
3378
+ imports: [ActionSheetComponent, ActionSheetTemplateDirective, ButtonComponent, TextBoxComponent, TextBoxPrefixTemplateDirective, IconWrapperComponent, NgTemplateOutlet]
3071
3379
  }]
3072
3380
  }], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i7.AdaptiveService }], propDecorators: { title: [{
3073
3381
  type: Input
@@ -3085,6 +3393,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
3085
3393
  type: Input
3086
3394
  }], filterable: [{
3087
3395
  type: Input
3396
+ }], showListContainer: [{
3397
+ type: Input
3088
3398
  }], closePopup: [{
3089
3399
  type: Output
3090
3400
  }], textInputChange: [{
@@ -3183,10 +3493,10 @@ class SharedDropDownEventsDirective {
3183
3493
  ngOnDestroy() {
3184
3494
  this.subscriptions.unsubscribe();
3185
3495
  }
3186
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SharedDropDownEventsDirective, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
3187
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: SharedDropDownEventsDirective, isStandalone: true, selector: "[kendoDropDownSharedEvents]", inputs: { hostElement: "hostElement", clearButtonClicked: "clearButtonClicked", isFocused: "isFocused" }, outputs: { isFocusedChange: "isFocusedChange", onFocus: "onFocus", handleBlur: "handleBlur" }, ngImport: i0 });
3496
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SharedDropDownEventsDirective, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
3497
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: SharedDropDownEventsDirective, isStandalone: true, selector: "[kendoDropDownSharedEvents]", inputs: { hostElement: "hostElement", clearButtonClicked: "clearButtonClicked", isFocused: "isFocused" }, outputs: { isFocusedChange: "isFocusedChange", onFocus: "onFocus", handleBlur: "handleBlur" }, ngImport: i0 });
3188
3498
  }
3189
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SharedDropDownEventsDirective, decorators: [{
3499
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: SharedDropDownEventsDirective, decorators: [{
3190
3500
  type: Directive,
3191
3501
  args: [{
3192
3502
  selector: '[kendoDropDownSharedEvents]',
@@ -3219,15 +3529,19 @@ class Messages extends ComponentMessages {
3219
3529
  */
3220
3530
  clearTitle;
3221
3531
  /**
3222
- * The text displayed for the check-all checkbox.
3532
+ * The text of the Select All item in the popup.
3533
+ */
3534
+ selectAllText;
3535
+ /**
3536
+ * The text of the Check All checkbox label in the tree popup.
3223
3537
  */
3224
3538
  checkAllText;
3225
3539
  /**
3226
- * The text set as aria-label on the select button.
3540
+ * The text set as aria-label on the select button. Available for DropDownList, ComboBox, MultiColumnComboBox, and DropDownTree.
3227
3541
  */
3228
3542
  selectButtonText;
3229
3543
  /**
3230
- * The text set as aria-label on the list filter input.
3544
+ * The text set as aria-label on the list filter input. Available for DropDownList, DropDownTree, and MultiSelectTree.
3231
3545
  */
3232
3546
  filterInputLabel;
3233
3547
  /**
@@ -3239,11 +3553,15 @@ class Messages extends ComponentMessages {
3239
3553
  */
3240
3554
  adaptiveCloseButtonTitle;
3241
3555
  /**
3242
- * The text for the input's placeholder when filtering is enabled.
3556
+ * The text for the input's placeholder when filtering is enabled. Available for DropDownTree and MultiSelectTree.
3243
3557
  */
3244
3558
  filterInputPlaceholder;
3245
3559
  /**
3246
- * The text displayed when the user types a custom value that is not in the list of options.
3560
+ * The accessible label of the tag list element that contains the selected items. Available for MultiSelect and MultiSelectTree.
3561
+ */
3562
+ chipListLabel;
3563
+ /**
3564
+ * The text displayed when the user types a custom value that is not in the list of options. Available for ComboBox and MultiSelect.
3247
3565
  *
3248
3566
  * The text includes a localizable string and the custom value.
3249
3567
  * For example, when adding a custom value **Test**, the default text is **Use "Test"**.
@@ -3252,15 +3570,25 @@ class Messages extends ComponentMessages {
3252
3570
  * Use `{customValue}` to insert the value, for example, **Add: {customValue}**.
3253
3571
  */
3254
3572
  useCustomValueText;
3255
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
3256
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: Messages, isStandalone: true, inputs: { noDataText: "noDataText", clearTitle: "clearTitle", checkAllText: "checkAllText", selectButtonText: "selectButtonText", filterInputLabel: "filterInputLabel", popupLabel: "popupLabel", adaptiveCloseButtonTitle: "adaptiveCloseButtonTitle", filterInputPlaceholder: "filterInputPlaceholder", useCustomValueText: "useCustomValueText" }, usesInheritance: true, ngImport: i0 });
3573
+ /**
3574
+ * The accessible label of the listbox that contains the list of options. Available for DropDownList, ComboBox, MultiColumnComboBox, AutoComplete, and MultiSelect.
3575
+ */
3576
+ listboxLabel;
3577
+ /**
3578
+ * The accessible label of the input element. Available for MultiSelectTree.
3579
+ */
3580
+ inputLabel;
3581
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
3582
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: Messages, isStandalone: true, inputs: { noDataText: "noDataText", clearTitle: "clearTitle", selectAllText: "selectAllText", checkAllText: "checkAllText", selectButtonText: "selectButtonText", filterInputLabel: "filterInputLabel", popupLabel: "popupLabel", adaptiveCloseButtonTitle: "adaptiveCloseButtonTitle", filterInputPlaceholder: "filterInputPlaceholder", chipListLabel: "chipListLabel", useCustomValueText: "useCustomValueText", listboxLabel: "listboxLabel", inputLabel: "inputLabel" }, usesInheritance: true, ngImport: i0 });
3257
3583
  }
3258
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: Messages, decorators: [{
3584
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: Messages, decorators: [{
3259
3585
  type: Directive
3260
3586
  }], propDecorators: { noDataText: [{
3261
3587
  type: Input
3262
3588
  }], clearTitle: [{
3263
3589
  type: Input
3590
+ }], selectAllText: [{
3591
+ type: Input
3264
3592
  }], checkAllText: [{
3265
3593
  type: Input
3266
3594
  }], selectButtonText: [{
@@ -3273,8 +3601,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
3273
3601
  type: Input
3274
3602
  }], filterInputPlaceholder: [{
3275
3603
  type: Input
3604
+ }], chipListLabel: [{
3605
+ type: Input
3276
3606
  }], useCustomValueText: [{
3277
3607
  type: Input
3608
+ }], listboxLabel: [{
3609
+ type: Input
3610
+ }], inputLabel: [{
3611
+ type: Input
3278
3612
  }] } });
3279
3613
 
3280
3614
  /**
@@ -3286,15 +3620,15 @@ class LocalizedMessagesDirective extends Messages {
3286
3620
  super();
3287
3621
  this.service = service;
3288
3622
  }
3289
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
3290
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: LocalizedMessagesDirective, isStandalone: true, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n ", providers: [
3623
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
3624
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: LocalizedMessagesDirective, isStandalone: true, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n ", providers: [
3291
3625
  {
3292
3626
  provide: Messages,
3293
3627
  useExisting: forwardRef(() => LocalizedMessagesDirective)
3294
3628
  }
3295
3629
  ], usesInheritance: true, ngImport: i0 });
3296
3630
  }
3297
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
3631
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
3298
3632
  type: Directive,
3299
3633
  args: [{
3300
3634
  providers: [
@@ -3431,7 +3765,7 @@ class AutoCompleteComponent {
3431
3765
  * @hidden
3432
3766
  */
3433
3767
  get ariaControls() {
3434
- return this.isOpen ? this.listBoxId : undefined;
3768
+ return (!this.isAdaptive && this.isOpen) ? this.listBoxId : undefined;
3435
3769
  }
3436
3770
  /**
3437
3771
  * @hidden
@@ -4451,8 +4785,8 @@ class AutoCompleteComponent {
4451
4785
  this.togglePopup(false);
4452
4786
  }
4453
4787
  }
4454
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AutoCompleteComponent, deps: [{ token: i1.LocalizationService }, { token: DataService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.Injector }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
4455
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AutoCompleteComponent, isStandalone: true, selector: "kendo-autocomplete", inputs: { highlightFirst: "highlightFirst", showStickyHeader: "showStickyHeader", focusableId: "focusableId", data: "data", value: "value", valueField: "valueField", placeholder: "placeholder", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", popupSettings: "popupSettings", listHeight: "listHeight", loading: "loading", clearButton: "clearButton", suggest: "suggest", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", tabindex: "tabindex", tabIndex: "tabIndex", filterable: "filterable", virtual: "virtual", size: "size", rounded: "rounded", fillMode: "fillMode", inputAttributes: "inputAttributes" }, outputs: { valueChange: "valueChange", filterChange: "filterChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur" }, host: { properties: { "class.k-readonly": "this.readonly", "class.k-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.dir": "this.dir" } }, providers: [
4788
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: AutoCompleteComponent, deps: [{ token: i1.LocalizationService }, { token: DataService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.Injector }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
4789
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: AutoCompleteComponent, isStandalone: true, selector: "kendo-autocomplete", inputs: { highlightFirst: "highlightFirst", showStickyHeader: "showStickyHeader", focusableId: "focusableId", data: "data", value: "value", valueField: "valueField", placeholder: "placeholder", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", popupSettings: "popupSettings", listHeight: "listHeight", loading: "loading", clearButton: "clearButton", suggest: "suggest", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", tabindex: "tabindex", tabIndex: "tabIndex", filterable: "filterable", virtual: "virtual", size: "size", rounded: "rounded", fillMode: "fillMode", inputAttributes: "inputAttributes" }, outputs: { valueChange: "valueChange", filterChange: "filterChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur" }, host: { properties: { "class.k-readonly": "this.readonly", "class.k-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.dir": "this.dir" } }, providers: [
4456
4790
  AUTOCOMPLETE_VALUE_ACCESSOR,
4457
4791
  DataService,
4458
4792
  SelectionService,
@@ -4471,7 +4805,8 @@ class AutoCompleteComponent {
4471
4805
  provide: KendoInput,
4472
4806
  useExisting: forwardRef(() => AutoCompleteComponent)
4473
4807
  },
4474
- { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => AutoCompleteComponent) }
4808
+ { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => AutoCompleteComponent) },
4809
+ provideComponentName('autocomplete')
4475
4810
  ], queries: [{ propertyName: "template", first: true, predicate: ItemTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: HeaderTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: FooterTemplateDirective, descendants: true }, { propertyName: "noDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }, { propertyName: "groupTemplate", first: true, predicate: GroupTemplateDirective, descendants: true }, { propertyName: "fixedGroupTemplate", first: true, predicate: FixedGroupTemplateDirective, descendants: true }, { propertyName: "suffixTemplate", first: true, predicate: SuffixTemplateDirective, descendants: true }, { propertyName: "prefixTemplate", first: true, predicate: PrefixTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "adaptiveRendererComponent", first: true, predicate: AdaptiveRendererComponent, descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "searchbar", first: true, predicate: SearchBarComponent, descendants: true, static: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }], exportAs: ["kendoAutoComplete"], usesOnChanges: true, ngImport: i0, template: `
4476
4811
  <ng-container kendoAutoCompleteLocalizedMessages
4477
4812
  i18n-noDataText="kendo.autocomplete.noDataText|The text displayed in the popup when there are no items"
@@ -4485,6 +4820,9 @@ class AutoCompleteComponent {
4485
4820
 
4486
4821
  i18n-adaptiveCloseButtonTitle="kendo.autocomplete.adaptiveCloseButtonTitle|The title of the Close button of the ActionSheet that is rendered instead of the Popup when using small screen devices in adaptive mode"
4487
4822
  adaptiveCloseButtonTitle="Close"
4823
+
4824
+ i18n-listboxLabel="kendo.autocomplete.listboxLabel|The accessible label of the list of suggestions"
4825
+ listboxLabel="Suggestions"
4488
4826
  >
4489
4827
  </ng-container>
4490
4828
 
@@ -4506,9 +4844,9 @@ class AutoCompleteComponent {
4506
4844
  }
4507
4845
  <input
4508
4846
  kendoSearchbar
4509
- [ariaExpanded]="isOpen"
4847
+ [ariaExpanded]="isAdaptive ? false : isOpen"
4510
4848
  [isSuggestable]="suggest"
4511
- [isFilterable]="filterable"
4849
+ [hasListAutocomplete]="filterable"
4512
4850
  [isLoading]="isLoading"
4513
4851
  [ariaControls]="ariaControls"
4514
4852
  [id]="focusableId"
@@ -4604,24 +4942,25 @@ class AutoCompleteComponent {
4604
4942
  [show]="isOpen"
4605
4943
  [virtual]="virtual"
4606
4944
  [showStickyHeader]="showStickyHeader"
4945
+ [ariaLabel]="messageFor('listboxLabel')"
4607
4946
  (pageChange)="pageChange($event)"
4608
4947
  >
4948
+ <!--no-data template-->
4949
+ @if (data.length === 0) {
4950
+ <div class="k-no-data" [attr.aria-live]="'polite'">
4951
+ @if (noDataTemplate) {
4952
+ <ng-template
4953
+ [templateContext]="{
4954
+ templateRef: noDataTemplate?.templateRef
4955
+ }">
4956
+ </ng-template>
4957
+ }
4958
+ @if (!noDataTemplate) {
4959
+ <div>{{ messageFor('noDataText') }}</div>
4960
+ }
4961
+ </div>
4962
+ }
4609
4963
  </kendo-list>
4610
- <!--no-data template-->
4611
- @if (data.length === 0) {
4612
- <div class="k-no-data" [attr.aria-live]="'polite'">
4613
- @if (noDataTemplate) {
4614
- <ng-template
4615
- [templateContext]="{
4616
- templateRef: noDataTemplate?.templateRef
4617
- }">
4618
- </ng-template>
4619
- }
4620
- @if (!noDataTemplate) {
4621
- <div>{{ messageFor('noDataText') }}</div>
4622
- }
4623
- </div>
4624
- }
4625
4964
  <!--footer template-->
4626
4965
  @if (footerTemplate) {
4627
4966
  <ng-template
@@ -4631,9 +4970,9 @@ class AutoCompleteComponent {
4631
4970
  </ng-template>
4632
4971
  }
4633
4972
  </ng-template>
4634
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "isFilterable", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "customItemTemplate", "text", "allowCustom", "defaultItem", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }] });
4973
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "hasListAutocomplete", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable", "showListContainer"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "ariaLabel", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "columnsWidths", "customItemTemplate", "text", "allowCustom", "defaultItem", "selectAll", "selectAllText", "isAllSelected", "isPartiallySelected", "data", "size", "rounded"], outputs: ["selectAllClick", "onClick", "pageChange", "listResize", "popupListScroll"] }] });
4635
4974
  }
4636
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AutoCompleteComponent, decorators: [{
4975
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: AutoCompleteComponent, decorators: [{
4637
4976
  type: Component,
4638
4977
  args: [{
4639
4978
  exportAs: 'kendoAutoComplete',
@@ -4656,7 +4995,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
4656
4995
  provide: KendoInput,
4657
4996
  useExisting: forwardRef(() => AutoCompleteComponent)
4658
4997
  },
4659
- { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => AutoCompleteComponent) }
4998
+ { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => AutoCompleteComponent) },
4999
+ provideComponentName('autocomplete')
4660
5000
  ],
4661
5001
  selector: 'kendo-autocomplete',
4662
5002
  template: `
@@ -4672,6 +5012,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
4672
5012
 
4673
5013
  i18n-adaptiveCloseButtonTitle="kendo.autocomplete.adaptiveCloseButtonTitle|The title of the Close button of the ActionSheet that is rendered instead of the Popup when using small screen devices in adaptive mode"
4674
5014
  adaptiveCloseButtonTitle="Close"
5015
+
5016
+ i18n-listboxLabel="kendo.autocomplete.listboxLabel|The accessible label of the list of suggestions"
5017
+ listboxLabel="Suggestions"
4675
5018
  >
4676
5019
  </ng-container>
4677
5020
 
@@ -4693,9 +5036,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
4693
5036
  }
4694
5037
  <input
4695
5038
  kendoSearchbar
4696
- [ariaExpanded]="isOpen"
5039
+ [ariaExpanded]="isAdaptive ? false : isOpen"
4697
5040
  [isSuggestable]="suggest"
4698
- [isFilterable]="filterable"
5041
+ [hasListAutocomplete]="filterable"
4699
5042
  [isLoading]="isLoading"
4700
5043
  [ariaControls]="ariaControls"
4701
5044
  [id]="focusableId"
@@ -4791,24 +5134,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
4791
5134
  [show]="isOpen"
4792
5135
  [virtual]="virtual"
4793
5136
  [showStickyHeader]="showStickyHeader"
5137
+ [ariaLabel]="messageFor('listboxLabel')"
4794
5138
  (pageChange)="pageChange($event)"
4795
5139
  >
5140
+ <!--no-data template-->
5141
+ @if (data.length === 0) {
5142
+ <div class="k-no-data" [attr.aria-live]="'polite'">
5143
+ @if (noDataTemplate) {
5144
+ <ng-template
5145
+ [templateContext]="{
5146
+ templateRef: noDataTemplate?.templateRef
5147
+ }">
5148
+ </ng-template>
5149
+ }
5150
+ @if (!noDataTemplate) {
5151
+ <div>{{ messageFor('noDataText') }}</div>
5152
+ }
5153
+ </div>
5154
+ }
4796
5155
  </kendo-list>
4797
- <!--no-data template-->
4798
- @if (data.length === 0) {
4799
- <div class="k-no-data" [attr.aria-live]="'polite'">
4800
- @if (noDataTemplate) {
4801
- <ng-template
4802
- [templateContext]="{
4803
- templateRef: noDataTemplate?.templateRef
4804
- }">
4805
- </ng-template>
4806
- }
4807
- @if (!noDataTemplate) {
4808
- <div>{{ messageFor('noDataText') }}</div>
4809
- }
4810
- </div>
4811
- }
4812
5156
  <!--footer template-->
4813
5157
  @if (footerTemplate) {
4814
5158
  <ng-template
@@ -5092,7 +5436,7 @@ class ComboBoxComponent extends MultiTabStop {
5092
5436
  * @hidden
5093
5437
  */
5094
5438
  get ariaControls() {
5095
- return this.isOpen ? this.listBoxId : undefined;
5439
+ return (!this.isAdaptive && this.isOpen) ? this.listBoxId : undefined;
5096
5440
  }
5097
5441
  /**
5098
5442
  * @hidden
@@ -5915,7 +6259,7 @@ class ComboBoxComponent extends MultiTabStop {
5915
6259
  * @hidden
5916
6260
  */
5917
6261
  get selectButtonClasses() {
5918
- return `${this.size ? getSizeClass('button', this.size) : ''} ${this.fillMode ? 'k-button-' + this.fillMode : ''}`;
6262
+ return `${this.size ? getSizeClass('button', this.size) : ''} ${this.fillMode ? 'k-button-' + this.fillMode : ''} ${this.disabled ? 'k-disabled' : ''}`;
5919
6263
  }
5920
6264
  /**
5921
6265
  * @hidden
@@ -6182,7 +6526,7 @@ class ComboBoxComponent extends MultiTabStop {
6182
6526
  this.zone.run(() => {
6183
6527
  if (valueHasChanged) {
6184
6528
  const lowerCaseMatch = isPresent(this.focusedItemText) && this.focusedItemText.toLowerCase() === currentText.toLowerCase();
6185
- if (lowerCaseMatch || unresolvedSelection) {
6529
+ if ((lowerCaseMatch && this.shouldResolveSuggestedItem(currentText)) || unresolvedSelection) {
6186
6530
  this.selectionService.change(this.selectionService.focused);
6187
6531
  }
6188
6532
  else {
@@ -6315,6 +6659,9 @@ class ComboBoxComponent extends MultiTabStop {
6315
6659
  const itemText = getter(this.dataService.itemAt(focused), this.textField);
6316
6660
  return !isPresent(itemText) ? "" : itemText.toString();
6317
6661
  }
6662
+ shouldResolveSuggestedItem(currentText) {
6663
+ return !(this.allowCustom && this.suggest && this.focusedItemText !== currentText);
6664
+ }
6318
6665
  /**
6319
6666
  * Focuses the first match when there's text in the input field, but no focused item.
6320
6667
  */
@@ -6503,7 +6850,7 @@ class ComboBoxComponent extends MultiTabStop {
6503
6850
  this.zone.run(() => {
6504
6851
  if (valueHasChanged) {
6505
6852
  const lowerCaseMatch = isPresent(this.focusedItemText) && this.focusedItemText.toLowerCase() === currentText.toLowerCase();
6506
- if (lowerCaseMatch || unresolvedSelection) {
6853
+ if ((lowerCaseMatch && this.shouldResolveSuggestedItem(currentText)) || unresolvedSelection) {
6507
6854
  this.selectionService.change(this.selectionService.focused);
6508
6855
  }
6509
6856
  else {
@@ -6519,8 +6866,8 @@ class ComboBoxComponent extends MultiTabStop {
6519
6866
  this.togglePopup(false);
6520
6867
  }
6521
6868
  }
6522
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.Injector }, { token: i0.ElementRef }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
6523
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ComboBoxComponent, isStandalone: true, selector: "kendo-combobox", inputs: { icon: "icon", svgIcon: "svgIcon", inputAttributes: "inputAttributes", showStickyHeader: "showStickyHeader", focusableId: "focusableId", allowCustom: "allowCustom", data: "data", value: "value", textField: "textField", valueField: "valueField", valuePrimitive: "valuePrimitive", valueNormalizer: "valueNormalizer", placeholder: "placeholder", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", popupSettings: "popupSettings", listHeight: "listHeight", loading: "loading", suggest: "suggest", clearButton: "clearButton", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", tabindex: "tabindex", tabIndex: "tabIndex", filterable: "filterable", virtual: "virtual", size: "size", rounded: "rounded", fillMode: "fillMode" }, outputs: { valueChange: "valueChange", selectionChange: "selectionChange", filterChange: "filterChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur", escape: "escape" }, host: { properties: { "class.k-readonly": "this.readonly", "class.k-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.dir": "this.dir" } }, providers: [
6869
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.Injector }, { token: i0.ElementRef }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
6870
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: ComboBoxComponent, isStandalone: true, selector: "kendo-combobox", inputs: { icon: "icon", svgIcon: "svgIcon", inputAttributes: "inputAttributes", showStickyHeader: "showStickyHeader", focusableId: "focusableId", allowCustom: "allowCustom", data: "data", value: "value", textField: "textField", valueField: "valueField", valuePrimitive: "valuePrimitive", valueNormalizer: "valueNormalizer", placeholder: "placeholder", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", popupSettings: "popupSettings", listHeight: "listHeight", loading: "loading", suggest: "suggest", clearButton: "clearButton", disabled: "disabled", itemDisabled: "itemDisabled", readonly: "readonly", tabindex: "tabindex", tabIndex: "tabIndex", filterable: "filterable", virtual: "virtual", size: "size", rounded: "rounded", fillMode: "fillMode" }, outputs: { valueChange: "valueChange", selectionChange: "selectionChange", filterChange: "filterChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur", escape: "escape" }, host: { properties: { "class.k-readonly": "this.readonly", "class.k-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.dir": "this.dir" } }, providers: [
6524
6871
  COMBOBOX_VALUE_ACCESSOR,
6525
6872
  DataService,
6526
6873
  SelectionService,
@@ -6540,7 +6887,8 @@ class ComboBoxComponent extends MultiTabStop {
6540
6887
  {
6541
6888
  provide: MultiTabStop, useExisting: forwardRef(() => ComboBoxComponent)
6542
6889
  },
6543
- { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => ComboBoxComponent) }
6890
+ { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => ComboBoxComponent) },
6891
+ provideComponentName('combobox')
6544
6892
  ], queries: [{ propertyName: "template", first: true, predicate: ItemTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: HeaderTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: FooterTemplateDirective, descendants: true }, { propertyName: "noDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }, { propertyName: "groupTemplate", first: true, predicate: GroupTemplateDirective, descendants: true }, { propertyName: "fixedGroupTemplate", first: true, predicate: FixedGroupTemplateDirective, descendants: true }, { propertyName: "suffixTemplate", first: true, predicate: SuffixTemplateDirective, descendants: true }, { propertyName: "prefixTemplate", first: true, predicate: PrefixTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "adaptiveRendererComponent", first: true, predicate: AdaptiveRendererComponent, descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "searchbar", first: true, predicate: SearchBarComponent, descendants: true, static: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }, { propertyName: "select", first: true, predicate: ["select"], descendants: true, static: true }], exportAs: ["kendoComboBox"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
6545
6893
  <ng-container kendoComboBoxLocalizedMessages
6546
6894
  i18n-noDataText="kendo.combobox.noDataText|The text displayed in the popup when there are no items"
@@ -6557,6 +6905,12 @@ class ComboBoxComponent extends MultiTabStop {
6557
6905
 
6558
6906
  i18n-adaptiveCloseButtonTitle="kendo.combobox.adaptiveCloseButtonTitle|The title of the Close button of the ActionSheet that is rendered instead of the Popup when using small screen devices in adaptive mode"
6559
6907
  adaptiveCloseButtonTitle="Close"
6908
+
6909
+ i18n-listboxLabel="kendo.combobox.listboxLabel|The accessible label of the listbox that contains the list of options"
6910
+ listboxLabel="Options"
6911
+
6912
+ i18n-useCustomValueText="kendo.combobox.useCustomValueText|The text displayed when the user types a custom value that is not in the list of options."
6913
+ useCustomValueText="{{ 'Use &quot;{customValue}&quot;' }}"
6560
6914
  >
6561
6915
  </ng-container>
6562
6916
 
@@ -6578,12 +6932,12 @@ class ComboBoxComponent extends MultiTabStop {
6578
6932
  }
6579
6933
  <input
6580
6934
  kendoSearchbar
6581
- [ariaExpanded]="isOpen"
6935
+ [ariaExpanded]="isAdaptive ? false : isOpen"
6582
6936
  [ariaControls]="ariaControls"
6583
6937
  [id]="focusableId"
6584
6938
  [isLoading]="loading"
6585
6939
  [isSuggestable]="suggest"
6586
- [isFilterable]="filterable"
6940
+ [hasListAutocomplete]="filterable"
6587
6941
  [activeDescendant]="activeDescendant"
6588
6942
  [userInput]="text"
6589
6943
  [suggestedText]="getSuggestion()"
@@ -6603,7 +6957,6 @@ class ComboBoxComponent extends MultiTabStop {
6603
6957
  <span
6604
6958
  class="k-clear-value"
6605
6959
  [style.visibility]="clearButtonVisibility"
6606
- aria-hidden="true"
6607
6960
  [attr.title]="messageFor('clearTitle')"
6608
6961
  (click)="clearValue($event)"
6609
6962
  [kendoEventsOutsideAngular]="{
@@ -6698,24 +7051,27 @@ class ComboBoxComponent extends MultiTabStop {
6698
7051
  [show]="isOpen"
6699
7052
  [virtual]="virtual"
6700
7053
  [showStickyHeader]="showStickyHeader"
7054
+ [ariaLabel]="messageFor('listboxLabel')"
7055
+ [text]="text"
7056
+ [allowCustom]="allowCustom"
6701
7057
  (pageChange)="pageChange($event)"
6702
7058
  >
7059
+ <!--no-data template-->
7060
+ @if (data.length === 0) {
7061
+ <div class="k-no-data" [attr.aria-live]="'polite'">
7062
+ @if (noDataTemplate) {
7063
+ <ng-template
7064
+ [templateContext]="{
7065
+ templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
7066
+ }">
7067
+ </ng-template>
7068
+ }
7069
+ @if (!noDataTemplate) {
7070
+ <div>{{ messageFor('noDataText') }}</div>
7071
+ }
7072
+ </div>
7073
+ }
6703
7074
  </kendo-list>
6704
- <!--no-data template-->
6705
- @if (data.length === 0) {
6706
- <div class="k-no-data" [attr.aria-live]="'polite'">
6707
- @if (noDataTemplate) {
6708
- <ng-template
6709
- [templateContext]="{
6710
- templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
6711
- }">
6712
- </ng-template>
6713
- }
6714
- @if (!noDataTemplate) {
6715
- <div>{{ messageFor('noDataText') }}</div>
6716
- }
6717
- </div>
6718
- }
6719
7075
  <!--footer template-->
6720
7076
  @if (footerTemplate) {
6721
7077
  <ng-template
@@ -6725,9 +7081,9 @@ class ComboBoxComponent extends MultiTabStop {
6725
7081
  </ng-template>
6726
7082
  }
6727
7083
  </ng-template>
6728
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "isFilterable", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "customItemTemplate", "text", "allowCustom", "defaultItem", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }] });
7084
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "hasListAutocomplete", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable", "showListContainer"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "ariaLabel", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "columnsWidths", "customItemTemplate", "text", "allowCustom", "defaultItem", "selectAll", "selectAllText", "isAllSelected", "isPartiallySelected", "data", "size", "rounded"], outputs: ["selectAllClick", "onClick", "pageChange", "listResize", "popupListScroll"] }] });
6729
7085
  }
6730
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxComponent, decorators: [{
7086
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxComponent, decorators: [{
6731
7087
  type: Component,
6732
7088
  args: [{
6733
7089
  exportAs: 'kendoComboBox',
@@ -6751,7 +7107,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
6751
7107
  {
6752
7108
  provide: MultiTabStop, useExisting: forwardRef(() => ComboBoxComponent)
6753
7109
  },
6754
- { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => ComboBoxComponent) }
7110
+ { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => ComboBoxComponent) },
7111
+ provideComponentName('combobox')
6755
7112
  ],
6756
7113
  selector: 'kendo-combobox',
6757
7114
  template: `
@@ -6770,6 +7127,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
6770
7127
 
6771
7128
  i18n-adaptiveCloseButtonTitle="kendo.combobox.adaptiveCloseButtonTitle|The title of the Close button of the ActionSheet that is rendered instead of the Popup when using small screen devices in adaptive mode"
6772
7129
  adaptiveCloseButtonTitle="Close"
7130
+
7131
+ i18n-listboxLabel="kendo.combobox.listboxLabel|The accessible label of the listbox that contains the list of options"
7132
+ listboxLabel="Options"
7133
+
7134
+ i18n-useCustomValueText="kendo.combobox.useCustomValueText|The text displayed when the user types a custom value that is not in the list of options."
7135
+ useCustomValueText="{{ 'Use &quot;{customValue}&quot;' }}"
6773
7136
  >
6774
7137
  </ng-container>
6775
7138
 
@@ -6791,12 +7154,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
6791
7154
  }
6792
7155
  <input
6793
7156
  kendoSearchbar
6794
- [ariaExpanded]="isOpen"
7157
+ [ariaExpanded]="isAdaptive ? false : isOpen"
6795
7158
  [ariaControls]="ariaControls"
6796
7159
  [id]="focusableId"
6797
7160
  [isLoading]="loading"
6798
7161
  [isSuggestable]="suggest"
6799
- [isFilterable]="filterable"
7162
+ [hasListAutocomplete]="filterable"
6800
7163
  [activeDescendant]="activeDescendant"
6801
7164
  [userInput]="text"
6802
7165
  [suggestedText]="getSuggestion()"
@@ -6816,7 +7179,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
6816
7179
  <span
6817
7180
  class="k-clear-value"
6818
7181
  [style.visibility]="clearButtonVisibility"
6819
- aria-hidden="true"
6820
7182
  [attr.title]="messageFor('clearTitle')"
6821
7183
  (click)="clearValue($event)"
6822
7184
  [kendoEventsOutsideAngular]="{
@@ -6911,24 +7273,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
6911
7273
  [show]="isOpen"
6912
7274
  [virtual]="virtual"
6913
7275
  [showStickyHeader]="showStickyHeader"
7276
+ [ariaLabel]="messageFor('listboxLabel')"
7277
+ [text]="text"
7278
+ [allowCustom]="allowCustom"
6914
7279
  (pageChange)="pageChange($event)"
6915
7280
  >
7281
+ <!--no-data template-->
7282
+ @if (data.length === 0) {
7283
+ <div class="k-no-data" [attr.aria-live]="'polite'">
7284
+ @if (noDataTemplate) {
7285
+ <ng-template
7286
+ [templateContext]="{
7287
+ templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
7288
+ }">
7289
+ </ng-template>
7290
+ }
7291
+ @if (!noDataTemplate) {
7292
+ <div>{{ messageFor('noDataText') }}</div>
7293
+ }
7294
+ </div>
7295
+ }
6916
7296
  </kendo-list>
6917
- <!--no-data template-->
6918
- @if (data.length === 0) {
6919
- <div class="k-no-data" [attr.aria-live]="'polite'">
6920
- @if (noDataTemplate) {
6921
- <ng-template
6922
- [templateContext]="{
6923
- templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
6924
- }">
6925
- </ng-template>
6926
- }
6927
- @if (!noDataTemplate) {
6928
- <div>{{ messageFor('noDataText') }}</div>
6929
- }
6930
- </div>
6931
- }
6932
7297
  <!--footer template-->
6933
7298
  @if (footerTemplate) {
6934
7299
  <ng-template
@@ -7121,10 +7486,10 @@ class ValueTemplateDirective {
7121
7486
  constructor(templateRef) {
7122
7487
  this.templateRef = templateRef;
7123
7488
  }
7124
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
7125
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: ValueTemplateDirective, isStandalone: true, selector: "[kendoDropDownListValueTemplate],[kendoDropDownTreeValueTemplate]", ngImport: i0 });
7489
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
7490
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: ValueTemplateDirective, isStandalone: true, selector: "[kendoDropDownListValueTemplate],[kendoDropDownTreeValueTemplate]", ngImport: i0 });
7126
7491
  }
7127
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ValueTemplateDirective, decorators: [{
7492
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ValueTemplateDirective, decorators: [{
7128
7493
  type: Directive,
7129
7494
  args: [{
7130
7495
  selector: '[kendoDropDownListValueTemplate],[kendoDropDownTreeValueTemplate]',
@@ -7151,10 +7516,10 @@ class FilterInputDirective {
7151
7516
  nextTick(fn) {
7152
7517
  this.zone.runOutsideAngular(() => setTimeout(fn));
7153
7518
  }
7154
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FilterInputDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
7155
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: FilterInputDirective, isStandalone: true, selector: "[filterInput]", inputs: { focused: ["filterInput", "focused"] }, usesOnChanges: true, ngImport: i0 });
7519
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FilterInputDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
7520
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: FilterInputDirective, isStandalone: true, selector: "[filterInput]", inputs: { focused: ["filterInput", "focused"] }, usesOnChanges: true, ngImport: i0 });
7156
7521
  }
7157
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FilterInputDirective, decorators: [{
7522
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FilterInputDirective, decorators: [{
7158
7523
  type: Directive,
7159
7524
  args: [{
7160
7525
  selector: '[filterInput]',
@@ -7287,7 +7652,7 @@ class DropDownListComponent {
7287
7652
  * @hidden
7288
7653
  */
7289
7654
  get ariaLive() {
7290
- return this.filterable ? 'polite' : 'off';
7655
+ return this.filterable ? 'polite' : null;
7291
7656
  }
7292
7657
  /**
7293
7658
  * Shows or hides the current group sticky header when using grouped data.
@@ -7676,7 +8041,7 @@ class DropDownListComponent {
7676
8041
  role = 'combobox';
7677
8042
  haspopup = 'listbox';
7678
8043
  get hostAriaInvalid() {
7679
- return this.formControl?.invalid ? true : null;
8044
+ return (this.formControl?.invalid && (this.formControl?.touched || this.formControl?.dirty)) ? true : null;
7680
8045
  }
7681
8046
  /**
7682
8047
  * @hidden
@@ -8525,8 +8890,6 @@ class DropDownListComponent {
8525
8890
  }
8526
8891
  closeActionSheet() {
8527
8892
  this.actionSheet.toggle(false);
8528
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
8529
- this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
8530
8893
  if (this.filterable) {
8531
8894
  this.adaptiveRenderer.searchBarValue = '';
8532
8895
  this.filterChange.emit('');
@@ -8536,8 +8899,6 @@ class DropDownListComponent {
8536
8899
  openActionSheet() {
8537
8900
  this.actionSheet.toggle(true);
8538
8901
  this.cdr.detectChanges();
8539
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
8540
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.listBoxId);
8541
8902
  if (!this.dataService.grouped) {
8542
8903
  setListBoxAriaLabelledBy(this.optionsList, this.wrapper, this.renderer);
8543
8904
  }
@@ -8551,8 +8912,8 @@ class DropDownListComponent {
8551
8912
  this.selectionService.focus(this.selectionService.focused);
8552
8913
  this.opened.emit();
8553
8914
  }
8554
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", 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 }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
8555
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", 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", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", 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.aria-disabled": "this.isDisabledClass", "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: [
8915
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", 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 }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
8916
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", 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", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", 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.aria-disabled": "this.isDisabledClass", "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: [
8556
8917
  DROPDOWNLIST_VALUE_ACCESSOR,
8557
8918
  DataService,
8558
8919
  SelectionService,
@@ -8569,7 +8930,8 @@ class DropDownListComponent {
8569
8930
  {
8570
8931
  provide: KendoInput, useExisting: forwardRef(() => DropDownListComponent)
8571
8932
  },
8572
- { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => DropDownListComponent) }
8933
+ { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => DropDownListComponent) },
8934
+ provideComponentName('dropdownlist')
8573
8935
  ], queries: [{ propertyName: "itemTemplate", first: true, predicate: ItemTemplateDirective, descendants: true }, { propertyName: "groupTemplate", first: true, predicate: GroupTemplateDirective, descendants: true }, { propertyName: "fixedGroupTemplate", first: true, predicate: FixedGroupTemplateDirective, descendants: true }, { propertyName: "valueTemplate", first: true, predicate: ValueTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: HeaderTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: FooterTemplateDirective, descendants: true }, { propertyName: "noDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "adaptiveRenderer", first: true, predicate: AdaptiveRendererComponent, descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }], exportAs: ["kendoDropDownList"], usesOnChanges: true, ngImport: i0, template: `
8574
8936
  <ng-container kendoDropDownListLocalizedMessages
8575
8937
  i18n-noDataText="kendo.dropdownlist.noDataText|The text displayed in the popup when there are no items"
@@ -8589,6 +8951,9 @@ class DropDownListComponent {
8589
8951
 
8590
8952
  i18n-filterPlaceholder="kendo.dropdownlist.filterPlaceholder|The text for the input's placeholder when filtering is enabled"
8591
8953
  filterInputPlaceholder="Filter"
8954
+
8955
+ i18n-listboxLabel="kendo.dropdownlist.listboxLabel|The accessible label of the listbox that contains the list of options"
8956
+ listboxLabel="Options"
8592
8957
  >
8593
8958
  </ng-container>
8594
8959
  <span class="k-input-inner" unselectable="on" [id]="valueLabelId" (click)="$event.preventDefault()">
@@ -8653,7 +9018,6 @@ class DropDownListComponent {
8653
9018
  class="k-searchbox k-input"
8654
9019
  [ngClass]="filterInputClasses">
8655
9020
  <kendo-icon-wrapper
8656
- class="k-icon"
8657
9021
  innerCssClass="k-input-icon"
8658
9022
  name="search"
8659
9023
  [svgIcon]="searchIcon">
@@ -8704,24 +9068,25 @@ class DropDownListComponent {
8704
9068
  [virtual]="virtual"
8705
9069
  [ariaLive]="ariaLive"
8706
9070
  [showStickyHeader]="showStickyHeader"
9071
+ [ariaLabel]="messageFor('listboxLabel')"
8707
9072
  (pageChange)="pageChange($event)"
8708
9073
  [defaultItem]="defaultItem">
9074
+ <!--no-data template-->
9075
+ @if (data.length === 0) {
9076
+ <div class="k-no-data" [attr.aria-live]="'polite'">
9077
+ @if (noDataTemplate) {
9078
+ <ng-template
9079
+ [templateContext]="{
9080
+ templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
9081
+ }">
9082
+ </ng-template>
9083
+ }
9084
+ @if (!noDataTemplate) {
9085
+ <div>{{ messageFor('noDataText') }}</div>
9086
+ }
9087
+ </div>
9088
+ }
8709
9089
  </kendo-list>
8710
- <!--no-data template-->
8711
- @if (data.length === 0) {
8712
- <div class="k-no-data" [attr.aria-live]="'polite'">
8713
- @if (noDataTemplate) {
8714
- <ng-template
8715
- [templateContext]="{
8716
- templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
8717
- }">
8718
- </ng-template>
8719
- }
8720
- @if (!noDataTemplate) {
8721
- <div>{{ messageFor('noDataText') }}</div>
8722
- }
8723
- </div>
8724
- }
8725
9090
  <!--footer template-->
8726
9091
  @if (footerTemplate) {
8727
9092
  <ng-template
@@ -8731,9 +9096,9 @@ class DropDownListComponent {
8731
9096
  </ng-template>
8732
9097
  }
8733
9098
  </ng-template>
8734
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i8.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "customItemTemplate", "text", "allowCustom", "defaultItem", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }] });
9099
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable", "showListContainer"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i8.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "ariaLabel", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "columnsWidths", "customItemTemplate", "text", "allowCustom", "defaultItem", "selectAll", "selectAllText", "isAllSelected", "isPartiallySelected", "data", "size", "rounded"], outputs: ["selectAllClick", "onClick", "pageChange", "listResize", "popupListScroll"] }] });
8735
9100
  }
8736
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownListComponent, decorators: [{
9101
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownListComponent, decorators: [{
8737
9102
  type: Component,
8738
9103
  args: [{
8739
9104
  exportAs: 'kendoDropDownList',
@@ -8754,7 +9119,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
8754
9119
  {
8755
9120
  provide: KendoInput, useExisting: forwardRef(() => DropDownListComponent)
8756
9121
  },
8757
- { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => DropDownListComponent) }
9122
+ { provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => DropDownListComponent) },
9123
+ provideComponentName('dropdownlist')
8758
9124
  ],
8759
9125
  selector: 'kendo-dropdownlist',
8760
9126
  template: `
@@ -8776,6 +9142,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
8776
9142
 
8777
9143
  i18n-filterPlaceholder="kendo.dropdownlist.filterPlaceholder|The text for the input's placeholder when filtering is enabled"
8778
9144
  filterInputPlaceholder="Filter"
9145
+
9146
+ i18n-listboxLabel="kendo.dropdownlist.listboxLabel|The accessible label of the listbox that contains the list of options"
9147
+ listboxLabel="Options"
8779
9148
  >
8780
9149
  </ng-container>
8781
9150
  <span class="k-input-inner" unselectable="on" [id]="valueLabelId" (click)="$event.preventDefault()">
@@ -8840,7 +9209,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
8840
9209
  class="k-searchbox k-input"
8841
9210
  [ngClass]="filterInputClasses">
8842
9211
  <kendo-icon-wrapper
8843
- class="k-icon"
8844
9212
  innerCssClass="k-input-icon"
8845
9213
  name="search"
8846
9214
  [svgIcon]="searchIcon">
@@ -8891,24 +9259,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
8891
9259
  [virtual]="virtual"
8892
9260
  [ariaLive]="ariaLive"
8893
9261
  [showStickyHeader]="showStickyHeader"
9262
+ [ariaLabel]="messageFor('listboxLabel')"
8894
9263
  (pageChange)="pageChange($event)"
8895
9264
  [defaultItem]="defaultItem">
9265
+ <!--no-data template-->
9266
+ @if (data.length === 0) {
9267
+ <div class="k-no-data" [attr.aria-live]="'polite'">
9268
+ @if (noDataTemplate) {
9269
+ <ng-template
9270
+ [templateContext]="{
9271
+ templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
9272
+ }">
9273
+ </ng-template>
9274
+ }
9275
+ @if (!noDataTemplate) {
9276
+ <div>{{ messageFor('noDataText') }}</div>
9277
+ }
9278
+ </div>
9279
+ }
8896
9280
  </kendo-list>
8897
- <!--no-data template-->
8898
- @if (data.length === 0) {
8899
- <div class="k-no-data" [attr.aria-live]="'polite'">
8900
- @if (noDataTemplate) {
8901
- <ng-template
8902
- [templateContext]="{
8903
- templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
8904
- }">
8905
- </ng-template>
8906
- }
8907
- @if (!noDataTemplate) {
8908
- <div>{{ messageFor('noDataText') }}</div>
8909
- }
8910
- </div>
8911
- }
8912
9281
  <!--footer template-->
8913
9282
  @if (footerTemplate) {
8914
9283
  <ng-template
@@ -9126,10 +9495,10 @@ class TagTemplateDirective {
9126
9495
  constructor(templateRef) {
9127
9496
  this.templateRef = templateRef;
9128
9497
  }
9129
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TagTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
9130
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: TagTemplateDirective, isStandalone: true, selector: "[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]", ngImport: i0 });
9498
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: TagTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
9499
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: TagTemplateDirective, isStandalone: true, selector: "[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]", ngImport: i0 });
9131
9500
  }
9132
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TagTemplateDirective, decorators: [{
9501
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: TagTemplateDirective, decorators: [{
9133
9502
  type: Directive,
9134
9503
  args: [{
9135
9504
  selector: '[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]',
@@ -9148,10 +9517,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
9148
9517
  *
9149
9518
  * @example
9150
9519
  * ```ts
9151
- * _@Component({
9520
+ * @Component({
9152
9521
  * selector: 'my-app',
9153
9522
  * template: `
9154
- * <kendo-multiselect kendoMultiSelectSummaryTag [data]="items">
9523
+ * <kendo-multiselect [summaryTagAfter]="1" [data]="items">
9155
9524
  * <ng-template kendoMultiSelectGroupTagTemplate let-dataItems>
9156
9525
  * <span>{{dataItems.length}} item(s) selected</span>
9157
9526
  * </ng-template>
@@ -9168,10 +9537,10 @@ class GroupTagTemplateDirective {
9168
9537
  constructor(templateRef) {
9169
9538
  this.templateRef = templateRef;
9170
9539
  }
9171
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: GroupTagTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
9172
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: GroupTagTemplateDirective, isStandalone: true, selector: "[kendoMultiSelectGroupTagTemplate],[kendoMultiSelectTreeGroupTagTemplate]", ngImport: i0 });
9540
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: GroupTagTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
9541
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: GroupTagTemplateDirective, isStandalone: true, selector: "[kendoMultiSelectGroupTagTemplate],[kendoMultiSelectTreeGroupTagTemplate]", ngImport: i0 });
9173
9542
  }
9174
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: GroupTagTemplateDirective, decorators: [{
9543
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: GroupTagTemplateDirective, decorators: [{
9175
9544
  type: Directive,
9176
9545
  args: [{
9177
9546
  selector: '[kendoMultiSelectGroupTagTemplate],[kendoMultiSelectTreeGroupTagTemplate]',
@@ -9229,6 +9598,7 @@ class TagListComponent {
9229
9598
  disabled;
9230
9599
  tagPrefix;
9231
9600
  id;
9601
+ ariaLabel;
9232
9602
  set size(size) {
9233
9603
  this.renderer.removeClass(this.hostElement.nativeElement, getSizeClass('chip-list', this.size));
9234
9604
  if (size) {
@@ -9251,7 +9621,11 @@ class TagListComponent {
9251
9621
  return this.id;
9252
9622
  }
9253
9623
  taglistRole = 'listbox';
9624
+ get hostAriaLabel() {
9625
+ return this.ariaLabel || null;
9626
+ }
9254
9627
  multiselectable = true;
9628
+ ariaOrientation = 'horizontal';
9255
9629
  _size;
9256
9630
  constructor(renderer, hostElement) {
9257
9631
  this.renderer = renderer;
@@ -9305,8 +9679,8 @@ class TagListComponent {
9305
9679
  return prop.find(item => item in tag);
9306
9680
  }
9307
9681
  }
9308
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TagListComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
9309
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TagListComponent, isStandalone: true, selector: "kendo-taglist", inputs: { tags: "tags", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", focused: "focused", template: "template", groupTemplate: "groupTemplate", disabled: "disabled", tagPrefix: "tagPrefix", id: "id", size: "size", rounded: "rounded", fillMode: "fillMode", disabledIndices: "disabledIndices" }, outputs: { removeTag: "removeTag" }, host: { properties: { "class.k-chip-list": "this.hostClass", "attr.id": "this.hostId", "attr.role": "this.taglistRole", "attr.aria-multiselectable": "this.multiselectable" } }, ngImport: i0, template: `
9682
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: TagListComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
9683
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: TagListComponent, isStandalone: true, selector: "kendo-taglist", inputs: { tags: "tags", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", focused: "focused", template: "template", groupTemplate: "groupTemplate", disabled: "disabled", tagPrefix: "tagPrefix", id: "id", ariaLabel: "ariaLabel", size: "size", rounded: "rounded", fillMode: "fillMode", disabledIndices: "disabledIndices" }, outputs: { removeTag: "removeTag" }, host: { properties: { "class.k-chip-list": "this.hostClass", "attr.id": "this.hostId", "attr.role": "this.taglistRole", "attr.aria-label": "this.hostAriaLabel", "attr.aria-multiselectable": "this.multiselectable", "attr.aria-orientation": "this.ariaOrientation" } }, ngImport: i0, template: `
9310
9684
  @for (tag of tags; track $index; let index = $index) {
9311
9685
  <div
9312
9686
  [attr.id]="itemId(tag, index)"
@@ -9332,7 +9706,7 @@ class TagListComponent {
9332
9706
  >
9333
9707
  <span class="k-chip-content">
9334
9708
  @if (isGroupTag(tag)) {
9335
- <span class="k-chip-label k-text-ellipsis">
9709
+ <span class="k-chip-label">
9336
9710
  @if (groupTemplate) {
9337
9711
  <ng-template
9338
9712
  [templateContext]="{
@@ -9346,7 +9720,7 @@ class TagListComponent {
9346
9720
  }
9347
9721
  </span>
9348
9722
  } @else {
9349
- <span class="k-chip-label k-text-ellipsis">
9723
+ <span class="k-chip-label">
9350
9724
  @if (template) {
9351
9725
  <ng-template
9352
9726
  [templateContext]="{
@@ -9362,11 +9736,13 @@ class TagListComponent {
9362
9736
  }
9363
9737
  </span>
9364
9738
  <span class="k-chip-actions">
9365
- <span aria-label="delete" [attr.aria-hidden]="index !== focused" class="k-chip-action k-chip-remove-action">
9739
+ <span class="k-chip-action k-chip-remove-action">
9366
9740
  <kendo-icon-wrapper
9741
+ [attr.aria-hidden]="index !== focused"
9367
9742
  (mousedown)="deleteTag($event, tag, index)"
9368
9743
  name="x-circle"
9369
9744
  [svgIcon]="xCircleIcon"
9745
+ size="small"
9370
9746
  >
9371
9747
  </kendo-icon-wrapper>
9372
9748
  </span>
@@ -9376,7 +9752,7 @@ class TagListComponent {
9376
9752
  <ng-content></ng-content>
9377
9753
  `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
9378
9754
  }
9379
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TagListComponent, decorators: [{
9755
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: TagListComponent, decorators: [{
9380
9756
  type: Component,
9381
9757
  args: [{
9382
9758
  selector: 'kendo-taglist',
@@ -9406,7 +9782,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
9406
9782
  >
9407
9783
  <span class="k-chip-content">
9408
9784
  @if (isGroupTag(tag)) {
9409
- <span class="k-chip-label k-text-ellipsis">
9785
+ <span class="k-chip-label">
9410
9786
  @if (groupTemplate) {
9411
9787
  <ng-template
9412
9788
  [templateContext]="{
@@ -9420,7 +9796,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
9420
9796
  }
9421
9797
  </span>
9422
9798
  } @else {
9423
- <span class="k-chip-label k-text-ellipsis">
9799
+ <span class="k-chip-label">
9424
9800
  @if (template) {
9425
9801
  <ng-template
9426
9802
  [templateContext]="{
@@ -9436,11 +9812,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
9436
9812
  }
9437
9813
  </span>
9438
9814
  <span class="k-chip-actions">
9439
- <span aria-label="delete" [attr.aria-hidden]="index !== focused" class="k-chip-action k-chip-remove-action">
9815
+ <span class="k-chip-action k-chip-remove-action">
9440
9816
  <kendo-icon-wrapper
9817
+ [attr.aria-hidden]="index !== focused"
9441
9818
  (mousedown)="deleteTag($event, tag, index)"
9442
9819
  name="x-circle"
9443
9820
  [svgIcon]="xCircleIcon"
9821
+ size="small"
9444
9822
  >
9445
9823
  </kendo-icon-wrapper>
9446
9824
  </span>
@@ -9472,6 +9850,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
9472
9850
  type: Input
9473
9851
  }], id: [{
9474
9852
  type: Input
9853
+ }], ariaLabel: [{
9854
+ type: Input
9475
9855
  }], size: [{
9476
9856
  type: Input
9477
9857
  }], rounded: [{
@@ -9491,9 +9871,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
9491
9871
  }], taglistRole: [{
9492
9872
  type: HostBinding,
9493
9873
  args: ['attr.role']
9874
+ }], hostAriaLabel: [{
9875
+ type: HostBinding,
9876
+ args: ['attr.aria-label']
9494
9877
  }], multiselectable: [{
9495
9878
  type: HostBinding,
9496
9879
  args: ['attr.aria-multiselectable']
9880
+ }], ariaOrientation: [{
9881
+ type: HostBinding,
9882
+ args: ['attr.aria-orientation']
9497
9883
  }] } });
9498
9884
 
9499
9885
  const MULTISELECT_VALUE_ACCESSOR = {
@@ -9560,6 +9946,8 @@ class MultiSelectComponent {
9560
9946
  popupRef;
9561
9947
  text;
9562
9948
  tags;
9949
+ isAllSelected = false;
9950
+ isPartiallySelected = false;
9563
9951
  focusedTagIndex = undefined;
9564
9952
  /**
9565
9953
  * @hidden
@@ -9581,7 +9969,7 @@ class MultiSelectComponent {
9581
9969
  * @hidden
9582
9970
  */
9583
9971
  get ariaControls() {
9584
- return this.isOpen ? this.listBoxId : undefined;
9972
+ return (!this.isAdaptive && this.isOpen) ? this.listBoxId : undefined;
9585
9973
  }
9586
9974
  /**
9587
9975
  * @hidden
@@ -9598,12 +9986,12 @@ class MultiSelectComponent {
9598
9986
  }
9599
9987
  /**
9600
9988
  * Focuses a specific item in the MultiSelect based on the provided index.
9601
- * Sets the index to `-1` to focus the custom item if available.
9989
+ * Sets the index to `-1` to focus the custom item if available, or `-2` to focus the Select All item.
9602
9990
  * Pass `null` or an invalid index to remove focus.
9603
9991
  */
9604
9992
  focusItemAt(index) {
9605
- const minIndex = this.allowCustom ? -1 : 0;
9606
- const isInRange = minIndex <= 0 && index < this.data.length;
9993
+ const minIndex = this.selectAll ? -2 : this.allowCustom ? -1 : 0;
9994
+ const isInRange = minIndex <= index && index < this.data.length;
9607
9995
  if (isPresent(index) && isInRange && !this.disabledItemsService.isIndexDisabled(index)) {
9608
9996
  this.selectionService.focus(index);
9609
9997
  }
@@ -9619,6 +10007,31 @@ class MultiSelectComponent {
9619
10007
  this.searchbar.focus();
9620
10008
  }
9621
10009
  }
10010
+ /**
10011
+ * @hidden
10012
+ */
10013
+ handleSelectAllStateChange(checkBoxState) {
10014
+ const availableItems = this.availableItemsForSelectAll;
10015
+ let newValue;
10016
+ if (checkBoxState === true) {
10017
+ const toAdd = availableItems.filter(item => !this.isItemSelected(item));
10018
+ newValue = [...this.value, ...toAdd];
10019
+ }
10020
+ else if (checkBoxState === false) {
10021
+ newValue = this.value.filter(v => !availableItems.some(item => getter(item, this.valueField) === getter(v, this.valueField)));
10022
+ }
10023
+ else {
10024
+ return;
10025
+ }
10026
+ this.preserveFocusIndex = -2;
10027
+ this.value = newValue;
10028
+ this.isAllSelected = this.isAllSelectedComputed;
10029
+ this.isPartiallySelected = this.isPartiallySelectedComputed;
10030
+ this.emitValueChange();
10031
+ this.cdr.markForCheck();
10032
+ const state = this.isAllSelected ? 'checked' : this.isPartiallySelected ? 'indeterminate' : 'unchecked';
10033
+ this.selectAllChange.emit(state);
10034
+ }
9622
10035
  /**
9623
10036
  * @hidden
9624
10037
  */
@@ -9671,8 +10084,9 @@ class MultiSelectComponent {
9671
10084
  isUntouched(this.wrapper.nativeElement) ||
9672
10085
  this.formControl?.updateOn === 'blur') {
9673
10086
  this._zone.run(() => {
10087
+ const preserveFilter = this.allowCustom && !!this.text;
9674
10088
  this.closePopup();
9675
- if (!(this.isOpen && this.allowCustom)) {
10089
+ if (!preserveFilter) {
9676
10090
  this.clearFilter();
9677
10091
  }
9678
10092
  this.inputBlur.emit();
@@ -9724,6 +10138,22 @@ class MultiSelectComponent {
9724
10138
  * By default the sticky header is displayed ([see example](https://www.telerik.com/kendo-angular-ui/components/dropdowns/autocomplete/grouping#sticky-header)).
9725
10139
  */
9726
10140
  showStickyHeader = true;
10141
+ /**
10142
+ * Renders a Select All sticky header item at the top of the popup list.
10143
+ * Clicking it selects or deselects all currently available items and triggers the `valueChange` event.
10144
+ *
10145
+ * @default false
10146
+ */
10147
+ selectAll = false;
10148
+ /**
10149
+ * Sets the number of selected items after which a summary chip replaces the remaining individual chips.
10150
+ * Set to `0` to always show a single summary chip.
10151
+ * Pass `null` to disable summarization.
10152
+ * When `selectAll` is enabled and this input is not explicitly set, defaults to `10`.
10153
+ *
10154
+ * @default null
10155
+ */
10156
+ summaryTagAfter;
9727
10157
  /**
9728
10158
  * @hidden
9729
10159
  */
@@ -10068,6 +10498,11 @@ class MultiSelectComponent {
10068
10498
  * You can prevent tag removal by calling `preventDefault()` on the event.
10069
10499
  */
10070
10500
  removeTag = new EventEmitter();
10501
+ /**
10502
+ * Emitted when the Select All item state changes.
10503
+ * Useful for virtualization scenarios where the consumer manages the full dataset.
10504
+ */
10505
+ selectAllChange = new EventEmitter();
10071
10506
  container;
10072
10507
  searchbar;
10073
10508
  tagList;
@@ -10141,6 +10576,33 @@ class MultiSelectComponent {
10141
10576
  _fillMode;
10142
10577
  _valueHolder = [];
10143
10578
  isCustomValueSelected = false;
10579
+ preserveFocusIndex = null;
10580
+ get isAllSelectedComputed() {
10581
+ const availableItems = this.availableItemsForSelectAll;
10582
+ if (availableItems.length === 0) {
10583
+ return false;
10584
+ }
10585
+ const allItemsSelected = availableItems.every(item => this.isItemSelected(item));
10586
+ return allItemsSelected;
10587
+ }
10588
+ get isPartiallySelectedComputed() {
10589
+ if (this.isAllSelected) {
10590
+ return false;
10591
+ }
10592
+ const availableItems = this.availableItemsForSelectAll;
10593
+ const hasPartialSelection = availableItems.some(item => this.isItemSelected(item));
10594
+ return hasPartialSelection;
10595
+ }
10596
+ get hasCustomValueItem() {
10597
+ return this.allowCustom && !!this.text;
10598
+ }
10599
+ get availableItemsForSelectAll() {
10600
+ const pageData = this.data;
10601
+ const data = this.dataService.grouped
10602
+ ? pageData.filter(item => !item.header).map(item => item.value)
10603
+ : pageData;
10604
+ return data;
10605
+ }
10144
10606
  constructor(wrapper, localization, popupService, dataService, selectionService, navigationService, disabledItemsService, cdr, differs, renderer, _zone, injector, adaptiveService) {
10145
10607
  this.wrapper = wrapper;
10146
10608
  this.localization = localization;
@@ -10244,6 +10706,7 @@ class MultiSelectComponent {
10244
10706
  * @hidden
10245
10707
  */
10246
10708
  change(event) {
10709
+ this.preserveFocusIndex = null;
10247
10710
  if (event.isMultipleSelection) {
10248
10711
  // Existing items.
10249
10712
  if (isPresent(event.added) && event.added.length > 0) {
@@ -10315,14 +10778,17 @@ class MultiSelectComponent {
10315
10778
  const data = this.getDataItems();
10316
10779
  const selection = selectedIndices(this.value, data, this.valueField);
10317
10780
  this.selectionService.resetSelection(selection);
10318
- if (this.disabledItemsService.isIndexDisabled(this.selectionService.focused)) {
10781
+ if (this.preserveFocusIndex !== null) {
10782
+ this.selectionService.focused = this.preserveFocusIndex;
10783
+ }
10784
+ else if (this.disabledItemsService.isIndexDisabled(this.selectionService.focused)) {
10319
10785
  this.selectionService.focused = this.firstFocusableIndex(0);
10320
10786
  }
10321
10787
  if (this.isOpen && this.selectionService.focused === undefined) {
10322
10788
  if (this.dataService.itemsCount > 0) {
10323
10789
  this.selectionService.focused = this.firstFocusableIndex(0);
10324
- if (this.allowCustom) {
10325
- this.selectionService.focused = 0;
10790
+ if (this.hasCustomValueItem) {
10791
+ this.selectionService.focused = -1;
10326
10792
  }
10327
10793
  }
10328
10794
  else if (this.allowCustom) {
@@ -10343,8 +10809,9 @@ class MultiSelectComponent {
10343
10809
  })
10344
10810
  .filter(dataItem => isPresent(dataItem));
10345
10811
  }
10346
- this.tags = this.tagMapper(this.selectedDataItems.slice(0));
10812
+ this.tags = this.buildTags(this.selectedDataItems.slice(0));
10347
10813
  this.disabledIndices = this.disabledItemsMapper();
10814
+ this.updateSelectAllState();
10348
10815
  this.cdr.markForCheck();
10349
10816
  }
10350
10817
  /**
@@ -10365,6 +10832,9 @@ class MultiSelectComponent {
10365
10832
  else {
10366
10833
  this.searchTextAndFocus(text);
10367
10834
  }
10835
+ if (this.selectAll && this.allowCustom && text) {
10836
+ this.selectionService.focused = -1;
10837
+ }
10368
10838
  this.searchbar.setInputSize();
10369
10839
  }
10370
10840
  /**
@@ -10373,6 +10843,7 @@ class MultiSelectComponent {
10373
10843
  pageChange(event) {
10374
10844
  const virtual = this.virtual;
10375
10845
  virtual.skip = event.skip;
10846
+ this.updateSelectAllState();
10376
10847
  }
10377
10848
  /**
10378
10849
  * @hidden
@@ -10411,7 +10882,7 @@ class MultiSelectComponent {
10411
10882
  const action = this.navigationService.process({
10412
10883
  current: focused,
10413
10884
  max: this.dataService.itemsCount - 1,
10414
- min: this.allowCustom && this.text ? -1 : 0,
10885
+ min: this.selectAll ? -2 : (this.hasCustomValueItem ? -1 : 0),
10415
10886
  open: this.isOpen,
10416
10887
  originalEvent: eventData
10417
10888
  });
@@ -10499,7 +10970,10 @@ class MultiSelectComponent {
10499
10970
  if (isChanged('valueNormalizer', changes)) {
10500
10971
  this.createCustomValueStream();
10501
10972
  }
10502
- if (anyChanged(['textField', 'valueField', 'valuePrimitive'], changes)) {
10973
+ if (anyChanged(['selectAll', 'summaryTagAfter'], changes, false)) {
10974
+ this.refreshSummaryTagMapper();
10975
+ }
10976
+ if (anyChanged(['textField', 'valueField', 'valuePrimitive', 'selectAll', 'summaryTagAfter'], changes)) {
10503
10977
  this.setState(this.value);
10504
10978
  }
10505
10979
  }
@@ -10583,13 +11057,6 @@ class MultiSelectComponent {
10583
11057
  this.cdr.markForCheck();
10584
11058
  this.disabled = isDisabled;
10585
11059
  }
10586
- /**
10587
- * @hidden
10588
- */
10589
- onTagMapperChange() {
10590
- this.tags = this.tagMapper(this.selectedDataItems.slice(0));
10591
- this.cdr.markForCheck();
10592
- }
10593
11060
  /**
10594
11061
  * @hidden
10595
11062
  */
@@ -10776,7 +11243,7 @@ class MultiSelectComponent {
10776
11243
  const itemIndex = this.dataService.indexOf(newValue);
10777
11244
  const customItem = itemIndex === -1;
10778
11245
  if (this.value.indexOf(newValue) === -1) {
10779
- !this.isActionSheetExpanded && (this.tags = this.tagMapper([...this.selectedDataItems, normalizedValue]));
11246
+ !this.isActionSheetExpanded && (this.tags = this.buildTags([...this.selectedDataItems, normalizedValue]));
10780
11247
  if (!customItem) {
10781
11248
  this.selectionService.add(itemIndex);
10782
11249
  }
@@ -10867,6 +11334,13 @@ class MultiSelectComponent {
10867
11334
  if (this.isOpen) {
10868
11335
  event.originalEvent.preventDefault();
10869
11336
  }
11337
+ if (focusedIndex === -2) {
11338
+ if (this.selectAll && this.data.length > 0) {
11339
+ const newState = !this.isAllSelected;
11340
+ this.handleSelectAllStateChange(newState);
11341
+ }
11342
+ return;
11343
+ }
10870
11344
  if (focusedIndex === -1) {
10871
11345
  if (this.allowCustom && this.text) {
10872
11346
  this.addCustomValue(this.text);
@@ -10977,7 +11451,8 @@ class MultiSelectComponent {
10977
11451
  this.nextTick(() => this.selectionService.focus(indexToSelect));
10978
11452
  }
10979
11453
  handleUp(index) {
10980
- this.selectionService.focused = index;
11454
+ this.preserveFocusIndex = null;
11455
+ this.selectionService.focused = this.calculateNavigationIndex(index);
10981
11456
  }
10982
11457
  handleBackspace() {
10983
11458
  if (this.focusedTagIndex !== undefined) {
@@ -11003,13 +11478,24 @@ class MultiSelectComponent {
11003
11478
  }
11004
11479
  }
11005
11480
  handleDownKey(index) {
11481
+ this.preserveFocusIndex = null;
11006
11482
  if (this.isOpen) {
11483
+ index = this.calculateNavigationIndex(index);
11007
11484
  this.selectionService.focused = index || this.firstFocusableIndex(0);
11008
11485
  }
11009
11486
  else {
11010
11487
  this.openPopup();
11011
11488
  }
11012
11489
  }
11490
+ calculateNavigationIndex(index) {
11491
+ if (index === 0 && !isPresent(this.selectionService.focused)) {
11492
+ return this.hasCustomValueItem ? -1 : (this.selectAll ? -2 : 0);
11493
+ }
11494
+ if (index === -1 && !this.hasCustomValueItem) {
11495
+ return this.selectionService.focused < index ? 0 : (this.selectAll ? -2 : 0);
11496
+ }
11497
+ return index;
11498
+ }
11013
11499
  handleRightKey() {
11014
11500
  const last = this.tags.length - 1;
11015
11501
  if (this.focusedTagIndex === last) {
@@ -11149,6 +11635,71 @@ class MultiSelectComponent {
11149
11635
  this.togglePopup(false);
11150
11636
  });
11151
11637
  }
11638
+ buildTags(items) {
11639
+ if (this.allowCustom && this.selectAll && this.valueField) {
11640
+ const data = this.getDataItems();
11641
+ const dataItemValues = new Set(data.map(item => getter(item, this.valueField)));
11642
+ const listItems = [];
11643
+ const customItems = [];
11644
+ items.forEach(item => {
11645
+ const itemValue = getter(item, this.valueField);
11646
+ if (dataItemValues.has(itemValue)) {
11647
+ listItems.push(item);
11648
+ }
11649
+ else {
11650
+ customItems.push(item);
11651
+ }
11652
+ });
11653
+ const hasExplicitSummaryTagAfter = this.summaryTagAfter !== undefined;
11654
+ const totalItems = listItems.length + customItems.length;
11655
+ const result = [];
11656
+ const effectiveSummaryAfter = hasExplicitSummaryTagAfter ? this.summaryTagAfter : (this.selectAll ? 10 : null);
11657
+ const shouldCreateSummaryTag = listItems.length > 0 &&
11658
+ (effectiveSummaryAfter !== null && totalItems > effectiveSummaryAfter);
11659
+ if (shouldCreateSummaryTag) {
11660
+ result.push(listItems);
11661
+ customItems.forEach(item => {
11662
+ result.push(item);
11663
+ });
11664
+ }
11665
+ else {
11666
+ if (listItems.length > 0) {
11667
+ listItems.forEach(item => {
11668
+ result.push(item);
11669
+ });
11670
+ }
11671
+ customItems.forEach(item => {
11672
+ result.push(item);
11673
+ });
11674
+ if (effectiveSummaryAfter !== null && result.length > effectiveSummaryAfter) {
11675
+ const summarized = result.slice(0, effectiveSummaryAfter);
11676
+ summarized.push(result.slice(effectiveSummaryAfter));
11677
+ return summarized;
11678
+ }
11679
+ }
11680
+ return result;
11681
+ }
11682
+ return this.tagMapper(items);
11683
+ }
11684
+ refreshSummaryTagMapper() {
11685
+ const effectiveSummaryAfter = this.summaryTagAfter !== undefined
11686
+ ? this.summaryTagAfter
11687
+ : (this.selectAll ? 10 : null);
11688
+ if (effectiveSummaryAfter !== null) {
11689
+ const showAfter = effectiveSummaryAfter;
11690
+ this.tagMapper = (tags) => {
11691
+ if (tags.length > showAfter) {
11692
+ const result = tags.slice(0, showAfter);
11693
+ result.push(tags.slice(showAfter, tags.length));
11694
+ return result;
11695
+ }
11696
+ return tags.slice ? tags.slice() : tags;
11697
+ };
11698
+ }
11699
+ else {
11700
+ this.tagMapper = (tags) => tags || [];
11701
+ }
11702
+ }
11152
11703
  emitValueChange() {
11153
11704
  this.onChangeCallback(this.value);
11154
11705
  this.valueChange.emit(this.value);
@@ -11221,8 +11772,9 @@ class MultiSelectComponent {
11221
11772
  hasObservers(this.close) ||
11222
11773
  isUntouched(this.wrapper.nativeElement)) {
11223
11774
  this._zone.run(() => {
11775
+ const preserveFilter = this.allowCustom && !!this.text;
11224
11776
  this.closePopup();
11225
- if (!(this.isOpen && this.allowCustom)) {
11777
+ if (!preserveFilter) {
11226
11778
  this.clearFilter();
11227
11779
  }
11228
11780
  this.onBlur.emit();
@@ -11236,8 +11788,17 @@ class MultiSelectComponent {
11236
11788
  this.closePopup();
11237
11789
  }
11238
11790
  }
11239
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: DataService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: i0.ChangeDetectorRef }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.Injector }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
11240
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: MultiSelectComponent, isStandalone: true, selector: "kendo-multiselect", inputs: { showStickyHeader: "showStickyHeader", focusableId: "focusableId", autoClose: "autoClose", loading: "loading", data: "data", value: "value", valueField: "valueField", textField: "textField", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", placeholder: "placeholder", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", disabled: "disabled", itemDisabled: "itemDisabled", checkboxes: "checkboxes", readonly: "readonly", filterable: "filterable", virtual: "virtual", popupSettings: "popupSettings", listHeight: "listHeight", valuePrimitive: "valuePrimitive", clearButton: "clearButton", tagMapper: "tagMapper", allowCustom: "allowCustom", valueNormalizer: "valueNormalizer", inputAttributes: "inputAttributes" }, outputs: { filterChange: "filterChange", valueChange: "valueChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur", removeTag: "removeTag" }, host: { properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.dir", "class.k-disabled": "this.disabledClass", "class.k-loading": "this.isLoading" } }, providers: [
11791
+ isItemSelected(item) {
11792
+ return this.value.some(v => getter(v, this.valueField) === getter(item, this.valueField));
11793
+ }
11794
+ updateSelectAllState() {
11795
+ if (this.selectAll) {
11796
+ this.isAllSelected = this.isAllSelectedComputed;
11797
+ this.isPartiallySelected = this.isPartiallySelectedComputed;
11798
+ }
11799
+ }
11800
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: DataService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: i0.ChangeDetectorRef }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.Injector }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
11801
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: MultiSelectComponent, isStandalone: true, selector: "kendo-multiselect", inputs: { showStickyHeader: "showStickyHeader", selectAll: "selectAll", summaryTagAfter: "summaryTagAfter", focusableId: "focusableId", autoClose: "autoClose", loading: "loading", data: "data", value: "value", valueField: "valueField", textField: "textField", tabindex: "tabindex", tabIndex: "tabIndex", size: "size", rounded: "rounded", fillMode: "fillMode", placeholder: "placeholder", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", disabled: "disabled", itemDisabled: "itemDisabled", checkboxes: "checkboxes", readonly: "readonly", filterable: "filterable", virtual: "virtual", popupSettings: "popupSettings", listHeight: "listHeight", valuePrimitive: "valuePrimitive", clearButton: "clearButton", tagMapper: "tagMapper", allowCustom: "allowCustom", valueNormalizer: "valueNormalizer", inputAttributes: "inputAttributes" }, outputs: { filterChange: "filterChange", valueChange: "valueChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur", inputFocus: "inputFocus", inputBlur: "inputBlur", removeTag: "removeTag", selectAllChange: "selectAllChange" }, host: { properties: { "class.k-readonly": "this.readonly", "attr.dir": "this.dir", "class.k-disabled": "this.disabledClass", "class.k-loading": "this.isLoading" } }, providers: [
11241
11802
  MULTISELECT_VALUE_ACCESSOR,
11242
11803
  DataService,
11243
11804
  SelectionService,
@@ -11256,7 +11817,8 @@ class MultiSelectComponent {
11256
11817
  },
11257
11818
  {
11258
11819
  provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => MultiSelectComponent)
11259
- }
11820
+ },
11821
+ provideComponentName('multiselect')
11260
11822
  ], queries: [{ propertyName: "template", first: true, predicate: ItemTemplateDirective, descendants: true }, { propertyName: "customItemTemplate", first: true, predicate: CustomItemTemplateDirective, descendants: true }, { propertyName: "groupTemplate", first: true, predicate: GroupTemplateDirective, descendants: true }, { propertyName: "fixedGroupTemplate", first: true, predicate: FixedGroupTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: HeaderTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: FooterTemplateDirective, descendants: true }, { propertyName: "tagTemplate", first: true, predicate: TagTemplateDirective, descendants: true }, { propertyName: "groupTagTemplate", first: true, predicate: GroupTagTemplateDirective, descendants: true }, { propertyName: "noDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }, { propertyName: "suffixTemplate", first: true, predicate: SuffixTemplateDirective, descendants: true }, { propertyName: "prefixTemplate", first: true, predicate: PrefixTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "adaptiveRendererComponent", first: true, predicate: AdaptiveRendererComponent, descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "searchbar", first: true, predicate: SearchBarComponent, descendants: true, static: true }, { propertyName: "tagList", first: true, predicate: TagListComponent, descendants: true, static: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }], exportAs: ["kendoMultiSelect"], usesOnChanges: true, ngImport: i0, template: `
11261
11823
  <ng-container kendoMultiSelectLocalizedMessages
11262
11824
  i18n-noDataText="kendo.multiselect.noDataText|The text displayed in the popup when there are no items"
@@ -11265,6 +11827,9 @@ class MultiSelectComponent {
11265
11827
  i18n-clearTitle="kendo.multiselect.clearTitle|The title of the clear button"
11266
11828
  clearTitle="clear"
11267
11829
 
11830
+ i18n-chipListLabel="kendo.multiselect.chipListLabel|The accessible label of the tag list element that contains the selected items"
11831
+ chipListLabel="chip list"
11832
+
11268
11833
  i18n-popupLabel="kendo.multiselect.popupLabel|The label of the popup element that contains the list of options when its role is 'region'"
11269
11834
  popupLabel="Options list"
11270
11835
 
@@ -11272,7 +11837,13 @@ class MultiSelectComponent {
11272
11837
  adaptiveCloseButtonTitle="Close"
11273
11838
 
11274
11839
  i18n-useCustomValueText="kendo.multiselect.useCustomValueText|The text displayed when the user types a custom value that is not in the list of options."
11275
- useCustomValueText="{{ 'Use &quot;{customValue}&quot;' }}"
11840
+ useCustomValueText="Use &quot;[[customValue]]&quot;"
11841
+
11842
+ i18n-listboxLabel="kendo.multiselect.listboxLabel|The accessible label of the listbox that contains the list of options"
11843
+ listboxLabel="Options"
11844
+
11845
+ i18n-selectAllText="kendo.multiselect.selectAllText|The text of the Select All item in the popup"
11846
+ selectAllText="Select All"
11276
11847
  >
11277
11848
  </ng-container>
11278
11849
 
@@ -11307,17 +11878,18 @@ class MultiSelectComponent {
11307
11878
  [groupTemplate]="groupTagTemplate"
11308
11879
  [tagPrefix]="tagPrefix"
11309
11880
  [disabledIndices]="disabledIndices"
11881
+ [ariaLabel]="messageFor('chipListLabel')"
11310
11882
  (removeTag)="handleRemoveTag($event)"
11311
11883
  >
11312
11884
  </kendo-taglist>
11313
11885
  <input
11314
11886
  kendoSearchbar
11315
11887
  [ariaControls]="ariaControls"
11316
- [ariaExpanded]="isOpen"
11888
+ [ariaExpanded]="isAdaptive ? false : isOpen"
11317
11889
  [id]="focusableId"
11318
11890
  [tagListId]="tagListId"
11319
11891
  [isLoading]="loading"
11320
- [isFilterable]="filterable"
11892
+ [hasListAutocomplete]="filterable"
11321
11893
  [activeDescendant]="activeDescendant"
11322
11894
  [userInput]="text"
11323
11895
  [disabled]="disabled"
@@ -11344,7 +11916,6 @@ class MultiSelectComponent {
11344
11916
  (mousedown)="clearAll($event)"
11345
11917
  >
11346
11918
  <kendo-icon-wrapper
11347
- class="k-icon"
11348
11919
  name="x"
11349
11920
  [svgIcon]="xIcon"
11350
11921
  >
@@ -11419,26 +11990,32 @@ class MultiSelectComponent {
11419
11990
  [isMultiselect]="true"
11420
11991
  [isActionSheetExpanded]="isActionSheetExpanded"
11421
11992
  [showStickyHeader]="showStickyHeader"
11993
+ [selectAll]="selectAll && data.length > 0"
11994
+ [selectAllText]="messageFor('selectAllText')"
11995
+ [isAllSelected]="isAllSelected"
11996
+ [isPartiallySelected]="isPartiallySelected"
11997
+ (selectAllClick)="handleSelectAllStateChange($event)"
11422
11998
  [customItemTemplate]="customItemTemplate"
11423
11999
  [text]="text"
11424
12000
  [allowCustom]="allowCustom"
12001
+ [ariaLabel]="messageFor('listboxLabel')"
11425
12002
  >
12003
+ <!--no data template-->
12004
+ @if (data.length === 0) {
12005
+ <div class="k-no-data" [attr.aria-live]="'polite'">
12006
+ @if (noDataTemplate) {
12007
+ <ng-template
12008
+ [templateContext]="{
12009
+ templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
12010
+ }">
12011
+ </ng-template>
12012
+ }
12013
+ @if (!noDataTemplate) {
12014
+ <div>{{ messageFor('noDataText') }}</div>
12015
+ }
12016
+ </div>
12017
+ }
11426
12018
  </kendo-list>
11427
- <!--no data template-->
11428
- @if (data.length === 0) {
11429
- <div class="k-no-data" [attr.aria-live]="'polite'">
11430
- @if (noDataTemplate) {
11431
- <ng-template
11432
- [templateContext]="{
11433
- templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
11434
- }">
11435
- </ng-template>
11436
- }
11437
- @if (!noDataTemplate) {
11438
- <div>{{ messageFor('noDataText') }}</div>
11439
- }
11440
- </div>
11441
- }
11442
12019
  <!--footer template-->
11443
12020
  @if (footerTemplate) {
11444
12021
  <ng-template
@@ -11448,9 +12025,9 @@ class MultiSelectComponent {
11448
12025
  </ng-template>
11449
12026
  }
11450
12027
  </ng-template>
11451
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: TagListComponent, selector: "kendo-taglist", inputs: ["tags", "textField", "valueField", "valueDepth", "focused", "template", "groupTemplate", "disabled", "tagPrefix", "id", "size", "rounded", "fillMode", "disabledIndices"], outputs: ["removeTag"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "isFilterable", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "customItemTemplate", "text", "allowCustom", "defaultItem", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }] });
12028
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: TagListComponent, selector: "kendo-taglist", inputs: ["tags", "textField", "valueField", "valueDepth", "focused", "template", "groupTemplate", "disabled", "tagPrefix", "id", "ariaLabel", "size", "rounded", "fillMode", "disabledIndices"], outputs: ["removeTag"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "hasListAutocomplete", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable", "showListContainer"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "ariaLabel", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "columnsWidths", "customItemTemplate", "text", "allowCustom", "defaultItem", "selectAll", "selectAllText", "isAllSelected", "isPartiallySelected", "data", "size", "rounded"], outputs: ["selectAllClick", "onClick", "pageChange", "listResize", "popupListScroll"] }] });
11452
12029
  }
11453
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectComponent, decorators: [{
12030
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectComponent, decorators: [{
11454
12031
  type: Component,
11455
12032
  args: [{
11456
12033
  exportAs: 'kendoMultiSelect',
@@ -11473,7 +12050,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11473
12050
  },
11474
12051
  {
11475
12052
  provide: KENDO_WEBMCP_HOST, useExisting: forwardRef(() => MultiSelectComponent)
11476
- }
12053
+ },
12054
+ provideComponentName('multiselect')
11477
12055
  ],
11478
12056
  selector: 'kendo-multiselect',
11479
12057
  template: `
@@ -11484,6 +12062,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11484
12062
  i18n-clearTitle="kendo.multiselect.clearTitle|The title of the clear button"
11485
12063
  clearTitle="clear"
11486
12064
 
12065
+ i18n-chipListLabel="kendo.multiselect.chipListLabel|The accessible label of the tag list element that contains the selected items"
12066
+ chipListLabel="chip list"
12067
+
11487
12068
  i18n-popupLabel="kendo.multiselect.popupLabel|The label of the popup element that contains the list of options when its role is 'region'"
11488
12069
  popupLabel="Options list"
11489
12070
 
@@ -11491,7 +12072,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11491
12072
  adaptiveCloseButtonTitle="Close"
11492
12073
 
11493
12074
  i18n-useCustomValueText="kendo.multiselect.useCustomValueText|The text displayed when the user types a custom value that is not in the list of options."
11494
- useCustomValueText="{{ 'Use &quot;{customValue}&quot;' }}"
12075
+ useCustomValueText="Use &quot;[[customValue]]&quot;"
12076
+
12077
+ i18n-listboxLabel="kendo.multiselect.listboxLabel|The accessible label of the listbox that contains the list of options"
12078
+ listboxLabel="Options"
12079
+
12080
+ i18n-selectAllText="kendo.multiselect.selectAllText|The text of the Select All item in the popup"
12081
+ selectAllText="Select All"
11495
12082
  >
11496
12083
  </ng-container>
11497
12084
 
@@ -11526,17 +12113,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11526
12113
  [groupTemplate]="groupTagTemplate"
11527
12114
  [tagPrefix]="tagPrefix"
11528
12115
  [disabledIndices]="disabledIndices"
12116
+ [ariaLabel]="messageFor('chipListLabel')"
11529
12117
  (removeTag)="handleRemoveTag($event)"
11530
12118
  >
11531
12119
  </kendo-taglist>
11532
12120
  <input
11533
12121
  kendoSearchbar
11534
12122
  [ariaControls]="ariaControls"
11535
- [ariaExpanded]="isOpen"
12123
+ [ariaExpanded]="isAdaptive ? false : isOpen"
11536
12124
  [id]="focusableId"
11537
12125
  [tagListId]="tagListId"
11538
12126
  [isLoading]="loading"
11539
- [isFilterable]="filterable"
12127
+ [hasListAutocomplete]="filterable"
11540
12128
  [activeDescendant]="activeDescendant"
11541
12129
  [userInput]="text"
11542
12130
  [disabled]="disabled"
@@ -11563,7 +12151,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11563
12151
  (mousedown)="clearAll($event)"
11564
12152
  >
11565
12153
  <kendo-icon-wrapper
11566
- class="k-icon"
11567
12154
  name="x"
11568
12155
  [svgIcon]="xIcon"
11569
12156
  >
@@ -11638,26 +12225,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11638
12225
  [isMultiselect]="true"
11639
12226
  [isActionSheetExpanded]="isActionSheetExpanded"
11640
12227
  [showStickyHeader]="showStickyHeader"
12228
+ [selectAll]="selectAll && data.length > 0"
12229
+ [selectAllText]="messageFor('selectAllText')"
12230
+ [isAllSelected]="isAllSelected"
12231
+ [isPartiallySelected]="isPartiallySelected"
12232
+ (selectAllClick)="handleSelectAllStateChange($event)"
11641
12233
  [customItemTemplate]="customItemTemplate"
11642
12234
  [text]="text"
11643
12235
  [allowCustom]="allowCustom"
12236
+ [ariaLabel]="messageFor('listboxLabel')"
11644
12237
  >
12238
+ <!--no data template-->
12239
+ @if (data.length === 0) {
12240
+ <div class="k-no-data" [attr.aria-live]="'polite'">
12241
+ @if (noDataTemplate) {
12242
+ <ng-template
12243
+ [templateContext]="{
12244
+ templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
12245
+ }">
12246
+ </ng-template>
12247
+ }
12248
+ @if (!noDataTemplate) {
12249
+ <div>{{ messageFor('noDataText') }}</div>
12250
+ }
12251
+ </div>
12252
+ }
11645
12253
  </kendo-list>
11646
- <!--no data template-->
11647
- @if (data.length === 0) {
11648
- <div class="k-no-data" [attr.aria-live]="'polite'">
11649
- @if (noDataTemplate) {
11650
- <ng-template
11651
- [templateContext]="{
11652
- templateRef: noDataTemplate ? noDataTemplate.templateRef : undefined
11653
- }">
11654
- </ng-template>
11655
- }
11656
- @if (!noDataTemplate) {
11657
- <div>{{ messageFor('noDataText') }}</div>
11658
- }
11659
- </div>
11660
- }
11661
12254
  <!--footer template-->
11662
12255
  @if (footerTemplate) {
11663
12256
  <ng-template
@@ -11676,6 +12269,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11676
12269
  args: [AdaptiveRendererComponent]
11677
12270
  }], showStickyHeader: [{
11678
12271
  type: Input
12272
+ }], selectAll: [{
12273
+ type: Input
12274
+ }], summaryTagAfter: [{
12275
+ type: Input
11679
12276
  }], focusableId: [{
11680
12277
  type: Input
11681
12278
  }], autoClose: [{
@@ -11764,6 +12361,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
11764
12361
  type: Output
11765
12362
  }], removeTag: [{
11766
12363
  type: Output
12364
+ }], selectAllChange: [{
12365
+ type: Output
11767
12366
  }], container: [{
11768
12367
  type: ViewChild,
11769
12368
  args: ['container', { read: ViewContainerRef, static: true }]
@@ -11849,10 +12448,10 @@ class ColumnCellTemplateDirective {
11849
12448
  constructor(templateRef) {
11850
12449
  this.templateRef = templateRef;
11851
12450
  }
11852
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ColumnCellTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
11853
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: ColumnCellTemplateDirective, isStandalone: true, selector: "[kendoMultiColumnComboBoxColumnCellTemplate]", ngImport: i0 });
12451
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ColumnCellTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
12452
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: ColumnCellTemplateDirective, isStandalone: true, selector: "[kendoMultiColumnComboBoxColumnCellTemplate]", ngImport: i0 });
11854
12453
  }
11855
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ColumnCellTemplateDirective, decorators: [{
12454
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ColumnCellTemplateDirective, decorators: [{
11856
12455
  type: Directive,
11857
12456
  args: [{
11858
12457
  selector: '[kendoMultiColumnComboBoxColumnCellTemplate]',
@@ -11884,10 +12483,10 @@ class ColumnHeaderTemplateDirective {
11884
12483
  constructor(templateRef) {
11885
12484
  this.templateRef = templateRef;
11886
12485
  }
11887
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ColumnHeaderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
11888
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: ColumnHeaderTemplateDirective, isStandalone: true, selector: "[kendoMultiColumnComboBoxColumnHeaderTemplate]", ngImport: i0 });
12486
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ColumnHeaderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
12487
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: ColumnHeaderTemplateDirective, isStandalone: true, selector: "[kendoMultiColumnComboBoxColumnHeaderTemplate]", ngImport: i0 });
11889
12488
  }
11890
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ColumnHeaderTemplateDirective, decorators: [{
12489
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ColumnHeaderTemplateDirective, decorators: [{
11891
12490
  type: Directive,
11892
12491
  args: [{
11893
12492
  selector: '[kendoMultiColumnComboBoxColumnHeaderTemplate]',
@@ -11968,10 +12567,10 @@ class ComboBoxColumnComponent {
11968
12567
  * @hidden
11969
12568
  */
11970
12569
  matchesMedia = true;
11971
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
11972
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: ComboBoxColumnComponent, isStandalone: true, selector: "kendo-combobox-column", inputs: { field: "field", title: "title", width: "width", hidden: "hidden", style: "style", headerStyle: "headerStyle", class: "class", headerClass: "headerClass", media: "media" }, queries: [{ propertyName: "cellTemplate", first: true, predicate: ColumnCellTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ColumnHeaderTemplateDirective, descendants: true }], ngImport: i0, template: '', isInline: true });
12570
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
12571
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.26", type: ComboBoxColumnComponent, isStandalone: true, selector: "kendo-combobox-column", inputs: { field: "field", title: "title", width: "width", hidden: "hidden", style: "style", headerStyle: "headerStyle", class: "class", headerClass: "headerClass", media: "media" }, queries: [{ propertyName: "cellTemplate", first: true, predicate: ColumnCellTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ColumnHeaderTemplateDirective, descendants: true }], ngImport: i0, template: '', isInline: true });
11973
12572
  }
11974
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxColumnComponent, decorators: [{
12573
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxColumnComponent, decorators: [{
11975
12574
  type: Component,
11976
12575
  args: [{
11977
12576
  selector: 'kendo-combobox-column',
@@ -12113,6 +12712,17 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12113
12712
  * @hidden
12114
12713
  */
12115
12714
  totalColumnsWidth;
12715
+ /**
12716
+ * @hidden
12717
+ */
12718
+ get visibleColumnsWidths() {
12719
+ return this.columns.reduce((widths, column, index) => {
12720
+ if (!column.hidden && column.matchesMedia) {
12721
+ widths.push(this.getColumnWidth(index));
12722
+ }
12723
+ return widths;
12724
+ }, []);
12725
+ }
12116
12726
  get popupWidth() {
12117
12727
  const wrapperOffsetWidth = this.wrapper.nativeElement.offsetWidth;
12118
12728
  const min = `${wrapperOffsetWidth}px`;
@@ -12127,7 +12737,8 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12127
12737
  * @hidden
12128
12738
  */
12129
12739
  get tableSizeClass() {
12130
- return `${this.size ? getSizeClass('table', this.size) : ''}`;
12740
+ const effectiveSize = this.isAdaptive ? 'large' : this.size;
12741
+ return `${effectiveSize ? getSizeClass('table', effectiveSize) : ''}`;
12131
12742
  }
12132
12743
  /**
12133
12744
  * @hidden
@@ -12246,8 +12857,8 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12246
12857
  }
12247
12858
  return this.headerTable?.nativeElement.offsetWidth;
12248
12859
  }
12249
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiColumnComboBoxComponent, deps: [{ token: i1.LocalizationService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.Injector }, { token: i0.ElementRef }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
12250
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: MultiColumnComboBoxComponent, isStandalone: true, selector: "kendo-multicolumncombobox", host: { properties: { "class.k-dropdowngrid": "this.hostClasses", "class.k-disabled": "this.isDisabled" } }, providers: [
12860
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiColumnComboBoxComponent, deps: [{ token: i1.LocalizationService }, { token: i2.PopupService }, { token: SelectionService }, { token: NavigationService }, { token: DisabledItemsService }, { token: DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.Injector }, { token: i0.ElementRef }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
12861
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: MultiColumnComboBoxComponent, isStandalone: true, selector: "kendo-multicolumncombobox", host: { properties: { "class.k-dropdowngrid": "this.hostClasses", "class.k-disabled": "this.isDisabled" } }, providers: [
12251
12862
  SelectionService,
12252
12863
  DataService,
12253
12864
  NavigationService,
@@ -12277,7 +12888,8 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12277
12888
  {
12278
12889
  provide: KENDO_WEBMCP_HOST,
12279
12890
  useExisting: forwardRef(() => MultiColumnComboBoxComponent)
12280
- }
12891
+ },
12892
+ provideComponentName('multicolumncombobox')
12281
12893
  ], queries: [{ propertyName: "columns", predicate: ComboBoxColumnComponent }], viewQueries: [{ propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "headerTable", first: true, predicate: ["headerTable"], descendants: true }, { propertyName: "headerColumns", predicate: ["columnHeader"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
12282
12894
  <ng-container
12283
12895
  kendoMultiColumnComboBoxLocalizedMessages
@@ -12296,6 +12908,8 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12296
12908
  popupLabel="Options list"
12297
12909
  i18n-adaptiveCloseButtonTitle="kendo.multicolumncombobox.adaptiveCloseButtonTitle|The title of the Close button of the ActionSheet that is rendered instead of the Popup when using small screen devices in adaptive mode"
12298
12910
  adaptiveCloseButtonTitle="Close"
12911
+ i18n-listboxLabel="kendo.multicolumncombobox.listboxLabel|The accessible label of the listbox that contains the list of options"
12912
+ listboxLabel="Options"
12299
12913
  ></ng-container>
12300
12914
 
12301
12915
  <ng-container
@@ -12317,11 +12931,11 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12317
12931
  <input
12318
12932
  kendoSearchbar
12319
12933
  [ariaControls]="ariaControls"
12320
- [ariaExpanded]="isOpen"
12934
+ [ariaExpanded]="isAdaptive ? false : isOpen"
12321
12935
  [id]="focusableId"
12322
12936
  [isLoading]="loading"
12323
12937
  [isSuggestable]="suggest"
12324
- [isFilterable]="filterable"
12938
+ [hasListAutocomplete]="filterable"
12325
12939
  [activeDescendant]="activeDescendant"
12326
12940
  [userInput]="text"
12327
12941
  [suggestedText]="getSuggestion()"
@@ -12425,7 +13039,7 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12425
13039
  <!--grid header-->
12426
13040
  <div #header class="k-table-header">
12427
13041
  <div #headerWrap class="k-table-header-wrap">
12428
- <table #headerTable class="k-table" role="presentation">
13042
+ <table #headerTable class="k-table">
12429
13043
  <colgroup>
12430
13044
  @for (column of columns; track column) {
12431
13045
  @if (!column.hidden && column.matchesMedia) {
@@ -12509,7 +13123,9 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12509
13123
  [virtual]="virtual"
12510
13124
  [type]="'dropdowngrid'"
12511
13125
  [rowWidth]="rowWidth"
13126
+ [columnsWidths]="visibleColumnsWidths"
12512
13127
  [showStickyHeader]="showStickyHeader"
13128
+ [ariaLabel]="messageFor('listboxLabel')"
12513
13129
  (pageChange)="pageChange($event)"
12514
13130
  (listResize)="updateHeaderPadding(header)"
12515
13131
  (popupListScroll)="headerWrap.scrollLeft = $event.target.scrollLeft;"
@@ -12536,27 +13152,21 @@ class MultiColumnComboBoxComponent extends ComboBoxComponent {
12536
13152
  <!--user-defined footer template-->
12537
13153
  @if (footerTemplate) {
12538
13154
  <div class="k-table-footer">
12539
- <table class="k-table">
12540
- <tfoot class="k-table-tfoot">
12541
- <tr class="k-table-row">
12542
- <td class="k-table-td">
12543
- <ng-template
13155
+ <span class="k-table-td">
13156
+ <ng-template
12544
13157
  [templateContext]="{
12545
13158
  templateRef: footerTemplate.templateRef
12546
13159
  }"
12547
- >
12548
- </ng-template>
12549
- </td>
12550
- </tr>
12551
- </tfoot>
12552
- </table>
13160
+ >
13161
+ </ng-template>
13162
+ </span>
12553
13163
  </div>
12554
13164
  }
12555
13165
  </div>
12556
13166
  </ng-template>
12557
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "isFilterable", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "customItemTemplate", "text", "allowCustom", "defaultItem", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }] });
13167
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: SharedDropDownEventsDirective, selector: "[kendoDropDownSharedEvents]", inputs: ["hostElement", "clearButtonClicked", "isFocused"], outputs: ["isFocusedChange", "onFocus", "handleBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "component", type: SearchBarComponent, selector: "input[kendoSearchbar]", inputs: ["tagListId", "readonly", "disabled", "isRequired", "isSuggestable", "hasListAutocomplete", "userInput", "suggestedText", "inputAttributes", "id", "activeDescendant", "tabIndex", "isLoading", "ariaControls", "ariaExpanded", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable", "showListContainer"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "ariaLabel", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "rowWidth", "columnsWidths", "customItemTemplate", "text", "allowCustom", "defaultItem", "selectAll", "selectAllText", "isAllSelected", "isPartiallySelected", "data", "size", "rounded"], outputs: ["selectAllClick", "onClick", "pageChange", "listResize", "popupListScroll"] }] });
12558
13168
  }
12559
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiColumnComboBoxComponent, decorators: [{
13169
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiColumnComboBoxComponent, decorators: [{
12560
13170
  type: Component,
12561
13171
  args: [{
12562
13172
  providers: [
@@ -12589,7 +13199,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
12589
13199
  {
12590
13200
  provide: KENDO_WEBMCP_HOST,
12591
13201
  useExisting: forwardRef(() => MultiColumnComboBoxComponent)
12592
- }
13202
+ },
13203
+ provideComponentName('multicolumncombobox')
12593
13204
  ],
12594
13205
  selector: 'kendo-multicolumncombobox',
12595
13206
  template: `
@@ -12610,6 +13221,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
12610
13221
  popupLabel="Options list"
12611
13222
  i18n-adaptiveCloseButtonTitle="kendo.multicolumncombobox.adaptiveCloseButtonTitle|The title of the Close button of the ActionSheet that is rendered instead of the Popup when using small screen devices in adaptive mode"
12612
13223
  adaptiveCloseButtonTitle="Close"
13224
+ i18n-listboxLabel="kendo.multicolumncombobox.listboxLabel|The accessible label of the listbox that contains the list of options"
13225
+ listboxLabel="Options"
12613
13226
  ></ng-container>
12614
13227
 
12615
13228
  <ng-container
@@ -12631,11 +13244,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
12631
13244
  <input
12632
13245
  kendoSearchbar
12633
13246
  [ariaControls]="ariaControls"
12634
- [ariaExpanded]="isOpen"
13247
+ [ariaExpanded]="isAdaptive ? false : isOpen"
12635
13248
  [id]="focusableId"
12636
13249
  [isLoading]="loading"
12637
13250
  [isSuggestable]="suggest"
12638
- [isFilterable]="filterable"
13251
+ [hasListAutocomplete]="filterable"
12639
13252
  [activeDescendant]="activeDescendant"
12640
13253
  [userInput]="text"
12641
13254
  [suggestedText]="getSuggestion()"
@@ -12739,7 +13352,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
12739
13352
  <!--grid header-->
12740
13353
  <div #header class="k-table-header">
12741
13354
  <div #headerWrap class="k-table-header-wrap">
12742
- <table #headerTable class="k-table" role="presentation">
13355
+ <table #headerTable class="k-table">
12743
13356
  <colgroup>
12744
13357
  @for (column of columns; track column) {
12745
13358
  @if (!column.hidden && column.matchesMedia) {
@@ -12823,7 +13436,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
12823
13436
  [virtual]="virtual"
12824
13437
  [type]="'dropdowngrid'"
12825
13438
  [rowWidth]="rowWidth"
13439
+ [columnsWidths]="visibleColumnsWidths"
12826
13440
  [showStickyHeader]="showStickyHeader"
13441
+ [ariaLabel]="messageFor('listboxLabel')"
12827
13442
  (pageChange)="pageChange($event)"
12828
13443
  (listResize)="updateHeaderPadding(header)"
12829
13444
  (popupListScroll)="headerWrap.scrollLeft = $event.target.scrollLeft;"
@@ -12850,20 +13465,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
12850
13465
  <!--user-defined footer template-->
12851
13466
  @if (footerTemplate) {
12852
13467
  <div class="k-table-footer">
12853
- <table class="k-table">
12854
- <tfoot class="k-table-tfoot">
12855
- <tr class="k-table-row">
12856
- <td class="k-table-td">
12857
- <ng-template
13468
+ <span class="k-table-td">
13469
+ <ng-template
12858
13470
  [templateContext]="{
12859
13471
  templateRef: footerTemplate.templateRef
12860
13472
  }"
12861
- >
12862
- </ng-template>
12863
- </td>
12864
- </tr>
12865
- </tfoot>
12866
- </table>
13473
+ >
13474
+ </ng-template>
13475
+ </span>
12867
13476
  </div>
12868
13477
  }
12869
13478
  </div>
@@ -12907,10 +13516,10 @@ class NodeTemplateDirective {
12907
13516
  constructor(templateRef) {
12908
13517
  this.templateRef = templateRef;
12909
13518
  }
12910
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NodeTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
12911
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: NodeTemplateDirective, isStandalone: true, selector: "[kendoDropDownTreeNodeTemplate], [kendoMultiSelectTreeNodeTemplate]", ngImport: i0 });
13519
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: NodeTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
13520
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: NodeTemplateDirective, isStandalone: true, selector: "[kendoDropDownTreeNodeTemplate], [kendoMultiSelectTreeNodeTemplate]", ngImport: i0 });
12912
13521
  }
12913
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NodeTemplateDirective, decorators: [{
13522
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: NodeTemplateDirective, decorators: [{
12914
13523
  type: Directive,
12915
13524
  args: [{
12916
13525
  selector: '[kendoDropDownTreeNodeTemplate], [kendoMultiSelectTreeNodeTemplate]',
@@ -12993,7 +13602,7 @@ class DropDownTreeComponent {
12993
13602
  return this.readonly ? '' : null;
12994
13603
  }
12995
13604
  get hostAriaInvalid() {
12996
- return this.formControl?.invalid ? true : null;
13605
+ return (this.formControl?.invalid && (this.formControl?.touched || this.formControl?.dirty)) ? true : null;
12997
13606
  }
12998
13607
  get isDisabled() {
12999
13608
  return this.disabled || null;
@@ -13005,7 +13614,7 @@ class DropDownTreeComponent {
13005
13614
  return this.loading ? 'true' : null;
13006
13615
  }
13007
13616
  get hostAriaControls() {
13008
- return this.isOpen ? this.treeViewId : null;
13617
+ return (!this.isAdaptive && this.isOpen) ? this.treeViewId : null;
13009
13618
  }
13010
13619
  get id() {
13011
13620
  return this.focusableId;
@@ -13017,7 +13626,7 @@ class DropDownTreeComponent {
13017
13626
  role = 'combobox';
13018
13627
  ariaHasPopup = 'tree';
13019
13628
  get isAriaExpanded() {
13020
- return this.isOpen;
13629
+ return this.isAdaptive ? false : this.isOpen;
13021
13630
  }
13022
13631
  get hostAriaAutocomplete() {
13023
13632
  return this.filterable ? 'list' : null;
@@ -13037,6 +13646,7 @@ class DropDownTreeComponent {
13037
13646
  // the treeview animations are initially disabled (we don't want expand animations during popup opening)
13038
13647
  // re-enables the animations for user interaction
13039
13648
  treeview.animate = true;
13649
+ treeview.loadMoreButtonRole = 'treeitem';
13040
13650
  this._treeview = treeview;
13041
13651
  }
13042
13652
  }
@@ -13337,7 +13947,12 @@ class DropDownTreeComponent {
13337
13947
  get isFilterActive() {
13338
13948
  return this.filterInput && document.activeElement === this.filterInput.nativeElement;
13339
13949
  }
13340
- popupRef;
13950
+ set popupRef(value) {
13951
+ this._popupRef.set(value);
13952
+ }
13953
+ get popupRef() {
13954
+ return this._popupRef();
13955
+ }
13341
13956
  /**
13342
13957
  * @hidden
13343
13958
  */
@@ -13492,6 +14107,7 @@ class DropDownTreeComponent {
13492
14107
  _size;
13493
14108
  _rounded;
13494
14109
  _fillMode;
14110
+ _popupRef = signal(null, ...(ngDevMode ? [{ debugName: "_popupRef" }] : []));
13495
14111
  _searchableNodes = [];
13496
14112
  _typedValue = '';
13497
14113
  printableCharacters = new Subject();
@@ -13736,7 +14352,7 @@ class DropDownTreeComponent {
13736
14352
  * @hidden
13737
14353
  */
13738
14354
  get popupContainerClasses() {
13739
- const containerClasses = ['k-dropdowntree-popup'];
14355
+ const containerClasses = ['k-list-container', 'k-dropdowntree-popup'];
13740
14356
  if (!this.popupSettings.popupClass) {
13741
14357
  return containerClasses;
13742
14358
  }
@@ -14194,8 +14810,8 @@ class DropDownTreeComponent {
14194
14810
  this.opened.emit();
14195
14811
  this.removeTreeViewFromTabOrder();
14196
14812
  }
14197
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreeComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i2.PopupService }, { token: NavigationService }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
14198
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DropDownTreeComponent, isStandalone: true, selector: "kendo-dropdowntree", inputs: { icon: "icon", svgIcon: "svgIcon", loading: "loading", clearButton: "clearButton", data: "data", value: "value", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", hasChildren: "hasChildren", fetchChildren: "fetchChildren", placeholder: "placeholder", popupSettings: "popupSettings", dataItem: "dataItem", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", itemDisabled: "itemDisabled", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", loadOnDemand: "loadOnDemand", filterable: "filterable", filter: "filter", focusableId: "focusableId", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle" }, outputs: { open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", onFocus: "focus", onBlur: "blur", valueChange: "valueChange", filterChange: "filterChange" }, host: { properties: { "class.k-dropdowntree": "this.hostClasses", "class.k-picker": "this.hostClasses", "attr.readonly": "this.isReadonly", "attr.aria-invalid": "this.hostAriaInvalid", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.aria-busy": "this.isBusy", "attr.aria-controls": "this.hostAriaControls", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-readonly": "this.readonly" } }, providers: [
14813
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreeComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i2.PopupService }, { token: NavigationService }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
14814
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: DropDownTreeComponent, isStandalone: true, selector: "kendo-dropdowntree", inputs: { icon: "icon", svgIcon: "svgIcon", loading: "loading", clearButton: "clearButton", data: "data", value: "value", textField: "textField", valueField: "valueField", valueDepth: "valueDepth", hasChildren: "hasChildren", fetchChildren: "fetchChildren", placeholder: "placeholder", popupSettings: "popupSettings", dataItem: "dataItem", listHeight: "listHeight", disabled: "disabled", readonly: "readonly", valuePrimitive: "valuePrimitive", tabindex: "tabindex", size: "size", rounded: "rounded", fillMode: "fillMode", itemDisabled: "itemDisabled", isNodeExpanded: "isNodeExpanded", isNodeVisible: "isNodeVisible", loadOnDemand: "loadOnDemand", filterable: "filterable", filter: "filter", focusableId: "focusableId", adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle" }, outputs: { open: "open", opened: "opened", close: "close", closed: "closed", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", onFocus: "focus", onBlur: "blur", valueChange: "valueChange", filterChange: "filterChange" }, host: { properties: { "class.k-dropdowntree": "this.hostClasses", "class.k-picker": "this.hostClasses", "attr.readonly": "this.isReadonly", "attr.aria-invalid": "this.hostAriaInvalid", "class.k-disabled": "this.isDisabled", "attr.aria-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.aria-busy": "this.isBusy", "attr.aria-controls": "this.hostAriaControls", "attr.id": "this.id", "attr.dir": "this.direction", "attr.tabindex": "this.hostTabIndex", "attr.role": "this.role", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.isAriaExpanded", "attr.aria-autocomplete": "this.hostAriaAutocomplete", "class.k-readonly": "this.readonly" } }, providers: [
14199
14815
  DataService,
14200
14816
  SelectionService,
14201
14817
  NavigationService,
@@ -14225,7 +14841,8 @@ class DropDownTreeComponent {
14225
14841
  {
14226
14842
  provide: KENDO_WEBMCP_HOST,
14227
14843
  useExisting: forwardRef(() => DropDownTreeComponent)
14228
- }
14844
+ },
14845
+ provideComponentName('dropdowntree')
14229
14846
  ], queries: [{ propertyName: "noDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: HeaderTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: FooterTemplateDirective, descendants: true }, { propertyName: "nodeTemplate", first: true, predicate: NodeTemplateDirective, descendants: true }, { propertyName: "valueTemplate", first: true, predicate: ValueTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "adaptiveRendererComponent", first: true, predicate: AdaptiveRendererComponent, descendants: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "treeview", first: true, predicate: ["treeview"], descendants: true }, { propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true }], exportAs: ["kendoDropDownTree"], usesOnChanges: true, ngImport: i0, template: `
14230
14847
  <ng-container kendoDropDownTreeLocalizedMessages
14231
14848
  i18n-noDataText="kendo.dropdowntree.noDataText|The text displayed in the popup when there are no items"
@@ -14314,6 +14931,7 @@ class DropDownTreeComponent {
14314
14931
  [title]="adaptiveTitle"
14315
14932
  [showTextInput]="filterable"
14316
14933
  [subtitle]="adaptiveSubtitle"
14934
+ [showListContainer]="false"
14317
14935
  (closePopup)="togglePopup(false)"
14318
14936
  (textInputChange)="handleFilterInputChange($event)"
14319
14937
  [placeholder]="placeholder"
@@ -14330,14 +14948,14 @@ class DropDownTreeComponent {
14330
14948
  class="k-textbox k-input"
14331
14949
  [ngClass]="filterInputClasses"
14332
14950
  >
14333
- <span class="k-input-prefix">
14951
+ <span class="k-input-prefix k-input-prefix-horizontal">
14334
14952
  <kendo-icon-wrapper
14335
- class="k-icon"
14336
14953
  name="search"
14337
14954
  [svgIcon]="searchIcon"
14338
14955
  >
14339
14956
  </kendo-icon-wrapper>
14340
14957
  </span>
14958
+ <kendo-separator></kendo-separator>
14341
14959
  <input
14342
14960
  #filterInput
14343
14961
  (input)="handleFilterInputChange($event.target)"
@@ -14369,7 +14987,7 @@ class DropDownTreeComponent {
14369
14987
  <kendo-treeview
14370
14988
  #treeview
14371
14989
  [attr.id]="treeViewId"
14372
- [size]="windowSize !== 'large' ? 'large' : size"
14990
+ [size]="isAdaptive ? 'large' : size"
14373
14991
  [nodes]="data"
14374
14992
  [style.maxHeight.px]="listHeight"
14375
14993
  [animate]="false"
@@ -14422,9 +15040,9 @@ class DropDownTreeComponent {
14422
15040
  @if (isOpen || isAdaptiveModeEnabled) {
14423
15041
  <kendo-resize-sensor (resize)="onResize()"></kendo-resize-sensor>
14424
15042
  }
14425
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: SelectDirective, selector: "[kendoTreeViewSelectable]", inputs: ["isSelected", "selectBy", "kendoTreeViewSelectable", "selectedKeys"], outputs: ["selectedKeysChange"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
15043
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable", "showListContainer"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "loadMoreButtonRole", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: SelectDirective, selector: "[kendoTreeViewSelectable]", inputs: ["isSelected", "selectBy", "kendoTreeViewSelectable", "selectedKeys"], outputs: ["selectedKeysChange"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
14426
15044
  }
14427
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreeComponent, decorators: [{
15045
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreeComponent, decorators: [{
14428
15046
  type: Component,
14429
15047
  args: [{
14430
15048
  exportAs: 'kendoDropDownTree',
@@ -14458,7 +15076,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
14458
15076
  {
14459
15077
  provide: KENDO_WEBMCP_HOST,
14460
15078
  useExisting: forwardRef(() => DropDownTreeComponent)
14461
- }
15079
+ },
15080
+ provideComponentName('dropdowntree')
14462
15081
  ],
14463
15082
  selector: 'kendo-dropdowntree',
14464
15083
  template: `
@@ -14549,6 +15168,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
14549
15168
  [title]="adaptiveTitle"
14550
15169
  [showTextInput]="filterable"
14551
15170
  [subtitle]="adaptiveSubtitle"
15171
+ [showListContainer]="false"
14552
15172
  (closePopup)="togglePopup(false)"
14553
15173
  (textInputChange)="handleFilterInputChange($event)"
14554
15174
  [placeholder]="placeholder"
@@ -14565,14 +15185,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
14565
15185
  class="k-textbox k-input"
14566
15186
  [ngClass]="filterInputClasses"
14567
15187
  >
14568
- <span class="k-input-prefix">
15188
+ <span class="k-input-prefix k-input-prefix-horizontal">
14569
15189
  <kendo-icon-wrapper
14570
- class="k-icon"
14571
15190
  name="search"
14572
15191
  [svgIcon]="searchIcon"
14573
15192
  >
14574
15193
  </kendo-icon-wrapper>
14575
15194
  </span>
15195
+ <kendo-separator></kendo-separator>
14576
15196
  <input
14577
15197
  #filterInput
14578
15198
  (input)="handleFilterInputChange($event.target)"
@@ -14604,7 +15224,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
14604
15224
  <kendo-treeview
14605
15225
  #treeview
14606
15226
  [attr.id]="treeViewId"
14607
- [size]="windowSize !== 'large' ? 'large' : size"
15227
+ [size]="isAdaptive ? 'large' : size"
14608
15228
  [nodes]="data"
14609
15229
  [style.maxHeight.px]="listHeight"
14610
15230
  [animate]="false"
@@ -14660,7 +15280,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
14660
15280
  `,
14661
15281
  changeDetection: ChangeDetectionStrategy.OnPush,
14662
15282
  standalone: true,
14663
- imports: [LocalizedMessagesDirective, TemplateContextDirective, IconWrapperComponent, NgClass, NgTemplateOutlet, AdaptiveRendererComponent, FilterInputDirective, EventsOutsideAngularDirective, TreeViewComponent, SelectDirective, ResizeSensorComponent]
15283
+ imports: [LocalizedMessagesDirective, TemplateContextDirective, IconWrapperComponent, NgClass, NgTemplateOutlet, AdaptiveRendererComponent, FilterInputDirective, EventsOutsideAngularDirective, TreeViewComponent, SelectDirective, ResizeSensorComponent, SeparatorComponent]
14664
15284
  }]
14665
15285
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i2.PopupService }, { type: NavigationService }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i1.LocalizationService }, { type: i7.AdaptiveService }], propDecorators: { icon: [{
14666
15286
  type: Input
@@ -14900,10 +15520,10 @@ class MultiSelectTreeLookupService {
14900
15520
  };
14901
15521
  });
14902
15522
  }
14903
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeLookupService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
14904
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeLookupService });
15523
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeLookupService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
15524
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeLookupService });
14905
15525
  }
14906
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeLookupService, decorators: [{
15526
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeLookupService, decorators: [{
14907
15527
  type: Injectable
14908
15528
  }] });
14909
15529
 
@@ -14964,10 +15584,10 @@ class BaseCheckDirective {
14964
15584
  getKey(item, level) {
14965
15585
  return valueFrom(item, this.valueField) + '_' + (this.isHeterogeneous ? level : 0);
14966
15586
  }
14967
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BaseCheckDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
14968
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: BaseCheckDirective, isStandalone: true, inputs: { valueField: "valueField", checkedItems: "checkedItems", isHeterogeneous: "isHeterogeneous" }, ngImport: i0 });
15587
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: BaseCheckDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
15588
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: BaseCheckDirective, isStandalone: true, inputs: { valueField: "valueField", checkedItems: "checkedItems", isHeterogeneous: "isHeterogeneous" }, ngImport: i0 });
14969
15589
  }
14970
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BaseCheckDirective, decorators: [{
15590
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: BaseCheckDirective, decorators: [{
14971
15591
  type: Directive
14972
15592
  }], propDecorators: { valueField: [{
14973
15593
  type: Input
@@ -15115,10 +15735,10 @@ class CheckDirective extends BaseCheckDirective {
15115
15735
  }
15116
15736
  return false;
15117
15737
  }
15118
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CheckDirective, deps: [{ token: i1$1.TreeViewComponent }], target: i0.ɵɵFactoryTarget.Directive });
15119
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: CheckDirective, isStandalone: true, selector: "[kendoMultiSelectTreeCheckable]", inputs: { checkable: "checkable", valueField: "valueField", checkedItems: "checkedItems" }, outputs: { checkedItemsChange: "checkedItemsChange" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
15738
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CheckDirective, deps: [{ token: i1$1.TreeViewComponent }], target: i0.ɵɵFactoryTarget.Directive });
15739
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: CheckDirective, isStandalone: true, selector: "[kendoMultiSelectTreeCheckable]", inputs: { checkable: "checkable", valueField: "valueField", checkedItems: "checkedItems" }, outputs: { checkedItemsChange: "checkedItemsChange" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
15120
15740
  }
15121
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CheckDirective, decorators: [{
15741
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CheckDirective, decorators: [{
15122
15742
  type: Directive,
15123
15743
  args: [{
15124
15744
  selector: '[kendoMultiSelectTreeCheckable]',
@@ -15268,10 +15888,10 @@ class CheckAllDirective extends BaseCheckDirective {
15268
15888
  });
15269
15889
  return childrenChecked || this.isItemChecked(lookup.item);
15270
15890
  }
15271
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CheckAllDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
15272
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: CheckAllDirective, isStandalone: true, selector: "[checkAll]", inputs: { lastAction: "lastAction", treeview: "treeview", checkedItems: "checkedItems", valueField: "valueField", focused: ["checkAll", "focused"] }, outputs: { checkedItemsChange: "checkedItemsChange" }, host: { listeners: { "change": "handleChange($event.target)" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
15891
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CheckAllDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
15892
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: CheckAllDirective, isStandalone: true, selector: "[checkAll]", inputs: { lastAction: "lastAction", treeview: "treeview", checkedItems: "checkedItems", valueField: "valueField", focused: ["checkAll", "focused"] }, outputs: { checkedItemsChange: "checkedItemsChange" }, host: { listeners: { "change": "handleChange($event.target)" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
15273
15893
  }
15274
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CheckAllDirective, decorators: [{
15894
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CheckAllDirective, decorators: [{
15275
15895
  type: Directive,
15276
15896
  args: [{
15277
15897
  selector: '[checkAll]',
@@ -15364,14 +15984,11 @@ class MultiSelectTreeComponent {
15364
15984
  return this.disabled || null;
15365
15985
  }
15366
15986
  treeViewId = `k-${guid()}`;
15367
- get hostAriaAutocomplete() {
15368
- return this.filterable ? 'list' : null;
15369
- }
15370
15987
  get isLoading() {
15371
15988
  return this.loading;
15372
15989
  }
15373
15990
  get hostAriaInvalid() {
15374
- return this.formControl?.invalid ? true : null;
15991
+ return (this.formControl?.invalid && (this.formControl?.touched || this.formControl?.dirty)) ? true : null;
15375
15992
  }
15376
15993
  get isBusy() {
15377
15994
  return this.loading ? 'true' : null;
@@ -15383,14 +16000,9 @@ class MultiSelectTreeComponent {
15383
16000
  get hostTabIndex() {
15384
16001
  return this.tabindex;
15385
16002
  }
15386
- role = 'combobox';
15387
- ariaHasPopup = 'tree';
15388
16003
  get isReadonly() {
15389
16004
  return this.readonly ? '' : null;
15390
16005
  }
15391
- get ariaDescribedBy() {
15392
- return this.tagListId;
15393
- }
15394
16006
  get ariaActiveDescendant() {
15395
16007
  return this.focusedTagId;
15396
16008
  }
@@ -16085,7 +16697,6 @@ class MultiSelectTreeComponent {
16085
16697
  this._typedValue = '';
16086
16698
  }));
16087
16699
  this.renderer.removeAttribute(this.wrapper.nativeElement, 'tabindex');
16088
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', String(this.isOpen));
16089
16700
  this.subs.add(this.localization
16090
16701
  .changes.subscribe(({ rtl }) => {
16091
16702
  this.direction = rtl ? 'rtl' : 'ltr';
@@ -16539,9 +17150,7 @@ class MultiSelectTreeComponent {
16539
17150
  popupWrapper.style.minWidth = min;
16540
17151
  popupWrapper.style.width = max;
16541
17152
  popupWrapper.style.height = this.height;
16542
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.treeViewId);
16543
17153
  this.renderer.setAttribute(popupWrapper, 'dir', this.direction);
16544
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
16545
17154
  this.popupRef.popupOpen.subscribe(() => {
16546
17155
  this.cdr.detectChanges();
16547
17156
  this.opened.emit();
@@ -16562,8 +17171,6 @@ class MultiSelectTreeComponent {
16562
17171
  if (this.popupRef) {
16563
17172
  this.popupRef.close();
16564
17173
  this.popupRef = null;
16565
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
16566
- this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
16567
17174
  this.clearFilter();
16568
17175
  }
16569
17176
  }
@@ -16877,8 +17484,6 @@ class MultiSelectTreeComponent {
16877
17484
  closeActionSheet() {
16878
17485
  this.wrapper.nativeElement.focus();
16879
17486
  this.actionSheet.toggle(false);
16880
- this.renderer.removeAttribute(this.wrapper.nativeElement, 'aria-controls');
16881
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'false');
16882
17487
  this.clearFilter();
16883
17488
  this.closed.emit();
16884
17489
  }
@@ -16886,13 +17491,11 @@ class MultiSelectTreeComponent {
16886
17491
  this.actionSheet.toggle(true);
16887
17492
  this.adaptiveTitle = setActionSheetTitle(this.wrapper, this.adaptiveTitle);
16888
17493
  this.cdr.detectChanges();
16889
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.treeViewId);
16890
- this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
16891
17494
  this.cdr.detectChanges();
16892
17495
  this.opened.emit();
16893
17496
  }
16894
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", 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 }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
16895
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", 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-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: [
17497
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", 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 }, { token: i7.AdaptiveService }], target: i0.ɵɵFactoryTarget.Component });
17498
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.26", type: MultiSelectTreeComponent, isStandalone: true, selector: "kendo-multiselecttree", inputs: { adaptiveMode: "adaptiveMode", adaptiveTitle: "adaptiveTitle", adaptiveSubtitle: "adaptiveSubtitle", 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-disabled": "this.isDisabled", "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.readonly": "this.isReadonly", "attr.aria-activedescendant": "this.ariaActiveDescendant", "class.k-readonly": "this.readonly" } }, providers: [
16896
17499
  LocalizationService,
16897
17500
  NavigationService,
16898
17501
  DataService,
@@ -16919,7 +17522,8 @@ class MultiSelectTreeComponent {
16919
17522
  {
16920
17523
  provide: KendoInput,
16921
17524
  useExisting: forwardRef(() => MultiSelectTreeComponent)
16922
- }
17525
+ },
17526
+ provideComponentName('multiselecttree')
16923
17527
  ], queries: [{ propertyName: "headerTemplate", first: true, predicate: HeaderTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: FooterTemplateDirective, descendants: true }, { propertyName: "nodeTemplate", first: true, predicate: NodeTemplateDirective, descendants: true }, { propertyName: "noDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }, { propertyName: "tagTemplate", first: true, predicate: TagTemplateDirective, descendants: true }, { propertyName: "groupTagTemplate", first: true, predicate: GroupTagTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "adaptiveRendererComponent", first: true, predicate: AdaptiveRendererComponent, descendants: true }, { propertyName: "popupTemplate", first: true, predicate: ["popupTemplate"], descendants: true, static: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "treeview", first: true, predicate: ["treeview"], descendants: true }, { propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true }, { propertyName: "checkAllInput", first: true, predicate: ["checkAllInput"], descendants: true }], exportAs: ["kendoMultiSelectTree"], usesOnChanges: true, ngImport: i0, template: `
16924
17528
  <ng-container kendoMultiSelectTreeLocalizedMessages
16925
17529
  i18n-noDataText="kendo.multiselecttree.noDataText|The text displayed in the popup when there are no items"
@@ -16928,6 +17532,9 @@ class MultiSelectTreeComponent {
16928
17532
  i18n-clearTitle="kendo.multiselecttree.clearTitle|The title of the clear button"
16929
17533
  clearTitle="clear"
16930
17534
 
17535
+ i18n-chipListLabel="kendo.multiselecttree.chipListLabel|The accessible label of the tag list element that contains the selected items"
17536
+ chipListLabel="chip list"
17537
+
16931
17538
  i18n-checkAllText="kendo.multiselecttree.checkAllText|The text displayed for the check-all checkbox"
16932
17539
  checkAllText="Check all"
16933
17540
 
@@ -16942,6 +17549,9 @@ class MultiSelectTreeComponent {
16942
17549
 
16943
17550
  i18n-filterInputPlaceholder="kendo.multiselecttree.filterInputPlaceholder|The text for the input's placeholder when filtering is enabled"
16944
17551
  filterInputPlaceholder="Filter"
17552
+
17553
+ i18n-inputLabel="kendo.multiselecttree.inputLabel|The text set as aria-label on the combobox input element"
17554
+ inputLabel="Select items"
16945
17555
  >
16946
17556
  </ng-container>
16947
17557
  <kendo-taglist
@@ -16960,10 +17570,19 @@ class MultiSelectTreeComponent {
16960
17570
  [template]="tagTemplate"
16961
17571
  [groupTemplate]="groupTagTemplate"
16962
17572
  [disabledIndices]="disabledIndices"
17573
+ [ariaLabel]="messageFor('chipListLabel')"
16963
17574
  (removeTag)="handleRemoveTag($event)"
16964
17575
  >
16965
17576
  </kendo-taglist>
16966
- <span class="k-input-inner">
17577
+ <span class="k-input-inner"
17578
+ role="combobox"
17579
+ aria-haspopup="tree"
17580
+ [attr.aria-expanded]="isOpen"
17581
+ [attr.aria-autocomplete]="filterable ? 'list' : null"
17582
+ [attr.aria-controls]="isOpen ? treeViewId : null"
17583
+ [attr.aria-describedby]="tags?.length ? tagListId : null"
17584
+ [attr.aria-disabled]="disabled || null"
17585
+ [attr.aria-label]="messageFor('inputLabel')">
16967
17586
  @if (!tags || !tags.length) {
16968
17587
  <span
16969
17588
  class="k-input-value-text"
@@ -16981,7 +17600,6 @@ class MultiSelectTreeComponent {
16981
17600
  (click)="clearAll($event)"
16982
17601
  >
16983
17602
  <kendo-icon-wrapper
16984
- class="k-icon"
16985
17603
  name="x"
16986
17604
  [svgIcon]="xIcon"
16987
17605
  >
@@ -17004,6 +17622,7 @@ class MultiSelectTreeComponent {
17004
17622
  [title]="adaptiveTitle"
17005
17623
  [showTextInput]="filterable"
17006
17624
  [subtitle]="adaptiveSubtitle"
17625
+ [showListContainer]="false"
17007
17626
  (closePopup)="togglePopup(false)"
17008
17627
  (textInputChange)="onFilterChange($event)"
17009
17628
  [searchBarValue]="filter"
@@ -17020,7 +17639,7 @@ class MultiSelectTreeComponent {
17020
17639
  class="k-textbox k-input"
17021
17640
  [ngClass]="filterInputClasses"
17022
17641
  >
17023
- <span class="k-input-prefix">
17642
+ <span class="k-input-prefix k-input-prefix-horizontal">
17024
17643
  <kendo-icon-wrapper
17025
17644
  class="k-icon"
17026
17645
  name="search"
@@ -17028,6 +17647,7 @@ class MultiSelectTreeComponent {
17028
17647
  >
17029
17648
  </kendo-icon-wrapper>
17030
17649
  </span>
17650
+ <kendo-separator></kendo-separator>
17031
17651
  <input
17032
17652
  #filterInput
17033
17653
  (input)="handleFilterInputChange($event.target)"
@@ -17151,9 +17771,9 @@ class MultiSelectTreeComponent {
17151
17771
  @if (isOpen || isAdaptiveModeEnabled) {
17152
17772
  <kendo-resize-sensor (resize)="onResize()"></kendo-resize-sensor>
17153
17773
  }
17154
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "component", type: TagListComponent, selector: "kendo-taglist", inputs: ["tags", "textField", "valueField", "valueDepth", "focused", "template", "groupTemplate", "disabled", "tagPrefix", "id", "size", "rounded", "fillMode", "disabledIndices"], outputs: ["removeTag"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: CheckAllDirective, selector: "[checkAll]", inputs: ["lastAction", "treeview", "checkedItems", "valueField", "checkAll"], outputs: ["checkedItemsChange"] }, { kind: "component", type: TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: CheckDirective, selector: "[kendoMultiSelectTreeCheckable]", inputs: ["checkable", "valueField", "checkedItems"], outputs: ["checkedItemsChange"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
17774
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { kind: "component", type: TagListComponent, selector: "kendo-taglist", inputs: ["tags", "textField", "valueField", "valueDepth", "focused", "template", "groupTemplate", "disabled", "tagPrefix", "id", "ariaLabel", "size", "rounded", "fillMode", "disabledIndices"], outputs: ["removeTag"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-adaptive-renderer", inputs: ["title", "subtitle", "showTextInput", "sharedPopupActionSheetTemplate", "text", "placeholder", "searchBarValue", "filterable", "showListContainer"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: CheckAllDirective, selector: "[checkAll]", inputs: ["lastAction", "treeview", "checkedItems", "valueField", "checkAll"], outputs: ["checkedItemsChange"] }, { kind: "component", type: TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "loadMoreButtonRole", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: CheckDirective, selector: "[kendoMultiSelectTreeCheckable]", inputs: ["checkable", "valueField", "checkedItems"], outputs: ["checkedItemsChange"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }] });
17155
17775
  }
17156
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeComponent, decorators: [{
17776
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeComponent, decorators: [{
17157
17777
  type: Component,
17158
17778
  args: [{
17159
17779
  exportAs: 'kendoMultiSelectTree',
@@ -17184,7 +17804,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17184
17804
  {
17185
17805
  provide: KendoInput,
17186
17806
  useExisting: forwardRef(() => MultiSelectTreeComponent)
17187
- }
17807
+ },
17808
+ provideComponentName('multiselecttree')
17188
17809
  ],
17189
17810
  selector: 'kendo-multiselecttree',
17190
17811
  template: `
@@ -17195,6 +17816,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17195
17816
  i18n-clearTitle="kendo.multiselecttree.clearTitle|The title of the clear button"
17196
17817
  clearTitle="clear"
17197
17818
 
17819
+ i18n-chipListLabel="kendo.multiselecttree.chipListLabel|The accessible label of the tag list element that contains the selected items"
17820
+ chipListLabel="chip list"
17821
+
17198
17822
  i18n-checkAllText="kendo.multiselecttree.checkAllText|The text displayed for the check-all checkbox"
17199
17823
  checkAllText="Check all"
17200
17824
 
@@ -17209,6 +17833,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17209
17833
 
17210
17834
  i18n-filterInputPlaceholder="kendo.multiselecttree.filterInputPlaceholder|The text for the input's placeholder when filtering is enabled"
17211
17835
  filterInputPlaceholder="Filter"
17836
+
17837
+ i18n-inputLabel="kendo.multiselecttree.inputLabel|The text set as aria-label on the combobox input element"
17838
+ inputLabel="Select items"
17212
17839
  >
17213
17840
  </ng-container>
17214
17841
  <kendo-taglist
@@ -17227,10 +17854,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17227
17854
  [template]="tagTemplate"
17228
17855
  [groupTemplate]="groupTagTemplate"
17229
17856
  [disabledIndices]="disabledIndices"
17857
+ [ariaLabel]="messageFor('chipListLabel')"
17230
17858
  (removeTag)="handleRemoveTag($event)"
17231
17859
  >
17232
17860
  </kendo-taglist>
17233
- <span class="k-input-inner">
17861
+ <span class="k-input-inner"
17862
+ role="combobox"
17863
+ aria-haspopup="tree"
17864
+ [attr.aria-expanded]="isOpen"
17865
+ [attr.aria-autocomplete]="filterable ? 'list' : null"
17866
+ [attr.aria-controls]="isOpen ? treeViewId : null"
17867
+ [attr.aria-describedby]="tags?.length ? tagListId : null"
17868
+ [attr.aria-disabled]="disabled || null"
17869
+ [attr.aria-label]="messageFor('inputLabel')">
17234
17870
  @if (!tags || !tags.length) {
17235
17871
  <span
17236
17872
  class="k-input-value-text"
@@ -17248,7 +17884,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17248
17884
  (click)="clearAll($event)"
17249
17885
  >
17250
17886
  <kendo-icon-wrapper
17251
- class="k-icon"
17252
17887
  name="x"
17253
17888
  [svgIcon]="xIcon"
17254
17889
  >
@@ -17271,6 +17906,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17271
17906
  [title]="adaptiveTitle"
17272
17907
  [showTextInput]="filterable"
17273
17908
  [subtitle]="adaptiveSubtitle"
17909
+ [showListContainer]="false"
17274
17910
  (closePopup)="togglePopup(false)"
17275
17911
  (textInputChange)="onFilterChange($event)"
17276
17912
  [searchBarValue]="filter"
@@ -17287,7 +17923,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17287
17923
  class="k-textbox k-input"
17288
17924
  [ngClass]="filterInputClasses"
17289
17925
  >
17290
- <span class="k-input-prefix">
17926
+ <span class="k-input-prefix k-input-prefix-horizontal">
17291
17927
  <kendo-icon-wrapper
17292
17928
  class="k-icon"
17293
17929
  name="search"
@@ -17295,6 +17931,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17295
17931
  >
17296
17932
  </kendo-icon-wrapper>
17297
17933
  </span>
17934
+ <kendo-separator></kendo-separator>
17298
17935
  <input
17299
17936
  #filterInput
17300
17937
  (input)="handleFilterInputChange($event.target)"
@@ -17420,17 +18057,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17420
18057
  }
17421
18058
  `,
17422
18059
  standalone: true,
17423
- imports: [LocalizedMessagesDirective, TagListComponent, IconWrapperComponent, NgTemplateOutlet, AdaptiveRendererComponent, NgClass, FilterInputDirective, EventsOutsideAngularDirective, TemplateContextDirective, CheckAllDirective, TreeViewComponent, CheckDirective, ResizeSensorComponent]
18060
+ imports: [LocalizedMessagesDirective, TagListComponent, IconWrapperComponent, NgTemplateOutlet, AdaptiveRendererComponent, NgClass, FilterInputDirective, EventsOutsideAngularDirective, TemplateContextDirective, CheckAllDirective, TreeViewComponent, CheckDirective, ResizeSensorComponent, SeparatorComponent]
17424
18061
  }]
17425
18062
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i2.PopupService }, { type: i0.Renderer2 }, { type: NavigationService }, { type: i0.NgZone }, { type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: MultiSelectTreeLookupService }, { type: i7.AdaptiveService }], propDecorators: { isDisabled: [{
17426
18063
  type: HostBinding,
17427
18064
  args: ['class.k-disabled']
17428
- }, {
17429
- type: HostBinding,
17430
- args: ['attr.aria-disabled']
17431
- }], hostAriaAutocomplete: [{
17432
- type: HostBinding,
17433
- args: ['attr.aria-autocomplete']
17434
18065
  }], isLoading: [{
17435
18066
  type: HostBinding,
17436
18067
  args: ['class.k-loading']
@@ -17449,18 +18080,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
17449
18080
  }], hostTabIndex: [{
17450
18081
  type: HostBinding,
17451
18082
  args: ['attr.tabindex']
17452
- }], role: [{
17453
- type: HostBinding,
17454
- args: ['attr.role']
17455
- }], ariaHasPopup: [{
17456
- type: HostBinding,
17457
- args: ['attr.aria-haspopup']
17458
18083
  }], isReadonly: [{
17459
18084
  type: HostBinding,
17460
18085
  args: ['attr.readonly']
17461
- }], ariaDescribedBy: [{
17462
- type: HostBinding,
17463
- args: ['attr.aria-describedby']
17464
18086
  }], ariaActiveDescendant: [{
17465
18087
  type: HostBinding,
17466
18088
  args: ['attr.aria-activedescendant']
@@ -17637,10 +18259,10 @@ class DropDownTreeFlatBindingDirective extends FlatDataBindingDirective {
17637
18259
  }
17638
18260
  super.ngOnChanges(changes);
17639
18261
  }
17640
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreeFlatBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
17641
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: DropDownTreeFlatBindingDirective, isStandalone: true, selector: "[kendoDropDownTreeFlatBinding]", inputs: { nodes: ["kendoDropDownTreeFlatBinding", "nodes"], idField: ["valueField", "idField"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
18262
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreeFlatBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
18263
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: DropDownTreeFlatBindingDirective, isStandalone: true, selector: "[kendoDropDownTreeFlatBinding]", inputs: { nodes: ["kendoDropDownTreeFlatBinding", "nodes"], idField: ["valueField", "idField"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
17642
18264
  }
17643
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreeFlatBindingDirective, decorators: [{
18265
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreeFlatBindingDirective, decorators: [{
17644
18266
  type: Directive,
17645
18267
  args: [{
17646
18268
  selector: '[kendoDropDownTreeFlatBinding]',
@@ -17694,10 +18316,10 @@ class DropDownTreeHierarchyBindingDirective extends HierarchyBindingDirective {
17694
18316
  }
17695
18317
  super.ngOnChanges(changes);
17696
18318
  }
17697
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreeHierarchyBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
17698
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: DropDownTreeHierarchyBindingDirective, isStandalone: true, selector: "[kendoDropDownTreeHierarchyBinding]", inputs: { nodes: ["kendoDropDownTreeHierarchyBinding", "nodes"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
18319
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreeHierarchyBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
18320
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: DropDownTreeHierarchyBindingDirective, isStandalone: true, selector: "[kendoDropDownTreeHierarchyBinding]", inputs: { nodes: ["kendoDropDownTreeHierarchyBinding", "nodes"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
17699
18321
  }
17700
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreeHierarchyBindingDirective, decorators: [{
18322
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreeHierarchyBindingDirective, decorators: [{
17701
18323
  type: Directive,
17702
18324
  args: [{
17703
18325
  selector: '[kendoDropDownTreeHierarchyBinding]',
@@ -17752,10 +18374,10 @@ class MultiSelectTreeFlatBindingDirective extends FlatDataBindingDirective {
17752
18374
  }
17753
18375
  super.ngOnChanges(changes);
17754
18376
  }
17755
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeFlatBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
17756
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: MultiSelectTreeFlatBindingDirective, isStandalone: true, selector: "[kendoMultiSelectTreeFlatBinding]", inputs: { nodes: ["kendoMultiSelectTreeFlatBinding", "nodes"], idField: ["valueField", "idField"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
18377
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeFlatBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
18378
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: MultiSelectTreeFlatBindingDirective, isStandalone: true, selector: "[kendoMultiSelectTreeFlatBinding]", inputs: { nodes: ["kendoMultiSelectTreeFlatBinding", "nodes"], idField: ["valueField", "idField"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
17757
18379
  }
17758
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeFlatBindingDirective, decorators: [{
18380
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeFlatBindingDirective, decorators: [{
17759
18381
  type: Directive,
17760
18382
  args: [{
17761
18383
  selector: '[kendoMultiSelectTreeFlatBinding]',
@@ -17809,10 +18431,10 @@ class MultiSelectTreeHierarchyBindingDirective extends HierarchyBindingDirective
17809
18431
  }
17810
18432
  super.ngOnChanges(changes);
17811
18433
  }
17812
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeHierarchyBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
17813
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: MultiSelectTreeHierarchyBindingDirective, isStandalone: true, selector: "[kendoMultiSelectTreeHierarchyBinding]", inputs: { nodes: ["kendoMultiSelectTreeHierarchyBinding", "nodes"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
18434
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeHierarchyBindingDirective, deps: [{ token: i1$1.DataBoundComponent }], target: i0.ɵɵFactoryTarget.Directive });
18435
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: MultiSelectTreeHierarchyBindingDirective, isStandalone: true, selector: "[kendoMultiSelectTreeHierarchyBinding]", inputs: { nodes: ["kendoMultiSelectTreeHierarchyBinding", "nodes"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
17814
18436
  }
17815
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeHierarchyBindingDirective, decorators: [{
18437
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeHierarchyBindingDirective, decorators: [{
17816
18438
  type: Directive,
17817
18439
  args: [{
17818
18440
  selector: '[kendoMultiSelectTreeHierarchyBinding]',
@@ -17860,10 +18482,10 @@ class DropDownTreesExpandDirective extends ExpandDirective {
17860
18482
  super(dropDownTree);
17861
18483
  this.dropDownTree = dropDownTree;
17862
18484
  }
17863
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreesExpandDirective, deps: [{ token: i1$1.ExpandableComponent }], target: i0.ɵɵFactoryTarget.Directive });
17864
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: DropDownTreesExpandDirective, isStandalone: true, selector: "[kendoDropDownTreeExpandable], [kendoMultiSelectTreeExpandable]", inputs: { isExpanded: ["isNodeExpanded", "isExpanded"] }, usesInheritance: true, ngImport: i0 });
18485
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreesExpandDirective, deps: [{ token: i1$1.ExpandableComponent }], target: i0.ɵɵFactoryTarget.Directive });
18486
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: DropDownTreesExpandDirective, isStandalone: true, selector: "[kendoDropDownTreeExpandable], [kendoMultiSelectTreeExpandable]", inputs: { isExpanded: ["isNodeExpanded", "isExpanded"] }, usesInheritance: true, ngImport: i0 });
17865
18487
  }
17866
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreesExpandDirective, decorators: [{
18488
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreesExpandDirective, decorators: [{
17867
18489
  type: Directive,
17868
18490
  args: [{
17869
18491
  selector: '[kendoDropDownTreeExpandable], [kendoMultiSelectTreeExpandable]',
@@ -17881,7 +18503,6 @@ const DEFAULT_FILTER_SETTINGS = {
17881
18503
  /**
17882
18504
  * Implements an event handler for the `filterChange` event of a DropDowns component
17883
18505
  * which performs simple data filtering.
17884
- * Currently, the built-in filtering does not work with [grouped data](https://www.telerik.com/kendo-angular-ui/components/data-query/api/groupby).
17885
18506
  *
17886
18507
  * @example
17887
18508
  * ```ts
@@ -17941,7 +18562,14 @@ class FilterDirective {
17941
18562
  }
17942
18563
  }
17943
18564
  handleFilterChange(query) {
17944
- this.component.data = this.data.filter(item => this.matchesAnyField(item, query));
18565
+ if (isGroupedData(this.data)) {
18566
+ this.component.data = this.data
18567
+ .map(group => ({ ...group, items: group.items.filter(item => this.matchesAnyField(item, query)) }))
18568
+ .filter(group => group.items.length > 0);
18569
+ }
18570
+ else {
18571
+ this.component.data = this.data.filter(item => this.matchesAnyField(item, query));
18572
+ }
17945
18573
  }
17946
18574
  matchesAnyField(item, query) {
17947
18575
  const normalizedQuery = this.normalizeValue(query);
@@ -17984,10 +18612,10 @@ class FilterDirective {
17984
18612
  const providedFields = isPresent(settings) && typeof settings === 'object' ? settings.fields : [];
17985
18613
  return Object.assign({}, DEFAULT_FILTER_SETTINGS, settings, { fields: this.getFilterFields(providedFields) });
17986
18614
  }
17987
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FilterDirective, deps: [{ token: FilterableComponent }], target: i0.ɵɵFactoryTarget.Directive });
17988
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: FilterDirective, isStandalone: true, selector: "[kendoDropDownFilter]", inputs: { data: "data", rawSettings: ["kendoDropDownFilter", "rawSettings"], filterable: "filterable" }, ngImport: i0 });
18615
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FilterDirective, deps: [{ token: FilterableComponent }], target: i0.ɵɵFactoryTarget.Directive });
18616
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: FilterDirective, isStandalone: true, selector: "[kendoDropDownFilter]", inputs: { data: "data", rawSettings: ["kendoDropDownFilter", "rawSettings"], filterable: "filterable" }, ngImport: i0 });
17989
18617
  }
17990
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FilterDirective, decorators: [{
18618
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: FilterDirective, decorators: [{
17991
18619
  type: Directive,
17992
18620
  args: [{
17993
18621
  selector: '[kendoDropDownFilter]',
@@ -18018,7 +18646,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18018
18646
  * <kendo-combobox>
18019
18647
  * <kendo-combobox-messages
18020
18648
  * noDataText="No items found"
18021
- * filterInputPlaceholder="Search items">
18649
+ * filterInputPlaceholder="Search items"
18650
+ * clearTitle="Clear selection">
18022
18651
  * </kendo-combobox-messages>
18023
18652
  * </kendo-combobox>
18024
18653
  *
@@ -18032,7 +18661,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18032
18661
  * <kendo-autocomplete>
18033
18662
  * <kendo-autocomplete-messages
18034
18663
  * noDataText="No items found"
18035
- * filterInputPlaceholder="Type to search">
18664
+ * filterInputPlaceholder="Type to search"
18665
+ * clearTitle="Clear input">
18036
18666
  * </kendo-autocomplete-messages>
18037
18667
  * </kendo-autocomplete>
18038
18668
  *
@@ -18067,15 +18697,15 @@ class CustomMessagesComponent extends Messages {
18067
18697
  get override() {
18068
18698
  return true;
18069
18699
  }
18070
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
18071
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: CustomMessagesComponent, isStandalone: true, selector: "kendo-dropdownlist-messages,kendo-combobox-messages,kendo-multicolumncombobox-messages,kendo-autocomplete-messages,kendo-multiselect-messages,kendo-dropdowntree-messages,kendo-multiselecttree-messages", providers: [
18700
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
18701
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.26", type: CustomMessagesComponent, isStandalone: true, selector: "kendo-dropdownlist-messages,kendo-combobox-messages,kendo-multicolumncombobox-messages,kendo-autocomplete-messages,kendo-multiselect-messages,kendo-dropdowntree-messages,kendo-multiselecttree-messages", providers: [
18072
18702
  {
18073
18703
  provide: Messages,
18074
18704
  useExisting: forwardRef(() => CustomMessagesComponent)
18075
18705
  }
18076
18706
  ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
18077
18707
  }
18078
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: CustomMessagesComponent, decorators: [{
18708
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: CustomMessagesComponent, decorators: [{
18079
18709
  type: Component,
18080
18710
  args: [{
18081
18711
  providers: [
@@ -18090,66 +18720,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18090
18720
  }]
18091
18721
  }], ctorParameters: () => [{ type: i1.LocalizationService }] });
18092
18722
 
18093
- /**
18094
- * Configures the MultiSelect to show one summary tag for all selected items.
18095
- * Set a number to display the summary tag after the respective number of items are selected.
18096
- * [See example](https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/summary-tag-mode).
18097
- *
18098
- * @example
18099
- * ```ts-no-run
18100
- * <kendo-multiselect kendoMultiSelectSummaryTag [data]="data"></kendo-multiselect>
18101
- * ```
18102
- *
18103
- * @example
18104
- * ```ts-no-run
18105
- * <kendo-multiselect [kendoMultiSelectSummaryTag]="2" [data]="data"></kendo-multiselect>
18106
- * ```
18107
- */
18108
- class SummaryTagDirective {
18109
- multiSelectComponent;
18110
- /**
18111
- * Sets the number of selected items after which the summary tag appears.
18112
- *
18113
- * @default 0
18114
- */
18115
- showAfter = 0;
18116
- constructor(multiSelectComponent) {
18117
- this.multiSelectComponent = multiSelectComponent;
18118
- this.createTagMapper();
18119
- }
18120
- ngOnChanges(changes) {
18121
- if (isPresent(changes.showAfter)) {
18122
- this.createTagMapper();
18123
- this.multiSelectComponent.onTagMapperChange();
18124
- }
18125
- }
18126
- createTagMapper() {
18127
- const showAfter = parseNumber(this.showAfter);
18128
- this.multiSelectComponent.tagMapper = (tags) => {
18129
- if (tags.length > showAfter) {
18130
- const result = tags.slice(0, showAfter);
18131
- result.push(tags.slice(showAfter, tags.length));
18132
- return result;
18133
- }
18134
- else {
18135
- return tags;
18136
- }
18137
- };
18138
- }
18139
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SummaryTagDirective, deps: [{ token: MultiSelectComponent }], target: i0.ɵɵFactoryTarget.Directive });
18140
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: SummaryTagDirective, isStandalone: true, selector: "[kendoMultiSelectSummaryTag]", inputs: { showAfter: ["kendoMultiSelectSummaryTag", "showAfter"] }, usesOnChanges: true, ngImport: i0 });
18141
- }
18142
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SummaryTagDirective, decorators: [{
18143
- type: Directive,
18144
- args: [{
18145
- selector: '[kendoMultiSelectSummaryTag]',
18146
- standalone: true
18147
- }]
18148
- }], ctorParameters: () => [{ type: MultiSelectComponent }], propDecorators: { showAfter: [{
18149
- type: Input,
18150
- args: ['kendoMultiSelectSummaryTag']
18151
- }] } });
18152
-
18153
18723
  /**
18154
18724
  * Configures the MultiSelectTree to show one single summary tag for all selected data items.
18155
18725
  * When a number is set, the summary tag is shown after the corresponding number of data items are selected (see examples).
@@ -18198,10 +18768,10 @@ class MultiSelectTreeSummaryTagDirective {
18198
18768
  }
18199
18769
  };
18200
18770
  }
18201
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeSummaryTagDirective, deps: [{ token: MultiSelectTreeComponent }], target: i0.ɵɵFactoryTarget.Directive });
18202
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: MultiSelectTreeSummaryTagDirective, isStandalone: true, selector: "[kendoMultiSelectTreeSummaryTag]", inputs: { showAfter: ["kendoMultiSelectTreeSummaryTag", "showAfter"] }, usesOnChanges: true, ngImport: i0 });
18771
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeSummaryTagDirective, deps: [{ token: MultiSelectTreeComponent }], target: i0.ɵɵFactoryTarget.Directive });
18772
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.26", type: MultiSelectTreeSummaryTagDirective, isStandalone: true, selector: "[kendoMultiSelectTreeSummaryTag]", inputs: { showAfter: ["kendoMultiSelectTreeSummaryTag", "showAfter"] }, usesOnChanges: true, ngImport: i0 });
18203
18773
  }
18204
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectTreeSummaryTagDirective, decorators: [{
18774
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectTreeSummaryTagDirective, decorators: [{
18205
18775
  type: Directive,
18206
18776
  args: [{
18207
18777
  selector: '[kendoMultiSelectTreeSummaryTag]',
@@ -18288,7 +18858,6 @@ const KENDO_DROPDOWNLIST = [
18288
18858
  */
18289
18859
  const KENDO_MULTISELECT = [
18290
18860
  MultiSelectComponent,
18291
- SummaryTagDirective,
18292
18861
  CustomItemTemplateDirective,
18293
18862
  FixedGroupTemplateDirective,
18294
18863
  FooterTemplateDirective,
@@ -18371,9 +18940,9 @@ const KENDO_DROPDOWNS = [
18371
18940
  * - `CustomMessagesComponent`&mdash;The custom messages component.
18372
18941
  */
18373
18942
  class DropDownTreesModule {
18374
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18375
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreesModule, imports: [DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent], exports: [DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent] });
18376
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreesModule, providers: [
18943
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18944
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreesModule, imports: [DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent], exports: [DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent] });
18945
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreesModule, providers: [
18377
18946
  IconsService,
18378
18947
  PopupService,
18379
18948
  ResizeBatchService,
@@ -18384,7 +18953,7 @@ class DropDownTreesModule {
18384
18953
  AdaptiveService
18385
18954
  ], imports: [DropDownTreeComponent, MultiSelectTreeComponent] });
18386
18955
  }
18387
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownTreesModule, decorators: [{
18956
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownTreesModule, decorators: [{
18388
18957
  type: NgModule,
18389
18958
  args: [{
18390
18959
  imports: [...KENDO_DROPDOWNTREE, ...KENDO_MULTISELECTTREE],
@@ -18423,11 +18992,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18423
18992
  * ```
18424
18993
  */
18425
18994
  class DropDownsModule {
18426
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18427
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: DropDownsModule, imports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, MultiSelectComponent, SummaryTagDirective, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective], exports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, MultiSelectComponent, SummaryTagDirective, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective] });
18428
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownsModule, providers: [PopupService, ResizeBatchService, IconsService, DialogContainerService, DialogService, WindowService, WindowContainerService, AdaptiveService], imports: [AutoCompleteComponent, i10.SeparatorComponent, ComboBoxComponent, i10.SeparatorComponent, MultiColumnComboBoxComponent, i10.SeparatorComponent, DropDownListComponent, MultiSelectComponent, i10.SeparatorComponent, DropDownTreeComponent, MultiSelectTreeComponent, i10.SeparatorComponent] });
18995
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18996
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.26", ngImport: i0, type: DropDownsModule, imports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, MultiSelectComponent, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective], exports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, MultiSelectComponent, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, DropDownTreesExpandDirective, NodeTemplateDirective, MultiSelectTreeSummaryTagDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, FooterTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, CustomMessagesComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective] });
18997
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownsModule, providers: [PopupService, ResizeBatchService, IconsService, DialogContainerService, DialogService, WindowService, WindowContainerService, AdaptiveService], imports: [AutoCompleteComponent, i10.SeparatorComponent, ComboBoxComponent, i10.SeparatorComponent, MultiColumnComboBoxComponent, i10.SeparatorComponent, DropDownListComponent, MultiSelectComponent, i10.SeparatorComponent, DropDownTreeComponent, MultiSelectTreeComponent, i10.SeparatorComponent] });
18429
18998
  }
18430
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownsModule, decorators: [{
18999
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownsModule, decorators: [{
18431
19000
  type: NgModule,
18432
19001
  args: [{
18433
19002
  exports: [...KENDO_DROPDOWNS, ...KENDO_ADORNMENTS, ...KENDO_TOGGLEBUTTONTABSTOP],
@@ -18442,7 +19011,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18442
19011
  *
18443
19012
  * This module exports all MultiSelect-related components and directives:
18444
19013
  * - `MultiSelectComponent`&mdash;The main MultiSelect component class.
18445
- * - `SummaryTagDirective`&mdash;The summary tag directive for MultiSelect.
18446
19014
  * - `ItemTemplateDirective`&mdash;The item template directive.
18447
19015
  * - `CustomItemTemplateDirective`&mdash;The custom item template directive.
18448
19016
  * - `TagTemplateDirective`&mdash;The tag template directive.
@@ -18468,16 +19036,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18468
19036
  * ```
18469
19037
  */
18470
19038
  class MultiSelectModule {
18471
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18472
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectModule, imports: [MultiSelectComponent, SummaryTagDirective, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent], exports: [MultiSelectComponent, SummaryTagDirective, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent] });
18473
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectModule, providers: [
19039
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
19040
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectModule, imports: [MultiSelectComponent, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent], exports: [MultiSelectComponent, CustomItemTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, GroupTagTemplateDirective, TagTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent] });
19041
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectModule, providers: [
18474
19042
  PopupService,
18475
19043
  ResizeBatchService,
18476
19044
  IconsService,
18477
19045
  AdaptiveService
18478
19046
  ], imports: [MultiSelectComponent, i10.SeparatorComponent, i10.SeparatorComponent] });
18479
19047
  }
18480
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MultiSelectModule, decorators: [{
19048
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: MultiSelectModule, decorators: [{
18481
19049
  type: NgModule,
18482
19050
  args: [{
18483
19051
  imports: [...KENDO_MULTISELECT, ...KENDO_ADORNMENTS],
@@ -18518,16 +19086,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18518
19086
  * - `PrefixTemplateDirective`&mdash;The prefix template directive.
18519
19087
  */
18520
19088
  class AutoCompleteModule {
18521
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AutoCompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18522
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: AutoCompleteModule, imports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent], exports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent] });
18523
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AutoCompleteModule, providers: [
19089
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: AutoCompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
19090
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.26", ngImport: i0, type: AutoCompleteModule, imports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent], exports: [AutoCompleteComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent] });
19091
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: AutoCompleteModule, providers: [
18524
19092
  PopupService,
18525
19093
  ResizeBatchService,
18526
19094
  IconsService,
18527
19095
  AdaptiveService
18528
19096
  ], imports: [AutoCompleteComponent, i10.SeparatorComponent, i10.SeparatorComponent] });
18529
19097
  }
18530
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AutoCompleteModule, decorators: [{
19098
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: AutoCompleteModule, decorators: [{
18531
19099
  type: NgModule,
18532
19100
  args: [{
18533
19101
  imports: [...KENDO_AUTOCOMPLETE, ...KENDO_ADORNMENTS],
@@ -18571,16 +19139,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18571
19139
  * ```
18572
19140
  */
18573
19141
  class ComboBoxModule {
18574
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18575
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxModule, imports: [ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective], exports: [ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective] });
18576
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxModule, providers: [
19142
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
19143
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxModule, imports: [ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective], exports: [ComboBoxComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, MultiColumnComboBoxComponent, ComboBoxColumnComponent, ColumnHeaderTemplateDirective, ColumnCellTemplateDirective, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent, i10.SuffixTemplateDirective, i10.PrefixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective, i10.PrefixTemplateDirective, i10.SuffixTemplateDirective, i10.SeparatorComponent, i10.ToggleButtonTabStopDirective] });
19144
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxModule, providers: [
18577
19145
  PopupService,
18578
19146
  ResizeBatchService,
18579
19147
  IconsService,
18580
19148
  AdaptiveService
18581
19149
  ], imports: [ComboBoxComponent, i10.SeparatorComponent, MultiColumnComboBoxComponent, i10.SeparatorComponent, i10.SeparatorComponent] });
18582
19150
  }
18583
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ComboBoxModule, decorators: [{
19151
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: ComboBoxModule, decorators: [{
18584
19152
  type: NgModule,
18585
19153
  args: [{
18586
19154
  imports: [...KENDO_COMBOBOX, ...KENDO_MULTICOLUMNCOMBOBOX, ...KENDO_ADORNMENTS, ...KENDO_TOGGLEBUTTONTABSTOP],
@@ -18630,16 +19198,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18630
19198
  * ```
18631
19199
  */
18632
19200
  class DropDownListModule {
18633
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
18634
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: DropDownListModule, imports: [DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent], exports: [DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent] });
18635
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownListModule, providers: [
19201
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
19202
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.26", ngImport: i0, type: DropDownListModule, imports: [DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent], exports: [DropDownListComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, ValueTemplateDirective, NoDataTemplateDirective, FilterDirective, CustomMessagesComponent] });
19203
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownListModule, providers: [
18636
19204
  PopupService,
18637
19205
  ResizeBatchService,
18638
19206
  IconsService,
18639
19207
  AdaptiveService
18640
19208
  ], imports: [DropDownListComponent] });
18641
19209
  }
18642
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DropDownListModule, decorators: [{
19210
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.26", ngImport: i0, type: DropDownListModule, decorators: [{
18643
19211
  type: NgModule,
18644
19212
  args: [{
18645
19213
  imports: [...KENDO_DROPDOWNLIST],
@@ -18657,5 +19225,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
18657
19225
  * Generated bundle index. Do not edit.
18658
19226
  */
18659
19227
 
18660
- export { AdaptiveRendererComponent, AutoCompleteComponent, AutoCompleteModule, CheckAllDirective, CheckDirective, ColumnCellTemplateDirective, ColumnHeaderTemplateDirective, ComboBoxColumnComponent, ComboBoxComponent, ComboBoxModule, CustomItemTemplateDirective, CustomMessagesComponent, DataService, DisabledItemsService, DropDownListComponent, DropDownListModule, DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, DropDownTreesModule, DropDownsModule, FilterDirective, FilterInputDirective, FilterableComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTagTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, KENDO_AUTOCOMPLETE, KENDO_COMBOBOX, KENDO_DROPDOWNLIST, KENDO_DROPDOWNS, KENDO_DROPDOWNTREE, KENDO_MULTICOLUMNCOMBOBOX, KENDO_MULTISELECT, KENDO_MULTISELECTTREE, ListComponent, ListItemDirective, LocalizedMessagesDirective, MultiColumnComboBoxComponent, MultiSelectComponent, MultiSelectModule, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, MultiSelectTreeSummaryTagDirective, NavigationService, NoDataTemplateDirective, NodeTemplateDirective, PreventableEvent, RemoveTagEvent, SearchBarComponent, SelectableDirective, SelectionService, SummaryTagDirective, TagListComponent, TagTemplateDirective, ValueTemplateDirective };
19228
+ export { AdaptiveRendererComponent, AutoCompleteComponent, AutoCompleteModule, CheckAllDirective, CheckDirective, ColumnCellTemplateDirective, ColumnHeaderTemplateDirective, ComboBoxColumnComponent, ComboBoxComponent, ComboBoxModule, CustomItemTemplateDirective, CustomMessagesComponent, DataService, DisabledItemsService, DropDownListComponent, DropDownListModule, DropDownTreeComponent, DropDownTreeFlatBindingDirective, DropDownTreeHierarchyBindingDirective, DropDownTreesExpandDirective, DropDownTreesModule, DropDownsModule, FilterDirective, FilterInputDirective, FilterableComponent, FixedGroupTemplateDirective, FooterTemplateDirective, GroupTagTemplateDirective, GroupTemplateDirective, HeaderTemplateDirective, ItemTemplateDirective, KENDO_AUTOCOMPLETE, KENDO_COMBOBOX, KENDO_DROPDOWNLIST, KENDO_DROPDOWNS, KENDO_DROPDOWNTREE, KENDO_MULTICOLUMNCOMBOBOX, KENDO_MULTISELECT, KENDO_MULTISELECTTREE, ListComponent, ListItemDirective, LocalizedMessagesDirective, MultiColumnComboBoxComponent, MultiSelectComponent, MultiSelectModule, MultiSelectTreeComponent, MultiSelectTreeFlatBindingDirective, MultiSelectTreeHierarchyBindingDirective, MultiSelectTreeSummaryTagDirective, NavigationService, NoDataTemplateDirective, NodeTemplateDirective, PreventableEvent, RemoveTagEvent, SearchBarComponent, SelectableDirective, SelectionService, TagListComponent, TagTemplateDirective, ValueTemplateDirective };
18661
19229