@progress/kendo-angular-popup 4.0.6 → 5.0.0-dev.202204131653
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/kendo-angular-popup.umd.js +5 -0
- package/{dist/es2015/models/position-mode.js → esm2015/kendo-angular-popup.js} +2 -1
- package/{dist/es → esm2015}/main.js +0 -0
- package/{dist/es → esm2015}/models/align-element-settings.interface.js +1 -0
- package/{dist/es2015 → esm2015}/models/align.interface.js +1 -0
- package/{dist/es2015 → esm2015}/models/collision.interface.js +1 -0
- package/{dist/es2015 → esm2015}/models/collision.type.js +1 -0
- package/{dist/es → esm2015}/models/margin.interface.js +1 -0
- package/{dist/es → esm2015}/models/offset.interface.js +1 -0
- package/{dist/es → esm2015}/models/popup-animation.interface.js +1 -0
- package/{dist/es → esm2015}/models/popup-ref.js +1 -0
- package/{dist/es → esm2015}/models/popup-settings.js +1 -0
- package/{dist/es → esm2015}/models/position-element-settings.interface.js +1 -0
- package/{dist/es → esm2015}/models/position-mode.js +1 -0
- package/{dist/es → esm2015}/models/position.interface.js +1 -0
- package/{dist/es2015 → esm2015}/package-metadata.js +1 -1
- package/{dist/es2015 → esm2015}/popup.component.js +64 -86
- package/{dist/es2015 → esm2015}/popup.module.js +16 -13
- package/{dist/es2015 → esm2015}/popup.service.js +14 -15
- package/{dist/es2015 → esm2015}/scale.js +0 -0
- package/{dist/es2015 → esm2015}/services/align.service.js +14 -10
- package/{dist/es2015 → esm2015}/services/animation.service.js +10 -10
- package/{dist/es2015 → esm2015}/services/dom.service.js +9 -8
- package/{dist/es2015 → esm2015}/services/position.service.js +14 -10
- package/{dist/es2015 → esm2015}/services/resize.service.js +10 -10
- package/{dist/es2015 → esm2015}/services/scrollable.service.js +10 -10
- package/{dist/es2015 → esm2015}/util.js +5 -10
- package/{dist/fesm2015/index.js → fesm2015/kendo-angular-popup.js} +205 -192
- package/kendo-angular-popup.d.ts +9 -0
- package/{dist/es2015/main.d.ts → main.d.ts} +1 -1
- package/{dist/es2015/models → models}/align-element-settings.interface.d.ts +0 -0
- package/{dist/es2015/models → models}/align.interface.d.ts +0 -0
- package/{dist/es2015/models → models}/collision.interface.d.ts +0 -0
- package/{dist/es2015/models → models}/collision.type.d.ts +0 -0
- package/{dist/es2015/models → models}/margin.interface.d.ts +0 -0
- package/{dist/es2015/models → models}/offset.interface.d.ts +0 -0
- package/{dist/es2015/models → models}/popup-animation.interface.d.ts +4 -2
- package/{dist/es2015/models → models}/popup-ref.d.ts +0 -0
- package/{dist/es2015/models → models}/popup-settings.d.ts +0 -0
- package/{dist/es2015/models → models}/position-element-settings.interface.d.ts +0 -0
- package/{dist/es2015/models → models}/position-mode.d.ts +0 -0
- package/{dist/es2015/models → models}/position.interface.d.ts +0 -0
- package/{dist/es2015/package-metadata.d.ts → package-metadata.d.ts} +0 -0
- package/package.json +34 -99
- package/{dist/es2015/popup.component.d.ts → popup.component.d.ts} +5 -1
- package/{dist/es2015/popup.module.d.ts → popup.module.d.ts} +7 -0
- package/{dist/es2015/popup.service.d.ts → popup.service.d.ts} +5 -2
- package/{dist/es2015/scale.d.ts → scale.d.ts} +0 -0
- package/schematics/ngAdd/index.js +5 -2
- package/schematics/ngAdd/index.js.map +1 -1
- package/{dist/es2015/services → services}/align.service.d.ts +3 -0
- package/{dist/es2015/services → services}/animation.service.d.ts +3 -0
- package/{dist/es2015/services → services}/dom.service.d.ts +3 -0
- package/{dist/es2015/services → services}/position.service.d.ts +3 -0
- package/{dist/es2015/services → services}/resize.service.d.ts +3 -0
- package/{dist/es2015/services → services}/scrollable.service.d.ts +3 -0
- package/{dist/es2015/util.d.ts → util.d.ts} +1 -1
- package/dist/cdn/js/kendo-angular-popup.js +0 -20
- package/dist/cdn/main.js +0 -5
- package/dist/es/index.js +0 -14
- package/dist/es/models/align.interface.js +0 -4
- package/dist/es/models/collision.interface.js +0 -4
- package/dist/es/models/collision.type.js +0 -4
- package/dist/es/package-metadata.js +0 -15
- package/dist/es/popup.component.js +0 -438
- package/dist/es/popup.module.js +0 -57
- package/dist/es/popup.service.js +0 -254
- package/dist/es/scale.js +0 -21
- package/dist/es/services/align.service.js +0 -64
- package/dist/es/services/animation.service.js +0 -137
- package/dist/es/services/dom.service.js +0 -158
- package/dist/es/services/position.service.js +0 -53
- package/dist/es/services/resize.service.js +0 -46
- package/dist/es/services/scrollable.service.js +0 -78
- package/dist/es/util.js +0 -168
- package/dist/es2015/index.d.ts +0 -14
- package/dist/es2015/index.js +0 -14
- package/dist/es2015/index.metadata.json +0 -1
- package/dist/es2015/main.js +0 -8
- package/dist/es2015/models/align-element-settings.interface.js +0 -4
- package/dist/es2015/models/margin.interface.js +0 -4
- package/dist/es2015/models/offset.interface.js +0 -4
- package/dist/es2015/models/popup-animation.interface.js +0 -4
- package/dist/es2015/models/popup-ref.js +0 -4
- package/dist/es2015/models/popup-settings.js +0 -4
- package/dist/es2015/models/position-element-settings.interface.js +0 -4
- package/dist/es2015/models/position.interface.js +0 -4
- package/dist/fesm5/index.js +0 -1381
- package/dist/npm/index.js +0 -23
- package/dist/npm/main.js +0 -15
- package/dist/npm/models/align-element-settings.interface.js +0 -6
- package/dist/npm/models/align.interface.js +0 -6
- package/dist/npm/models/collision.interface.js +0 -6
- package/dist/npm/models/collision.type.js +0 -6
- package/dist/npm/models/margin.interface.js +0 -6
- package/dist/npm/models/offset.interface.js +0 -6
- package/dist/npm/models/popup-animation.interface.js +0 -6
- package/dist/npm/models/popup-ref.js +0 -6
- package/dist/npm/models/popup-settings.js +0 -6
- package/dist/npm/models/position-element-settings.interface.js +0 -6
- package/dist/npm/models/position-mode.js +0 -9
- package/dist/npm/models/position.interface.js +0 -6
- package/dist/npm/package-metadata.js +0 -17
- package/dist/npm/popup.component.js +0 -440
- package/dist/npm/popup.module.js +0 -59
- package/dist/npm/popup.service.js +0 -256
- package/dist/npm/scale.js +0 -23
- package/dist/npm/services/align.service.js +0 -66
- package/dist/npm/services/animation.service.js +0 -139
- package/dist/npm/services/dom.service.js +0 -160
- package/dist/npm/services/position.service.js +0 -55
- package/dist/npm/services/resize.service.js +0 -48
- package/dist/npm/services/scrollable.service.js +0 -80
- package/dist/npm/util.js +0 -173
- package/dist/systemjs/kendo-angular-popup.js +0 -5
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* @hidden
|
|
7
|
-
*/
|
|
8
|
-
export var packageMetadata = {
|
|
9
|
-
name: '@progress/kendo-angular-popup',
|
|
10
|
-
productName: 'Kendo UI for Angular',
|
|
11
|
-
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
12
|
-
publishDate: 1648554200,
|
|
13
|
-
version: '',
|
|
14
|
-
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'
|
|
15
|
-
};
|
|
@@ -1,438 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import * as tslib_1 from "tslib";
|
|
6
|
-
import { Component, ElementRef, EventEmitter, Input, Output, NgZone, Renderer2, ViewChild } from '@angular/core';
|
|
7
|
-
import { AlignService } from './services/align.service';
|
|
8
|
-
import { DOMService } from './services/dom.service';
|
|
9
|
-
import { PositionService } from './services/position.service';
|
|
10
|
-
import { ResizeService } from './services/resize.service';
|
|
11
|
-
import { ScrollableService } from './services/scrollable.service';
|
|
12
|
-
import { AnimationService } from './services/animation.service';
|
|
13
|
-
import { isDifferentOffset } from './util';
|
|
14
|
-
import { hasObservers, isDocumentAvailable, ResizeSensorComponent } from '@progress/kendo-angular-common';
|
|
15
|
-
import { from } from 'rxjs';
|
|
16
|
-
import { validatePackage } from '@progress/kendo-licensing';
|
|
17
|
-
import { packageMetadata } from './package-metadata';
|
|
18
|
-
var DEFAULT_OFFSET = { left: -10000, top: 0 };
|
|
19
|
-
var ANIMATION_CONTAINER = 'k-animation-container';
|
|
20
|
-
var ANIMATION_CONTAINER_FIXED = 'k-animation-container-fixed';
|
|
21
|
-
/**
|
|
22
|
-
* Represents the [Kendo UI Popup component for Angular]({% slug overview_popup %}).
|
|
23
|
-
*
|
|
24
|
-
* @example
|
|
25
|
-
* ```ts
|
|
26
|
-
* _@Component({
|
|
27
|
-
* selector: 'my-app',
|
|
28
|
-
* template: `
|
|
29
|
-
* <button #anchor (click)="show=!show">Toggle</button>
|
|
30
|
-
* <kendo-popup *ngIf="show" [anchor]="anchor">
|
|
31
|
-
* <strong>Popup content!</strong>
|
|
32
|
-
* </kendo-popup>
|
|
33
|
-
* `
|
|
34
|
-
* })
|
|
35
|
-
* class AppComponent {
|
|
36
|
-
* public show: boolean = false;
|
|
37
|
-
* }
|
|
38
|
-
* ```
|
|
39
|
-
*/
|
|
40
|
-
var PopupComponent = /** @class */ (function () {
|
|
41
|
-
function PopupComponent(container, _alignService, domService, _positionService, _resizeService, _scrollableService, animationService, _renderer, _zone) {
|
|
42
|
-
this.container = container;
|
|
43
|
-
this._alignService = _alignService;
|
|
44
|
-
this.domService = domService;
|
|
45
|
-
this._positionService = _positionService;
|
|
46
|
-
this._resizeService = _resizeService;
|
|
47
|
-
this._scrollableService = _scrollableService;
|
|
48
|
-
this.animationService = animationService;
|
|
49
|
-
this._renderer = _renderer;
|
|
50
|
-
this._zone = _zone;
|
|
51
|
-
/**
|
|
52
|
-
* Controls the Popup animation. By default, the opening and closing animations
|
|
53
|
-
* are enabled ([see example]({% slug animations_popup %})).
|
|
54
|
-
*/
|
|
55
|
-
this.animate = true;
|
|
56
|
-
/**
|
|
57
|
-
* Specifies the anchor pivot point
|
|
58
|
-
* ([see example]({% slug alignmentpositioning_popup %}#toc-positioning)).
|
|
59
|
-
*/
|
|
60
|
-
this.anchorAlign = { horizontal: 'left', vertical: 'bottom' };
|
|
61
|
-
/**
|
|
62
|
-
* Configures the collision behavior of the Popup
|
|
63
|
-
* ([see example]({% slug viewportboundarydetection_popup %})).
|
|
64
|
-
*/
|
|
65
|
-
this.collision = { horizontal: 'fit', vertical: 'flip' };
|
|
66
|
-
/**
|
|
67
|
-
* Specifies the pivot point of the Popup
|
|
68
|
-
* ([see example]({% slug alignmentpositioning_popup %}#toc-positioning)).
|
|
69
|
-
*/
|
|
70
|
-
this.popupAlign = { horizontal: 'left', vertical: 'top' };
|
|
71
|
-
/**
|
|
72
|
-
* Controls whether the component will copy the `anchor` font styles.
|
|
73
|
-
*/
|
|
74
|
-
this.copyAnchorStyles = false;
|
|
75
|
-
/**
|
|
76
|
-
* Specifies the position mode of the component. By default, the Popup uses fixed positioning.
|
|
77
|
-
* To make the Popup acquire absolute positioning, set this option to `absolute`.
|
|
78
|
-
*
|
|
79
|
-
* > If you need to support mobile browsers with the zoom option,
|
|
80
|
-
* use the `absolute` positioning of the Popup.
|
|
81
|
-
*
|
|
82
|
-
* @example
|
|
83
|
-
* ```html
|
|
84
|
-
* <style>
|
|
85
|
-
* .parent-content {
|
|
86
|
-
* position: relative;
|
|
87
|
-
* width: 200px;
|
|
88
|
-
* height: 200px;
|
|
89
|
-
* overflow: auto;
|
|
90
|
-
* margin: 200px auto;
|
|
91
|
-
* border: 1px solid red;
|
|
92
|
-
* }
|
|
93
|
-
* .content {
|
|
94
|
-
* position: relative;
|
|
95
|
-
* width: 100px;
|
|
96
|
-
* height: 100px;
|
|
97
|
-
* overflow: auto;
|
|
98
|
-
* margin: 300px;
|
|
99
|
-
* border: 1px solid blue;
|
|
100
|
-
* }
|
|
101
|
-
* .anchor {
|
|
102
|
-
* position: absolute;
|
|
103
|
-
* top: 200px;
|
|
104
|
-
* left: 200px;
|
|
105
|
-
* }
|
|
106
|
-
* </style>
|
|
107
|
-
* ```
|
|
108
|
-
* ```ts
|
|
109
|
-
* _@Component({
|
|
110
|
-
* selector: 'my-app',
|
|
111
|
-
* template: `
|
|
112
|
-
* <div class="example-config">
|
|
113
|
-
* Position mode:
|
|
114
|
-
* <label><input type="radio" value="fixed" [(ngModel)]="mode" /> Fixed</label>
|
|
115
|
-
* <label><input type="radio" value="absolute" [(ngModel)]="mode" /> Absolute</label>
|
|
116
|
-
* </div>
|
|
117
|
-
* <div class="example-config">
|
|
118
|
-
* Append to
|
|
119
|
-
* <label>
|
|
120
|
-
* <input type="radio" name="place" [value]="1" [(ngModel)]="checked" />
|
|
121
|
-
* Root component
|
|
122
|
-
* </label>
|
|
123
|
-
* <label>
|
|
124
|
-
* <input type="radio" name="place" [value]="2" [(ngModel)]="checked" />
|
|
125
|
-
* <span style="color: red">Red Container</span>
|
|
126
|
-
* </label>
|
|
127
|
-
* <label>
|
|
128
|
-
* <input type="radio" name="place" [value]="3" [(ngModel)]="checked" />
|
|
129
|
-
* <span style="color: blue">Blue Container</span>
|
|
130
|
-
* </label>
|
|
131
|
-
* </div>
|
|
132
|
-
* <div class="example">
|
|
133
|
-
* <div class="parent-content" [scrollLeft]="250" [scrollTop]="230">
|
|
134
|
-
* <div class="content" [scrollLeft]="170" [scrollTop]="165">
|
|
135
|
-
* <button #anchor class="anchor" (click)="show = !show">Toggle</button>
|
|
136
|
-
* <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 3">
|
|
137
|
-
* <ul>
|
|
138
|
-
* <li>Item1</li>
|
|
139
|
-
* <li>Item2</li>
|
|
140
|
-
* <li>Item3</li>
|
|
141
|
-
* </ul>
|
|
142
|
-
* </kendo-popup>
|
|
143
|
-
* <span style="position: absolute; top: 400px; left: 400px">Bottom/Right</span>
|
|
144
|
-
* </div>
|
|
145
|
-
* <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 2">
|
|
146
|
-
* <ul>
|
|
147
|
-
* <li>Item1</li>
|
|
148
|
-
* <li>Item2</li>
|
|
149
|
-
* <li>Item3</li>
|
|
150
|
-
* </ul>
|
|
151
|
-
* </kendo-popup>
|
|
152
|
-
* <span style="position: absolute; top: 600px; left: 600px">Bottom/Right</span>
|
|
153
|
-
* </div>
|
|
154
|
-
* <kendo-popup [positionMode]="mode" [anchor]="anchor" (anchorViewportLeave)="show=false" *ngIf="show && checked === 1">
|
|
155
|
-
* <ul>
|
|
156
|
-
* <li>Item1</li>
|
|
157
|
-
* <li>Item2</li>
|
|
158
|
-
* <li>Item3</li>
|
|
159
|
-
* </ul>
|
|
160
|
-
* </kendo-popup>
|
|
161
|
-
* </div>
|
|
162
|
-
* `
|
|
163
|
-
* })
|
|
164
|
-
* class AppComponent {
|
|
165
|
-
* public checked: number = 3;
|
|
166
|
-
* public mode: string = 'absolute';
|
|
167
|
-
* public show: boolean = true;
|
|
168
|
-
* }
|
|
169
|
-
* ```
|
|
170
|
-
*/
|
|
171
|
-
this.positionMode = 'fixed';
|
|
172
|
-
/**
|
|
173
|
-
* Specifies the absolute position of the element
|
|
174
|
-
* ([see example]({% slug alignmentpositioning_popup %}#toc-aligning-to-absolute-points)).
|
|
175
|
-
* The Popup opens next to that point. The Popup pivot point is defined by the `popupAlign` configuration option.
|
|
176
|
-
* The boundary detection is applied by using the window viewport.
|
|
177
|
-
*/
|
|
178
|
-
this.offset = DEFAULT_OFFSET;
|
|
179
|
-
/**
|
|
180
|
-
* Fires when the anchor is scrolled outside the screen boundaries.
|
|
181
|
-
* ([see example]({% slug closing_popup %}#toc-after-leaving-the-viewport)).
|
|
182
|
-
*/
|
|
183
|
-
this.anchorViewportLeave = new EventEmitter();
|
|
184
|
-
/**
|
|
185
|
-
* Fires after the component is closed.
|
|
186
|
-
*/
|
|
187
|
-
this.close = new EventEmitter();
|
|
188
|
-
/**
|
|
189
|
-
* Fires after the component is opened and the opening animation ends.
|
|
190
|
-
*/
|
|
191
|
-
this.open = new EventEmitter();
|
|
192
|
-
/**
|
|
193
|
-
* Fires after the component is opened and the Popup is positioned.
|
|
194
|
-
*/
|
|
195
|
-
this.positionChange = new EventEmitter();
|
|
196
|
-
this.resolvedPromise = Promise.resolve(null);
|
|
197
|
-
this.initialCheck = true;
|
|
198
|
-
validatePackage(packageMetadata);
|
|
199
|
-
this._renderer.addClass(container.nativeElement, ANIMATION_CONTAINER);
|
|
200
|
-
this.updateFixedClass();
|
|
201
|
-
}
|
|
202
|
-
PopupComponent.prototype.ngOnInit = function () {
|
|
203
|
-
this.reposition = this.reposition.bind(this);
|
|
204
|
-
this._resizeService.subscribe(this.reposition);
|
|
205
|
-
this.animationSubscriptions = this.animationService.start.subscribe(this.onAnimationStart.bind(this));
|
|
206
|
-
this.animationSubscriptions.add(this.animationService.end.subscribe(this.onAnimationEnd.bind(this)));
|
|
207
|
-
this._scrollableService.forElement(this.domService.nativeElement(this.anchor) || this.container.nativeElement).subscribe(this.onScroll.bind(this));
|
|
208
|
-
this.currentOffset = DEFAULT_OFFSET;
|
|
209
|
-
this.setZIndex();
|
|
210
|
-
this.copyFontStyles();
|
|
211
|
-
this.updateFixedClass();
|
|
212
|
-
this.reposition();
|
|
213
|
-
};
|
|
214
|
-
PopupComponent.prototype.ngOnChanges = function (changes) {
|
|
215
|
-
if (changes.copyAnchorStyles) {
|
|
216
|
-
this.copyFontStyles();
|
|
217
|
-
}
|
|
218
|
-
if (changes.positionMode) {
|
|
219
|
-
this.updateFixedClass();
|
|
220
|
-
}
|
|
221
|
-
};
|
|
222
|
-
PopupComponent.prototype.ngAfterViewInit = function () {
|
|
223
|
-
var _this = this;
|
|
224
|
-
if (!this.animate) {
|
|
225
|
-
this.resolvedPromise.then(function () {
|
|
226
|
-
_this.onAnimationEnd();
|
|
227
|
-
});
|
|
228
|
-
}
|
|
229
|
-
};
|
|
230
|
-
PopupComponent.prototype.ngAfterViewChecked = function () {
|
|
231
|
-
var _this = this;
|
|
232
|
-
if (this.initialCheck) {
|
|
233
|
-
this.initialCheck = false;
|
|
234
|
-
return;
|
|
235
|
-
}
|
|
236
|
-
this._zone.runOutsideAngular(function () {
|
|
237
|
-
// workarounds https://github.com/angular/angular/issues/19094
|
|
238
|
-
// uses promise because it is executed synchronously after the content is updated
|
|
239
|
-
// does not use onStable in case the current zone is not the angular one.
|
|
240
|
-
_this.unsubscribeReposition();
|
|
241
|
-
_this.repositionSubscription = from(_this.resolvedPromise)
|
|
242
|
-
.subscribe(_this.reposition);
|
|
243
|
-
});
|
|
244
|
-
};
|
|
245
|
-
PopupComponent.prototype.ngOnDestroy = function () {
|
|
246
|
-
this.anchorViewportLeave.complete();
|
|
247
|
-
this.positionChange.complete();
|
|
248
|
-
this.close.emit();
|
|
249
|
-
this.close.complete();
|
|
250
|
-
this._resizeService.unsubscribe();
|
|
251
|
-
this._scrollableService.unsubscribe();
|
|
252
|
-
this.animationSubscriptions.unsubscribe();
|
|
253
|
-
this.unsubscribeReposition();
|
|
254
|
-
};
|
|
255
|
-
/**
|
|
256
|
-
* @hidden
|
|
257
|
-
*/
|
|
258
|
-
PopupComponent.prototype.onResize = function () {
|
|
259
|
-
this.reposition();
|
|
260
|
-
};
|
|
261
|
-
PopupComponent.prototype.onAnimationStart = function () {
|
|
262
|
-
this._renderer.removeClass(this.container.nativeElement, 'k-animation-container-shown');
|
|
263
|
-
};
|
|
264
|
-
PopupComponent.prototype.onAnimationEnd = function () {
|
|
265
|
-
this._renderer.addClass(this.container.nativeElement, 'k-animation-container-shown');
|
|
266
|
-
this.open.emit();
|
|
267
|
-
this.open.complete();
|
|
268
|
-
};
|
|
269
|
-
Object.defineProperty(PopupComponent.prototype, "currentOffset", {
|
|
270
|
-
get: function () {
|
|
271
|
-
return this._currentOffset;
|
|
272
|
-
},
|
|
273
|
-
set: function (offset) {
|
|
274
|
-
this.setContainerStyle('left', offset.left + "px");
|
|
275
|
-
this.setContainerStyle('top', offset.top + "px");
|
|
276
|
-
this._currentOffset = offset;
|
|
277
|
-
},
|
|
278
|
-
enumerable: true,
|
|
279
|
-
configurable: true
|
|
280
|
-
});
|
|
281
|
-
PopupComponent.prototype.setZIndex = function () {
|
|
282
|
-
if (this.anchor) {
|
|
283
|
-
this.setContainerStyle('z-index', String(this.domService.zIndex(this.domService.nativeElement(this.anchor), this.container)));
|
|
284
|
-
}
|
|
285
|
-
};
|
|
286
|
-
PopupComponent.prototype.reposition = function () {
|
|
287
|
-
var _this = this;
|
|
288
|
-
if (!isDocumentAvailable()) {
|
|
289
|
-
return;
|
|
290
|
-
}
|
|
291
|
-
var _a = this.position(), flip = _a.flip, offset = _a.offset;
|
|
292
|
-
if (!this.currentOffset || isDifferentOffset(this.currentOffset, offset)) {
|
|
293
|
-
this.currentOffset = offset;
|
|
294
|
-
if (hasObservers(this.positionChange)) {
|
|
295
|
-
this._zone.run(function () { return _this.positionChange.emit({ offset: offset, flip: flip }); });
|
|
296
|
-
}
|
|
297
|
-
}
|
|
298
|
-
if (this.animate) {
|
|
299
|
-
this.animationService.play(this.contentContainer.nativeElement, this.animate, flip);
|
|
300
|
-
}
|
|
301
|
-
this.resizeSensor.acceptSize();
|
|
302
|
-
};
|
|
303
|
-
PopupComponent.prototype.position = function () {
|
|
304
|
-
var alignedOffset = this._alignService.alignElement({
|
|
305
|
-
anchor: this.domService.nativeElement(this.anchor),
|
|
306
|
-
anchorAlign: this.anchorAlign,
|
|
307
|
-
element: this.container,
|
|
308
|
-
elementAlign: this.popupAlign,
|
|
309
|
-
margin: this.margin,
|
|
310
|
-
offset: this.offset,
|
|
311
|
-
positionMode: this.positionMode
|
|
312
|
-
});
|
|
313
|
-
return this._positionService.positionElement({
|
|
314
|
-
anchor: this.domService.nativeElement(this.anchor),
|
|
315
|
-
anchorAlign: this.anchorAlign,
|
|
316
|
-
collisions: this.collision,
|
|
317
|
-
currentLocation: alignedOffset,
|
|
318
|
-
element: this.container,
|
|
319
|
-
elementAlign: this.popupAlign,
|
|
320
|
-
margin: this.margin
|
|
321
|
-
});
|
|
322
|
-
};
|
|
323
|
-
PopupComponent.prototype.onScroll = function (isInViewPort) {
|
|
324
|
-
var _this = this;
|
|
325
|
-
var hasLeaveObservers = hasObservers(this.anchorViewportLeave);
|
|
326
|
-
if (isInViewPort || !hasLeaveObservers) {
|
|
327
|
-
this.reposition();
|
|
328
|
-
}
|
|
329
|
-
else if (hasLeaveObservers) {
|
|
330
|
-
this._zone.run(function () {
|
|
331
|
-
_this.anchorViewportLeave.emit();
|
|
332
|
-
});
|
|
333
|
-
}
|
|
334
|
-
};
|
|
335
|
-
PopupComponent.prototype.copyFontStyles = function () {
|
|
336
|
-
var _this = this;
|
|
337
|
-
if (!this.anchor || !this.copyAnchorStyles) {
|
|
338
|
-
return;
|
|
339
|
-
}
|
|
340
|
-
this.domService.getFontStyles(this.domService.nativeElement(this.anchor))
|
|
341
|
-
.forEach(function (s) { return _this.setContainerStyle(s.key, s.value); });
|
|
342
|
-
};
|
|
343
|
-
PopupComponent.prototype.updateFixedClass = function () {
|
|
344
|
-
var action = this.positionMode === 'fixed' ? 'addClass' : 'removeClass';
|
|
345
|
-
this._renderer[action](this.container.nativeElement, ANIMATION_CONTAINER_FIXED);
|
|
346
|
-
};
|
|
347
|
-
PopupComponent.prototype.setContainerStyle = function (name, value) {
|
|
348
|
-
this._renderer.setStyle(this.container.nativeElement, name, value);
|
|
349
|
-
};
|
|
350
|
-
PopupComponent.prototype.unsubscribeReposition = function () {
|
|
351
|
-
if (this.repositionSubscription) {
|
|
352
|
-
this.repositionSubscription.unsubscribe();
|
|
353
|
-
}
|
|
354
|
-
};
|
|
355
|
-
tslib_1.__decorate([
|
|
356
|
-
Input(),
|
|
357
|
-
tslib_1.__metadata("design:type", Object)
|
|
358
|
-
], PopupComponent.prototype, "animate", void 0);
|
|
359
|
-
tslib_1.__decorate([
|
|
360
|
-
Input(),
|
|
361
|
-
tslib_1.__metadata("design:type", Object)
|
|
362
|
-
], PopupComponent.prototype, "anchor", void 0);
|
|
363
|
-
tslib_1.__decorate([
|
|
364
|
-
Input(),
|
|
365
|
-
tslib_1.__metadata("design:type", Object)
|
|
366
|
-
], PopupComponent.prototype, "anchorAlign", void 0);
|
|
367
|
-
tslib_1.__decorate([
|
|
368
|
-
Input(),
|
|
369
|
-
tslib_1.__metadata("design:type", Object)
|
|
370
|
-
], PopupComponent.prototype, "collision", void 0);
|
|
371
|
-
tslib_1.__decorate([
|
|
372
|
-
Input(),
|
|
373
|
-
tslib_1.__metadata("design:type", Object)
|
|
374
|
-
], PopupComponent.prototype, "popupAlign", void 0);
|
|
375
|
-
tslib_1.__decorate([
|
|
376
|
-
Input(),
|
|
377
|
-
tslib_1.__metadata("design:type", Boolean)
|
|
378
|
-
], PopupComponent.prototype, "copyAnchorStyles", void 0);
|
|
379
|
-
tslib_1.__decorate([
|
|
380
|
-
Input(),
|
|
381
|
-
tslib_1.__metadata("design:type", Object)
|
|
382
|
-
], PopupComponent.prototype, "popupClass", void 0);
|
|
383
|
-
tslib_1.__decorate([
|
|
384
|
-
Input(),
|
|
385
|
-
tslib_1.__metadata("design:type", String)
|
|
386
|
-
], PopupComponent.prototype, "positionMode", void 0);
|
|
387
|
-
tslib_1.__decorate([
|
|
388
|
-
Input(),
|
|
389
|
-
tslib_1.__metadata("design:type", Object)
|
|
390
|
-
], PopupComponent.prototype, "offset", void 0);
|
|
391
|
-
tslib_1.__decorate([
|
|
392
|
-
Input(),
|
|
393
|
-
tslib_1.__metadata("design:type", Object)
|
|
394
|
-
], PopupComponent.prototype, "margin", void 0);
|
|
395
|
-
tslib_1.__decorate([
|
|
396
|
-
Output(),
|
|
397
|
-
tslib_1.__metadata("design:type", EventEmitter)
|
|
398
|
-
], PopupComponent.prototype, "anchorViewportLeave", void 0);
|
|
399
|
-
tslib_1.__decorate([
|
|
400
|
-
Output(),
|
|
401
|
-
tslib_1.__metadata("design:type", EventEmitter)
|
|
402
|
-
], PopupComponent.prototype, "close", void 0);
|
|
403
|
-
tslib_1.__decorate([
|
|
404
|
-
Output(),
|
|
405
|
-
tslib_1.__metadata("design:type", EventEmitter)
|
|
406
|
-
], PopupComponent.prototype, "open", void 0);
|
|
407
|
-
tslib_1.__decorate([
|
|
408
|
-
Output(),
|
|
409
|
-
tslib_1.__metadata("design:type", EventEmitter)
|
|
410
|
-
], PopupComponent.prototype, "positionChange", void 0);
|
|
411
|
-
tslib_1.__decorate([
|
|
412
|
-
ViewChild('container', { static: true }),
|
|
413
|
-
tslib_1.__metadata("design:type", ElementRef)
|
|
414
|
-
], PopupComponent.prototype, "contentContainer", void 0);
|
|
415
|
-
tslib_1.__decorate([
|
|
416
|
-
ViewChild(ResizeSensorComponent, { static: true }),
|
|
417
|
-
tslib_1.__metadata("design:type", ResizeSensorComponent)
|
|
418
|
-
], PopupComponent.prototype, "resizeSensor", void 0);
|
|
419
|
-
PopupComponent = tslib_1.__decorate([
|
|
420
|
-
Component({
|
|
421
|
-
exportAs: 'kendo-popup',
|
|
422
|
-
providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService],
|
|
423
|
-
selector: 'kendo-popup',
|
|
424
|
-
template: "\n <div class=\"k-popup\" [ngClass]=\"popupClass\" #container>\n <ng-content></ng-content>\n <ng-template [ngTemplateOutlet]=\"content\" [ngIf]=\"content\"></ng-template>\n <kendo-resize-sensor [rateLimit]=\"100\" (resize)=\"onResize()\">\n </kendo-resize-sensor>\n </div>\n "
|
|
425
|
-
}),
|
|
426
|
-
tslib_1.__metadata("design:paramtypes", [ElementRef,
|
|
427
|
-
AlignService,
|
|
428
|
-
DOMService,
|
|
429
|
-
PositionService,
|
|
430
|
-
ResizeService,
|
|
431
|
-
ScrollableService,
|
|
432
|
-
AnimationService,
|
|
433
|
-
Renderer2,
|
|
434
|
-
NgZone])
|
|
435
|
-
], PopupComponent);
|
|
436
|
-
return PopupComponent;
|
|
437
|
-
}());
|
|
438
|
-
export { PopupComponent };
|
package/dist/es/popup.module.js
DELETED
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import * as tslib_1 from "tslib";
|
|
6
|
-
import { NgModule } from '@angular/core';
|
|
7
|
-
import { CommonModule } from '@angular/common';
|
|
8
|
-
import { PopupComponent } from './popup.component';
|
|
9
|
-
import { ResizeSensorModule } from '@progress/kendo-angular-common';
|
|
10
|
-
import { PopupService } from './popup.service';
|
|
11
|
-
var POPUP_DIRECTIVES = [PopupComponent];
|
|
12
|
-
/**
|
|
13
|
-
* Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
|
|
14
|
-
* definition for the Popup component.
|
|
15
|
-
*
|
|
16
|
-
* @example
|
|
17
|
-
*
|
|
18
|
-
* ```ts-no-run
|
|
19
|
-
* // Import the Popup module
|
|
20
|
-
* import { PopupModule } from '@progress/kendo-angular-popup';
|
|
21
|
-
*
|
|
22
|
-
* // The browser platform with a compiler
|
|
23
|
-
* import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
|
24
|
-
*
|
|
25
|
-
* import { NgModule } from '@angular/core';
|
|
26
|
-
*
|
|
27
|
-
* // Import the app component
|
|
28
|
-
* import { AppComponent } from './app.component';
|
|
29
|
-
*
|
|
30
|
-
* // Define the app module
|
|
31
|
-
* _@NgModule({
|
|
32
|
-
* declarations: [AppComponent], // declare app component
|
|
33
|
-
* imports: [BrowserModule, PopupModule], // import Popup module
|
|
34
|
-
* bootstrap: [AppComponent]
|
|
35
|
-
* })
|
|
36
|
-
* export class AppModule {}
|
|
37
|
-
*
|
|
38
|
-
* // Compile and launch the module
|
|
39
|
-
* platformBrowserDynamic().bootstrapModule(AppModule);
|
|
40
|
-
*
|
|
41
|
-
* ```
|
|
42
|
-
*/
|
|
43
|
-
var PopupModule = /** @class */ (function () {
|
|
44
|
-
function PopupModule() {
|
|
45
|
-
}
|
|
46
|
-
PopupModule = tslib_1.__decorate([
|
|
47
|
-
NgModule({
|
|
48
|
-
declarations: [POPUP_DIRECTIVES],
|
|
49
|
-
entryComponents: [POPUP_DIRECTIVES],
|
|
50
|
-
exports: [POPUP_DIRECTIVES],
|
|
51
|
-
imports: [CommonModule, ResizeSensorModule],
|
|
52
|
-
providers: [PopupService]
|
|
53
|
-
})
|
|
54
|
-
], PopupModule);
|
|
55
|
-
return PopupModule;
|
|
56
|
-
}());
|
|
57
|
-
export { PopupModule };
|