@progress/kendo-angular-dropdowns 5.5.0-dev.202110290903 → 5.5.1-dev.202111181325

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.
@@ -31,6 +31,7 @@ var DEFAULT_FILTER_SETTINGS = {
31
31
  * public data: Array<string> = ["Albania", "Andorra", "Armenia", "Austria", "Azerbaijan"];
32
32
  * }
33
33
  * ```
34
+ * > Currently, the built-in filtering does not work with [grouped data]({% slug api_kendo-data-query_groupby %}).
34
35
  */
35
36
  var FilterDirective = /** @class */ (function () {
36
37
  function FilterDirective(component) {
@@ -92,6 +92,10 @@ var ListComponent = /** @class */ (function () {
92
92
  this.lastLoaded = this.data.length - 1;
93
93
  this.scrollToFocused = !changes.data.isFirstChange();
94
94
  }
95
+ this.setOverflow();
96
+ }
97
+ if (isChanged('virtual', changes, false)) {
98
+ this.setOverflow();
95
99
  }
96
100
  };
97
101
  ListComponent.prototype.ngAfterViewInit = function () {
@@ -101,6 +105,7 @@ var ListComponent = /** @class */ (function () {
101
105
  _this.lastScrollTop = _this.content.nativeElement.scrollTop;
102
106
  });
103
107
  });
108
+ this.setOverflow();
104
109
  };
105
110
  ListComponent.prototype.ngAfterViewChecked = function () {
106
111
  if (this.virtual) {
@@ -276,6 +281,15 @@ var ListComponent = /** @class */ (function () {
276
281
  var hasVirtualScroll = isPresent(this.virtual) && this.hasVirtualScrollbar();
277
282
  return hasVirtualScroll || this.list.nativeElement.scrollHeight > this.content.nativeElement.offsetHeight;
278
283
  };
284
+ /**
285
+ * Sets the list's content overflow (hides/shows scrollbar)
286
+ */
287
+ ListComponent.prototype.setOverflow = function () {
288
+ if (this.virtual) {
289
+ var overflow = this.hasVirtualScrollbar() ? 'scroll' : 'hidden';
290
+ this.renderer.setStyle(this.content.nativeElement, 'overflow-y', overflow);
291
+ }
292
+ };
279
293
  /**
280
294
  * Indicates whether the scrollbar should be visible in virtual mode.
281
295
  */
@@ -396,7 +410,7 @@ var ListComponent = /** @class */ (function () {
396
410
  ListComponent = tslib_1.__decorate([
397
411
  Component({
398
412
  selector: 'kendo-list',
399
- template: "\n <div *ngIf=\"dataService.grouped\"\n class='k-outer-group-header k-first'\n [ngClass]=\"{'k-virtual-item': virtual}\"\n [ngStyle]=\"{\n 'height.px': virtual?.itemHeight,\n 'minHeight.px' : virtual?.itemHeight,\n 'boxSizing' : virtual ? 'border-box' : 'inherit'}\"\n >\n <ng-template *ngIf=\"fixedGroupTemplate\"\n [templateContext]=\"{\n templateRef: fixedGroupTemplate.templateRef,\n $implicit: currentGroup\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!fixedGroupTemplate\"><strong>{{ currentGroup }}</strong> </ng-template>\n </div>\n <div #content\n [ngClass]=\"{ 'k-virtual-content': virtual, 'k-list-scroller': !virtual }\"\n [style.maxHeight.px]=\"height\"\n [style.overflowY]=\"overflowY\"\n unselectable=\"on\">\n <ul #list\n role=\"listbox\"\n [class]=\"listClass\"\n [ngClass]=\"{ 'k-virtual-list': virtual }\"\n [attr.id]=\"id\"\n [attr.aria-hidden]=\"!show\">\n <ng-template *ngIf=\"!dataService.grouped && show\" ngFor let-dataItem let-itemIndex=\"index\" [ngForOf]=\"data\">\n <li\n role=\"option\"\n kendoDropDownsSelectable\n [checkboxes]=\"checkboxes\"\n [height]=\"virtual?.itemHeight\"\n [index]=\"itemIndex + startFrom\"\n [multipleSelection]=\"multipleSelection\"\n [attr.id]=\"optionPrefix + '-' + getValue(dataItem)\"\n [attr.tabIndex]=\"-1\"\n class=\"k-item\"\n [ngClass]=\"{ 'k-virtual-item': virtual, 'k-state-disabled': isDisabled(itemIndex) }\">\n <label *ngIf=\"checkboxes.enabled\"\n class=\"k-checkbox-label\">\n <input type=\"checkbox\"\n class=\"k-checkbox\"\n (change)=\"onCheckedChange($event, itemIndex)\"\n [checked]=\"isChecked(itemIndex)\"\n />\n </label>\n <ng-template *ngIf=\"template\"\n [templateContext]=\"{\n templateRef: template.templateRef,\n $implicit: dataItem\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!template\">{{ getText(dataItem) }}</ng-template>\n </li>\n </ng-template>\n <ng-template *ngIf=\"dataService.grouped\" ngFor let-dataItem let-itemIndex=\"index\" [ngForOf]=\"data\">\n <li\n *ngIf=\"dataItem.header && dataItem.index > 0\"\n role=\"group\"\n class='k-outer-group-header'\n [ngClass]=\"{ 'k-virtual-item': virtual }\"\n [ngStyle]=\"{\n 'height.px': virtual?.itemHeight,\n 'minHeight.px' : virtual?.itemHeight,\n 'boxSizing' : virtual ? 'border-box' : 'inherit'}\"\n [attr.group-index]=\"dataItem.index\"\n [attr.id]=\"optionPrefix + '-' + getValue(dataItem.value)\"\n [attr.tabIndex]=\"-1\">\n <ng-template *ngIf=\"groupTemplate\"\n [templateContext]=\"{\n templateRef: groupTemplate.templateRef,\n $implicit: dataItem.value\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!groupTemplate\"><strong> {{ dataItem.value }}</strong> </ng-template>\n </li>\n <li\n *ngIf=\"!dataItem.header\"\n role=\"option\"\n kendoDropDownsSelectable\n [height]=\"virtual?.itemHeight\"\n [index]=\"dataItem.offsetIndex\"\n [multipleSelection]=\"multipleSelection\"\n [attr.absolute-index]=\"dataItem.index\"\n [attr.id]=\"optionPrefix + '-' + getValue(dataItem.value)\"\n [attr.tabIndex]=\"-1\"\n class=\"k-item\"\n [ngClass]=\"{ 'k-virtual-item': virtual, 'k-state-disabled': isDisabled(dataItem.offsetIndex) }\">\n <ng-template *ngIf=\"template\"\n [templateContext]=\"{\n templateRef: template.templateRef,\n $implicit: dataItem.value\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!template\">{{ getText(dataItem.value) }}</ng-template>\n </li>\n </ng-template>\n <kendo-resize-sensor\n *ngIf=\"!virtual\"\n (resize)=\"listResize.emit()\"\n >\n </kendo-resize-sensor>\n </ul>\n <div *ngIf=\"virtual\" #virtualContainer class=\"k-height-container\" role=\"presentation\">\n <div [style.height.px]=\"scrollHeight\">\n <kendo-resize-sensor (resize)=\"listResize.emit()\"></kendo-resize-sensor>\n </div>\n </div>\n </div>\n "
413
+ template: "\n <div *ngIf=\"dataService.grouped\"\n class='k-outer-group-header k-first'\n [ngClass]=\"{'k-virtual-item': virtual}\"\n [ngStyle]=\"{\n 'height.px': virtual?.itemHeight,\n 'minHeight.px' : virtual?.itemHeight,\n 'boxSizing' : virtual ? 'border-box' : 'inherit'}\"\n >\n <ng-template *ngIf=\"fixedGroupTemplate\"\n [templateContext]=\"{\n templateRef: fixedGroupTemplate.templateRef,\n $implicit: currentGroup\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!fixedGroupTemplate\"><strong>{{ currentGroup }}</strong> </ng-template>\n </div>\n <div #content\n [ngClass]=\"{ 'k-virtual-content': virtual, 'k-list-scroller': !virtual }\"\n [style.maxHeight.px]=\"height\"\n unselectable=\"on\">\n <ul #list\n role=\"listbox\"\n [class]=\"listClass\"\n [ngClass]=\"{ 'k-virtual-list': virtual }\"\n [attr.id]=\"id\"\n [attr.aria-hidden]=\"!show\">\n <ng-template *ngIf=\"!dataService.grouped && show\" ngFor let-dataItem let-itemIndex=\"index\" [ngForOf]=\"data\">\n <li\n role=\"option\"\n kendoDropDownsSelectable\n [checkboxes]=\"checkboxes\"\n [height]=\"virtual?.itemHeight\"\n [index]=\"itemIndex + startFrom\"\n [multipleSelection]=\"multipleSelection\"\n [attr.id]=\"optionPrefix + '-' + getValue(dataItem)\"\n [attr.tabIndex]=\"-1\"\n class=\"k-item\"\n [ngClass]=\"{ 'k-virtual-item': virtual, 'k-state-disabled': isDisabled(itemIndex) }\">\n <label *ngIf=\"checkboxes.enabled\"\n class=\"k-checkbox-label\">\n <input type=\"checkbox\"\n class=\"k-checkbox\"\n (change)=\"onCheckedChange($event, itemIndex)\"\n [checked]=\"isChecked(itemIndex)\"\n />\n </label>\n <ng-template *ngIf=\"template\"\n [templateContext]=\"{\n templateRef: template.templateRef,\n $implicit: dataItem\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!template\">{{ getText(dataItem) }}</ng-template>\n </li>\n </ng-template>\n <ng-template *ngIf=\"dataService.grouped\" ngFor let-dataItem let-itemIndex=\"index\" [ngForOf]=\"data\">\n <li\n *ngIf=\"dataItem.header && dataItem.index > 0\"\n role=\"group\"\n class='k-outer-group-header'\n [ngClass]=\"{ 'k-virtual-item': virtual }\"\n [ngStyle]=\"{\n 'height.px': virtual?.itemHeight,\n 'minHeight.px' : virtual?.itemHeight,\n 'boxSizing' : virtual ? 'border-box' : 'inherit'}\"\n [attr.group-index]=\"dataItem.index\"\n [attr.id]=\"optionPrefix + '-' + getValue(dataItem.value)\"\n [attr.tabIndex]=\"-1\">\n <ng-template *ngIf=\"groupTemplate\"\n [templateContext]=\"{\n templateRef: groupTemplate.templateRef,\n $implicit: dataItem.value\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!groupTemplate\"><strong> {{ dataItem.value }}</strong> </ng-template>\n </li>\n <li\n *ngIf=\"!dataItem.header\"\n role=\"option\"\n kendoDropDownsSelectable\n [height]=\"virtual?.itemHeight\"\n [index]=\"dataItem.offsetIndex\"\n [multipleSelection]=\"multipleSelection\"\n [attr.absolute-index]=\"dataItem.index\"\n [attr.id]=\"optionPrefix + '-' + getValue(dataItem.value)\"\n [attr.tabIndex]=\"-1\"\n class=\"k-item\"\n [ngClass]=\"{ 'k-virtual-item': virtual, 'k-state-disabled': isDisabled(dataItem.offsetIndex) }\">\n <ng-template *ngIf=\"template\"\n [templateContext]=\"{\n templateRef: template.templateRef,\n $implicit: dataItem.value\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!template\">{{ getText(dataItem.value) }}</ng-template>\n </li>\n </ng-template>\n <kendo-resize-sensor\n *ngIf=\"!virtual\"\n (resize)=\"listResize.emit()\"\n >\n </kendo-resize-sensor>\n </ul>\n <div *ngIf=\"virtual\" #virtualContainer class=\"k-height-container\" role=\"presentation\">\n <div [style.height.px]=\"scrollHeight\">\n <kendo-resize-sensor (resize)=\"listResize.emit()\"></kendo-resize-sensor>\n </div>\n </div>\n </div>\n "
400
414
  }),
401
415
  tslib_1.__metadata("design:paramtypes", [DataService,
402
416
  ElementRef,
@@ -716,6 +716,16 @@ var DropDownTreeComponent = /** @class */ (function () {
716
716
  this.filterChange.next(term);
717
717
  this.allNodesHidden = this.nodes.every(function (node, index) { return !_this.isVisible(node, String(index)); });
718
718
  };
719
+ Object.defineProperty(DropDownTreeComponent.prototype, "buttonClasses", {
720
+ /**
721
+ * @hidden
722
+ */
723
+ get: function () {
724
+ return this.loading ? 'k-i-loading' : 'k-i-arrow-s';
725
+ },
726
+ enumerable: true,
727
+ configurable: true
728
+ });
719
729
  DropDownTreeComponent.prototype.verifySettings = function () {
720
730
  if (!isDevMode()) {
721
731
  return;
@@ -1132,7 +1142,7 @@ var DropDownTreeComponent = /** @class */ (function () {
1132
1142
  }
1133
1143
  ],
1134
1144
  selector: 'kendo-dropdowntree',
1135
- template: "\n <ng-container kendoDropDownTreeLocalizedMessages\n i18n-noDataText=\"kendo.dropdowntree.noDataText|The text displayed in the popup when there are no items\"\n noDataText=\"NO DATA FOUND\"\n\n i18n-clearTitle=\"kendo.dropdowntree.clearTitle|The title of the clear button\"\n clearTitle=\"clear\"\n >\n </ng-container>\n <span\n #wrapper\n [ngClass]=\"{\n 'k-dropdown-wrap': true,\n 'k-state-disabled': this.disabled\n }\"\n [attr.id]=\"focusableId\"\n role=\"listbox\"\n aria-haspopup=\"tree\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-readonly]=\"readonly\"\n [attr.tabindex]=\"tabindex\"\n [attr.dir]=\"direction\"\n (click)=\"handleClick()\"\n (keydown)=\"handleKeydown($event)\"\n [kendoEventsOutsideAngular]=\"{\n focus: handleFocus,\n blur: handleBlur\n }\"\n [scope]=\"this\"\n >\n <span\n [attr.id]=\"valueLabelId\"\n class=\"k-input\"\n >\n <ng-template *ngIf=\"valueTemplate\"\n [templateContext]=\"{\n templateRef: valueTemplate.templateRef,\n $implicit: dataItem\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!valueTemplate\"> {{ text || placeholder }} </ng-template>\n </span>\n <span\n *ngIf=\"!loading && !readonly && clearButton && text?.length\"\n class=\"k-icon k-clear-value k-i-close\"\n [style.visibility]=\"clearButtonVisiblity\"\n aria-hidden=\"true\"\n [attr.title]=\"messageFor('clearTitle')\"\n (click)=\"clearValue($event)\"\n >\n </span>\n <span class=\"k-select\" aria-hidden=\"true\">\n <span class=\"k-icon k-i-arrow-60-down\"></span>\n </span>\n </span>\n <ng-template #popupTemplate>\n <span\n *ngIf=\"filterable\"\n class=\"k-list-filter\"\n >\n <input\n #filterInput\n (input)=\"handleFilterInputChange($event.target.value)\"\n [filterInput]=\"filterable && !touchEnabled\"\n (keydown.arrowdown)=\"handleKeydown($event)\"\n (keydown.alt.arrowup)=\"handleKeydown($event)\"\n [(ngModel)]=\"filter\"\n class=\"k-textbox\"\n role=\"textbox\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n tabindex=\"0\"\n aria-disabled=\"false\"\n aria-readonly=\"false\"\n [kendoEventsOutsideAngular]=\"{\n blur: handleBlur\n }\"\n [scope]=\"this\"\n >\n <span class=\"k-icon k-i-zoom\"></span>\n </span>\n <!--header template-->\n <ng-template\n *ngIf=\"headerTemplate\"\n [templateContext]=\"{\n templateRef: headerTemplate?.templateRef\n }\">\n </ng-template>\n <kendo-treeview\n #treeview\n *ngIf=\"data.length !== 0 && !allNodesHidden\"\n [nodes]=\"data\"\n [style.maxHeight.px]=\"listHeight\"\n [animate]=\"false\"\n [(selectedKeys)]=\"selectedKeys\"\n [selectBy]=\"selectBy\"\n [textField]=\"textField\"\n kendoTreeViewSelectable\n [children]=\"children\"\n [hasChildren]=\"hasChildren\"\n [loadOnDemand]=\"loadOnDemand\"\n [isExpanded]=\"isNodeExpanded\"\n [isDisabled]=\"itemDisabled\"\n [nodeTemplate]=\"nodeTemplate\"\n [filter]=\"filter\"\n [isVisible]=\"isNodeVisible\"\n (focusout)=\"handleBlur($event)\"\n (keydown)=\"handleKeydown($event)\"\n (selectionChange)=\"onSelectionChange($event)\"\n (expand)=\"nodeExpand.emit($event)\"\n (collapse)=\"nodeCollapse.emit($event)\"\n >\n </kendo-treeview>\n <!--footer template-->\n <ng-template\n *ngIf=\"footerTemplate\"\n [templateContext]=\"{\n templateRef: footerTemplate?.templateRef\n }\">\n </ng-template>\n <!--no-data template-->\n <div class=\"k-nodata\" *ngIf=\"data.length === 0 || allNodesHidden\">\n <ng-template [ngIf]=\"noDataTemplate\"\n [templateContext]=\"{\n templateRef: noDataTemplate?.templateRef\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!noDataTemplate\">\n <div>{{ messageFor('noDataText') }}</div>\n </ng-template>\n </div>\n </ng-template>\n <ng-container #container></ng-container>\n ",
1145
+ template: "\n <ng-container kendoDropDownTreeLocalizedMessages\n i18n-noDataText=\"kendo.dropdowntree.noDataText|The text displayed in the popup when there are no items\"\n noDataText=\"NO DATA FOUND\"\n\n i18n-clearTitle=\"kendo.dropdowntree.clearTitle|The title of the clear button\"\n clearTitle=\"clear\"\n >\n </ng-container>\n <span\n #wrapper\n [ngClass]=\"{\n 'k-dropdown-wrap': true,\n 'k-state-disabled': this.disabled\n }\"\n [attr.id]=\"focusableId\"\n role=\"listbox\"\n aria-haspopup=\"tree\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-readonly]=\"readonly\"\n [attr.tabindex]=\"tabindex\"\n [attr.dir]=\"direction\"\n (click)=\"handleClick()\"\n (keydown)=\"handleKeydown($event)\"\n [kendoEventsOutsideAngular]=\"{\n focus: handleFocus,\n blur: handleBlur\n }\"\n [scope]=\"this\"\n >\n <span\n [attr.id]=\"valueLabelId\"\n class=\"k-input\"\n >\n <ng-template *ngIf=\"valueTemplate\"\n [templateContext]=\"{\n templateRef: valueTemplate.templateRef,\n $implicit: dataItem\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!valueTemplate\"> {{ text || placeholder }} </ng-template>\n </span>\n <span\n *ngIf=\"!loading && !readonly && clearButton && text?.length && !disabled\"\n class=\"k-icon k-clear-value k-i-close\"\n [style.visibility]=\"clearButtonVisiblity\"\n aria-hidden=\"true\"\n [attr.title]=\"messageFor('clearTitle')\"\n (click)=\"clearValue($event)\"\n >\n </span>\n <span class=\"k-select\" aria-hidden=\"true\">\n <span\n class=\"k-icon k-i-arrow-60-down\"\n [ngClass]=\"buttonClasses\"\n ></span>\n </span>\n </span>\n <ng-template #popupTemplate>\n <span\n *ngIf=\"filterable\"\n class=\"k-list-filter\"\n >\n <input\n #filterInput\n (input)=\"handleFilterInputChange($event.target.value)\"\n [filterInput]=\"filterable && !touchEnabled\"\n (keydown.arrowdown)=\"handleKeydown($event)\"\n (keydown.alt.arrowup)=\"handleKeydown($event)\"\n [(ngModel)]=\"filter\"\n class=\"k-textbox\"\n role=\"textbox\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n tabindex=\"0\"\n aria-disabled=\"false\"\n aria-readonly=\"false\"\n [kendoEventsOutsideAngular]=\"{\n blur: handleBlur\n }\"\n [scope]=\"this\"\n >\n <span class=\"k-icon k-i-zoom\"></span>\n </span>\n <!--header template-->\n <ng-template\n *ngIf=\"headerTemplate\"\n [templateContext]=\"{\n templateRef: headerTemplate?.templateRef\n }\">\n </ng-template>\n <kendo-treeview\n #treeview\n *ngIf=\"data.length !== 0 && !allNodesHidden\"\n [nodes]=\"data\"\n [style.maxHeight.px]=\"listHeight\"\n [animate]=\"false\"\n [(selectedKeys)]=\"selectedKeys\"\n [selectBy]=\"selectBy\"\n [textField]=\"textField\"\n kendoTreeViewSelectable\n [children]=\"children\"\n [hasChildren]=\"hasChildren\"\n [loadOnDemand]=\"loadOnDemand\"\n [isExpanded]=\"isNodeExpanded\"\n [isDisabled]=\"itemDisabled\"\n [nodeTemplate]=\"nodeTemplate\"\n [filter]=\"filter\"\n [isVisible]=\"isNodeVisible\"\n (focusout)=\"handleBlur($event)\"\n (keydown)=\"handleKeydown($event)\"\n (selectionChange)=\"onSelectionChange($event)\"\n (expand)=\"nodeExpand.emit($event)\"\n (collapse)=\"nodeCollapse.emit($event)\"\n >\n </kendo-treeview>\n <!--footer template-->\n <ng-template\n *ngIf=\"footerTemplate\"\n [templateContext]=\"{\n templateRef: footerTemplate?.templateRef\n }\">\n </ng-template>\n <!--no-data template-->\n <div class=\"k-nodata\" *ngIf=\"data.length === 0 || allNodesHidden\">\n <ng-template [ngIf]=\"noDataTemplate\"\n [templateContext]=\"{\n templateRef: noDataTemplate?.templateRef\n }\">\n </ng-template>\n <ng-template [ngIf]=\"!noDataTemplate\">\n <div>{{ messageFor('noDataText') }}</div>\n </ng-template>\n </div>\n </ng-template>\n <ng-container #container></ng-container>\n ",
1136
1146
  changeDetection: ChangeDetectionStrategy.OnPush
1137
1147
  }),
1138
1148
  tslib_1.__param(7, Optional()), tslib_1.__param(7, Inject(TOUCH_ENABLED)),
@@ -9,7 +9,7 @@ export var packageMetadata = {
9
9
  name: '@progress/kendo-angular-dropdowns',
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
12
- publishDate: 1635498056,
12
+ publishDate: 1637241736,
13
13
  version: '',
14
14
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
15
15
  };
@@ -26,6 +26,7 @@ import { DropDownFilterSettings } from './filter-settings';
26
26
  * public data: Array<string> = ["Albania", "Andorra", "Armenia", "Austria", "Azerbaijan"];
27
27
  * }
28
28
  * ```
