@progress/kendo-angular-popup 4.0.6-dev.202203091019 → 5.0.0-dev.202204131653

package/{dist/fesm2015/index.js → fesm2015/kendo-angular-popup.js}

@@ -2,25 +2,43 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { __decorate, __param, __metadata } from 'tslib';
-import { Injectable, InjectionToken, Inject, Optional, NgZone, EventEmitter, isDevMode, Input, ElementRef, Output, ViewChild, Component, Renderer2, TemplateRef, ApplicationRef, ComponentFactoryResolver, Injector, NgModule } from '@angular/core';
+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 i7 from '@progress/kendo-angular-common';
 import { isDocumentAvailable, hasObservers, ResizeSensorComponent, ResizeSensorModule } from '@progress/kendo-angular-common';
 import { fromEvent, merge, from } from 'rxjs';
 import { auditTime } from 'rxjs/operators';
-import { style, animate, AnimationBuilder } from '@angular/animations';
+import * as i1 from '@angular/animations';
+import { style, animate } from '@angular/animations';
 import { validatePackage } from '@progress/kendo-licensing';
+import * as i8 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
 /**
  * @hidden
  */
-const eitherRect = (rect, offset$$1) => {
+const eitherRect = (rect, offset) => {
     if (!rect) {
-        return { height: 0, left: offset$$1.left, top: offset$$1.top, width: 0 };
+        return { height: 0, left: offset.left, top: offset.top, width: 0 };
     }
     return rect;
 };
+/**
+ * @hidden
+ */
+const replaceOffset = (rect, offset) => {
+    if (!offset) {
+        return rect;
+    }
+    const result = {
+        height: rect.height,
+        left: offset.left,
+        top: offset.top,
+        width: rect.width
+    };
+    return result;
+};
 /**
  * @hidden
  */
@@ -50,6 +68,10 @@ const isDifferentOffset = (oldOffset, newOffset) => {
 const isWindowAvailable = () => {
     return typeof window !== 'undefined';
 };
+/**
+ * @hidden
+ */
+const hasBoundingRect = (elem) => !!elem.getBoundingClientRect;
 /**
  * @hidden
  */
@@ -98,7 +120,10 @@ function memoize(fun) {
         return result;
     };
 }
-const ɵ3 = () => {
+/**
+ * @hidden
+ */
+const hasRelativeStackingContext = memoize(() => {
     if (!isDocumentAvailable() && document.body !== null) {
         return false;
     }
@@ -110,11 +135,7 @@ const ɵ3 = () => {
     const isDifferent = parent.children[0].getBoundingClientRect().top !== top;
     document.body.removeChild(parent);
     return isDifferent;
-};
-/**
- * @hidden
- */
-const hasRelativeStackingContext = memoize(ɵ3);
+});
 /**
  * @hidden
  */
@@ -148,6 +169,23 @@ const scaleRect = (rect, scale) => {
     };
 };
 
+/**
+ * Used to set the document scale when using a [scale transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale).
+ *
+ * The document or container scale is required to compute the popup position correctly. Detecting the scale is not reliable and must be set by providing a value for SCALE. See [Support for Document Scale]({% slug documentscale_popup %}).
+ *
+ * > Using this token is not necessary for user-applied browser zoom.
+ *
+ * {% meta height:300 %}
+ * {% embed_file scale/app.component.ts preview %}
+ * {% embed_file shared/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% endmeta %}
+ *
+ *
+ */
+const SCALE = new InjectionToken('Popup Document Scale');
+
 const STYLES = [
     'font-size',
     'font-family',
@@ -159,7 +197,7 @@ const STYLES = [
 /**
  * @hidden
  */
-let DOMService = class DOMService {
+class DOMService {
     addOffset(current, addition) {
         return {
             left: current.left + addition.left,
@@ -173,14 +211,14 @@ let DOMService = class DOMService {
         return align(settings);
     }
     boundingOffset(el) {
-        return boundingOffset(this.nativeElement(el));
+        return boundingOffset(el);
     }
     getFontStyles(el) {
         const window = this.getWindow();
         if (!window || !el) {
             return [];
         }
-        const computedStyles = window.getComputedStyle(this.nativeElement(el));
+        const computedStyles = window.getComputedStyle(el);
         return STYLES.map(font => ({ key: font, value: computedStyles[font] }));
     }
     getWindow() {
@@ -196,7 +234,7 @@ let DOMService = class DOMService {
         if (!el) {
             return null;
         }
-        return offset(this.nativeElement(el));
+        return offset(el);
     }
     offsetAtPoint(el, currentLocation) {
         if (!el) {
@@ -211,7 +249,7 @@ let DOMService = class DOMService {
         element.style.left = left;
         element.style.top = top;
         // prevents elements with transition to be animated because of the change
-        // tslint:disable-next-line:no-unused-expression
+        // eslint-disable-next-line no-unused-expressions
         element.offsetHeight;
         element.style.transition = transition;
         return currentOffset;
@@ -226,7 +264,7 @@ let DOMService = class DOMService {
         if (!element || !popup) {
             return null;
         }
-        return positionWithScroll(this.nativeElement(element), this.nativeElement(popup), scale);
+        return positionWithScroll(element, this.nativeElement(popup), scale);
     }
     removeScroll(rect, scroll) {
         return removeScroll(rect, scroll);
@@ -238,7 +276,7 @@ let DOMService = class DOMService {
         return scrollPosition(this.nativeElement(el));
     }
     scrollableParents(el) {
-        return scrollableParents(this.nativeElement(el));
+        return scrollableParents(el);
     }
     stackingElementOffset(el) {
         const relativeContextElement = this.getRelativeContextElement(el);
@@ -277,7 +315,7 @@ let DOMService = class DOMService {
         return getWindowViewPort(this.nativeElement(el));
     }
     zIndex(anchor, container) {
-        return zIndex(this.nativeElement(anchor), this.nativeElement(container));
+        return zIndex(anchor, this.nativeElement(container));
     }
     zoomLevel() {
         if (!isDocumentAvailable() || !isWindowAvailable()) {
@@ -288,42 +326,27 @@ let DOMService = class DOMService {
     isZoomed() {
         return this.zoomLevel() > 1;
     }
-};
-DOMService = __decorate([
-    Injectable()
-], DOMService);
-
-/**
- * Used to set the document scale when using a [scale transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale).
- *
- * The document or container scale is required to compute the popup position correctly. Detecting the scale is not reliable and must be set by providing a value for SCALE. See [Support for Document Scale]({% slug documentscale_popup %}).
- *
- * > Using this token is not necessary for user-applied browser zoom.
- *
- * {% meta height:300 %}
- * {% embed_file scale/app.component.ts preview %}
- * {% embed_file shared/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% endmeta %}
- *
- *
- */
-const SCALE = new InjectionToken('Popup Document Scale');
+}
+DOMService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DOMService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DOMService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DOMService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DOMService, decorators: [{
+            type: Injectable
+        }] });
 
 /**
  * @hidden
  */
-let AlignService = class AlignService {
+class AlignService {
     constructor(_dom, scale = 1) {
         this._dom = _dom;
         this.scale = scale;
     }
     alignElement(settings) {
-        const { anchor, element, anchorAlign, elementAlign, margin, offset: offset$$1, positionMode } = settings;
+        const { anchor, element, anchorAlign, elementAlign, margin, offset, positionMode } = settings;
         const scale = this.scale || 1;
         const fixedMode = positionMode === 'fixed' || !this._dom.hasOffsetParent(element);
-        const anchorRect = fixedMode ? this.absoluteRect(anchor, element, offset$$1, scale) : this.relativeRect(anchor, element, offset$$1, scale);
-        const elementRect = scaleRect(this._dom.offset(element), scale);
+        const anchorRect = fixedMode ? this.absoluteRect(anchor, element, offset, scale) : this.relativeRect(anchor, element, offset, scale);
+        const elementRect = scaleRect(this._dom.offset(element.nativeElement), scale);
         const result = this._dom.align({
             anchorAlign: anchorAlign,
             anchorRect: anchorRect,
@@ -333,9 +356,9 @@ let AlignService = class AlignService {
         });
         return result;
     }
-    absoluteRect(anchor, element, offset$$1, scale) {
+    absoluteRect(anchor, element, offset, scale) {
         const scrollPos = this.elementScrollPosition(anchor, element);
-        const rect = eitherRect(this._dom.offset(anchor), offset$$1);
+        const rect = eitherRect(this._dom.offset(anchor), offset);
         const stackScale = 2 * scale;
         const stackScroll = this._dom.stackingElementScroll(element);
         if (scale !== 1 && stackScroll) {
@@ -352,21 +375,26 @@ let AlignService = class AlignService {
     elementScrollPosition(anchor, element) {
         return anchor ? { x: 0, y: 0 } : this._dom.scrollPosition(element);
     }
-    relativeRect(anchor, element, offset$$1, scale) {
-        const rect = eitherRect(this._dom.position(anchor, element, scale), offset$$1);
+    relativeRect(anchor, element, offset, scale) {
+        const rect = eitherRect(this._dom.position(anchor, element, scale), offset);
         return scaleRect(rect, scale);
     }
-};
-AlignService = __decorate([
-    Injectable(),
-    __param(1, Inject(SCALE)), __param(1, Optional()),
-    __metadata("design:paramtypes", [DOMService, Number])
-], AlignService);
+}
+AlignService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AlignService, deps: [{ token: DOMService }, { token: SCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+AlignService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AlignService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AlignService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: DOMService }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [SCALE]
+                }, {
+                    type: Optional
+                }] }]; } });
 
 /**
  * @hidden
  */
-let PositionService = class PositionService {
+class PositionService {
     constructor(_dom, scale = 1) {
         this._dom = _dom;
         this.scale = scale;
@@ -391,24 +419,29 @@ let PositionService = class PositionService {
             margin,
             viewPort
         });
-        const offset$$1 = dom.addOffset(currentLocation, result.offset);
+        const offset = dom.addOffset(currentLocation, result.offset);
         return {
             flip: result.flip,
             flipped: result.flipped,
-            offset: offset$$1
+            offset: offset
         };
     }
-};
-PositionService = __decorate([
-    Injectable(),
-    __param(1, Inject(SCALE)), __param(1, Optional()),
-    __metadata("design:paramtypes", [DOMService, Number])
-], PositionService);
+}
+PositionService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PositionService, deps: [{ token: DOMService }, { token: SCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+PositionService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PositionService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PositionService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: DOMService }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [SCALE]
+                }, {
+                    type: Optional
+                }] }]; } });
 
 /**
  * @hidden
  */
-let ResizeService = class ResizeService {
+class ResizeService {
     constructor(_dom, _zone) {
         this._dom = _dom;
         this._zone = _zone;
@@ -432,11 +465,12 @@ let ResizeService = class ResizeService {
     isUnsubscribed() {
         return this.subscription && this.subscription.closed;
     }
-};
-ResizeService = __decorate([
-    Injectable(),
-    __metadata("design:paramtypes", [DOMService, NgZone])
-], ResizeService);
+}
+ResizeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ResizeService, deps: [{ token: DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+ResizeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ResizeService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ResizeService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: DOMService }, { type: i0.NgZone }]; } });
 
 /**
  * @hidden
@@ -445,7 +479,7 @@ const THRESHOLD_DIFF = 1;
 /**
  * @hidden
  */
-let ScrollableService = class ScrollableService {
+class ScrollableService {
     constructor(_dom, _zone) {
         this._dom = _dom;
         this._zone = _zone;
@@ -459,17 +493,16 @@ let ScrollableService = class ScrollableService {
         if (!callback || !isDocumentAvailable() || !this.element) {
             return;
         }
-        const nativeElement = this._dom.nativeElement(this.element);
-        const parents$$1 = this._dom.scrollableParents(this.element);
+        const parents = this._dom.scrollableParents(this.element);
         this._zone.runOutsideAngular(() => {
-            const observables = parents$$1.map(p => fromEvent(p, "scroll").pipe(auditTime(FRAME_DURATION)));
+            const observables = parents.map(p => fromEvent(p, "scroll").pipe(auditTime(FRAME_DURATION)));
             const subscriber = (e) => {
                 const target = e.target;
-                const isParent = parents$$1.filter(p => p === target).length > 0;
+                const isParent = parents.filter(p => p === target).length > 0;
                 const isDocument = target === document;
                 const isWindow = target === window;
                 if (isParent || isDocument || isWindow) {
-                    callback(this.isVisible(nativeElement, target));
+                    callback(this.isVisible(this.element, target));
                 }
             };
             this.subscription = merge(...observables).subscribe(subscriber);
@@ -483,7 +516,7 @@ let ScrollableService = class ScrollableService {
     }
     isVisible(elem, container) {
         const elemRect = this._dom.boundingOffset(elem);
-        const containerRect = this._dom.boundingOffset(container);
+        const containerRect = this._dom.boundingOffset(this._dom.nativeElement(container));
         if (THRESHOLD_DIFF < (containerRect.top - elemRect.bottom)) {
             return false;
         }
@@ -498,11 +531,12 @@ let ScrollableService = class ScrollableService {
         }
         return true;
     }
-};
-ScrollableService = __decorate([
-    Injectable(),
-    __metadata("design:paramtypes", [DOMService, NgZone])
-], ScrollableService);
+}
+ScrollableService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollableService, deps: [{ token: DOMService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+ScrollableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollableService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollableService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: DOMService }, { type: i0.NgZone }]; } });
 
 const LEFT = 'left';
 const RIGHT = 'right';
@@ -511,7 +545,6 @@ const UP = 'up';
 const DEFAULT_TYPE = 'slide';
 const DEFAULT_DURATION = 100;
 const animationTypes = {};
-/* tslint:disable:object-literal-sort-keys */
 animationTypes.expand = (direction) => {
     const scale = direction === UP || direction === DOWN ? 'scaleY' : 'scaleX';
     const startScale = 0;
@@ -560,7 +593,7 @@ animationTypes.zoom = () => {
 /**
  * @hidden
  */
-let AnimationService = class AnimationService {
+class AnimationService {
     constructor(animationBuilder) {
         this.animationBuilder = animationBuilder;
         this.start = new EventEmitter();
@@ -626,11 +659,12 @@ let AnimationService = class AnimationService {
             this.player = null;
         }
     }
-};
-AnimationService = __decorate([
-    Injectable(),
-    __metadata("design:paramtypes", [AnimationBuilder])
-], AnimationService);
+}
+AnimationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AnimationService, deps: [{ token: i1.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Injectable });
+AnimationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AnimationService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AnimationService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1.AnimationBuilder }]; } });
 
 /**
  * @hidden
@@ -639,7 +673,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-popup',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1646821120,
+    publishDate: 1649868773,
     version: '',
     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'
 };
@@ -666,7 +700,7 @@ const ANIMATION_CONTAINER_FIXED = 'k-animation-container-fixed';
  * }
  * ```
  */
-let PopupComponent = class PopupComponent {
+class PopupComponent {
     constructor(container, _alignService, domService, _positionService, _resizeService, _scrollableService, animationService, _renderer, _zone) {
         this.container = container;
         this._alignService = _alignService;
@@ -833,7 +867,7 @@ let PopupComponent = class PopupComponent {
         this._resizeService.subscribe(this.reposition);
         this.animationSubscriptions = this.animationService.start.subscribe(this.onAnimationStart.bind(this));
         this.animationSubscriptions.add(this.animationService.end.subscribe(this.onAnimationEnd.bind(this)));
-        this._scrollableService.forElement(this.anchor || this.container).subscribe(this.onScroll.bind(this));
+        this._scrollableService.forElement(this.domService.nativeElement(this.anchor) || this.container.nativeElement).subscribe(this.onScroll.bind(this));
         this.currentOffset = DEFAULT_OFFSET;
         this.setZIndex();
         this.copyFontStyles();
@@ -896,25 +930,25 @@ let PopupComponent = class PopupComponent {
     get currentOffset() {
         return this._currentOffset;
     }
-    set currentOffset(offset$$1) {
-        this.setContainerStyle('left', `${offset$$1.left}px`);
-        this.setContainerStyle('top', `${offset$$1.top}px`);
-        this._currentOffset = offset$$1;
+    set currentOffset(offset) {
+        this.setContainerStyle('left', `${offset.left}px`);
+        this.setContainerStyle('top', `${offset.top}px`);
+        this._currentOffset = offset;
     }
     setZIndex() {
         if (this.anchor) {
-            this.setContainerStyle('z-index', String(this.domService.zIndex(this.anchor, this.container)));
+            this.setContainerStyle('z-index', String(this.domService.zIndex(this.domService.nativeElement(this.anchor), this.container)));
         }
     }
     reposition() {
         if (!isDocumentAvailable()) {
             return;
         }
-        const { flip, offset: offset$$1 } = this.position();
-        if (!this.currentOffset || isDifferentOffset(this.currentOffset, offset$$1)) {
-            this.currentOffset = offset$$1;
+        const { flip, offset } = this.position();
+        if (!this.currentOffset || isDifferentOffset(this.currentOffset, offset)) {
+            this.currentOffset = offset;
             if (hasObservers(this.positionChange)) {
-                this._zone.run(() => this.positionChange.emit({ offset: offset$$1, flip }));
+                this._zone.run(() => this.positionChange.emit({ offset, flip }));
             }
         }
         if (this.animate) {
@@ -924,7 +958,7 @@ let PopupComponent = class PopupComponent {
     }
     position() {
         const alignedOffset = this._alignService.alignElement({
-            anchor: this.anchor,
+            anchor: this.domService.nativeElement(this.anchor),
             anchorAlign: this.anchorAlign,
             element: this.container,
             elementAlign: this.popupAlign,
@@ -933,7 +967,7 @@ let PopupComponent = class PopupComponent {
             positionMode: this.positionMode
         });
         return this._positionService.positionElement({
-            anchor: this.anchor,
+            anchor: this.domService.nativeElement(this.anchor),
             anchorAlign: this.anchorAlign,
             collisions: this.collision,
             currentLocation: alignedOffset,
@@ -957,7 +991,7 @@ let PopupComponent = class PopupComponent {
         if (!this.anchor || !this.copyAnchorStyles) {
             return;
         }
-        this.domService.getFontStyles(this.anchor)
+        this.domService.getFontStyles(this.domService.nativeElement(this.anchor))
             .forEach(s => this.setContainerStyle(s.key, s.value));
     }
     updateFixedClass() {
@@ -972,77 +1006,23 @@ let PopupComponent = class PopupComponent {
             this.repositionSubscription.unsubscribe();
         }
     }
-};
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], PopupComponent.prototype, "animate", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", ElementRef)
-], PopupComponent.prototype, "anchor", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], PopupComponent.prototype, "anchorAlign", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], PopupComponent.prototype, "collision", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], PopupComponent.prototype, "popupAlign", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], PopupComponent.prototype, "copyAnchorStyles", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], PopupComponent.prototype, "popupClass", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], PopupComponent.prototype, "positionMode", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], PopupComponent.prototype, "offset", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], PopupComponent.prototype, "margin", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], PopupComponent.prototype, "anchorViewportLeave", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], PopupComponent.prototype, "close", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], PopupComponent.prototype, "open", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], PopupComponent.prototype, "positionChange", void 0);
-__decorate([
-    ViewChild('container', { static: true }),
-    __metadata("design:type", ElementRef)
-], PopupComponent.prototype, "contentContainer", void 0);
-__decorate([
-    ViewChild(ResizeSensorComponent, { static: true }),
-    __metadata("design:type", ResizeSensorComponent)
-], PopupComponent.prototype, "resizeSensor", void 0);
-PopupComponent = __decorate([
-    Component({
-        exportAs: 'kendo-popup',
-        providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService],
-        selector: 'kendo-popup',
-        template: `
+}
+PopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", 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: "12.0.0", version: "12.2.16", 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: `
+        <div class="k-popup" [ngClass]="popupClass" #container>
+            <ng-content></ng-content>
+            <ng-template [ngTemplateOutlet]="content" [ngIf]="content"></ng-template>
+            <kendo-resize-sensor [rateLimit]="100" (resize)="onResize()">
+            </kendo-resize-sensor>
+        </div>
+     `, isInline: true, components: [{ type: i7.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i8.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupComponent, decorators: [{
+            type: Component,
+            args: [{
+                    exportAs: 'kendo-popup',
+                    providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService],
+                    selector: 'kendo-popup',
+                    template: `
         <div class="k-popup" [ngClass]="popupClass" #container>
             <ng-content></ng-content>
             <ng-template [ngTemplateOutlet]="content" [ngIf]="content"></ng-template>
@@ -1050,17 +1030,42 @@ PopupComponent = __decorate([
             </kendo-resize-sensor>
         </div>
      `
-    }),
-    __metadata("design:paramtypes", [ElementRef,
-        AlignService,
-        DOMService,
-        PositionService,
-        ResizeService,
-        ScrollableService,
-        AnimationService,
-        Renderer2,
-        NgZone])
-], PopupComponent);
+                }]
+        }], 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
+            }], anchor: [{
+                type: Input
+            }], anchorAlign: [{
+                type: Input
+            }], collision: [{
+                type: Input
+            }], popupAlign: [{
+                type: Input
+            }], copyAnchorStyles: [{
+                type: Input
+            }], popupClass: [{
+                type: Input
+            }], positionMode: [{
+                type: Input
+            }], offset: [{
+                type: Input
+            }], margin: [{
+                type: Input
+            }], anchorViewportLeave: [{
+                type: Output
+            }], close: [{
+                type: Output
+            }], open: [{
+                type: Output
+            }], positionChange: [{
+                type: Output
+            }], contentContainer: [{
+                type: ViewChild,
+                args: ['container', { static: true }]
+            }], resizeSensor: [{
+                type: ViewChild,
+                args: [ResizeSensorComponent, { static: true }]
+            }] } });
 
 const removeElement = (element) => {
     if (element && element.parentNode) {
@@ -1114,7 +1119,7 @@ const POPUP_CONTAINER = new InjectionToken('Popup Container');
  * @export
  * @class PopupService
  */
-let PopupService = class PopupService {
+class PopupService {
     constructor(applicationRef, componentFactoryResolver, injector, container) {
         this.applicationRef = applicationRef;
         this.componentFactoryResolver = componentFactoryResolver;
@@ -1290,15 +1295,17 @@ let PopupService = class PopupService {
             ]
         };
     }
-};
-PopupService = __decorate([
-    Injectable(),
-    __param(3, Inject(POPUP_CONTAINER)), __param(3, Optional()),
-    __metadata("design:paramtypes", [ApplicationRef,
-        ComponentFactoryResolver,
-        Injector,
-        ElementRef])
-], PopupService);
+}
+PopupService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", 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: "12.2.16", ngImport: i0, type: PopupService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.ElementRef, decorators: [{
+                    type: Inject,
+                    args: [POPUP_CONTAINER]
+                }, {
+                    type: Optional
+                }] }]; } });
 
 const POPUP_DIRECTIVES = [PopupComponent];
 /**
@@ -1332,20 +1339,25 @@ const POPUP_DIRECTIVES = [PopupComponent];
  *
  * ```
  */
-let PopupModule = class PopupModule {
-};
-PopupModule = __decorate([
-    NgModule({
-        declarations: [POPUP_DIRECTIVES],
-        entryComponents: [POPUP_DIRECTIVES],
-        exports: [POPUP_DIRECTIVES],
-        imports: [CommonModule, ResizeSensorModule],
-        providers: [PopupService]
-    })
-], PopupModule);
+class PopupModule {
+}
+PopupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, declarations: [PopupComponent], imports: [CommonModule, ResizeSensorModule], exports: [PopupComponent] });
+PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, providers: [PopupService], imports: [[CommonModule, ResizeSensorModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [POPUP_DIRECTIVES],
+                    entryComponents: [POPUP_DIRECTIVES],
+                    exports: [POPUP_DIRECTIVES],
+                    imports: [CommonModule, ResizeSensorModule],
+                    providers: [PopupService]
+                }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService, PopupService, POPUP_CONTAINER, PopupComponent, PopupModule, SCALE };
+export { POPUP_CONTAINER, PopupComponent, PopupModule, PopupService, SCALE };
+