@progress/kendo-angular-dropdowns 14.0.2-develop.9 → 14.1.0-develop.2

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.
@@ -2,8 +2,8 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Renderer2, ElementRef, EventEmitter, ViewContainerRef, TemplateRef, OnDestroy, SimpleChanges, OnChanges, ChangeDetectorRef, NgZone, AfterViewInit } from '@angular/core';
6
- import { ControlValueAccessor } from '@angular/forms';
5
+ import { Renderer2, ElementRef, EventEmitter, ViewContainerRef, TemplateRef, OnDestroy, SimpleChanges, OnChanges, ChangeDetectorRef, NgZone, AfterViewInit, Injector } from '@angular/core';
6
+ import { ControlValueAccessor, FormControl } from '@angular/forms';
7
7
  import { SearchBarComponent } from '../common/searchbar.component';
8
8
  import { ItemTemplateDirective } from '../common/templates/item-template.directive';
9
9
  import { HeaderTemplateDirective } from '../common/templates/header-template.directive';
@@ -69,6 +69,7 @@ export declare class AutoCompleteComponent implements ControlValueAccessor, OnDe
69
69
  private renderer;
70
70
  private hostElement;
71
71
  protected touchEnabled: boolean;
72
+ private injector;
72
73
  /**
73
74
  * @hidden
74
75
  */
@@ -354,9 +355,13 @@ export declare class AutoCompleteComponent implements ControlValueAccessor, OnDe
354
355
  * @hidden
355
356
  */
356
357
  get isAdaptive(): boolean;
358
+ /**
359
+ * @hidden
360
+ */
361
+ get formControl(): FormControl;
357
362
  protected onChangeCallback: Function;
358
363
  protected onTouchedCallback: Function;
359
- constructor(localization: LocalizationService, dataService: DataService, popupService: PopupService, selectionService: SelectionService, navigationService: NavigationService, disabledItemsService: DisabledItemsService, _zone: NgZone, cdr: ChangeDetectorRef, renderer: Renderer2, hostElement: ElementRef, touchEnabled: boolean);
364
+ constructor(localization: LocalizationService, dataService: DataService, popupService: PopupService, selectionService: SelectionService, navigationService: NavigationService, disabledItemsService: DisabledItemsService, _zone: NgZone, cdr: ChangeDetectorRef, renderer: Renderer2, hostElement: ElementRef, touchEnabled: boolean, injector: Injector);
360
365
  ngOnInit(): void;
361
366
  ngAfterViewInit(): void;
362
367
  ngOnDestroy(): void;
@@ -474,6 +479,6 @@ export declare class AutoCompleteComponent implements ControlValueAccessor, OnDe
474
479
  private setComponentClasses;
475
480
  private closeActionSheet;
476
481
  private openActionSheet;
477
- static ɵfac: i0.ɵɵFactoryDeclaration<AutoCompleteComponent, [null, null, null, null, null, null, null, null, null, null, { optional: true; }]>;
482
+ static ɵfac: i0.ɵɵFactoryDeclaration<AutoCompleteComponent, [null, null, null, null, null, null, null, null, null, null, { optional: true; }, null]>;
478
483
  static ɵcmp: i0.ɵɵComponentDeclaration<AutoCompleteComponent, "kendo-autocomplete", ["kendoAutoComplete"], { "highlightFirst": "highlightFirst"; "showStickyHeader": "showStickyHeader"; "focusableId": "focusableId"; "data": "data"; "value": "value"; "valueField": "valueField"; "placeholder": "placeholder"; "adaptiveMode": "adaptiveMode"; "title": "title"; "subtitle": "subtitle"; "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"; }, { "valueChange": "valueChange"; "filterChange": "filterChange"; "open": "open"; "opened": "opened"; "close": "close"; "closed": "closed"; "onFocus": "focus"; "onBlur": "blur"; }, ["template", "headerTemplate", "footerTemplate", "noDataTemplate", "groupTemplate", "fixedGroupTemplate"], never>;
479
484
  }
@@ -2,8 +2,8 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { ElementRef, TemplateRef, EventEmitter, ViewContainerRef, OnDestroy, OnChanges, ChangeDetectorRef, NgZone, Renderer2, SimpleChanges, AfterContentChecked, AfterViewInit } from '@angular/core';
6
- import { ControlValueAccessor } from '@angular/forms';
5
+ import { ElementRef, TemplateRef, EventEmitter, ViewContainerRef, OnDestroy, OnChanges, ChangeDetectorRef, NgZone, Renderer2, SimpleChanges, AfterContentChecked, AfterViewInit, Injector } from '@angular/core';
6
+ import { ControlValueAccessor, FormControl } from '@angular/forms';
7
7
  import { SearchBarComponent } from '../common/searchbar.component';
8
8
  import { ItemTemplateDirective } from '../common/templates/item-template.directive';
9
9
  import { HeaderTemplateDirective } from '../common/templates/header-template.directive';