29
+ * > Currently, the built-in filtering does not work with [grouped data]({% slug api_kendo-data-query_groupby %}).
29
30
  */
30
31
  export declare class FilterDirective implements OnInit, OnDestroy {
31
32
  private component;
@@ -31,6 +31,7 @@ const DEFAULT_FILTER_SETTINGS = {
31
31
  * public data: Array<string> = ["Albania", "Andorra", "Armenia", "Austria", "Azerbaijan"];
32
32
  * }
33
33
  * ```
34
+ * > Currently, the built-in filtering does not work with [grouped data]({% slug api_kendo-data-query_groupby %}).
34
35
  */
35
36
  let FilterDirective = class FilterDirective {
36
37
  constructor(component) {
@@ -83,6 +83,10 @@ export declare class ListComponent implements OnChanges, OnDestroy, AfterViewIni
83
83
  * Indicates whether a scrollbar is currently rendered in the list.
84
84
  */
85
85
  hasScrollbar(): boolean;
86
+ /**
87
+ * Sets the list's content overflow (hides/shows scrollbar)
88
+ */
89
+ private setOverflow;
86
90
  /**
87
91
  * Indicates whether the scrollbar should be visible in virtual mode.
88
92
  */
@@ -75,6 +75,10 @@ let ListComponent = class ListComponent {
75
75
  this.lastLoaded = this.data.length - 1;
76
76
  this.scrollToFocused = !changes.data.isFirstChange();
77
77
  }
78
+ this.setOverflow();
79
+ }
80
+ if (isChanged('virtual', changes, false)) {
81
+ this.setOverflow();
78
82
  }
79
83
  }
80
84
  ngAfterViewInit() {
@@ -83,6 +87,7 @@ let ListComponent = class ListComponent {
83
87
  this.lastScrollTop = this.content.nativeElement.scrollTop;
84
88
  });
85
89
  });
90
+ this.setOverflow();
86
91
  }
87
92
  ngAfterViewChecked() {
88
93
  if (this.virtual) {
@@ -256,6 +261,15 @@ let ListComponent = class ListComponent {
256
261
  const hasVirtualScroll = isPresent(this.virtual) && this.hasVirtualScrollbar();
257
262
  return hasVirtualScroll || this.list.nativeElement.scrollHeight > this.content.nativeElement.offsetHeight;
258
263
  }
264
+ /**
265
+ * Sets the list's content overflow (hides/shows scrollbar)
266
+ */
267
+ setOverflow() {
268
+ if (this.virtual) {
269
+ const overflow = this.hasVirtualScrollbar() ? 'scroll' : 'hidden';
270
+ this.renderer.setStyle(this.content.nativeElement, 'overflow-y', overflow);
271
+ }
272
+ }
259
273
  /**
260
274
  * Indicates whether the scrollbar should be visible in virtual mode.
261
275
  */
@@ -396,7 +410,6 @@ ListComponent = tslib_1.__decorate([
396
410
  <div #content
397
411
  [ngClass]="{ 'k-virtual-content': virtual, 'k-list-scroller': !virtual }"
398
412
  [style.maxHeight.px]="height"
399
- [style.overflowY]="overflowY"
400
413
  unselectable="on">
401
414
  <ul #list
402
415
  role="listbox"
@@ -418,6 +418,10 @@ export declare class DropDownTreeComponent implements OnInit, OnDestroy, OnChang
418
418
  * @hidden
419
419
  */
420
420
  handleFilterInputChange(term: string): void;
421
+ /**
422
+ * @hidden
423
+ */
424
+ readonly buttonClasses: any;
421
425
  protected onTouchedCallback: Function;
422
426
  protected onChangeCallback: Function;
423
427
  protected verifySettings(): void;
@@ -629,6 +629,12 @@ let DropDownTreeComponent = DropDownTreeComponent_1 = class DropDownTreeComponen
629
629
  this.filterChange.next(term);
630
630
  this.allNodesHidden = this.nodes.every((node, index) => !this.isVisible(node, String(index)));
631
631
  }
632
+ /**
633
+ * @hidden
634
+ */
635
+ get buttonClasses() {
636
+ return this.loading ? 'k-i-loading' : 'k-i-arrow-s';
637
+ }
632
638
  verifySettings() {
633
639
  if (!isDevMode()) {
634
640
  return;
@@ -1083,7 +1089,7 @@ DropDownTreeComponent = DropDownTreeComponent_1 = tslib_1.__decorate([
1083
1089
  <ng-template [ngIf]="!valueTemplate"> {{ text || placeholder }} </ng-template>
1084
1090
  </span>
1085
1091
  <span
1086
- *ngIf="!loading && !readonly && clearButton && text?.length"
1092
+ *ngIf="!loading && !readonly && clearButton && text?.length && !disabled"
1087
1093
  class="k-icon k-clear-value k-i-close"
1088
1094
  [style.visibility]="clearButtonVisiblity"
1089
1095
  aria-hidden="true"
@@ -1092,7 +1098,10 @@ DropDownTreeComponent = DropDownTreeComponent_1 = tslib_1.__decorate([
1092
1098
  >
1093
1099
  </span>
1094
1100
  <span class="k-select" aria-hidden="true">
1095
- <span class="k-icon k-i-arrow-60-down"></span>
1101
+ <span
1102
+ class="k-icon k-i-arrow-60-down"
1103
+ [ngClass]="buttonClasses"
1104
+ ></span>
1096
1105
  </span>
1097
1106
  </span>
1098
1107
  <ng-template #popupTemplate>