@progress/kendo-angular-popup 17.0.0-develop.3 → 17.0.0-develop.31

package/{esm2020 → esm2022}/services/scrollable.service.mjs

@@ -18,6 +18,10 @@ export const THRESHOLD_DIFF = 1;
  * @hidden
  */
 export class ScrollableService {
+    _dom;
+    _zone;
+    element;
+    subscription;
     constructor(_dom, _zone) {
         this._dom = _dom;
         this._zone = _zone;
@@ -69,9 +73,9 @@ export class ScrollableService {
         }
         return true;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollableService, deps: [{ token: i1.DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollableService });
 }
-ScrollableService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollableService, deps: [{ token: i1.DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-ScrollableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollableService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollableService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollableService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.DOMService }, { type: i0.NgZone }]; } });

package/{fesm2020 → fesm2022}/progress-kendo-angular-popup.mjs

@@ -184,6 +184,7 @@ const STYLES = [
  * @hidden
  */
 class DOMService {
+    _dummy;
     addOffset(current, addition) {
         return {
             left: current.left + addition.left,
@@ -311,10 +312,10 @@ class DOMService {
     isZoomed() {
         return this.zoomLevel() > 1;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DOMService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DOMService });
 }
-DOMService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DOMService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-DOMService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DOMService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DOMService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DOMService, decorators: [{
             type: Injectable
         }] });
 
@@ -339,6 +340,8 @@ const SCALE = new InjectionToken('Popup Document Scale');
  * @hidden
  */
 class AlignService {
+    _dom;
+    scale;
     constructor(_dom, scale = 1) {
         this._dom = _dom;
         this.scale = scale;
@@ -381,10 +384,10 @@ class AlignService {
         const rect = eitherRect(this._dom.position(anchor, element, scale), offset);
         return scaleRect(rect, scale);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlignService, deps: [{ token: DOMService }, { token: SCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlignService });
 }
-AlignService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AlignService, deps: [{ token: DOMService }, { token: SCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-AlignService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AlignService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AlignService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlignService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: DOMService }, { type: undefined, decorators: [{
                     type: Inject,
@@ -397,6 +400,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * @hidden
  */
 class PositionService {
+    _dom;
+    scale;
     constructor(_dom, scale = 1) {
         this._dom = _dom;
         this.scale = scale;
@@ -428,10 +433,10 @@ class PositionService {
             offset: offset
         };
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PositionService, deps: [{ token: DOMService }, { token: SCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PositionService });
 }
-PositionService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PositionService, deps: [{ token: DOMService }, { token: SCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-PositionService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PositionService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PositionService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PositionService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: DOMService }, { type: undefined, decorators: [{
                     type: Inject,
@@ -444,6 +449,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * @hidden
  */
 class ResizeService {
+    _dom;
+    _zone;
+    subscription;
     constructor(_dom, _zone) {
         this._dom = _dom;
         this._zone = _zone;
@@ -467,10 +475,10 @@ class ResizeService {
     isUnsubscribed() {
         return this.subscription && this.subscription.closed;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ResizeService, deps: [{ token: DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ResizeService });
 }
-ResizeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeService, deps: [{ token: DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-ResizeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ResizeService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: DOMService }, { type: i0.NgZone }]; } });
 
@@ -482,6 +490,10 @@ const THRESHOLD_DIFF = 1;
  * @hidden
  */
 class ScrollableService {
+    _dom;
+    _zone;
+    element;
+    subscription;
     constructor(_dom, _zone) {
         this._dom = _dom;
         this._zone = _zone;
@@ -533,10 +545,10 @@ class ScrollableService {
         }
         return true;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollableService, deps: [{ token: DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollableService });
 }
-ScrollableService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollableService, deps: [{ token: DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-ScrollableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollableService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ScrollableService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollableService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: DOMService }, { type: i0.NgZone }]; } });
 
@@ -596,10 +608,13 @@ animationTypes.zoom = () => {
  * @hidden
  */
 class AnimationService {
+    animationBuilder;
+    start = new EventEmitter();
+    end = new EventEmitter();
+    flip;
+    player;
     constructor(animationBuilder) {
         this.animationBuilder = animationBuilder;
-        this.start = new EventEmitter();
-        this.end = new EventEmitter();
     }
     play(element, options, flip) {
         if (!this.flip || this.flip.horizontal !== flip.horizontal ||
@@ -661,10 +676,10 @@ class AnimationService {
             this.player = null;
         }
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AnimationService, deps: [{ token: i1.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AnimationService });
 }
-AnimationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AnimationService, deps: [{ token: i1.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Injectable });
-AnimationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AnimationService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AnimationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AnimationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.AnimationBuilder }]; } });
 
@@ -675,8 +690,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-popup',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1728917093,
-    version: '17.0.0-develop.3',
+    publishDate: 1730478567,
+    version: '17.0.0-develop.31',
     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'
 };
 
@@ -703,6 +718,195 @@ const ANIMATION_CONTAINER_FIXED = 'k-animation-container-fixed';
  * ```
  */
 class PopupComponent {
+    container;
+    _alignService;
+    domService;
+    _positionService;
+    _resizeService;
+    _scrollableService;
+    animationService;
+    _renderer;
+    _zone;
+    /**
+     * Controls the Popup animation. By default, the opening and closing animations
+     * are enabled ([see example]({% slug animations_popup %})).
+     */
+    animate = true;
+    /**
+     * Specifies the element that will be used as an anchor. The Popup opens next to that element.
+     * ([see example]({% slug alignmentpositioning_popup %}#toc-aligning-to-components)).
+     */
+    anchor;
+    /**
+     * Specifies the anchor pivot point
+     * ([see example]({% slug alignmentpositioning_popup %}#toc-positioning)).
+     */
+    anchorAlign = { horizontal: 'left', vertical: 'bottom' };
+    /**
+     * Configures the collision behavior of the Popup
+     * ([see example]({% slug viewportboundarydetection_popup %})).
+     */
+    collision = { horizontal: 'fit', vertical: 'flip' };
+    /**
+     * Specifies the pivot point of the Popup
+     * ([see example]({% slug alignmentpositioning_popup %}#toc-positioning)).
+     */
+    popupAlign = { horizontal: 'left', vertical: 'top' };
+    /**
+     * Controls whether the component will copy the `anchor` font styles.
+     */
+    copyAnchorStyles = false;
+    /**
+     * Specifies a list of CSS classes that will be added to the internal
+     * animated element ([see example]({% slug appearance_popup %})).
+     *
+     * > To style the content of the Popup, use this property binding.
+     */
+    // eslint-disable-next-line @typescript-eslint/ban-types
+    popupClass;
+    /**
+     * Specifies the position mode of the component. By default, the Popup uses fixed positioning.
+     * To make the Popup acquire absolute positioning, set this option to `absolute`.
+     *
+     * > If you need to support mobile browsers with the zoom option,
+     * use the `absolute` positioning of the Popup.
+     *
+     * @example
+     * ```html
+     * <style>
+     *  .parent-content {
+     *     position: relative;
+     *     width: 200px;
+     *     height: 200px;
+     *     overflow: auto;
+     *     margin: 200px auto;
+     *     border: 1px solid red;
+     *  }
+     *  .content {
+     *     position: relative;
+     *     width: 100px;
+     *     height: 100px;
+     *     overflow: auto;
+     *     margin: 300px;
+     *     border: 1px solid blue;
+     *  }
+     *  .anchor {
+     *     position: absolute;
+     *     top: 200px;
+     *     left: 200px;
+     *  }
+     * </style>
+     * ```
+     * ```ts
+     * _@Component({
+     * selector: 'my-app',
+     * template: `
+     *   <div class="example-config">
+     *      Position mode:
+     *      <label><input type="radio" value="fixed" [(ngModel)]="mode" /> Fixed</label>
+     *      <label><input type="radio" value="absolute" [(ngModel)]="mode" /> Absolute</label>
+     *   </div>
+     *   <div class="example-config">
+     *       Append to
+     *       <label>
+     *           <input type="radio" name="place" [value]="1" [(ngModel)]="checked" />
+     *           Root component
+     *       </label>
+     *       <label>
+     *           <input type="radio" name="place" [value]="2" [(ngModel)]="checked" />
+     *           <span [style.color]="'red'">Red Container</span>
+     *       </label>
+     *       <label>
+     *           <input type="radio" name="place" [value]="3" [(ngModel)]="checked" />
+     *           <span [style.color]="'blue'">Blue Container</span>
+     *       </label>
+     *   </div>
+     *   <div class="example">
+     *     <div class="parent-content" [scrollLeft]="250" [scrollTop]="230">
+     *         <div class="content" [scrollLeft]="170" [scrollTop]="165">
+     *           <button #anchor class="anchor" (click)="show = !show">Toggle</button>
+     *           <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 3">
+     *             <ul>
+     *                 <li>Item1</li>
+     *                 <li>Item2</li>
+     *                 <li>Item3</li>
+     *             </ul>
+     *           </kendo-popup>
+     *           <span [style.position]="'absolute'" [style.top.px]="400" [style.left.px]="400">Bottom/Right</span>
+     *         </div>
+     *         <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 2">
+     *           <ul>
+     *               <li>Item1</li>
+     *               <li>Item2</li>
+     *               <li>Item3</li>
+     *           </ul>
+     *         </kendo-popup>
+     *         <span [style.position]="'absolute'" [style.top.px]="600" [style.left.px]="600">Bottom/Right</span>
+     *     </div>
+     *     <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 1">
+     *       <ul>
+     *           <li>Item1</li>
+     *           <li>Item2</li>
+     *           <li>Item3</li>
+     *       </ul>
+     *     </kendo-popup>
+     *   </div>
+     * `
+     * })
+     * class AppComponent {
+     *   public checked: number = 3;
+     *   public mode: string = 'absolute';
+     *   public show: boolean = true;
+     * }
+     * ```
+     */
+    positionMode = 'fixed';
+    /**
+     * Specifies the absolute position of the element
+     * ([see example]({% slug alignmentpositioning_popup %}#toc-aligning-to-absolute-points)).
+     * The Popup opens next to that point. The Popup pivot point is defined by the `popupAlign` configuration option.
+     * The boundary detection is applied by using the window viewport.
+     */
+    offset = DEFAULT_OFFSET;
+    /**
+     * Specifies the margin value that will be added to the popup dimensions in pixels and leaves a blank space
+     * between the popup and the anchor ([see example]({% slug alignmentpositioning_popup %}#toc-adding-a-margin)).
+     */
+    margin;
+    /**
+     * Fires when the anchor is scrolled outside the screen boundaries.
+     * ([see example]({% slug closing_popup %}#toc-after-leaving-the-viewport)).
+     */
+    anchorViewportLeave = new EventEmitter();
+    /**
+     * Fires after the component is closed.
+     */
+    close = new EventEmitter();
+    /**
+     * Fires after the component is opened and the opening animation ends.
+     */
+    open = new EventEmitter();
+    /**
+     * Fires after the component is opened and the Popup is positioned.
+     */
+    positionChange = new EventEmitter();
+    /**
+     * @hidden
+     */
+    contentContainer;
+    /**
+     * @hidden
+     */
+    resizeSensor;
+    /**
+     * @hidden
+     */
+    content;
+    resolvedPromise = Promise.resolve(null);
+    _currentOffset;
+    animationSubscriptions;
+    repositionSubscription;
+    initialCheck = true;
     constructor(container, _alignService, domService, _positionService, _resizeService, _scrollableService, animationService, _renderer, _zone) {
         this.container = container;
         this._alignService = _alignService;
@@ -713,153 +917,6 @@ class PopupComponent {
         this.animationService = animationService;
         this._renderer = _renderer;
         this._zone = _zone;
-        /**
-         * Controls the Popup animation. By default, the opening and closing animations
-         * are enabled ([see example]({% slug animations_popup %})).
-         */
-        this.animate = true;
-        /**
-         * Specifies the anchor pivot point
-         * ([see example]({% slug alignmentpositioning_popup %}#toc-positioning)).
-         */
-        this.anchorAlign = { horizontal: 'left', vertical: 'bottom' };
-        /**
-         * Configures the collision behavior of the Popup
-         * ([see example]({% slug viewportboundarydetection_popup %})).
-         */
-        this.collision = { horizontal: 'fit', vertical: 'flip' };
-        /**
-         * Specifies the pivot point of the Popup
-         * ([see example]({% slug alignmentpositioning_popup %}#toc-positioning)).
-         */
-        this.popupAlign = { horizontal: 'left', vertical: 'top' };
-        /**
-         * Controls whether the component will copy the `anchor` font styles.
-         */
-        this.copyAnchorStyles = false;
-        /**
-         * Specifies the position mode of the component. By default, the Popup uses fixed positioning.
-         * To make the Popup acquire absolute positioning, set this option to `absolute`.
-         *
-         * > If you need to support mobile browsers with the zoom option,
-         * use the `absolute` positioning of the Popup.
-         *
-         * @example
-         * ```html
-         * <style>
-         *  .parent-content {
-         *     position: relative;
-         *     width: 200px;
-         *     height: 200px;
-         *     overflow: auto;
-         *     margin: 200px auto;
-         *     border: 1px solid red;
-         *  }
-         *  .content {
-         *     position: relative;
-         *     width: 100px;
-         *     height: 100px;
-         *     overflow: auto;
-         *     margin: 300px;
-         *     border: 1px solid blue;
-         *  }
-         *  .anchor {
-         *     position: absolute;
-         *     top: 200px;
-         *     left: 200px;
-         *  }
-         * </style>
-         * ```
-         * ```ts
-         * _@Component({
-         * selector: 'my-app',
-         * template: `
-         *   <div class="example-config">
-         *      Position mode:
-         *      <label><input type="radio" value="fixed" [(ngModel)]="mode" /> Fixed</label>
-         *      <label><input type="radio" value="absolute" [(ngModel)]="mode" /> Absolute</label>
-         *   </div>
-         *   <div class="example-config">
-         *       Append to
-         *       <label>
-         *           <input type="radio" name="place" [value]="1" [(ngModel)]="checked" />
-         *           Root component
-         *       </label>
-         *       <label>
-         *           <input type="radio" name="place" [value]="2" [(ngModel)]="checked" />
-         *           <span [style.color]="'red'">Red Container</span>
-         *       </label>
-         *       <label>
-         *           <input type="radio" name="place" [value]="3" [(ngModel)]="checked" />
-         *           <span [style.color]="'blue'">Blue Container</span>
-         *       </label>
-         *   </div>
-         *   <div class="example">
-         *     <div class="parent-content" [scrollLeft]="250" [scrollTop]="230">
-         *         <div class="content" [scrollLeft]="170" [scrollTop]="165">
-         *           <button #anchor class="anchor" (click)="show = !show">Toggle</button>
-         *           <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 3">
-         *             <ul>
-         *                 <li>Item1</li>
-         *                 <li>Item2</li>
-         *                 <li>Item3</li>
-         *             </ul>
-         *           </kendo-popup>
-         *           <span [style.position]="'absolute'" [style.top.px]="400" [style.left.px]="400">Bottom/Right</span>
-         *         </div>
-         *         <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 2">
-         *           <ul>
-         *               <li>Item1</li>
-         *               <li>Item2</li>
-         *               <li>Item3</li>
-         *           </ul>
-         *         </kendo-popup>
-         *         <span [style.position]="'absolute'" [style.top.px]="600" [style.left.px]="600">Bottom/Right</span>
-         *     </div>
-         *     <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 1">
-         *       <ul>
-         *           <li>Item1</li>
-         *           <li>Item2</li>
-         *           <li>Item3</li>
-         *       </ul>
-         *     </kendo-popup>
-         *   </div>
-         * `
-         * })
-         * class AppComponent {
-         *   public checked: number = 3;
-         *   public mode: string = 'absolute';
-         *   public show: boolean = true;
-         * }
-         * ```
-         */
-        this.positionMode = 'fixed';
-        /**
-         * Specifies the absolute position of the element
-         * ([see example]({% slug alignmentpositioning_popup %}#toc-aligning-to-absolute-points)).
-         * The Popup opens next to that point. The Popup pivot point is defined by the `popupAlign` configuration option.
-         * The boundary detection is applied by using the window viewport.
-         */
-        this.offset = DEFAULT_OFFSET;
-        /**
-         * Fires when the anchor is scrolled outside the screen boundaries.
-         * ([see example]({% slug closing_popup %}#toc-after-leaving-the-viewport)).
-         */
-        this.anchorViewportLeave = new EventEmitter();
-        /**
-         * Fires after the component is closed.
-         */
-        this.close = new EventEmitter();
-        /**
-         * Fires after the component is opened and the opening animation ends.
-         */
-        this.open = new EventEmitter();
-        /**
-         * Fires after the component is opened and the Popup is positioned.
-         */
-        this.positionChange = new EventEmitter();
-        this.resolvedPromise = Promise.resolve(null);
-        this.initialCheck = true;
         validatePackage(packageMetadata);
         this._renderer.addClass(container.nativeElement, ANIMATION_CONTAINER);
         this.updateFixedClass();
@@ -1009,9 +1066,8 @@ class PopupComponent {
             this.repositionSubscription.unsubscribe();
         }
     }
-}
-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, 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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", 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 });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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>
@@ -1021,7 +1077,8 @@ PopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version
             </div>
         </div>
      `, 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: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopupComponent, decorators: [{
             type: Component,
             args: [{
                     exportAs: 'kendo-popup',
@@ -1147,12 +1204,10 @@ const POPUP_CONTAINER = new InjectionToken('Popup Container');
  * @class PopupService
  */
 class PopupService {
-    constructor(applicationRef, componentFactoryResolver, injector, container) {
-        this.applicationRef = applicationRef;
-        this.componentFactoryResolver = componentFactoryResolver;
-        this.injector = injector;
-        this.container = container;
-    }
+    applicationRef;
+    componentFactoryResolver;
+    injector;
+    container;
     /**
      * Gets the root view container into which the component will be injected.
      *
@@ -1177,6 +1232,12 @@ class PopupService {
     get rootViewContainerNode() {
         return this.container ? this.container.nativeElement : this.getComponentRootNode(this.rootViewContainer);
     }
+    constructor(applicationRef, componentFactoryResolver, injector, container) {
+        this.applicationRef = applicationRef;
+        this.componentFactoryResolver = componentFactoryResolver;
+        this.injector = injector;
+        this.container = container;
+    }
     /**
      * Opens a Popup component. Created Popups are mounted
      * in the DOM directly in the root application component.
@@ -1322,10 +1383,10 @@ class PopupService {
             ]
         };
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopupService, deps: [{ token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: POPUP_CONTAINER, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopupService, providedIn: 'root' });
 }
-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, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PopupService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopupService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1377,11 +1438,11 @@ const KENDO_POPUP = [
  * ```
  */
 class PopupModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: PopupModule, imports: [ResizeSensorComponent, PopupComponent], exports: [PopupComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopupModule, providers: [PopupService, ResizeBatchService], imports: [ResizeSensorComponent, KENDO_POPUP] });
 }
-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, 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PopupModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [...KENDO_POPUP],

package/models/collision.type.d.ts

@@ -9,4 +9,4 @@
  * - `fit`—Moves the Popup horizontally until it is fully displayed in the viewport.
  * - `flip`—Flips the Popup position based on the origin and the position properties.
  */
-export declare type CollisionType = 'fit' | 'flip';
+export type CollisionType = 'fit' | 'flip';

package/models/popup-animation.interface.d.ts

@@ -22,5 +22,5 @@ export interface PopupAnimation {
      */
     direction: AnimationDirection;
 }
-export declare type AnimationType = 'slide' | 'expand' | 'zoom' | 'fade';
-export declare type AnimationDirection = 'down' | 'up' | 'left' | 'right';
+export type AnimationType = 'slide' | 'expand' | 'zoom' | 'fade';
+export type AnimationDirection = 'down' | 'up' | 'left' | 'right';

package/models/position-mode.d.ts

@@ -5,4 +5,4 @@
 /**
  * The type which defines all possible position modes of the Popup.
  */
-export declare type PositionMode = 'absolute' | 'fixed';
+export type PositionMode = 'absolute' | 'fixed';