@@ -67,6 +67,7 @@ export declare class ComboBoxComponent implements ControlValueAccessor, AfterVie
67
67
  protected cdr: ChangeDetectorRef;
68
68
  protected renderer: Renderer2;
69
69
  protected touchEnabled: boolean;
70
+ protected injector: Injector;
70
71
  /**
71
72
  * @hidden
72
73
  */
@@ -406,6 +407,10 @@ export declare class ComboBoxComponent implements ControlValueAccessor, AfterVie
406
407
  get isFocused(): boolean;
407
408
  set isFocused(value: boolean);
408
409
  get clearButtonVisiblity(): string;
410
+ /**
411
+ * @hidden
412
+ */
413
+ get formControl(): FormControl;
409
414
  /**
410
415
  * @hidden
411
416
  */
@@ -460,7 +465,7 @@ export declare class ComboBoxComponent implements ControlValueAccessor, AfterVie
460
465
  private _size;
461
466
  private _rounded;
462
467
  private _fillMode;
463
- constructor(wrapper: ElementRef<HTMLElement>, localization: LocalizationService, popupService: PopupService, selectionService: SelectionService, navigationService: NavigationService, disabledItemsService: DisabledItemsService, dataService: DataService, zone: NgZone, cdr: ChangeDetectorRef, renderer: Renderer2, touchEnabled: boolean);
468
+ constructor(wrapper: ElementRef<HTMLElement>, localization: LocalizationService, popupService: PopupService, selectionService: SelectionService, navigationService: NavigationService, disabledItemsService: DisabledItemsService, dataService: DataService, zone: NgZone, cdr: ChangeDetectorRef, renderer: Renderer2, touchEnabled: boolean, injector: Injector);
464
469
  ngOnInit(): void;
465
470
  ngAfterViewInit(): void;
466
471
  private createValueStream;
@@ -622,6 +627,6 @@ export declare class ComboBoxComponent implements ControlValueAccessor, AfterVie
622
627
  private findIndex;
623
628
  private closeActionSheet;
624
629
  private openActionSheet;
625
- static ɵfac: i0.ɵɵFactoryDeclaration<ComboBoxComponent, [null, null, null, null, null, null, null, null, null, null, { optional: true; }]>;
630
+ static ɵfac: i0.ɵɵFactoryDeclaration<ComboBoxComponent, [null, null, null, null, null, null, null, null, null, null, { optional: true; }, null]>;
626
631
  static ɵcmp: i0.ɵɵComponentDeclaration<ComboBoxComponent, "kendo-combobox", ["kendoComboBox"], { "icon": "icon"; "svgIcon": "svgIcon"; "showStickyHeader": "showStickyHeader"; "focusableId": "focusableId"; "allowCustom": "allowCustom"; "data": "data"; "value": "value"; "textField": "textField"; "valueField": "valueField"; "valuePrimitive": "valuePrimitive"; "valueNormalizer": "valueNormalizer"; "placeholder": "placeholder"; "adaptiveMode": "adaptiveMode"; "title": "title"; "subtitle": "subtitle"; "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"; }, { "valueChange": "valueChange"; "selectionChange": "selectionChange"; "filterChange": "filterChange"; "open": "open"; "opened": "opened"; "close": "close"; "closed": "closed"; "onFocus": "focus"; "onBlur": "blur"; }, ["template", "headerTemplate", "footerTemplate", "noDataTemplate", "groupTemplate", "fixedGroupTemplate"], never>;
627
632
  }
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { AfterViewInit, ChangeDetectorRef, ElementRef, NgZone, OnDestroy, QueryList, Renderer2 } from '@angular/core';
5
+ import { AfterViewInit, ChangeDetectorRef, ElementRef, Injector, NgZone, OnDestroy, QueryList, Renderer2 } from '@angular/core';
6
6
  import { LocalizationService } from '@progress/kendo-angular-l10n';
7
7
  import { PopupService } from '@progress/kendo-angular-popup';
8
8
  import { ComboBoxComponent } from './combobox.component';
@@ -50,7 +50,7 @@ export declare class MultiColumnComboBoxComponent extends ComboBoxComponent impl
50
50
  * @hidden
51
51
  */
52
52
  protected get listContainerClasses(): string[];
53
- constructor(localization: LocalizationService, popupService: PopupService, selectionService: SelectionService, navigationService: NavigationService, disabledItemsService: DisabledItemsService, dataService: DataService, zone: NgZone, changeDetector: ChangeDetectorRef, renderer: Renderer2, wrapper: ElementRef<HTMLElement>, touchEnabled: boolean);
53
+ constructor(localization: LocalizationService, popupService: PopupService, selectionService: SelectionService, navigationService: NavigationService, disabledItemsService: DisabledItemsService, dataService: DataService, zone: NgZone, changeDetector: ChangeDetectorRef, renderer: Renderer2, wrapper: ElementRef<HTMLElement>, touchEnabled: boolean, injector: Injector);
54
54
  ngAfterViewInit(): void;
