@progress/kendo-angular-popup 16.5.0-develop.6 → 16.6.0-develop.1

package/directives.d.ts

@@ -0,0 +1,9 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { PopupComponent } from "./popup.component";
+/**
+ * Utility array that contains all `@progress/kendo-angular-popup` related components and directives
+ */
+export declare const KENDO_POPUP: readonly [typeof PopupComponent];

package/esm2020/directives.mjs

@@ -0,0 +1,11 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { PopupComponent } from "./popup.component";
+/**
+ * Utility array that contains all `@progress/kendo-angular-popup` related components and directives
+ */
+export const KENDO_POPUP = [
+    PopupComponent
+];

package/esm2020/index.mjs

@@ -6,3 +6,4 @@ export { PopupService, POPUP_CONTAINER } from './popup.service';
 export { PopupComponent } from './popup.component';
 export { PopupModule } from './popup.module';
 export { SCALE } from './scale';
+export * from './directives';

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-popup',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1721765888,
-    version: '16.5.0-develop.6',
+    publishDate: 1721827513,
+    version: '16.6.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/esm2020/popup.component.mjs

@@ -14,6 +14,7 @@ import { hasObservers, isDocumentAvailable, ResizeSensorComponent } from '@progr
 import { from } from 'rxjs';
 import { validatePackage } from '@progress/kendo-licensing';
 import { packageMetadata } from './package-metadata';
+import { NgClass, NgTemplateOutlet, NgIf } from '@angular/common';
 import * as i0 from "@angular/core";
 import * as i1 from "./services/align.service";
 import * as i2 from "./services/dom.service";
@@ -21,8 +22,6 @@ import * as i3 from "./services/position.service";
 import * as i4 from "./services/resize.service";
 import * as i5 from "./services/scrollable.service";
 import * as i6 from "./services/animation.service";
-import * as i7 from "@angular/common";
-import * as i8 from "@progress/kendo-angular-common";
 const DEFAULT_OFFSET = { left: -10000, top: 0 };
 const ANIMATION_CONTAINER = 'k-animation-container';
 const ANIMATION_CONTAINER_FIXED = 'k-animation-container-fixed';
@@ -354,7 +353,7 @@ export class PopupComponent {
     }
 }
 PopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupComponent, deps: [{ token: i0.ElementRef }, { token: i1.AlignService }, { token: i2.DOMService }, { token: i3.PositionService }, { token: i4.ResizeService }, { token: i5.ScrollableService }, { token: i6.AnimationService }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PopupComponent, selector: "kendo-popup", inputs: { animate: "animate", anchor: "anchor", anchorAlign: "anchorAlign", collision: "collision", popupAlign: "popupAlign", copyAnchorStyles: "copyAnchorStyles", popupClass: "popupClass", positionMode: "positionMode", offset: "offset", margin: "margin" }, outputs: { anchorViewportLeave: "anchorViewportLeave", close: "close", open: "open", positionChange: "positionChange" }, providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService], viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "resizeSensor", first: true, predicate: ResizeSensorComponent, descendants: true, static: true }], exportAs: ["kendo-popup"], usesOnChanges: true, ngImport: i0, template: `
+PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PopupComponent, isStandalone: true, selector: "kendo-popup", inputs: { animate: "animate", anchor: "anchor", anchorAlign: "anchorAlign", collision: "collision", popupAlign: "popupAlign", copyAnchorStyles: "copyAnchorStyles", popupClass: "popupClass", positionMode: "positionMode", offset: "offset", margin: "margin" }, outputs: { anchorViewportLeave: "anchorViewportLeave", close: "close", open: "open", positionChange: "positionChange" }, providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService], viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "resizeSensor", first: true, predicate: ResizeSensorComponent, descendants: true, static: true }], exportAs: ["kendo-popup"], usesOnChanges: true, ngImport: i0, template: `
         <div class="k-child-animation-container">
             <div class="k-popup" [ngClass]="popupClass" #container>
                 <ng-content></ng-content>
@@ -363,7 +362,7 @@ PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version
                 </kendo-resize-sensor>
             </div>
         </div>
