@progress/kendo-angular-common 16.5.0 → 16.6.0-develop.2

package/fesm2020/progress-kendo-angular-common.mjs

@@ -7,9 +7,8 @@ import { EventEmitter, Directive, Input, Output, NgModule, Injectable, Component
 import { detectDesktopBrowser, detectMobileOS } from '@progress/kendo-common';
 import { take, auditTime } from 'rxjs/operators';
 import { Draggable } from '@progress/kendo-draggable';
-import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
 import { merge, fromEvent, from, Subscription } from 'rxjs';
+import { NgIf, NgStyle } from '@angular/common';
 
 /**
  * @hidden
@@ -227,11 +226,12 @@ class DraggableDirective {
     }
 }
 DraggableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
-DraggableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DraggableDirective, selector: "[kendoDraggable]", inputs: { enableDrag: "enableDrag" }, outputs: { kendoPress: "kendoPress", kendoDrag: "kendoDrag", kendoRelease: "kendoRelease" }, usesOnChanges: true, ngImport: i0 });
+DraggableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DraggableDirective, isStandalone: true, selector: "[kendoDraggable]", inputs: { enableDrag: "enableDrag" }, outputs: { kendoPress: "kendoPress", kendoDrag: "kendoDrag", kendoRelease: "kendoRelease" }, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[kendoDraggable]'
+                    selector: '[kendoDraggable]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { enableDrag: [{
                 type: Input
@@ -245,18 +245,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
 
 /**
  * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
  */
 class DraggableModule {
 }
 DraggableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DraggableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: DraggableModule, declarations: [DraggableDirective], imports: [CommonModule], exports: [DraggableDirective] });
-DraggableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableModule, imports: [CommonModule] });
+DraggableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: DraggableModule, imports: [DraggableDirective], exports: [DraggableDirective] });
+DraggableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableModule });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [DraggableDirective],
                     exports: [DraggableDirective],
-                    imports: [CommonModule]
+                    imports: [DraggableDirective]
                 }]
         }] });
 
@@ -423,11 +423,12 @@ class EventsOutsideAngularDirective {
     }
 }
 EventsOutsideAngularDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: EventsOutsideAngularDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
-EventsOutsideAngularDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: { events: ["kendoEventsOutsideAngular", "events"], scope: "scope" }, ngImport: i0 });
+EventsOutsideAngularDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: EventsOutsideAngularDirective, isStandalone: true, selector: "[kendoEventsOutsideAngular]", inputs: { events: ["kendoEventsOutsideAngular", "events"], scope: "scope" }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: EventsOutsideAngularDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[kendoEventsOutsideAngular]'
+                    selector: '[kendoEventsOutsideAngular]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }]; }, propDecorators: { events: [{
                 type: Input,
@@ -438,16 +439,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
 
 /**
  * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
  */
 class EventsModule {
 }
 EventsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: EventsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-EventsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: EventsModule, declarations: [EventsOutsideAngularDirective], exports: [EventsOutsideAngularDirective] });
+EventsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: EventsModule, imports: [EventsOutsideAngularDirective], exports: [EventsOutsideAngularDirective] });
 EventsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: EventsModule });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: EventsModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [EventsOutsideAngularDirective],
+                    imports: [EventsOutsideAngularDirective],
                     exports: [EventsOutsideAngularDirective]
                 }]
         }] });
@@ -687,9 +689,12 @@ class ResizeBatchService {
     }
 }
 ResizeBatchService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeBatchService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-ResizeBatchService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeBatchService });
+ResizeBatchService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeBatchService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeBatchService, decorators: [{
-            type: Injectable
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
         }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
 
 /**
@@ -737,12 +742,13 @@ class ResizeSensorComponent {
     }
 }
 ResizeSensorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorComponent, deps: [{ token: ResizeBatchService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-ResizeSensorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: { rateLimit: "rateLimit" }, outputs: { resize: "resize" }, ngImport: i0, template: '', isInline: true });
+ResizeSensorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ResizeSensorComponent, isStandalone: true, selector: "kendo-resize-sensor", inputs: { rateLimit: "rateLimit" }, outputs: { resize: "resize" }, ngImport: i0, template: '', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-resize-sensor',
-                    template: ''
+                    template: '',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: ResizeBatchService }, { type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { rateLimit: [{
                 type: Input
@@ -750,20 +756,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 type: Output
             }] } });
 
-const COMPONENT_DIRECTIVES = [ResizeSensorComponent];
 /**
- * Resize Sensor module
+ * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
  */
 class ResizeSensorModule {
 }
 ResizeSensorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ResizeSensorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorModule, declarations: [ResizeSensorComponent], exports: [ResizeSensorComponent] });
-ResizeSensorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorModule, providers: [ResizeBatchService] });
+ResizeSensorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorModule, imports: [ResizeSensorComponent], exports: [ResizeSensorComponent] });
+ResizeSensorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorModule, providers: [ResizeBatchService], imports: [ResizeSensorComponent] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeSensorModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [COMPONENT_DIRECTIVES],
-                    exports: [COMPONENT_DIRECTIVES],
+                    imports: [ResizeSensorComponent],
+                    exports: [ResizeSensorComponent],
                     providers: [ResizeBatchService]
                 }]
         }] });
@@ -945,7 +951,7 @@ class WatermarkOverlayComponent {
     }
 }
 WatermarkOverlayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WatermarkOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-WatermarkOverlayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", host: { properties: { "style": "this.watermarkStyle" } }, viewQueries: [{ propertyName: "banner", first: true, predicate: ["banner"], descendants: true }], ngImport: i0, template: `
+WatermarkOverlayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WatermarkOverlayComponent, isStandalone: true, selector: "div[kendoWatermarkOverlay]", host: { properties: { "style": "this.watermarkStyle" } }, viewQueries: [{ propertyName: "banner", first: true, predicate: ["banner"], descendants: true }], ngImport: i0, template: `
         <div #banner *ngIf="isOpen && bannerMounted" [ngStyle]="bannerStyles">
             <span [ngStyle]="{ display: 'flex', alignSelf: 'center', marginRight: '8px' }">
                 <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
@@ -971,7 +977,7 @@ WatermarkOverlayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.
                 </button>
             </div>
         </div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WatermarkOverlayComponent, decorators: [{
             type: Component,
             args: [{
@@ -1002,7 +1008,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 </button>
             </div>
         </div>
-    `
+    `,
+                    standalone: true,
+                    imports: [NgIf, NgStyle]
                 }]
         }], propDecorators: { watermarkStyle: [{
                 type: HostBinding,
@@ -1014,18 +1022,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
 
 /**
  * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
  */
 class WatermarkModule {
 }
 WatermarkModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WatermarkModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-WatermarkModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: WatermarkModule, declarations: [WatermarkOverlayComponent], imports: [CommonModule], exports: [WatermarkOverlayComponent] });
-WatermarkModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WatermarkModule, imports: [CommonModule] });
+WatermarkModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: WatermarkModule, imports: [WatermarkOverlayComponent], exports: [WatermarkOverlayComponent] });
+WatermarkModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WatermarkModule, imports: [WatermarkOverlayComponent] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WatermarkModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [WatermarkOverlayComponent],
                     exports: [WatermarkOverlayComponent],
-                    imports: [CommonModule]
+                    imports: [WatermarkOverlayComponent]
                 }]
         }] });
 
@@ -1078,11 +1086,12 @@ class PrefixTemplateDirective {
     }
 }
 PrefixTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PrefixTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-PrefixTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: PrefixTemplateDirective, selector: "[kendoPrefixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
+PrefixTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: PrefixTemplateDirective, isStandalone: true, selector: "[kendoPrefixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[kendoPrefixTemplate]'
+                    selector: '[kendoPrefixTemplate]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
                     type: Optional
@@ -1129,11 +1138,12 @@ class SuffixTemplateDirective {
     }
 }
 SuffixTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SuffixTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-SuffixTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SuffixTemplateDirective, selector: "[kendoSuffixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
+SuffixTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: SuffixTemplateDirective, isStandalone: true, selector: "[kendoSuffixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[kendoSuffixTemplate]'
+                    selector: '[kendoSuffixTemplate]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
                     type: Optional
@@ -1176,12 +1186,13 @@ class SeparatorComponent {
     }
 }
 SeparatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SeparatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SeparatorComponent, selector: "kendo-separator", inputs: { orientation: "orientation" }, host: { properties: { "class.k-input-separator-vertical": "this.vertical", "class.k-input-separator-horizontal": "this.horizontal", "class.k-input-separator": "this.hostClass" } }, ngImport: i0, template: ``, isInline: true });
+SeparatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SeparatorComponent, isStandalone: true, selector: "kendo-separator", inputs: { orientation: "orientation" }, host: { properties: { "class.k-input-separator-vertical": "this.vertical", "class.k-input-separator-horizontal": "this.horizontal", "class.k-input-separator": "this.hostClass" } }, ngImport: i0, template: ``, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SeparatorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-separator',
-                    template: ``
+                    template: ``,
+                    standalone: true
                 }]
         }], propDecorators: { orientation: [{
                 type: Input
@@ -1199,79 +1210,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
 /**
  * @hidden
  */
-class AdornmentsModule {
-}
-AdornmentsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AdornmentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule, declarations: [PrefixTemplateDirective, SuffixTemplateDirective, SeparatorComponent], exports: [PrefixTemplateDirective, SuffixTemplateDirective, SeparatorComponent] });
-AdornmentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [PrefixTemplateDirective, SuffixTemplateDirective, SeparatorComponent],
-                    exports: [PrefixTemplateDirective, SuffixTemplateDirective, SeparatorComponent]
-                }]
-        }] });
-
-class PreventableEvent {
-    constructor() {
-        this.prevented = false;
-    }
-    /**
-     * Prevents the default action for a specified event.
-     * In this way, the source component suppresses
-     * the built-in behavior that follows the event.
-     */
-    preventDefault() {
-        this.prevented = true;
-    }
-    /**
-     * Returns `true` if the event was prevented
-     * by any of its subscribers.
-     *
-     * @returns `true` if the default action was prevented.
-     * Otherwise, returns `false`.
-     */
-    isDefaultPrevented() {
-        return this.prevented;
-    }
-}
-
-const canCreateElement = () => isDocumentAvailable() && document.createElement;
-const propName = '--kendo-scrollbar-width';
-/**
- * @hidden
- */
-const scrollbarWidth = () => {
-    let scrollbarWidth = 0;
-    if (canCreateElement()) {
-        const div = document.createElement('div');
-        div.style.cssText = 'overflow:scroll;overflow-x:hidden;zoom:1;clear:both;display:block';
-        div.innerHTML = '&nbsp;';
-        document.body.appendChild(div);
-        scrollbarWidth = div.offsetWidth - div.scrollWidth;
-        document.body.removeChild(div);
-    }
-    return scrollbarWidth;
-};
-/**
- * @hidden
- */
-class ScrollbarWidthService {
-    constructor() {
-        this.changes = new EventEmitter();
-        if (typeof window !== 'undefined' && isDocumentAvailable()) {
-            document.body.style.setProperty(propName, `${scrollbarWidth()}px`);
+class TemplateContextDirective {
+    constructor(viewContainerRef) {
+        this.viewContainerRef = viewContainerRef;
+    }
+    set templateContext(context) {
+        if (this.insertedViewRef) {
+            this.viewContainerRef.remove(this.viewContainerRef.indexOf(this.insertedViewRef));
+            this.insertedViewRef = undefined;
+        }
+        if (context.templateRef) {
+            this.insertedViewRef = this.viewContainerRef.createEmbeddedView(context.templateRef, context);
         }
     }
 }
-ScrollbarWidthService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollbarWidthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ScrollbarWidthService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollbarWidthService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollbarWidthService, decorators: [{
-            type: Injectable,
+TemplateContextDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TemplateContextDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+TemplateContextDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: TemplateContextDirective, isStandalone: true, selector: "[templateContext]", inputs: { templateContext: "templateContext" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TemplateContextDirective, decorators: [{
+            type: Directive,
             args: [{
-                    providedIn: 'root'
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '[templateContext]',
+                    standalone: true
                 }]
-        }], ctorParameters: function () { return []; } });
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { templateContext: [{
+                type: Input
+            }] } });
 
 /**
  * @hidden
@@ -1469,11 +1433,12 @@ class ToggleButtonTabStopDirective {
     }
 }
 ToggleButtonTabStopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ToggleButtonTabStopDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: MultiTabStop }], target: i0.ɵɵFactoryTarget.Directive });
-ToggleButtonTabStopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ToggleButtonTabStopDirective, selector: "[kendoToggleButtonTabStop]", inputs: { active: ["kendoToggleButtonTabStop", "active"], toggleButtonAriaLabel: "toggleButtonAriaLabel" }, usesOnChanges: true, ngImport: i0 });
+ToggleButtonTabStopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ToggleButtonTabStopDirective, isStandalone: true, selector: "[kendoToggleButtonTabStop]", inputs: { active: ["kendoToggleButtonTabStop", "active"], toggleButtonAriaLabel: "toggleButtonAriaLabel" }, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ToggleButtonTabStopDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[kendoToggleButtonTabStop]'
+                    selector: '[kendoToggleButtonTabStop]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: MultiTabStop }]; }, propDecorators: { active: [{
                 type: Input,
@@ -1482,16 +1447,153 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 type: Input
             }] } });
 
+/**
+ * @hidden
+ */
+const KENDO_ADORNMENTS = [
+    PrefixTemplateDirective,
+    SuffixTemplateDirective,
+    SeparatorComponent
+];
+/**
+ * @hidden
+ */
+const KENDO_COMMON = [
+    ...KENDO_ADORNMENTS,
+    DraggableDirective,
+    EventsOutsideAngularDirective,
+    ResizeSensorComponent,
+    ToggleButtonTabStopDirective,
+    WatermarkOverlayComponent,
+];
+/**
+ * @hidden
+ */
+const KENDO_DRAGGABLE = [
+    DraggableDirective
+];
+/**
+ * @hidden
+ */
+const KENDO_EVENTS = [
+    EventsOutsideAngularDirective
+];
+/**
+ * @hidden
+ */
+const KENDO_RESIZESENSOR = [
+    ResizeSensorComponent
+];
+/**
+ * @hidden
+ */
+const KENDO_TOGGLEBUTTONTABSTOP = [
+    ToggleButtonTabStopDirective
+];
+/**
+ * @hidden
+ */
+const KENDO_WATERMARK = [
+    WatermarkOverlayComponent
+];
+/**
+ * @hidden
+ */
+const KENDO_TEMPLATE_CONTEXT = [
+    TemplateContextDirective
+];
+
+/**
+ * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
+ */
+class AdornmentsModule {
+}
+AdornmentsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AdornmentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule, imports: [PrefixTemplateDirective, SuffixTemplateDirective, SeparatorComponent], exports: [PrefixTemplateDirective, SuffixTemplateDirective, SeparatorComponent] });
+AdornmentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule, imports: [SeparatorComponent] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AdornmentsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...KENDO_ADORNMENTS],
+                    exports: [...KENDO_ADORNMENTS]
+                }]
+        }] });
+
+class PreventableEvent {
+    constructor() {
+        this.prevented = false;
+    }
+    /**
+     * Prevents the default action for a specified event.
+     * In this way, the source component suppresses
+     * the built-in behavior that follows the event.
+     */
+    preventDefault() {
+        this.prevented = true;
+    }
+    /**
+     * Returns `true` if the event was prevented
+     * by any of its subscribers.
+     *
+     * @returns `true` if the default action was prevented.
+     * Otherwise, returns `false`.
+     */
+    isDefaultPrevented() {
+        return this.prevented;
+    }
+}
+
+const canCreateElement = () => isDocumentAvailable() && document.createElement;
+const propName = '--kendo-scrollbar-width';
+/**
+ * @hidden
+ */
+const scrollbarWidth = () => {
+    let scrollbarWidth = 0;
+    if (canCreateElement()) {
+        const div = document.createElement('div');
+        div.style.cssText = 'overflow:scroll;overflow-x:hidden;zoom:1;clear:both;display:block';
+        div.innerHTML = '&nbsp;';
+        document.body.appendChild(div);
+        scrollbarWidth = div.offsetWidth - div.scrollWidth;
+        document.body.removeChild(div);
+    }
+    return scrollbarWidth;
+};
+/**
+ * @hidden
+ */
+class ScrollbarWidthService {
+    constructor() {
+        this.changes = new EventEmitter();
+        if (typeof window !== 'undefined' && isDocumentAvailable()) {
+            document.body.style.setProperty(propName, `${scrollbarWidth()}px`);
+        }
+    }
+}
+ScrollbarWidthService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollbarWidthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ScrollbarWidthService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollbarWidthService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollbarWidthService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: function () { return []; } });
+
+/**
+ * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
+ */
 class ToggleButtonTabStopModule {
 }
 ToggleButtonTabStopModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ToggleButtonTabStopModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ToggleButtonTabStopModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ToggleButtonTabStopModule, declarations: [ToggleButtonTabStopDirective], exports: [ToggleButtonTabStopDirective] });
+ToggleButtonTabStopModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ToggleButtonTabStopModule, imports: [ToggleButtonTabStopDirective], exports: [ToggleButtonTabStopDirective] });
 ToggleButtonTabStopModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ToggleButtonTabStopModule });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ToggleButtonTabStopModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [],
-                    declarations: [ToggleButtonTabStopDirective],
+                    imports: [ToggleButtonTabStopDirective],
                     exports: [ToggleButtonTabStopDirective]
                 }]
         }] });
@@ -1500,5 +1602,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AdornmentsModule, DraggableDirective, DraggableModule, EventsModule, EventsOutsideAngularDirective, KendoInput, Keys, MultiTabStop, PrefixTemplateDirective, PreventableEvent, ResizeBatchService, ResizeCompatService, ResizeObserverService, ResizeSensorComponent, ResizeSensorModule, ScrollbarWidthService, SeparatorComponent, SuffixTemplateDirective, ToggleButtonTabStopDirective, ToggleButtonTabStopModule, WatermarkModule, WatermarkOverlayComponent, anyChanged, applyAttributes, closest, closestBySelector, closestInScope, contains, findElement, findFocusable, findFocusableChild, focusableSelector, guid, hasClasses, hasObservers, isChanged, isControlRequired, isDocumentAvailable, isFirefox, isFocusable, isFocusableWithTabKey, isObject, isObjectPresent, isPresent, isSafari, isString, isVisible, matchesClasses, matchesNodeName, parseAttributes, parseCSSClassNames, removeHTMLAttributes, rtlScrollPosition, scrollbarWidth, setHTMLAttributes, shouldShowValidationUI, splitStringToArray };
+export { AdornmentsModule, DraggableDirective, DraggableModule, EventsModule, EventsOutsideAngularDirective, KENDO_ADORNMENTS, KENDO_COMMON, KENDO_DRAGGABLE, KENDO_EVENTS, KENDO_RESIZESENSOR, KENDO_TEMPLATE_CONTEXT, KENDO_TOGGLEBUTTONTABSTOP, KENDO_WATERMARK, KendoInput, Keys, MultiTabStop, PrefixTemplateDirective, PreventableEvent, ResizeBatchService, ResizeCompatService, ResizeObserverService, ResizeSensorComponent, ResizeSensorModule, ScrollbarWidthService, SeparatorComponent, SuffixTemplateDirective, TemplateContextDirective, ToggleButtonTabStopDirective, ToggleButtonTabStopModule, WatermarkModule, WatermarkOverlayComponent, anyChanged, applyAttributes, closest, closestBySelector, closestInScope, contains, findElement, findFocusable, findFocusableChild, focusableSelector, guid, hasClasses, hasObservers, isChanged, isControlRequired, isDocumentAvailable, isFirefox, isFocusable, isFocusableWithTabKey, isObject, isObjectPresent, isPresent, isSafari, isString, isVisible, matchesClasses, matchesNodeName, parseAttributes, parseCSSClassNames, removeHTMLAttributes, rtlScrollPosition, scrollbarWidth, setHTMLAttributes, shouldShowValidationUI, splitStringToArray };
 

package/index.d.ts

@@ -16,3 +16,5 @@ export * from './adornments';
 export { PreventableEvent } from './preventable-event';
 export { ScrollbarWidthService, scrollbarWidth } from './utils/scrollbar-width.service';
 export * from './toggle-button-tab-stop';
+export * from './directives';
+export * from './template-context';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-common",
-  "version": "16.5.0",
+  "version": "16.6.0-develop.2",
   "description": "Kendo UI for Angular - Utility Package",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -23,7 +23,7 @@
     "@progress/kendo-common": "^0.2.1",
     "@progress/kendo-draggable": "^3.0.2",
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "16.5.0"
+    "@progress/kendo-angular-schematics": "16.6.0-develop.2"
   },
   "publishConfig": {
     "access": "public"

package/resize-sensor/resize-sensor.component.d.ts

@@ -28,5 +28,5 @@ export declare class ResizeSensorComponent implements OnDestroy, AfterViewChecke
     ngOnDestroy(): void;
     acceptSize(size?: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ResizeSensorComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ResizeSensorComponent, "kendo-resize-sensor", never, { "rateLimit": "rateLimit"; }, { "resize": "resize"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ResizeSensorComponent, "kendo-resize-sensor", never, { "rateLimit": "rateLimit"; }, { "resize": "resize"; }, never, never, true, never>;
 }

package/resize-sensor/resize-sensor.module.d.ts

@@ -5,10 +5,11 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./resize-sensor.component";
 /**
- * Resize Sensor module
+ * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
  */
 export declare class ResizeSensorModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ResizeSensorModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ResizeSensorModule, [typeof i1.ResizeSensorComponent], never, [typeof i1.ResizeSensorComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ResizeSensorModule, never, [typeof i1.ResizeSensorComponent], [typeof i1.ResizeSensorComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ResizeSensorModule>;
 }

package/template-context/index.d.ts

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export { TemplateContextDirective } from './template-context.directive';

package/template-context/template-context.directive.d.ts

@@ -0,0 +1,17 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ViewContainerRef } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export declare class TemplateContextDirective {
+    set templateContext(context: any);
+    private insertedViewRef;
+    private viewContainerRef;
+    constructor(viewContainerRef: ViewContainerRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<TemplateContextDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TemplateContextDirective, "[templateContext]", never, { "templateContext": "templateContext"; }, {}, never, never, true, never>;
+}

package/toggle-button-tab-stop/toggle-button-tab-stop.directive.d.ts

@@ -68,5 +68,5 @@ export declare class ToggleButtonTabStopDirective {
     private returnFocusToToggleButton;
     private initializeObserver;
     static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButtonTabStopDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ToggleButtonTabStopDirective, "[kendoToggleButtonTabStop]", never, { "active": "kendoToggleButtonTabStop"; "toggleButtonAriaLabel": "toggleButtonAriaLabel"; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ToggleButtonTabStopDirective, "[kendoToggleButtonTabStop]", never, { "active": "kendoToggleButtonTabStop"; "toggleButtonAriaLabel": "toggleButtonAriaLabel"; }, {}, never, never, true, never>;
 }

package/toggle-button-tab-stop/toggle-button-tab-stop.module.d.ts

@@ -4,8 +4,12 @@
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from "@angular/core";
 import * as i1 from "./toggle-button-tab-stop.directive";
+/**
+ * @hidden
+ * IMPORTANT: NgModule export kept for backwards compatibility
+ */
 export declare class ToggleButtonTabStopModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButtonTabStopModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ToggleButtonTabStopModule, [typeof i1.ToggleButtonTabStopDirective], never, [typeof i1.ToggleButtonTabStopDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ToggleButtonTabStopModule, never, [typeof i1.ToggleButtonTabStopDirective], [typeof i1.ToggleButtonTabStopDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ToggleButtonTabStopModule>;
 }

package/watermark/watermark.component.d.ts

@@ -47,5 +47,5 @@ export declare class WatermarkOverlayComponent implements OnInit, AfterViewInit,
     closeBanner(): void;
     get isBannerRendered(): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<WatermarkOverlayComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<WatermarkOverlayComponent, "div[kendoWatermarkOverlay]", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<WatermarkOverlayComponent, "div[kendoWatermarkOverlay]", never, {}, {}, never, never, true, never>;
 }