55
55
  ngOnDestroy(): void;
56
56
  /**
@@ -57,6 +57,7 @@ export declare class ListComponent implements OnChanges, OnDestroy, AfterViewIni
57
57
  onClick: EventEmitter<any>;
58
58
  pageChange: EventEmitter<PageChangeEvent>;
59
59
  listResize: EventEmitter<boolean>;
60
+ popupListScroll: EventEmitter<any>;
60
61
  items: QueryList<ListItemDirective>;
61
62
  content: ElementRef<HTMLElement>;
62
63
  list: ElementRef<HTMLElement>;
@@ -129,5 +130,5 @@ export declare class ListComponent implements OnChanges, OnDestroy, AfterViewIni
129
130
  private firstGroupHeaderInTargetedPage;
130
131
  private setComponentClasses;
131
132
  static ɵfac: i0.ɵɵFactoryDeclaration<ListComponent, never>;
132
- static ɵcmp: i0.ɵɵComponentDeclaration<ListComponent, "kendo-list", never, { "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"; "data": "data"; "size": "size"; "rounded": "rounded"; }, { "onClick": "onClick"; "pageChange": "pageChange"; "listResize": "listResize"; }, never, never>;
133
+ static ɵcmp: i0.ɵɵComponentDeclaration<ListComponent, "kendo-list", never, { "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"; "data": "data"; "size": "size"; "rounded": "rounded"; }, { "onClick": "onClick"; "pageChange": "pageChange"; "listResize": "listResize"; "popupListScroll": "popupListScroll"; }, never, never>;
133
134
  }
@@ -2,9 +2,9 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Component, Renderer2, forwardRef, ElementRef, Input, Output, EventEmitter, ContentChild, ViewChild, ViewContainerRef, TemplateRef, HostBinding, isDevMode, ChangeDetectorRef, NgZone, Optional, Inject } from '@angular/core';
5
+ import { Component, Renderer2, forwardRef, ElementRef, Input, Output, EventEmitter, ContentChild, ViewChild, ViewContainerRef, TemplateRef, HostBinding, isDevMode, ChangeDetectorRef, NgZone, Optional, Inject, Injector } from '@angular/core';
6
6
  import { isDocumentAvailable, KendoInput, hasObservers } from '@progress/kendo-angular-common';
7
- import { NG_VALUE_ACCESSOR } from '@angular/forms';
7
+ import { NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
8
8
  import { validatePackage } from '@progress/kendo-licensing';
9
9
  import { packageMetadata } from '../package-metadata';
10
10
  import { SearchBarComponent } from '../common/searchbar.component';
@@ -78,7 +78,7 @@ export const AUTOCOMPLETE_VALUE_ACCESSOR = {
78
78
  * ```
79
79
  */