-     `, isInline: true, dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i8.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
+     `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupComponent, decorators: [{
             type: Component,
             args: [{
@@ -379,7 +378,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 </kendo-resize-sensor>
             </div>
         </div>
-     `
+     `,
+                    standalone: true,
+                    imports: [NgClass, NgTemplateOutlet, NgIf, ResizeSensorComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.AlignService }, { type: i2.DOMService }, { type: i3.PositionService }, { type: i4.ResizeService }, { type: i5.ScrollableService }, { type: i6.AnimationService }, { type: i0.Renderer2 }, { type: i0.NgZone }]; }, propDecorators: { animate: [{
                 type: Input

package/esm2020/popup.module.mjs

@@ -3,12 +3,12 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PopupComponent } from './popup.component';
-import { ResizeSensorModule } from '@progress/kendo-angular-common';
+import { ResizeBatchService, ResizeSensorComponent } from '@progress/kendo-angular-common';
 import { PopupService } from './popup.service';
+import { KENDO_POPUP } from './directives';
 import * as i0 from "@angular/core";
-const POPUP_DIRECTIVES = [PopupComponent];
+import * as i1 from "./popup.component";
+//IMPORTANT: NgModule export kept for backwards compatibility
 /**
  * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
  * definition for the Popup component.
@@ -43,15 +43,14 @@ const POPUP_DIRECTIVES = [PopupComponent];
 export class PopupModule {
 }
 PopupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, declarations: [PopupComponent], imports: [CommonModule, ResizeSensorModule], exports: [PopupComponent] });
-PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, providers: [PopupService], imports: [CommonModule, ResizeSensorModule] });
+PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, imports: [ResizeSensorComponent, i1.PopupComponent], exports: [i1.PopupComponent] });
+PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, providers: [PopupService, ResizeBatchService], imports: [ResizeSensorComponent, KENDO_POPUP] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [POPUP_DIRECTIVES],
-                    entryComponents: [POPUP_DIRECTIVES],
-                    exports: [POPUP_DIRECTIVES],
-                    imports: [CommonModule, ResizeSensorModule],
-                    providers: [PopupService]
+                    entryComponents: [...KENDO_POPUP],
+                    exports: [...KENDO_POPUP],
+                    imports: [ResizeSensorComponent, ...KENDO_POPUP],
+                    providers: [PopupService, ResizeBatchService]
                 }]
         }] });

package/esm2020/popup.service.mjs

@@ -14,23 +14,42 @@ const removeElement = (element) => {
  * Used to inject the Popup container. If not provided, the first root component of
  * the application is used.
  *
- * > The `POPUP_CONTAINER` can be used only with the [`PopupService`]({% slug service_popup %}) class.
+ * > The `POPUP_CONTAINER` can be used only with the [`PopupService`](slug:service_popup) class.
+ *
+ * In case you are using standalone components:
+ *
+ * @example
+ *
+ * ```ts
+ * import { Component } from '@angular/core';
+ * import { KENDO_POPUP, PopupService } from '@progress/kendo-angular-popup';
+ *
+ * @Component({
+ *   standalone: true,
+ *   imports: [KENDO_POPUP],
+ *   providers: [PopupService, {
+ *     provide: POPUP_CONTAINER,
+ *       useFactory: () => {
+ *         //return the container ElementRef, where the popup will be injected
+ *         return { nativeElement: document.body } as ElementRef;
+ *       }
+ *   }],
+ *   selector: 'app-root',
+ *   templateUrl: './app.component.html',
+ * })
+ * export class AppComponent {}
+ * ```
+ *
+ * In case you are using an NgModule-based application:
  *
  * @example
  *
  * ```ts-no-run
- * // Import the Popup module
  * import { PopupModule, POPUP_CONTAINER } from '@progress/kendo-angular-popup';
- *
- * // The browser platform with a compiler
  * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
  * import { ElementRef, NgModule } from '@angular/core';
- *
- * // Import the app component
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
  * _@NgModule({
  *     declarations: [AppComponent], // declare app component
  *     imports:      [BrowserModule, PopupModule], // import Popup module
@@ -45,7 +64,6 @@ const removeElement = (element) => {
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
  * platformBrowserDynamic().bootstrapModule(AppModule);
  * ```
  */
@@ -235,9 +253,12 @@ export class PopupService {
     }
 }
 PopupService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, deps: [{ token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: POPUP_CONTAINER, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-PopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService });
+PopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, decorators: [{
-            type: Injectable
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
         }], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.ElementRef, decorators: [{
                     type: Inject,
                     args: [POPUP_CONTAINER]

package/fesm2015/progress-kendo-angular-popup.mjs

@@ -5,15 +5,13 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, Injectable, Inject, Optional, EventEmitter, isDevMode, Component, Input, Output, ViewChild, TemplateRef, NgModule } from '@angular/core';
 import { siblingContainer, parents, addScroll, align, boundingOffset, offset, positionWithScroll, removeScroll, restrictToView, scrollPosition, getWindowViewPort } from '@progress/kendo-popup-common';
-import * as i8 from '@progress/kendo-angular-common';
-import { isDocumentAvailable, hasObservers, ResizeSensorComponent, ResizeSensorModule } from '@progress/kendo-angular-common';
+import { isDocumentAvailable, hasObservers, ResizeSensorComponent, ResizeBatchService } from '@progress/kendo-angular-common';
 import { fromEvent, merge, from } from 'rxjs';
 import { auditTime } from 'rxjs/operators';
 import * as i1 from '@angular/animations';
 import { style, animate } from '@angular/animations';
 import { validatePackage } from '@progress/kendo-licensing';
-import * as i7 from '@angular/common';
-import { CommonModule } from '@angular/common';
+import { NgClass, NgTemplateOutlet, NgIf } from '@angular/common';
 
 /**
  * @hidden
@@ -681,8 +679,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-popup',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1721765888,
-    version: '16.5.0-develop.6',
+    publishDate: 1721827513,
+    version: '16.6.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
 
@@ -1017,7 +1015,7 @@ class PopupComponent {
     }
 }
 PopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupComponent, deps: [{ token: i0.ElementRef }, { token: AlignService }, { token: DOMService }, { token: PositionService }, { token: ResizeService }, { token: ScrollableService }, { token: AnimationService }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PopupComponent, selector: "kendo-popup", inputs: { animate: "animate", anchor: "anchor", anchorAlign: "anchorAlign", collision: "collision", popupAlign: "popupAlign", copyAnchorStyles: "copyAnchorStyles", popupClass: "popupClass", positionMode: "positionMode", offset: "offset", margin: "margin" }, outputs: { anchorViewportLeave: "anchorViewportLeave", close: "close", open: "open", positionChange: "positionChange" }, providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService], viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "resizeSensor", first: true, predicate: ResizeSensorComponent, descendants: true, static: true }], exportAs: ["kendo-popup"], usesOnChanges: true, ngImport: i0, template: `
+PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PopupComponent, isStandalone: true, selector: "kendo-popup", inputs: { animate: "animate", anchor: "anchor", anchorAlign: "anchorAlign", collision: "collision", popupAlign: "popupAlign", copyAnchorStyles: "copyAnchorStyles", popupClass: "popupClass", positionMode: "positionMode", offset: "offset", margin: "margin" }, outputs: { anchorViewportLeave: "anchorViewportLeave", close: "close", open: "open", positionChange: "positionChange" }, providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService], viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "resizeSensor", first: true, predicate: ResizeSensorComponent, descendants: true, static: true }], exportAs: ["kendo-popup"], usesOnChanges: true, ngImport: i0, template: `
         <div class="k-child-animation-container">
             <div class="k-popup" [ngClass]="popupClass" #container>
                 <ng-content></ng-content>
@@ -1026,7 +1024,7 @@ PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version
                 </kendo-resize-sensor>
             </div>
         </div>
-     `, isInline: true, dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i8.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
+     `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupComponent, decorators: [{
             type: Component,
             args: [{
@@ -1042,7 +1040,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 </kendo-resize-sensor>
             </div>
         </div>
-     `
+     `,
+                    standalone: true,
+                    imports: [NgClass, NgTemplateOutlet, NgIf, ResizeSensorComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: AlignService }, { type: DOMService }, { type: PositionService }, { type: ResizeService }, { type: ScrollableService }, { type: AnimationService }, { type: i0.Renderer2 }, { type: i0.NgZone }]; }, propDecorators: { animate: [{
                 type: Input
@@ -1089,23 +1089,42 @@ const removeElement = (element) => {
  * Used to inject the Popup container. If not provided, the first root component of
  * the application is used.
  *
- * > The `POPUP_CONTAINER` can be used only with the [`PopupService`]({% slug service_popup %}) class.
+ * > The `POPUP_CONTAINER` can be used only with the [`PopupService`](slug:service_popup) class.
+ *
+ * In case you are using standalone components:
+ *
+ * @example
+ *
+ * ```ts
+ * import { Component } from '@angular/core';
+ * import { KENDO_POPUP, PopupService } from '@progress/kendo-angular-popup';
+ *
+ * @Component({
+ *   standalone: true,
+ *   imports: [KENDO_POPUP],
+ *   providers: [PopupService, {
+ *     provide: POPUP_CONTAINER,
+ *       useFactory: () => {
+ *         //return the container ElementRef, where the popup will be injected
+ *         return { nativeElement: document.body } as ElementRef;
+ *       }
+ *   }],
+ *   selector: 'app-root',
+ *   templateUrl: './app.component.html',
+ * })
+ * export class AppComponent {}
+ * ```
+ *
+ * In case you are using an NgModule-based application:
  *
  * @example
  *
  * ```ts-no-run
- * // Import the Popup module
  * import { PopupModule, POPUP_CONTAINER } from '@progress/kendo-angular-popup';
- *
- * // The browser platform with a compiler
  * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
  * import { ElementRef, NgModule } from '@angular/core';
- *
- * // Import the app component
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
  * _@NgModule({
  *     declarations: [AppComponent], // declare app component
  *     imports:      [BrowserModule, PopupModule], // import Popup module
@@ -1120,7 +1139,6 @@ const removeElement = (element) => {
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
  * platformBrowserDynamic().bootstrapModule(AppModule);
  * ```
  */
@@ -1310,9 +1328,12 @@ class PopupService {
     }
 }
 PopupService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, deps: [{ token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: POPUP_CONTAINER, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-PopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService });
+PopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, decorators: [{
-            type: Injectable
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
         }], ctorParameters: function () {
         return [{ type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.ElementRef, decorators: [{
                         type: Inject,
@@ -1322,7 +1343,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     }] }];
     } });
 
-const POPUP_DIRECTIVES = [PopupComponent];
+/**
+ * Utility array that contains all `@progress/kendo-angular-popup` related components and directives
+ */
+const KENDO_POPUP = [
+    PopupComponent
+];
+
+//IMPORTANT: NgModule export kept for backwards compatibility
 /**
  * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
  * definition for the Popup component.
@@ -1357,16 +1385,15 @@ const POPUP_DIRECTIVES = [PopupComponent];
 class PopupModule {
 }
 PopupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, declarations: [PopupComponent], imports: [CommonModule, ResizeSensorModule], exports: [PopupComponent] });
-PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, providers: [PopupService], imports: [CommonModule, ResizeSensorModule] });
+PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, imports: [ResizeSensorComponent, PopupComponent], exports: [PopupComponent] });
+PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, providers: [PopupService, ResizeBatchService], imports: [ResizeSensorComponent, KENDO_POPUP] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [POPUP_DIRECTIVES],
-                    entryComponents: [POPUP_DIRECTIVES],
-                    exports: [POPUP_DIRECTIVES],
-                    imports: [CommonModule, ResizeSensorModule],
-                    providers: [PopupService]
+                    entryComponents: [...KENDO_POPUP],
+                    exports: [...KENDO_POPUP],
+                    imports: [ResizeSensorComponent, ...KENDO_POPUP],
+                    providers: [PopupService, ResizeBatchService]
                 }]
         }] });
 
@@ -1374,5 +1401,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { POPUP_CONTAINER, PopupComponent, PopupModule, PopupService, SCALE };
+export { KENDO_POPUP, POPUP_CONTAINER, PopupComponent, PopupModule, PopupService, SCALE };
 

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

@@ -5,15 +5,13 @@
 import * as i0 from '@angular/core';
 import { Injectable, InjectionToken, Inject, Optional, EventEmitter, isDevMode, Component, Input, Output, ViewChild, TemplateRef, NgModule } from '@angular/core';
 import { siblingContainer, parents, addScroll, align, boundingOffset, offset, positionWithScroll, removeScroll, restrictToView, scrollPosition, getWindowViewPort } from '@progress/kendo-popup-common';
-import * as i8 from '@progress/kendo-angular-common';
-import { isDocumentAvailable, hasObservers, ResizeSensorComponent, ResizeSensorModule } from '@progress/kendo-angular-common';
+import { isDocumentAvailable, hasObservers, ResizeSensorComponent, ResizeBatchService } from '@progress/kendo-angular-common';
 import { fromEvent, merge, from } from 'rxjs';
 import { auditTime } from 'rxjs/operators';
 import * as i1 from '@angular/animations';
 import { style, animate } from '@angular/animations';
 import { validatePackage } from '@progress/kendo-licensing';
-import * as i7 from '@angular/common';
-import { CommonModule } from '@angular/common';
+import { NgClass, NgTemplateOutlet, NgIf } from '@angular/common';
 
 /**
  * @hidden
@@ -677,8 +675,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-popup',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1721765888,
-    version: '16.5.0-develop.6',
+    publishDate: 1721827513,
+    version: '16.6.0-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
 
@@ -1013,7 +1011,7 @@ class PopupComponent {
     }
 }
 PopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupComponent, deps: [{ token: i0.ElementRef }, { token: AlignService }, { token: DOMService }, { token: PositionService }, { token: ResizeService }, { token: ScrollableService }, { token: AnimationService }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PopupComponent, selector: "kendo-popup", inputs: { animate: "animate", anchor: "anchor", anchorAlign: "anchorAlign", collision: "collision", popupAlign: "popupAlign", copyAnchorStyles: "copyAnchorStyles", popupClass: "popupClass", positionMode: "positionMode", offset: "offset", margin: "margin" }, outputs: { anchorViewportLeave: "anchorViewportLeave", close: "close", open: "open", positionChange: "positionChange" }, providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService], viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "resizeSensor", first: true, predicate: ResizeSensorComponent, descendants: true, static: true }], exportAs: ["kendo-popup"], usesOnChanges: true, ngImport: i0, template: `
+PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PopupComponent, isStandalone: true, selector: "kendo-popup", inputs: { animate: "animate", anchor: "anchor", anchorAlign: "anchorAlign", collision: "collision", popupAlign: "popupAlign", copyAnchorStyles: "copyAnchorStyles", popupClass: "popupClass", positionMode: "positionMode", offset: "offset", margin: "margin" }, outputs: { anchorViewportLeave: "anchorViewportLeave", close: "close", open: "open", positionChange: "positionChange" }, providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService], viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "resizeSensor", first: true, predicate: ResizeSensorComponent, descendants: true, static: true }], exportAs: ["kendo-popup"], usesOnChanges: true, ngImport: i0, template: `
         <div class="k-child-animation-container">
             <div class="k-popup" [ngClass]="popupClass" #container>
                 <ng-content></ng-content>
@@ -1022,7 +1020,7 @@ PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version
                 </kendo-resize-sensor>
             </div>
         </div>
-     `, isInline: true, dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i8.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
+     `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupComponent, decorators: [{
             type: Component,
             args: [{
@@ -1038,7 +1036,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 </kendo-resize-sensor>
             </div>
         </div>
-     `
+     `,
+                    standalone: true,
+                    imports: [NgClass, NgTemplateOutlet, NgIf, ResizeSensorComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: AlignService }, { type: DOMService }, { type: PositionService }, { type: ResizeService }, { type: ScrollableService }, { type: AnimationService }, { type: i0.Renderer2 }, { type: i0.NgZone }]; }, propDecorators: { animate: [{
                 type: Input
@@ -1085,23 +1085,42 @@ const removeElement = (element) => {
  * Used to inject the Popup container. If not provided, the first root component of
  * the application is used.
  *
- * > The `POPUP_CONTAINER` can be used only with the [`PopupService`]({% slug service_popup %}) class.
+ * > The `POPUP_CONTAINER` can be used only with the [`PopupService`](slug:service_popup) class.
+ *
+ * In case you are using standalone components:
+ *
+ * @example
+ *
+ * ```ts
+ * import { Component } from '@angular/core';
+ * import { KENDO_POPUP, PopupService } from '@progress/kendo-angular-popup';
+ *
+ * @Component({
+ *   standalone: true,
+ *   imports: [KENDO_POPUP],
+ *   providers: [PopupService, {
+ *     provide: POPUP_CONTAINER,
+ *       useFactory: () => {
+ *         //return the container ElementRef, where the popup will be injected
+ *         return { nativeElement: document.body } as ElementRef;
+ *       }
+ *   }],
+ *   selector: 'app-root',
+ *   templateUrl: './app.component.html',
+ * })
+ * export class AppComponent {}
+ * ```
+ *
+ * In case you are using an NgModule-based application:
  *
  * @example
  *
  * ```ts-no-run
- * // Import the Popup module
  * import { PopupModule, POPUP_CONTAINER } from '@progress/kendo-angular-popup';
- *
- * // The browser platform with a compiler
  * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
  * import { ElementRef, NgModule } from '@angular/core';
- *
- * // Import the app component
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
  * _@NgModule({
  *     declarations: [AppComponent], // declare app component
  *     imports:      [BrowserModule, PopupModule], // import Popup module
@@ -1116,7 +1135,6 @@ const removeElement = (element) => {
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
  * platformBrowserDynamic().bootstrapModule(AppModule);
  * ```
  */
@@ -1306,9 +1324,12 @@ class PopupService {
     }
 }
 PopupService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, deps: [{ token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: POPUP_CONTAINER, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-PopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService });
+PopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, decorators: [{
-            type: Injectable
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
         }], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.ElementRef, decorators: [{
                     type: Inject,
                     args: [POPUP_CONTAINER]
@@ -1316,7 +1337,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     type: Optional
                 }] }]; } });
 
-const POPUP_DIRECTIVES = [PopupComponent];
+/**
+ * Utility array that contains all `@progress/kendo-angular-popup` related components and directives
+ */
+const KENDO_POPUP = [
+    PopupComponent
+];
+
+//IMPORTANT: NgModule export kept for backwards compatibility
 /**
  * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
  * definition for the Popup component.
@@ -1351,16 +1379,15 @@ const POPUP_DIRECTIVES = [PopupComponent];
 class PopupModule {
 }
 PopupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, declarations: [PopupComponent], imports: [CommonModule, ResizeSensorModule], exports: [PopupComponent] });
-PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, providers: [PopupService], imports: [CommonModule, ResizeSensorModule] });
+PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, imports: [ResizeSensorComponent, PopupComponent], exports: [PopupComponent] });
+PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, providers: [PopupService, ResizeBatchService], imports: [ResizeSensorComponent, KENDO_POPUP] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [POPUP_DIRECTIVES],
-                    entryComponents: [POPUP_DIRECTIVES],
-                    exports: [POPUP_DIRECTIVES],
-                    imports: [CommonModule, ResizeSensorModule],
-                    providers: [PopupService]
+                    entryComponents: [...KENDO_POPUP],
+                    exports: [...KENDO_POPUP],
+                    imports: [ResizeSensorComponent, ...KENDO_POPUP],
+                    providers: [PopupService, ResizeBatchService]
                 }]
         }] });
 
@@ -1368,5 +1395,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { POPUP_CONTAINER, PopupComponent, PopupModule, PopupService, SCALE };
+export { KENDO_POPUP, POPUP_CONTAINER, PopupComponent, PopupModule, PopupService, SCALE };
 

package/index.d.ts

@@ -14,3 +14,4 @@ export { PopupService, POPUP_CONTAINER } from './popup.service';
 export { PopupComponent } from './popup.component';
 export { PopupModule } from './popup.module';
 export { SCALE } from './scale';
+export * from './directives';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-popup",
-  "version": "16.5.0-develop.6",
+  "version": "16.6.0-develop.1",
   "description": "Kendo UI Angular Popup component - an easily customized popup from the most trusted provider of professional Angular components.",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -22,14 +22,14 @@
     "@angular/common": "15 - 18",
     "@angular/core": "15 - 18",
     "@angular/platform-browser": "15 - 18",
-    "@progress/kendo-angular-common": "16.5.0-develop.6",
+    "@progress/kendo-angular-common": "16.6.0-develop.1",
     "@progress/kendo-licensing": "^1.0.2",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "@progress/kendo-popup-common": "^1.7.0",
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "16.5.0-develop.6"
+    "@progress/kendo-angular-schematics": "16.6.0-develop.1"
   },
   "schematics": "./schematics/collection.json",
   "module": "fesm2015/progress-kendo-angular-popup.mjs",

package/popup.component.d.ts

@@ -248,5 +248,5 @@ export declare class PopupComponent implements AfterViewInit, OnInit, OnChanges,
     private setContainerStyle;
     private unsubscribeReposition;
     static ɵfac: i0.ɵɵFactoryDeclaration<PopupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PopupComponent, "kendo-popup", ["kendo-popup"], { "animate": "animate"; "anchor": "anchor"; "anchorAlign": "anchorAlign"; "collision": "collision"; "popupAlign": "popupAlign"; "copyAnchorStyles": "copyAnchorStyles"; "popupClass": "popupClass"; "positionMode": "positionMode"; "offset": "offset"; "margin": "margin"; }, { "anchorViewportLeave": "anchorViewportLeave"; "close": "close"; "open": "open"; "positionChange": "positionChange"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PopupComponent, "kendo-popup", ["kendo-popup"], { "animate": "animate"; "anchor": "anchor"; "anchorAlign": "anchorAlign"; "collision": "collision"; "popupAlign": "popupAlign"; "copyAnchorStyles": "copyAnchorStyles"; "popupClass": "popupClass"; "positionMode": "positionMode"; "offset": "offset"; "margin": "margin"; }, { "anchorViewportLeave": "anchorViewportLeave"; "close": "close"; "open": "open"; "positionChange": "positionChange"; }, never, ["*"], true, never>;
 }

package/popup.module.d.ts

@@ -3,9 +3,8 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from "@angular/core";
-import * as i1 from "./popup.component";
-import * as i2 from "@angular/common";
-import * as i3 from "@progress/kendo-angular-common";
+import * as i1 from "@progress/kendo-angular-common";
+import * as i2 from "./popup.component";
 /**
  * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
  * definition for the Popup component.
@@ -39,6 +38,6 @@ import * as i3 from "@progress/kendo-angular-common";
  */
 export declare class PopupModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<PopupModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<PopupModule, [typeof i1.PopupComponent], [typeof i2.CommonModule, typeof i3.ResizeSensorModule], [typeof i1.PopupComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PopupModule, never, [typeof i1.ResizeSensorComponent, typeof i2.PopupComponent], [typeof i2.PopupComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<PopupModule>;
 }

package/popup.service.d.ts

@@ -10,23 +10,42 @@ import * as i0 from "@angular/core";
  * Used to inject the Popup container. If not provided, the first root component of
  * the application is used.
  *
- * > The `POPUP_CONTAINER` can be used only with the [`PopupService`]({% slug service_popup %}) class.
+ * > The `POPUP_CONTAINER` can be used only with the [`PopupService`](slug:service_popup) class.
+ *
+ * In case you are using standalone components:
+ *
+ * @example
+ *
+ * ```ts
+ * import { Component } from '@angular/core';
+ * import { KENDO_POPUP, PopupService } from '@progress/kendo-angular-popup';
+ *
+ * @Component({
+ *   standalone: true,
+ *   imports: [KENDO_POPUP],
+ *   providers: [PopupService, {
+ *     provide: POPUP_CONTAINER,
+ *       useFactory: () => {
+ *         //return the container ElementRef, where the popup will be injected
+ *         return { nativeElement: document.body } as ElementRef;
+ *       }
+ *   }],
+ *   selector: 'app-root',
+ *   templateUrl: './app.component.html',
+ * })
+ * export class AppComponent {}
+ * ```
+ *
+ * In case you are using an NgModule-based application:
  *
  * @example
  *
  * ```ts-no-run
- * // Import the Popup module
  * import { PopupModule, POPUP_CONTAINER } from '@progress/kendo-angular-popup';
- *
- * // The browser platform with a compiler
  * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
  * import { ElementRef, NgModule } from '@angular/core';
- *
- * // Import the app component
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
  * _@NgModule({
  *     declarations: [AppComponent], // declare app component
  *     imports:      [BrowserModule, PopupModule], // import Popup module
@@ -41,7 +60,6 @@ import * as i0 from "@angular/core";
  * })
  * export class AppModule {}
  *
- * // Compile and launch the module
  * platformBrowserDynamic().bootstrapModule(AppModule);
  * ```
  */