@progress/kendo-angular-popup 4.0.6-dev.202203161114 → 5.0.0-dev.202204191152
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 +30 -97
- 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
|
@@ -2,25 +2,43 @@
|
|
|
2
2
|
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
5
|
+
import * as i0 from '@angular/core';
|
|
6
|
+
import { InjectionToken, Injectable, Inject, Optional, EventEmitter, isDevMode, Component, Input, Output, ViewChild, TemplateRef, NgModule } from '@angular/core';
|
|
7
7
|
import { siblingContainer, parents, addScroll, align, boundingOffset, offset, positionWithScroll, removeScroll, restrictToView, scrollPosition, getWindowViewPort } from '@progress/kendo-popup-common';
|
|
8
|
+
import * as i7 from '@progress/kendo-angular-common';
|
|
8
9
|
import { isDocumentAvailable, hasObservers, ResizeSensorComponent, ResizeSensorModule } from '@progress/kendo-angular-common';
|
|
9
10
|
import { fromEvent, merge, from } from 'rxjs';
|
|
10
11
|
import { auditTime } from 'rxjs/operators';
|
|
11
|
-
import
|
|
12
|
+
import * as i1 from '@angular/animations';
|
|
13
|
+
import { style, animate } from '@angular/animations';
|
|
12
14
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
15
|
+
import * as i8 from '@angular/common';
|
|
13
16
|
import { CommonModule } from '@angular/common';
|
|
14
17
|
|
|
15
18
|
/**
|
|
16
19
|
* @hidden
|
|
17
20
|
*/
|
|
18
|
-
const eitherRect = (rect, offset
|
|
21
|
+
const eitherRect = (rect, offset) => {
|
|
19
22
|
if (!rect) {
|
|
20
|
-
return { height: 0, left: offset
|
|
23
|
+
return { height: 0, left: offset.left, top: offset.top, width: 0 };
|
|
21
24
|
}
|
|
22
25
|
return rect;
|
|
23
26
|
};
|
|
27
|
+
/**
|
|
28
|
+
* @hidden
|
|
29
|
+
*/
|
|
30
|
+
const replaceOffset = (rect, offset) => {
|
|
31
|
+
if (!offset) {
|
|
32
|
+
return rect;
|
|
33
|
+
}
|
|
34
|
+
const result = {
|
|
35
|
+
height: rect.height,
|
|
36
|
+
left: offset.left,
|
|
37
|
+
top: offset.top,
|
|
38
|
+
width: rect.width
|
|
39
|
+
};
|
|
40
|
+
return result;
|
|
41
|
+
};
|
|
24
42
|
/**
|
|
25
43
|
* @hidden
|
|
26
44
|
*/
|
|
@@ -50,6 +68,10 @@ const isDifferentOffset = (oldOffset, newOffset) => {
|
|
|
50
68
|
const isWindowAvailable = () => {
|
|
51
69
|
return typeof window !== 'undefined';
|
|
52
70
|
};
|
|
71
|
+
/**
|
|
72
|
+
* @hidden
|
|
73
|
+
*/
|
|
74
|
+
const hasBoundingRect = (elem) => !!elem.getBoundingClientRect;
|
|
53
75
|
/**
|
|
54
76
|
* @hidden
|
|
55
77
|
*/
|
|
@@ -98,7 +120,10 @@ function memoize(fun) {
|
|
|
98
120
|
return result;
|
|
99
121
|
};
|
|
100
122
|
}
|
|
101
|
-
|
|
123
|
+
/**
|
|
124
|
+
* @hidden
|
|
125
|
+
*/
|
|
126
|
+
const hasRelativeStackingContext = memoize(() => {
|
|
102
127
|
if (!isDocumentAvailable() && document.body !== null) {
|
|
103
128
|
return false;
|
|
104
129
|
}
|
|
@@ -110,11 +135,7 @@ const ɵ3 = () => {
|
|
|
110
135
|
const isDifferent = parent.children[0].getBoundingClientRect().top !== top;
|
|
111
136
|
document.body.removeChild(parent);
|
|
112
137
|
return isDifferent;
|
|
113
|
-
};
|
|
114
|
-
/**
|
|
115
|
-
* @hidden
|
|
116
|
-
*/
|
|
117
|
-
const hasRelativeStackingContext = memoize(ɵ3);
|
|
138
|
+
});
|
|
118
139
|
/**
|
|
119
140
|
* @hidden
|
|
120
141
|
*/
|
|
@@ -148,6 +169,23 @@ const scaleRect = (rect, scale) => {
|
|
|
148
169
|
};
|
|
149
170
|
};
|
|
150
171
|
|
|
172
|
+
/**
|
|
173
|
+
* Used to set the document scale when using a [scale transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale).
|
|
174
|
+
*
|
|
175
|
+
* 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 %}).
|
|
176
|
+
*
|
|
177
|
+
* > Using this token is not necessary for user-applied browser zoom.
|
|
178
|
+
*
|
|
179
|
+
* {% meta height:300 %}
|
|
180
|
+
* {% embed_file scale/app.component.ts preview %}
|
|
181
|
+
* {% embed_file shared/app.module.ts %}
|
|
182
|
+
* {% embed_file shared/main.ts %}
|
|
183
|
+
* {% endmeta %}
|
|
184
|
+
*
|
|
185
|
+
*
|
|
186
|
+
*/
|
|
187
|
+
const SCALE = new InjectionToken('Popup Document Scale');
|
|
188
|
+
|
|
151
189
|
const STYLES = [
|
|
152
190
|
'font-size',
|
|
153
191
|
'font-family',
|
|
@@ -159,7 +197,7 @@ const STYLES = [
|
|
|
159
197
|
/**
|
|
160
198
|
* @hidden
|
|
161
199
|
*/
|
|
162
|
-
|
|
200
|
+
class DOMService {
|
|
163
201
|
addOffset(current, addition) {
|
|
164
202
|
return {
|
|
165
203
|
left: current.left + addition.left,
|
|
@@ -211,7 +249,7 @@ let DOMService = class DOMService {
|
|
|
211
249
|
element.style.left = left;
|
|
212
250
|
element.style.top = top;
|
|
213
251
|
// prevents elements with transition to be animated because of the change
|
|
214
|
-
//
|
|
252
|
+
// eslint-disable-next-line no-unused-expressions
|
|
215
253
|
element.offsetHeight;
|
|
216
254
|
element.style.transition = transition;
|
|
217
255
|
return currentOffset;
|
|
@@ -288,41 +326,26 @@ let DOMService = class DOMService {
|
|
|
288
326
|
isZoomed() {
|
|
289
327
|
return this.zoomLevel() > 1;
|
|
290
328
|
}
|
|
291
|
-
}
|
|
292
|
-
DOMService =
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
* Used to set the document scale when using a [scale transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale).
|
|
298
|
-
*
|
|
299
|
-
* 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 %}).
|
|
300
|
-
*
|
|
301
|
-
* > Using this token is not necessary for user-applied browser zoom.
|
|
302
|
-
*
|
|
303
|
-
* {% meta height:300 %}
|
|
304
|
-
* {% embed_file scale/app.component.ts preview %}
|
|
305
|
-
* {% embed_file shared/app.module.ts %}
|
|
306
|
-
* {% embed_file shared/main.ts %}
|
|
307
|
-
* {% endmeta %}
|
|
308
|
-
*
|
|
309
|
-
*
|
|
310
|
-
*/
|
|
311
|
-
const SCALE = new InjectionToken('Popup Document Scale');
|
|
329
|
+
}
|
|
330
|
+
DOMService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DOMService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
331
|
+
DOMService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DOMService });
|
|
332
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DOMService, decorators: [{
|
|
333
|
+
type: Injectable
|
|
334
|
+
}] });
|
|
312
335
|
|
|
313
336
|
/**
|
|
314
337
|
* @hidden
|
|
315
338
|
*/
|
|
316
|
-
|
|
339
|
+
class AlignService {
|
|
317
340
|
constructor(_dom, scale = 1) {
|
|
318
341
|
this._dom = _dom;
|
|
319
342
|
this.scale = scale;
|
|
320
343
|
}
|
|
321
344
|
alignElement(settings) {
|
|
322
|
-
const { anchor, element, anchorAlign, elementAlign, margin, offset
|
|
345
|
+
const { anchor, element, anchorAlign, elementAlign, margin, offset, positionMode } = settings;
|
|
323
346
|
const scale = this.scale || 1;
|
|
324
347
|
const fixedMode = positionMode === 'fixed' || !this._dom.hasOffsetParent(element);
|
|
325
|
-
const anchorRect = fixedMode ? this.absoluteRect(anchor, element, offset
|
|
348
|
+
const anchorRect = fixedMode ? this.absoluteRect(anchor, element, offset, scale) : this.relativeRect(anchor, element, offset, scale);
|
|
326
349
|
const elementRect = scaleRect(this._dom.offset(element.nativeElement), scale);
|
|
327
350
|
const result = this._dom.align({
|
|
328
351
|
anchorAlign: anchorAlign,
|
|
@@ -333,9 +356,9 @@ let AlignService = class AlignService {
|
|
|
333
356
|
});
|
|
334
357
|
return result;
|
|
335
358
|
}
|
|
336
|
-
absoluteRect(anchor, element, offset
|
|
359
|
+
absoluteRect(anchor, element, offset, scale) {
|
|
337
360
|
const scrollPos = this.elementScrollPosition(anchor, element);
|
|
338
|
-
const rect = eitherRect(this._dom.offset(anchor), offset
|
|
361
|
+
const rect = eitherRect(this._dom.offset(anchor), offset);
|
|
339
362
|
const stackScale = 2 * scale;
|
|
340
363
|
const stackScroll = this._dom.stackingElementScroll(element);
|
|
341
364
|
if (scale !== 1 && stackScroll) {
|
|
@@ -352,21 +375,26 @@ let AlignService = class AlignService {
|
|
|
352
375
|
elementScrollPosition(anchor, element) {
|
|
353
376
|
return anchor ? { x: 0, y: 0 } : this._dom.scrollPosition(element);
|
|
354
377
|
}
|
|
355
|
-
relativeRect(anchor, element, offset
|
|
356
|
-
const rect = eitherRect(this._dom.position(anchor, element, scale), offset
|
|
378
|
+
relativeRect(anchor, element, offset, scale) {
|
|
379
|
+
const rect = eitherRect(this._dom.position(anchor, element, scale), offset);
|
|
357
380
|
return scaleRect(rect, scale);
|
|
358
381
|
}
|
|
359
|
-
}
|
|
360
|
-
AlignService =
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
],
|
|
382
|
+
}
|
|
383
|
+
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 });
|
|
384
|
+
AlignService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AlignService });
|
|
385
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AlignService, decorators: [{
|
|
386
|
+
type: Injectable
|
|
387
|
+
}], ctorParameters: function () { return [{ type: DOMService }, { type: undefined, decorators: [{
|
|
388
|
+
type: Inject,
|
|
389
|
+
args: [SCALE]
|
|
390
|
+
}, {
|
|
391
|
+
type: Optional
|
|
392
|
+
}] }]; } });
|
|
365
393
|
|
|
366
394
|
/**
|
|
367
395
|
* @hidden
|
|
368
396
|
*/
|
|
369
|
-
|
|
397
|
+
class PositionService {
|
|
370
398
|
constructor(_dom, scale = 1) {
|
|
371
399
|
this._dom = _dom;
|
|
372
400
|
this.scale = scale;
|
|
@@ -391,24 +419,29 @@ let PositionService = class PositionService {
|
|
|
391
419
|
margin,
|
|
392
420
|
viewPort
|
|
393
421
|
});
|
|
394
|
-
const offset
|
|
422
|
+
const offset = dom.addOffset(currentLocation, result.offset);
|
|
395
423
|
return {
|
|
396
424
|
flip: result.flip,
|
|
397
425
|
flipped: result.flipped,
|
|
398
|
-
offset: offset
|
|
426
|
+
offset: offset
|
|
399
427
|
};
|
|
400
428
|
}
|
|
401
|
-
}
|
|
402
|
-
PositionService =
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
],
|
|
429
|
+
}
|
|
430
|
+
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 });
|
|
431
|
+
PositionService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PositionService });
|
|
432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PositionService, decorators: [{
|
|
433
|
+
type: Injectable
|
|
434
|
+
}], ctorParameters: function () { return [{ type: DOMService }, { type: undefined, decorators: [{
|
|
435
|
+
type: Inject,
|
|
436
|
+
args: [SCALE]
|
|
437
|
+
}, {
|
|
438
|
+
type: Optional
|
|
439
|
+
}] }]; } });
|
|
407
440
|
|
|
408
441
|
/**
|
|
409
442
|
* @hidden
|
|
410
443
|
*/
|
|
411
|
-
|
|
444
|
+
class ResizeService {
|
|
412
445
|
constructor(_dom, _zone) {
|
|
413
446
|
this._dom = _dom;
|
|
414
447
|
this._zone = _zone;
|
|
@@ -432,11 +465,12 @@ let ResizeService = class ResizeService {
|
|
|
432
465
|
isUnsubscribed() {
|
|
433
466
|
return this.subscription && this.subscription.closed;
|
|
434
467
|
}
|
|
435
|
-
}
|
|
436
|
-
ResizeService =
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
468
|
+
}
|
|
469
|
+
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 });
|
|
470
|
+
ResizeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ResizeService });
|
|
471
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ResizeService, decorators: [{
|
|
472
|
+
type: Injectable
|
|
473
|
+
}], ctorParameters: function () { return [{ type: DOMService }, { type: i0.NgZone }]; } });
|
|
440
474
|
|
|
441
475
|
/**
|
|
442
476
|
* @hidden
|
|
@@ -445,7 +479,7 @@ const THRESHOLD_DIFF = 1;
|
|
|
445
479
|
/**
|
|
446
480
|
* @hidden
|
|
447
481
|
*/
|
|
448
|
-
|
|
482
|
+
class ScrollableService {
|
|
449
483
|
constructor(_dom, _zone) {
|
|
450
484
|
this._dom = _dom;
|
|
451
485
|
this._zone = _zone;
|
|
@@ -459,12 +493,12 @@ let ScrollableService = class ScrollableService {
|
|
|
459
493
|
if (!callback || !isDocumentAvailable() || !this.element) {
|
|
460
494
|
return;
|
|
461
495
|
}
|
|
462
|
-
const parents
|
|
496
|
+
const parents = this._dom.scrollableParents(this.element);
|
|
463
497
|
this._zone.runOutsideAngular(() => {
|
|
464
|
-
const observables = parents
|
|
498
|
+
const observables = parents.map(p => fromEvent(p, "scroll").pipe(auditTime(FRAME_DURATION)));
|
|
465
499
|
const subscriber = (e) => {
|
|
466
500
|
const target = e.target;
|
|
467
|
-
const isParent = parents
|
|
501
|
+
const isParent = parents.filter(p => p === target).length > 0;
|
|
468
502
|
const isDocument = target === document;
|
|
469
503
|
const isWindow = target === window;
|
|
470
504
|
if (isParent || isDocument || isWindow) {
|
|
@@ -497,11 +531,12 @@ let ScrollableService = class ScrollableService {
|
|
|
497
531
|
}
|
|
498
532
|
return true;
|
|
499
533
|
}
|
|
500
|
-
}
|
|
501
|
-
ScrollableService =
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
534
|
+
}
|
|
535
|
+
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 });
|
|
536
|
+
ScrollableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollableService });
|
|
537
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollableService, decorators: [{
|
|
538
|
+
type: Injectable
|
|
539
|
+
}], ctorParameters: function () { return [{ type: DOMService }, { type: i0.NgZone }]; } });
|
|
505
540
|
|
|
506
541
|
const LEFT = 'left';
|
|
507
542
|
const RIGHT = 'right';
|
|
@@ -510,7 +545,6 @@ const UP = 'up';
|
|
|
510
545
|
const DEFAULT_TYPE = 'slide';
|
|
511
546
|
const DEFAULT_DURATION = 100;
|
|
512
547
|
const animationTypes = {};
|
|
513
|
-
/* tslint:disable:object-literal-sort-keys */
|
|
514
548
|
animationTypes.expand = (direction) => {
|
|
515
549
|
const scale = direction === UP || direction === DOWN ? 'scaleY' : 'scaleX';
|
|
516
550
|
const startScale = 0;
|
|
@@ -559,7 +593,7 @@ animationTypes.zoom = () => {
|
|
|
559
593
|
/**
|
|
560
594
|
* @hidden
|
|
561
595
|
*/
|
|
562
|
-
|
|
596
|
+
class AnimationService {
|
|
563
597
|
constructor(animationBuilder) {
|
|
564
598
|
this.animationBuilder = animationBuilder;
|
|
565
599
|
this.start = new EventEmitter();
|
|
@@ -625,11 +659,12 @@ let AnimationService = class AnimationService {
|
|
|
625
659
|
this.player = null;
|
|
626
660
|
}
|
|
627
661
|
}
|
|
628
|
-
}
|
|
629
|
-
AnimationService =
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
662
|
+
}
|
|
663
|
+
AnimationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AnimationService, deps: [{ token: i1.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
664
|
+
AnimationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AnimationService });
|
|
665
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AnimationService, decorators: [{
|
|
666
|
+
type: Injectable
|
|
667
|
+
}], ctorParameters: function () { return [{ type: i1.AnimationBuilder }]; } });
|
|
633
668
|
|
|
634
669
|
/**
|
|
635
670
|
* @hidden
|
|
@@ -638,7 +673,7 @@ const packageMetadata = {
|
|
|
638
673
|
name: '@progress/kendo-angular-popup',
|
|
639
674
|
productName: 'Kendo UI for Angular',
|
|
640
675
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
641
|
-
publishDate:
|
|
676
|
+
publishDate: 1650369128,
|
|
642
677
|
version: '',
|
|
643
678
|
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'
|
|
644
679
|
};
|
|
@@ -665,7 +700,7 @@ const ANIMATION_CONTAINER_FIXED = 'k-animation-container-fixed';
|
|
|
665
700
|
* }
|
|
666
701
|
* ```
|
|
667
702
|
*/
|
|
668
|
-
|
|
703
|
+
class PopupComponent {
|
|
669
704
|
constructor(container, _alignService, domService, _positionService, _resizeService, _scrollableService, animationService, _renderer, _zone) {
|
|
670
705
|
this.container = container;
|
|
671
706
|
this._alignService = _alignService;
|
|
@@ -895,10 +930,10 @@ let PopupComponent = class PopupComponent {
|
|
|
895
930
|
get currentOffset() {
|
|
896
931
|
return this._currentOffset;
|
|
897
932
|
}
|
|
898
|
-
set currentOffset(offset
|
|
899
|
-
this.setContainerStyle('left', `${offset
|
|
900
|
-
this.setContainerStyle('top', `${offset
|
|
901
|
-
this._currentOffset = offset
|
|
933
|
+
set currentOffset(offset) {
|
|
934
|
+
this.setContainerStyle('left', `${offset.left}px`);
|
|
935
|
+
this.setContainerStyle('top', `${offset.top}px`);
|
|
936
|
+
this._currentOffset = offset;
|
|
902
937
|
}
|
|
903
938
|
setZIndex() {
|
|
904
939
|
if (this.anchor) {
|
|
@@ -909,11 +944,11 @@ let PopupComponent = class PopupComponent {
|
|
|
909
944
|
if (!isDocumentAvailable()) {
|
|
910
945
|
return;
|
|
911
946
|
}
|
|
912
|
-
const { flip, offset
|
|
913
|
-
if (!this.currentOffset || isDifferentOffset(this.currentOffset, offset
|
|
914
|
-
this.currentOffset = offset
|
|
947
|
+
const { flip, offset } = this.position();
|
|
948
|
+
if (!this.currentOffset || isDifferentOffset(this.currentOffset, offset)) {
|
|
949
|
+
this.currentOffset = offset;
|
|
915
950
|
if (hasObservers(this.positionChange)) {
|
|
916
|
-
this._zone.run(() => this.positionChange.emit({ offset
|
|
951
|
+
this._zone.run(() => this.positionChange.emit({ offset, flip }));
|
|
917
952
|
}
|
|
918
953
|
}
|
|
919
954
|
if (this.animate) {
|
|
@@ -971,77 +1006,23 @@ let PopupComponent = class PopupComponent {
|
|
|
971
1006
|
this.repositionSubscription.unsubscribe();
|
|
972
1007
|
}
|
|
973
1008
|
}
|
|
974
|
-
}
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
__decorate([
|
|
992
|
-
Input(),
|
|
993
|
-
__metadata("design:type", Object)
|
|
994
|
-
], PopupComponent.prototype, "popupAlign", void 0);
|
|
995
|
-
__decorate([
|
|
996
|
-
Input(),
|
|
997
|
-
__metadata("design:type", Boolean)
|
|
998
|
-
], PopupComponent.prototype, "copyAnchorStyles", void 0);
|
|
999
|
-
__decorate([
|
|
1000
|
-
Input(),
|
|
1001
|
-
__metadata("design:type", Object)
|
|
1002
|
-
], PopupComponent.prototype, "popupClass", void 0);
|
|
1003
|
-
__decorate([
|
|
1004
|
-
Input(),
|
|
1005
|
-
__metadata("design:type", String)
|
|
1006
|
-
], PopupComponent.prototype, "positionMode", void 0);
|
|
1007
|
-
__decorate([
|
|
1008
|
-
Input(),
|
|
1009
|
-
__metadata("design:type", Object)
|
|
1010
|
-
], PopupComponent.prototype, "offset", void 0);
|
|
1011
|
-
__decorate([
|
|
1012
|
-
Input(),
|
|
1013
|
-
__metadata("design:type", Object)
|
|
1014
|
-
], PopupComponent.prototype, "margin", void 0);
|
|
1015
|
-
__decorate([
|
|
1016
|
-
Output(),
|
|
1017
|
-
__metadata("design:type", EventEmitter)
|
|
1018
|
-
], PopupComponent.prototype, "anchorViewportLeave", void 0);
|
|
1019
|
-
__decorate([
|
|
1020
|
-
Output(),
|
|
1021
|
-
__metadata("design:type", EventEmitter)
|
|
1022
|
-
], PopupComponent.prototype, "close", void 0);
|
|
1023
|
-
__decorate([
|
|
1024
|
-
Output(),
|
|
1025
|
-
__metadata("design:type", EventEmitter)
|
|
1026
|
-
], PopupComponent.prototype, "open", void 0);
|
|
1027
|
-
__decorate([
|
|
1028
|
-
Output(),
|
|
1029
|
-
__metadata("design:type", EventEmitter)
|
|
1030
|
-
], PopupComponent.prototype, "positionChange", void 0);
|
|
1031
|
-
__decorate([
|
|
1032
|
-
ViewChild('container', { static: true }),
|
|
1033
|
-
__metadata("design:type", ElementRef)
|
|
1034
|
-
], PopupComponent.prototype, "contentContainer", void 0);
|
|
1035
|
-
__decorate([
|
|
1036
|
-
ViewChild(ResizeSensorComponent, { static: true }),
|
|
1037
|
-
__metadata("design:type", ResizeSensorComponent)
|
|
1038
|
-
], PopupComponent.prototype, "resizeSensor", void 0);
|
|
1039
|
-
PopupComponent = __decorate([
|
|
1040
|
-
Component({
|
|
1041
|
-
exportAs: 'kendo-popup',
|
|
1042
|
-
providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService],
|
|
1043
|
-
selector: 'kendo-popup',
|
|
1044
|
-
template: `
|
|
1009
|
+
}
|
|
1010
|
+
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 });
|
|
1011
|
+
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: `
|
|
1012
|
+
<div class="k-popup" [ngClass]="popupClass" #container>
|
|
1013
|
+
<ng-content></ng-content>
|
|
1014
|
+
<ng-template [ngTemplateOutlet]="content" [ngIf]="content"></ng-template>
|
|
1015
|
+
<kendo-resize-sensor [rateLimit]="100" (resize)="onResize()">
|
|
1016
|
+
</kendo-resize-sensor>
|
|
1017
|
+
</div>
|
|
1018
|
+
`, 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"] }] });
|
|
1019
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupComponent, decorators: [{
|
|
1020
|
+
type: Component,
|
|
1021
|
+
args: [{
|
|
1022
|
+
exportAs: 'kendo-popup',
|
|
1023
|
+
providers: [AlignService, AnimationService, DOMService, PositionService, ResizeService, ScrollableService],
|
|
1024
|
+
selector: 'kendo-popup',
|
|
1025
|
+
template: `
|
|
1045
1026
|
<div class="k-popup" [ngClass]="popupClass" #container>
|
|
1046
1027
|
<ng-content></ng-content>
|
|
1047
1028
|
<ng-template [ngTemplateOutlet]="content" [ngIf]="content"></ng-template>
|
|
@@ -1049,17 +1030,42 @@ PopupComponent = __decorate([
|
|
|
1049
1030
|
</kendo-resize-sensor>
|
|
1050
1031
|
</div>
|
|
1051
1032
|
`
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
|
|
1033
|
+
}]
|
|
1034
|
+
}], 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: [{
|
|
1035
|
+
type: Input
|
|
1036
|
+
}], anchor: [{
|
|
1037
|
+
type: Input
|
|
1038
|
+
}], anchorAlign: [{
|
|
1039
|
+
type: Input
|
|
1040
|
+
}], collision: [{
|
|
1041
|
+
type: Input
|
|
1042
|
+
}], popupAlign: [{
|
|
1043
|
+
type: Input
|
|
1044
|
+
}], copyAnchorStyles: [{
|
|
1045
|
+
type: Input
|
|
1046
|
+
}], popupClass: [{
|
|
1047
|
+
type: Input
|
|
1048
|
+
}], positionMode: [{
|
|
1049
|
+
type: Input
|
|
1050
|
+
}], offset: [{
|
|
1051
|
+
type: Input
|
|
1052
|
+
}], margin: [{
|
|
1053
|
+
type: Input
|
|
1054
|
+
}], anchorViewportLeave: [{
|
|
1055
|
+
type: Output
|
|
1056
|
+
}], close: [{
|
|
1057
|
+
type: Output
|
|
1058
|
+
}], open: [{
|
|
1059
|
+
type: Output
|
|
1060
|
+
}], positionChange: [{
|
|
1061
|
+
type: Output
|
|
1062
|
+
}], contentContainer: [{
|
|
1063
|
+
type: ViewChild,
|
|
1064
|
+
args: ['container', { static: true }]
|
|
1065
|
+
}], resizeSensor: [{
|
|
1066
|
+
type: ViewChild,
|
|
1067
|
+
args: [ResizeSensorComponent, { static: true }]
|
|
1068
|
+
}] } });
|
|
1063
1069
|
|
|
1064
1070
|
const removeElement = (element) => {
|
|
1065
1071
|
if (element && element.parentNode) {
|
|
@@ -1113,7 +1119,7 @@ const POPUP_CONTAINER = new InjectionToken('Popup Container');
|
|
|
1113
1119
|
* @export
|
|
1114
1120
|
* @class PopupService
|
|
1115
1121
|
*/
|
|
1116
|
-
|
|
1122
|
+
class PopupService {
|
|
1117
1123
|
constructor(applicationRef, componentFactoryResolver, injector, container) {
|
|
1118
1124
|
this.applicationRef = applicationRef;
|
|
1119
1125
|
this.componentFactoryResolver = componentFactoryResolver;
|
|
@@ -1289,15 +1295,17 @@ let PopupService = class PopupService {
|
|
|
1289
1295
|
]
|
|
1290
1296
|
};
|
|
1291
1297
|
}
|
|
1292
|
-
}
|
|
1293
|
-
PopupService =
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
ComponentFactoryResolver,
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1298
|
+
}
|
|
1299
|
+
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 });
|
|
1300
|
+
PopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupService });
|
|
1301
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupService, decorators: [{
|
|
1302
|
+
type: Injectable
|
|
1303
|
+
}], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.ElementRef, decorators: [{
|
|
1304
|
+
type: Inject,
|
|
1305
|
+
args: [POPUP_CONTAINER]
|
|
1306
|
+
}, {
|
|
1307
|
+
type: Optional
|
|
1308
|
+
}] }]; } });
|
|
1301
1309
|
|
|
1302
1310
|
const POPUP_DIRECTIVES = [PopupComponent];
|
|
1303
1311
|
/**
|
|
@@ -1331,20 +1339,25 @@ const POPUP_DIRECTIVES = [PopupComponent];
|
|
|
1331
1339
|
*
|
|
1332
1340
|
* ```
|
|
1333
1341
|
*/
|
|
1334
|
-
|
|
1335
|
-
}
|
|
1336
|
-
PopupModule =
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
],
|
|
1342
|
+
class PopupModule {
|
|
1343
|
+
}
|
|
1344
|
+
PopupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1345
|
+
PopupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, declarations: [PopupComponent], imports: [CommonModule, ResizeSensorModule], exports: [PopupComponent] });
|
|
1346
|
+
PopupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, providers: [PopupService], imports: [[CommonModule, ResizeSensorModule]] });
|
|
1347
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PopupModule, decorators: [{
|
|
1348
|
+
type: NgModule,
|
|
1349
|
+
args: [{
|
|
1350
|
+
declarations: [POPUP_DIRECTIVES],
|
|
1351
|
+
entryComponents: [POPUP_DIRECTIVES],
|
|
1352
|
+
exports: [POPUP_DIRECTIVES],
|
|
1353
|
+
imports: [CommonModule, ResizeSensorModule],
|
|
1354
|
+
providers: [PopupService]
|
|
1355
|
+
}]
|
|
1356
|
+
}] });
|
|
1345
1357
|
|
|
1346
1358
|
/**
|
|
1347
1359
|
* Generated bundle index. Do not edit.
|
|
1348
1360
|
*/
|
|
1349
1361
|
|
|
1350
|
-
export {
|
|
1362
|
+
export { POPUP_CONTAINER, PopupComponent, PopupModule, PopupService, SCALE };
|
|
1363
|
+
|
|
@@ -0,0 +1,9 @@
|
|
|
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
|
+
* Generated bundle index. Do not edit.
|
|
7
|
+
*/
|
|
8
|
+
/// <amd-module name="@progress/kendo-angular-popup" />
|
|
9
|
+
export * from './main';
|
|
@@ -9,7 +9,7 @@ export { Margin } from './models/margin.interface';
|
|
|
9
9
|
export { PopupSettings } from './models/popup-settings';
|
|
10
10
|
export { PopupRef } from './models/popup-ref';
|
|
11
11
|
export { PositionMode } from './models/position-mode';
|
|
12
|
-
export { PopupAnimation } from './models/popup-animation.interface';
|
|
12
|
+
export { PopupAnimation, AnimationType, AnimationDirection } from './models/popup-animation.interface';
|
|
13
13
|
export { PopupService, POPUP_CONTAINER } from './popup.service';
|
|
14
14
|
export { PopupComponent } from './popup.component';
|
|
15
15
|
export { PopupModule } from './popup.module';
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|