80
80
  export class AutoCompleteComponent {
81
- constructor(localization, dataService, popupService, selectionService, navigationService, disabledItemsService, _zone, cdr, renderer, hostElement, touchEnabled) {
81
+ constructor(localization, dataService, popupService, selectionService, navigationService, disabledItemsService, _zone, cdr, renderer, hostElement, touchEnabled, injector) {
82
82
  this.localization = localization;
83
83
  this.dataService = dataService;
84
84
  this.popupService = popupService;
@@ -90,6 +90,7 @@ export class AutoCompleteComponent {
90
90
  this.renderer = renderer;
91
91
  this.hostElement = hostElement;
92
92
  this.touchEnabled = touchEnabled;
93
+ this.injector = injector;
93
94
  /**
94
95
  * @hidden
95
96
  */
@@ -537,6 +538,13 @@ export class AutoCompleteComponent {
537
538
  get isAdaptive() {
538
539
  return this.isAdaptiveModeEnabled && this.windowSize !== 'large';
539
540
  }
541
+ /**
542
+ * @hidden
543
+ */
544
+ get formControl() {
545
+ const ngControl = this.injector.get(NgControl, null);
546
+ return ngControl?.control || null;
547
+ }
540
548
  ngOnInit() {
541
549
  this.renderer.removeAttribute(this.wrapper, "tabindex");
542
550
  this.subs.add(this.localization
@@ -836,7 +844,11 @@ export class AutoCompleteComponent {
836
844
  }
837
845
  this.isFocused = false;
838
846
  const valueHasChanged = this.value !== this.text;
839
- const runInZone = hasObservers(this.onBlur) || hasObservers(this.close) || isUntouched(this.wrapper) || valueHasChanged;
847
+ const runInZone = hasObservers(this.onBlur) ||
848
+ hasObservers(this.close) ||
849
+ isUntouched(this.wrapper) ||
850
+ valueHasChanged ||
851
+ this.formControl?.updateOn === 'blur';
840
852
  if (runInZone) {
841
853
  this._zone.run(() => {
842
854
  if (valueHasChanged) {
@@ -1065,7 +1077,7 @@ export class AutoCompleteComponent {
1065
1077
  this.actionSheetSearchBar.focus();
1066
1078
  }
1067
1079
  }
1068
- AutoCompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: AutoCompleteComponent, deps: [{ token: i1.LocalizationService }, { token: i2.DataService }, { token: i3.PopupService }, { token: i4.SelectionService }, { token: i5.NavigationService }, { token: i6.DisabledItemsService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: TOUCH_ENABLED, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1080
+ AutoCompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: AutoCompleteComponent, deps: [{ token: i1.LocalizationService }, { token: i2.DataService }, { token: i3.PopupService }, { token: i4.SelectionService }, { token: i5.NavigationService }, { token: i6.DisabledItemsService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: TOUCH_ENABLED, optional: true }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
1069
1081
  AutoCompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: AutoCompleteComponent, selector: "kendo-autocomplete", inputs: { highlightFirst: "highlightFirst", showStickyHeader: "showStickyHeader", focusableId: "focusableId", data: "data", value: "value", valueField: "valueField", placeholder: "placeholder", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", 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" }, outputs: { valueChange: "valueChange", filterChange: "filterChange", open: "open", opened: "opened", close: "close", closed: "closed", onFocus: "focus", onBlur: "blur" }, host: { properties: { "class.k-autocomplete": "this.widgetClasses", "class.k-input": "this.widgetClasses", "class.k-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.dir": "this.dir" } }, providers: [
1070
1082
  AUTOCOMPLETE_VALUE_ACCESSOR,
1071
1083
  DataService,
@@ -1200,7 +1212,7 @@ AutoCompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
1200
1212
  }">
1201
1213
  </ng-template>
1202
1214
  </ng-template>
1203
- `, isInline: true, components: [{ type: i7.SearchBarComponent, selector: "kendo-searchbar", inputs: ["id", "tagListId", "activeDescendant", "disabled", "readonly", "tabIndex", "role", "isLoading", "ariaControls", "ariaExpanded", "isSuggestable", "isFilterable", "userInput", "suggestedText", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { type: i8.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i9.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i10.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i11.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize"] }], directives: [{ type: i12.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
1215
+ `, isInline: true, components: [{ type: i7.SearchBarComponent, selector: "kendo-searchbar", inputs: ["id", "tagListId", "activeDescendant", "disabled", "readonly", "tabIndex", "role", "isLoading", "ariaControls", "ariaExpanded", "isSuggestable", "isFilterable", "userInput", "suggestedText", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { type: i8.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i9.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i10.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i11.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }], directives: [{ type: i12.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
1204
1216
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: AutoCompleteComponent, decorators: [{
1205
1217
  type: Component,
1206
1218
  args: [{
@@ -1348,7 +1360,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1348
1360
  }, {
1349
1361
  type: Inject,
1350
1362
  args: [TOUCH_ENABLED]
1351
- }] }]; }, propDecorators: { responsiveRendererComponent: [{
1363
+ }] }, { type: i0.Injector }]; }, propDecorators: { responsiveRendererComponent: [{
1352
1364
  type: ViewChild,
1353
1365
  args: [ResponsiveRendererComponent]
1354
1366
  }], highlightFirst: [{
@@ -2,8 +2,8 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Component, forwardRef, ElementRef, TemplateRef, Input, Output, EventEmitter, ContentChild, ViewChild, ViewContainerRef, HostBinding, isDevMode, Optional, Inject, ChangeDetectorRef, NgZone, Renderer2 } from '@angular/core';
6
- import { NG_VALUE_ACCESSOR } from '@angular/forms';
5
+ import { Component, forwardRef, ElementRef, TemplateRef, Input, Output, EventEmitter, ContentChild, ViewChild, ViewContainerRef, HostBinding, isDevMode, Optional, Inject, ChangeDetectorRef, NgZone, Renderer2, Injector } from '@angular/core';
6
+ import { NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
7
7
  import { validatePackage } from '@progress/kendo-licensing';
8
8
  import { packageMetadata } from '../package-metadata';
9
9
  import { SearchBarComponent } from '../common/searchbar.component';
@@ -78,7 +78,7 @@ const DEFAULT_FILL_MODE = 'solid';
78
78
  * ```
79
79
  */
80
80
  export class ComboBoxComponent {
81
- constructor(wrapper, localization, popupService, selectionService, navigationService, disabledItemsService, dataService, zone, cdr, renderer, touchEnabled) {
81
+ constructor(wrapper, localization, popupService, selectionService, navigationService, disabledItemsService, dataService, zone, cdr, renderer, touchEnabled, injector) {
82
82
  this.wrapper = wrapper;
83
83
  this.localization = localization;
84
84
  this.popupService = popupService;
@@ -90,6 +90,7 @@ export class ComboBoxComponent {
90
90
  this.cdr = cdr;
91
91
  this.renderer = renderer;
92
92
  this.touchEnabled = touchEnabled;
93
+ this.injector = injector;
93
94
  /**
94
95
  * @hidden
95
96
  */
@@ -565,6 +566,13 @@ export class ComboBoxComponent {
565
566
  return 'visible';
566
567
  }
567
568
  }
569
+ /**
570
+ * @hidden
571
+ */
572
+ get formControl() {
573
+ const ngControl = this.injector.get(NgControl, null);
574
+ return ngControl?.control || null;
575
+ }
568
576
  /**
569
577
  * @hidden
570
578
  */
@@ -1152,7 +1160,11 @@ export class ComboBoxComponent {
1152
1160
  const currentText = this.searchbar.value;
1153
1161
  const textHasChanged = currentText !== (getter(this.dataItem, this.textField) || '');
1154
1162
  const valueHasChanged = unresolvedSelection || textHasChanged;
1155
- const runInZone = valueHasChanged || hasObservers(this.onBlur) || hasObservers(this.close) || isUntouched(this.wrapper.nativeElement);
1163
+ const runInZone = valueHasChanged ||
1164
+ hasObservers(this.onBlur) ||
1165
+ hasObservers(this.close) ||
1166
+ isUntouched(this.wrapper.nativeElement) ||
1167
+ this.formControl?.updateOn === 'blur';
1156
1168
  if (runInZone) {
1157
1169
  this.zone.run(() => {
1158
1170
  if (valueHasChanged) {
@@ -1451,7 +1463,7 @@ export class ComboBoxComponent {
1451
1463
  this.actionSheetSearchBar.focus();
1452
1464
  }
1453
1465
  }
1454
- ComboBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ComboBoxComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: i3.SelectionService }, { token: i4.NavigationService }, { token: i5.DisabledItemsService }, { token: i6.DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: TOUCH_ENABLED, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1466
+ ComboBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ComboBoxComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i2.PopupService }, { token: i3.SelectionService }, { token: i4.NavigationService }, { token: i5.DisabledItemsService }, { token: i6.DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: TOUCH_ENABLED, optional: true }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
1455
1467
  ComboBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ComboBoxComponent, selector: "kendo-combobox", inputs: { icon: "icon", svgIcon: "svgIcon", showStickyHeader: "showStickyHeader", focusableId: "focusableId", allowCustom: "allowCustom", data: "data", value: "value", textField: "textField", valueField: "valueField", valuePrimitive: "valuePrimitive", valueNormalizer: "valueNormalizer", placeholder: "placeholder", adaptiveMode: "adaptiveMode", title: "title", subtitle: "subtitle", 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" }, host: { properties: { "class.k-combobox": "this.widgetClasses", "class.k-input": "this.widgetClasses", "class.k-disabled": "this.isDisabled", "class.k-loading": "this.isLoading", "attr.dir": "this.dir" } }, providers: [
1456
1468
  COMBOBOX_VALUE_ACCESSOR,
1457
1469
  DataService,
@@ -1606,7 +1618,7 @@ ComboBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
1606
1618
  }">
1607
1619
  </ng-template>
1608
1620
  </ng-template>
1609
- `, isInline: true, components: [{ type: i7.SearchBarComponent, selector: "kendo-searchbar", inputs: ["id", "tagListId", "activeDescendant", "disabled", "readonly", "tabIndex", "role", "isLoading", "ariaControls", "ariaExpanded", "isSuggestable", "isFilterable", "userInput", "suggestedText", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { type: i8.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i9.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i10.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i11.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize"] }], directives: [{ type: i12.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
1621
+ `, isInline: true, components: [{ type: i7.SearchBarComponent, selector: "kendo-searchbar", inputs: ["id", "tagListId", "activeDescendant", "disabled", "readonly", "tabIndex", "role", "isLoading", "ariaControls", "ariaExpanded", "isSuggestable", "isFilterable", "userInput", "suggestedText", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { type: i8.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i9.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i10.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i11.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }], directives: [{ type: i12.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
1610
1622
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ComboBoxComponent, decorators: [{
1611
1623
  type: Component,
1612
1624
  args: [{
@@ -1774,7 +1786,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1774
1786
  }, {
1775
1787
  type: Inject,
1776
1788
  args: [TOUCH_ENABLED]
1777
- }] }]; }, propDecorators: { icon: [{
1789
+ }] }, { type: i0.Injector }]; }, propDecorators: { icon: [{
1778
1790
  type: Input
1779
1791
  }], svgIcon: [{
1780
1792
  type: Input
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { ChangeDetectorRef, Component, ContentChildren, ElementRef, forwardRef, HostBinding, Inject, isDevMode, NgZone, QueryList, Renderer2, ViewChild } from '@angular/core';
5
+ import { ChangeDetectorRef, Component, ContentChildren, ElementRef, forwardRef, HostBinding, Inject, Injector, isDevMode, NgZone, QueryList, Renderer2, ViewChild } from '@angular/core';
6
6
  import { NG_VALUE_ACCESSOR } from '@angular/forms';
7
7
  import { isDocumentAvailable, KendoInput } from '@progress/kendo-angular-common';
8
8
  import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
@@ -37,8 +37,8 @@ import * as i14 from "../common/templates/template-context.directive";
37
37
  * Represents the [Kendo UI MultiColumnComboBox component for Angular]({% slug overview_multicolumncombobox %}).
38
38
  */
39
39
  export class MultiColumnComboBoxComponent extends ComboBoxComponent {
40
- constructor(localization, popupService, selectionService, navigationService, disabledItemsService, dataService, zone, changeDetector, renderer, wrapper, touchEnabled) {
41
- super(wrapper, localization, popupService, selectionService, navigationService, disabledItemsService, dataService, zone, changeDetector, renderer, touchEnabled);
40
+ constructor(localization, popupService, selectionService, navigationService, disabledItemsService, dataService, zone, changeDetector, renderer, wrapper, touchEnabled, injector) {
41
+ super(wrapper, localization, popupService, selectionService, navigationService, disabledItemsService, dataService, zone, changeDetector, renderer, touchEnabled, injector);
42
42
  /**
43
43
  * @hidden
44
44
  */
@@ -161,7 +161,7 @@ export class MultiColumnComboBoxComponent extends ComboBoxComponent {
161
161
  });
162
162
  }
163
163
  }
164
- MultiColumnComboBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MultiColumnComboBoxComponent, deps: [{ token: i1.LocalizationService }, { token: i2.PopupService }, { token: i3.SelectionService }, { token: i4.NavigationService }, { token: i5.DisabledItemsService }, { token: i6.DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: TOUCH_ENABLED }], target: i0.ɵɵFactoryTarget.Component });
164
+ MultiColumnComboBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MultiColumnComboBoxComponent, deps: [{ token: i1.LocalizationService }, { token: i2.PopupService }, { token: i3.SelectionService }, { token: i4.NavigationService }, { token: i5.DisabledItemsService }, { token: i6.DataService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: TOUCH_ENABLED }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
165
165
  MultiColumnComboBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: MultiColumnComboBoxComponent, selector: "kendo-multicolumncombobox", host: { properties: { "class.k-dropdowngrid": "this.hostClasses", "class.k-disabled": "this.isDisabled" } }, providers: [
166
166
  SelectionService,
167
167
  DataService,
@@ -299,7 +299,7 @@ MultiColumnComboBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
299
299
  <div class="k-data-table" [ngClass]="tableSizeClass">
300
300
  <!--grid header-->
301
301
  <div #header class="k-table-header">
302
- <div class="k-table-header-wrap">
302
+ <div #headerWrap class="k-table-header-wrap">
303
303
  <table class="k-table" role="presentation">
304
304
  <colgroup>
305
305
  <ng-container *ngFor="let column of columns">
@@ -376,6 +376,7 @@ MultiColumnComboBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
376
376
  [showStickyHeader]="showStickyHeader"
377
377
  (pageChange)="pageChange($event)"
378
378
  (listResize)="updateHeaderPadding(header)"
379
+ (popupListScroll)="headerWrap.scrollLeft = $event.target.scrollLeft;"
379
380
  >
380
381
  </kendo-list>
381
382
 
@@ -414,7 +415,7 @@ MultiColumnComboBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
414
415
  </ng-container>
415
416
  </div>
416
417
  </ng-template>
417
- `, isInline: true, components: [{ type: i7.SearchBarComponent, selector: "kendo-searchbar", inputs: ["id", "tagListId", "activeDescendant", "disabled", "readonly", "tabIndex", "role", "isLoading", "ariaControls", "ariaExpanded", "isSuggestable", "isFilterable", "userInput", "suggestedText", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { type: i8.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i9.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i10.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i11.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize"] }], directives: [{ type: i12.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
418
+ `, isInline: true, components: [{ type: i7.SearchBarComponent, selector: "kendo-searchbar", inputs: ["id", "tagListId", "activeDescendant", "disabled", "readonly", "tabIndex", "role", "isLoading", "ariaControls", "ariaExpanded", "isSuggestable", "isFilterable", "userInput", "suggestedText", "placeholder"], outputs: ["valueChange", "onBlur", "onFocus", "onClick", "onNavigate"] }, { type: i8.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i9.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i10.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i11.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }], directives: [{ type: i12.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
418
419
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MultiColumnComboBoxComponent, decorators: [{
419
420
  type: Component,
420
421
  args: [{
@@ -557,7 +558,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
557
558
  <div class="k-data-table" [ngClass]="tableSizeClass">
558
559
  <!--grid header-->
559
560
  <div #header class="k-table-header">
560
- <div class="k-table-header-wrap">
561
+ <div #headerWrap class="k-table-header-wrap">
561
562
  <table class="k-table" role="presentation">
562
563
  <colgroup>
563
564
  <ng-container *ngFor="let column of columns">
@@ -634,6 +635,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
634
635
  [showStickyHeader]="showStickyHeader"
635
636
  (pageChange)="pageChange($event)"
636
637
  (listResize)="updateHeaderPadding(header)"
638
+ (popupListScroll)="headerWrap.scrollLeft = $event.target.scrollLeft;"
637
639
  >
638
640
  </kendo-list>
639
641
 
@@ -677,7 +679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
677
679
  }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i2.PopupService }, { type: i3.SelectionService }, { type: i4.NavigationService }, { type: i5.DisabledItemsService }, { type: i6.DataService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: undefined, decorators: [{
678
680
  type: Inject,
679
681
  args: [TOUCH_ENABLED]
680
- }] }]; }, propDecorators: { hostClasses: [{
682
+ }] }, { type: i0.Injector }]; }, propDecorators: { hostClasses: [{
681
683
  type: HostBinding,
682
684
  args: ['class.k-dropdowngrid']
683
685
  }], isDisabled: [{
@@ -47,6 +47,7 @@ export class ListComponent {
47
47
  this.onClick = new EventEmitter();
48
48
  this.pageChange = new EventEmitter();
49
49
  this.listResize = new EventEmitter();
50
+ this.popupListScroll = new EventEmitter();
50
51
  this.startFrom = 0;
51
52
  this.lastLoaded = 0;
52
53
  this.lastScrollTop = 0;
@@ -406,7 +407,7 @@ export class ListComponent {
406
407
  }
407
408
  }
408
409
  ListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ListComponent, deps: [{ token: i1.DataService }, { token: i0.ElementRef }, { token: i2.SelectionService }, { token: i3.DisabledItemsService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
409
- ListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ListComponent, 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", data: "data", size: "size", rounded: "rounded" }, outputs: { onClick: "onClick", pageChange: "pageChange", listResize: "listResize" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }, { propertyName: "list", first: true, predicate: ["list"], descendants: true, static: true }, { propertyName: "virtualContainer", first: true, predicate: ["virtualContainer"], descendants: true }, { propertyName: "items", predicate: ListItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
410
+ ListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ListComponent, 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", 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, static: true }, { propertyName: "virtualContainer", first: true, predicate: ["virtualContainer"], descendants: true }, { propertyName: "items", predicate: ListItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
410
411
  <div *ngIf="dataService.grouped && showStickyHeader"
411
412
  [class]="listGroupStickyHeaderClass"
412
413
  [ngStyle]="{
@@ -426,7 +427,8 @@ ListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
426
427
  [class]="listContentClass"
427
428
  [style.overscrollBehavior]="'none'"
428
429
  [style.maxHeight.px]="height"
429
- unselectable="on">
430
+ unselectable="on"
431
+ (scroll)="popupListScroll.emit($event)">
430
432
  <ul #list
431
433
  role="listbox"
432
434
  [class]="listClass"
@@ -559,7 +561,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
559
561
  [class]="listContentClass"
560
562
  [style.overscrollBehavior]="'none'"
561
563
  [style.maxHeight.px]="height"
562
- unselectable="on">
564
+ unselectable="on"
565
+ (scroll)="popupListScroll.emit($event)">
563
566
  <ul #list
564
567
  role="listbox"
565
568
  [class]="listClass"
@@ -719,6 +722,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
719
722
  type: Output
720
723
  }], listResize: [{
721
724
  type: Output
725
+ }], popupListScroll: [{
726
+ type: Output
722
727
  }], items: [{
723
728
  type: ViewChildren,
724
729
  args: [ListItemDirective]
@@ -1170,7 +1170,8 @@ export class DropDownListComponent {
1170
1170
  hasObservers(this.close) ||
1171
1171
  hasObservers(this.onBlur) ||
1172
1172
  hasObservers(this.filterChange) ||
1173
- isUntouched(this.wrapper.nativeElement)) {
1173
+ isUntouched(this.wrapper.nativeElement) ||
1174
+ this.formControl?.updateOn === 'blur') {
1174
1175
  this._zone.run(() => {
1175
1176
  if (valueHasChanged) {
1176
1177
  this.selectionService.change(this.selectionService.selected[0]);
@@ -1421,7 +1422,7 @@ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
1421
1422
  popupLabel="Options list"
1422
1423
  >
1423
1424
  </ng-container>
1424
- <span class="k-input-inner" unselectable="on" [id]="valueLabelId">
1425
+ <span class="k-input-inner" unselectable="on" [id]="valueLabelId" (click)="$event.preventDefault()">
1425
1426
  <span class="k-input-value-text">
1426
1427
  <ng-template *ngIf="valueTemplate"
1427
1428
  [templateContext]="{
@@ -1576,7 +1577,7 @@ DropDownListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
1576
1577
  }">
1577
1578
  </ng-template>
1578
1579
  </ng-template>
1579
- `, isInline: true, components: [{ type: i7.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i8.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i9.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i10.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize"] }], directives: [{ type: i11.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i13.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i12.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i8.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i12.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i15.FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i16.SelectableDirective, selector: "[kendoDropDownsSelectable]", inputs: ["index", "checkboxes", "height", "isMultiselect", "multipleSelection"] }] });
1580
+ `, isInline: true, components: [{ type: i7.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i8.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: i9.ResponsiveRendererComponent, selector: "responsive-renderer", inputs: ["title", "showActionButtons", "subtitle", "size", "showTextInput", "sharedPopupActionSheetTemplate", "isActionSheetExpanded", "text", "placeholder"], outputs: ["closePopup", "textInputChange", "navigate", "onExpand", "onCollapse", "onApply", "onCancel"] }, { type: i10.ListComponent, selector: "kendo-list", inputs: ["selected", "focused", "textField", "valueField", "height", "template", "groupTemplate", "fixedGroupTemplate", "show", "id", "optionPrefix", "multipleSelection", "virtual", "type", "checkboxes", "ariaLive", "isMultiselect", "isActionSheetExpanded", "showStickyHeader", "data", "size", "rounded"], outputs: ["onClick", "pageChange", "listResize", "popupListScroll"] }], directives: [{ type: i11.LocalizedMessagesDirective, selector: "\n [kendoDropDownListLocalizedMessages],\n [kendoDropDownTreeLocalizedMessages],\n [kendoComboBoxLocalizedMessages],\n [kendoMultiColumnComboBoxLocalizedMessages],\n [kendoAutoCompleteLocalizedMessages],\n [kendoMultiSelectLocalizedMessages],\n [kendoMultiSelectTreeLocalizedMessages]\n " }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i13.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i12.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i8.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i12.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i14.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i15.FilterInputDirective, selector: "[filterInput]", inputs: ["filterInput"] }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i16.SelectableDirective, selector: "[kendoDropDownsSelectable]", inputs: ["index", "checkboxes", "height", "isMultiselect", "multipleSelection"] }] });
1580
1581
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DropDownListComponent, decorators: [{
1581
1582
  type: Component,
1582
1583
  args: [{
@@ -1615,7 +1616,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1615
1616
  popupLabel="Options list"
1616
1617
  >
1617
1618
  </ng-container>
1618
- <span class="k-input-inner" unselectable="on" [id]="valueLabelId">
1619
+ <span class="k-input-inner" unselectable="on" [id]="valueLabelId" (click)="$event.preventDefault()">
1619
1620
  <span class="k-input-value-text">
1620
1621
  <ng-template *ngIf="valueTemplate"
1621
1622
  [templateContext]="{
@@ -700,7 +700,8 @@ export class DropDownTreeComponent {
700
700
  this.isFocused = false;
701
701
  this.togglePopup(false);
702
702
  if (hasObservers(this.onBlur) ||
703
- isUntouched(this.wrapper.nativeElement)) {
703
+ isUntouched(this.wrapper.nativeElement) ||
704
+ this.formControl?.updateOn === 'blur') {
704
705
  this._zone.run(() => {
705
706
  this.onBlur.emit();
706
707
  this.onTouchedCallback();
@@ -1281,6 +1282,7 @@ DropDownTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
1281
1282
  <span
1282
1283
  [attr.id]="valueLabelId"
1283
1284
  class="k-input-inner"
1285
+ (click)="$event.preventDefault()"
1284
1286
  >
1285
1287
  <span class="k-input-value-text">
1286
1288
  <ng-template *ngIf="valueTemplate"
@@ -1485,6 +1487,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1485
1487
  <span
1486
1488
  [attr.id]="valueLabelId"
1487
1489
  class="k-input-inner"
1490
+ (click)="$event.preventDefault()"
1488
1491
  >
1489
1492
  <span class="k-input-value-text">
1490
1493
  <ng-template *ngIf="valueTemplate"
@@ -948,7 +948,8 @@ export class MultiSelectTreeComponent {
948
948
  this.isFocused = false;
949
949
  this.togglePopup(false);
950
950
  if (hasObservers(this.onBlur) ||
951
- isUntouched(this.wrapper.nativeElement)) {
951
+ isUntouched(this.wrapper.nativeElement) ||
952
+ this.formControl?.updateOn === 'blur') {
952
953
  this._zone.run(() => {
953
954
  this.onBlur.emit();
954
955
  this.onTouchedCallback();
package/esm2020/index.mjs CHANGED
@@ -52,10 +52,5 @@ export { DropDownListModule } from './dropdownlist/dropdownlist.module';
52
52
  export { SharedDirectivesModule } from './common/shared-directives.module';
53
53
  export { ListComponent } from './common/list.component';
54
54
  export { ResponsiveRendererComponent } from './common/action-sheet.component';
55
- /**
56
- * @hidden
57
- * TODO: See if the export could be removed (AOT should pass)
58
- */
59
- export { PopupComponent } from '@progress/kendo-angular-popup';
60
55
  export { PreventableEvent } from './common/models/preventable-event';
61
56
  export { RemoveTagEvent } from './common/models/remove-tag-event';