1 | import * as i1 from '@angular/cdk/scrolling';
|
2 | import { ScrollingModule } from '@angular/cdk/scrolling';
|
3 | export { CdkScrollable, ScrollDispatcher, ViewportRuler } from '@angular/cdk/scrolling';
|
4 | import * as i6 from '@angular/common';
|
5 | import { DOCUMENT } from '@angular/common';
|
6 | import * as i0 from '@angular/core';
|
7 | import { Injectable, Inject, Optional, ElementRef, ApplicationRef, ANIMATION_MODULE_TYPE, InjectionToken, Directive, EventEmitter, Input, Output, NgModule } from '@angular/core';
|
8 | import { coerceCssPixelValue, coerceArray, coerceBooleanProperty } from '@angular/cdk/coercion';
|
9 | import * as i1$1 from '@angular/cdk/platform';
|
10 | import { supportsScrollBehavior, _getEventTarget, _isTestEnvironment } from '@angular/cdk/platform';
|
11 | import * as i5 from '@angular/cdk/bidi';
|
12 | import { BidiModule } from '@angular/cdk/bidi';
|
13 | import { DomPortalOutlet, TemplatePortal, PortalModule } from '@angular/cdk/portal';
|
14 | import { Subject, Subscription, merge } from 'rxjs';
|
15 | import { take, takeUntil, takeWhile } from 'rxjs/operators';
|
16 | import { ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
|
17 |
|
18 |
|
19 |
|
20 |
|
21 |
|
22 |
|
23 |
|
24 |
|
25 | const scrollBehaviorSupported = supportsScrollBehavior();
|
26 |
|
27 |
|
28 |
|
29 | class BlockScrollStrategy {
|
30 | constructor(_viewportRuler, document) {
|
31 | this._viewportRuler = _viewportRuler;
|
32 | this._previousHTMLStyles = { top: '', left: '' };
|
33 | this._isEnabled = false;
|
34 | this._document = document;
|
35 | }
|
36 |
|
37 | attach() { }
|
38 |
|
39 | enable() {
|
40 | if (this._canBeEnabled()) {
|
41 | const root = this._document.documentElement;
|
42 | this._previousScrollPosition = this._viewportRuler.getViewportScrollPosition();
|
43 |
|
44 | this._previousHTMLStyles.left = root.style.left || '';
|
45 | this._previousHTMLStyles.top = root.style.top || '';
|
46 |
|
47 |
|
48 | root.style.left = coerceCssPixelValue(-this._previousScrollPosition.left);
|
49 | root.style.top = coerceCssPixelValue(-this._previousScrollPosition.top);
|
50 | root.classList.add('cdk-global-scrollblock');
|
51 | this._isEnabled = true;
|
52 | }
|
53 | }
|
54 |
|
55 | disable() {
|
56 | if (this._isEnabled) {
|
57 | const html = this._document.documentElement;
|
58 | const body = this._document.body;
|
59 | const htmlStyle = html.style;
|
60 | const bodyStyle = body.style;
|
61 | const previousHtmlScrollBehavior = htmlStyle.scrollBehavior || '';
|
62 | const previousBodyScrollBehavior = bodyStyle.scrollBehavior || '';
|
63 | this._isEnabled = false;
|
64 | htmlStyle.left = this._previousHTMLStyles.left;
|
65 | htmlStyle.top = this._previousHTMLStyles.top;
|
66 | html.classList.remove('cdk-global-scrollblock');
|
67 |
|
68 |
|
69 |
|
70 |
|
71 |
|
72 | if (scrollBehaviorSupported) {
|
73 | htmlStyle.scrollBehavior = bodyStyle.scrollBehavior = 'auto';
|
74 | }
|
75 | window.scroll(this._previousScrollPosition.left, this._previousScrollPosition.top);
|
76 | if (scrollBehaviorSupported) {
|
77 | htmlStyle.scrollBehavior = previousHtmlScrollBehavior;
|
78 | bodyStyle.scrollBehavior = previousBodyScrollBehavior;
|
79 | }
|
80 | }
|
81 | }
|
82 | _canBeEnabled() {
|
83 |
|
84 |
|
85 |
|
86 | const html = this._document.documentElement;
|
87 | if (html.classList.contains('cdk-global-scrollblock') || this._isEnabled) {
|
88 | return false;
|
89 | }
|
90 | const body = this._document.body;
|
91 | const viewport = this._viewportRuler.getViewportSize();
|
92 | return body.scrollHeight > viewport.height || body.scrollWidth > viewport.width;
|
93 | }
|
94 | }
|
95 |
|
96 |
|
97 |
|
98 |
|
99 |
|
100 |
|
101 |
|
102 |
|
103 |
|
104 |
|
105 |
|
106 | function getMatScrollStrategyAlreadyAttachedError() {
|
107 | return Error(`Scroll strategy has already been attached.`);
|
108 | }
|
109 |
|
110 |
|
111 |
|
112 |
|
113 | class CloseScrollStrategy {
|
114 | constructor(_scrollDispatcher, _ngZone, _viewportRuler, _config) {
|
115 | this._scrollDispatcher = _scrollDispatcher;
|
116 | this._ngZone = _ngZone;
|
117 | this._viewportRuler = _viewportRuler;
|
118 | this._config = _config;
|
119 | this._scrollSubscription = null;
|
120 |
|
121 | this._detach = () => {
|
122 | this.disable();
|
123 | if (this._overlayRef.hasAttached()) {
|
124 | this._ngZone.run(() => this._overlayRef.detach());
|
125 | }
|
126 | };
|
127 | }
|
128 |
|
129 | attach(overlayRef) {
|
130 | if (this._overlayRef && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
131 | throw getMatScrollStrategyAlreadyAttachedError();
|
132 | }
|
133 | this._overlayRef = overlayRef;
|
134 | }
|
135 |
|
136 | enable() {
|
137 | if (this._scrollSubscription) {
|
138 | return;
|
139 | }
|
140 | const stream = this._scrollDispatcher.scrolled(0);
|
141 | if (this._config && this._config.threshold && this._config.threshold > 1) {
|
142 | this._initialScrollPosition = this._viewportRuler.getViewportScrollPosition().top;
|
143 | this._scrollSubscription = stream.subscribe(() => {
|
144 | const scrollPosition = this._viewportRuler.getViewportScrollPosition().top;
|
145 | if (Math.abs(scrollPosition - this._initialScrollPosition) > this._config.threshold) {
|
146 | this._detach();
|
147 | }
|
148 | else {
|
149 | this._overlayRef.updatePosition();
|
150 | }
|
151 | });
|
152 | }
|
153 | else {
|
154 | this._scrollSubscription = stream.subscribe(this._detach);
|
155 | }
|
156 | }
|
157 |
|
158 | disable() {
|
159 | if (this._scrollSubscription) {
|
160 | this._scrollSubscription.unsubscribe();
|
161 | this._scrollSubscription = null;
|
162 | }
|
163 | }
|
164 | detach() {
|
165 | this.disable();
|
166 | this._overlayRef = null;
|
167 | }
|
168 | }
|
169 |
|
170 |
|
171 |
|
172 |
|
173 |
|
174 |
|
175 |
|
176 |
|
177 |
|
178 | class NoopScrollStrategy {
|
179 |
|
180 | enable() { }
|
181 |
|
182 | disable() { }
|
183 |
|
184 | attach() { }
|
185 | }
|
186 |
|
187 |
|
188 |
|
189 |
|
190 |
|
191 |
|
192 |
|
193 |
|
194 |
|
195 |
|
196 |
|
197 |
|
198 |
|
199 |
|
200 |
|
201 | function isElementScrolledOutsideView(element, scrollContainers) {
|
202 | return scrollContainers.some(containerBounds => {
|
203 | const outsideAbove = element.bottom < containerBounds.top;
|
204 | const outsideBelow = element.top > containerBounds.bottom;
|
205 | const outsideLeft = element.right < containerBounds.left;
|
206 | const outsideRight = element.left > containerBounds.right;
|
207 | return outsideAbove || outsideBelow || outsideLeft || outsideRight;
|
208 | });
|
209 | }
|
210 |
|
211 |
|
212 |
|
213 |
|
214 |
|
215 |
|
216 |
|
217 | function isElementClippedByScrolling(element, scrollContainers) {
|
218 | return scrollContainers.some(scrollContainerRect => {
|
219 | const clippedAbove = element.top < scrollContainerRect.top;
|
220 | const clippedBelow = element.bottom > scrollContainerRect.bottom;
|
221 | const clippedLeft = element.left < scrollContainerRect.left;
|
222 | const clippedRight = element.right > scrollContainerRect.right;
|
223 | return clippedAbove || clippedBelow || clippedLeft || clippedRight;
|
224 | });
|
225 | }
|
226 |
|
227 |
|
228 |
|
229 |
|
230 |
|
231 |
|
232 |
|
233 |
|
234 |
|
235 |
|
236 |
|
237 | class RepositionScrollStrategy {
|
238 | constructor(_scrollDispatcher, _viewportRuler, _ngZone, _config) {
|
239 | this._scrollDispatcher = _scrollDispatcher;
|
240 | this._viewportRuler = _viewportRuler;
|
241 | this._ngZone = _ngZone;
|
242 | this._config = _config;
|
243 | this._scrollSubscription = null;
|
244 | }
|
245 |
|
246 | attach(overlayRef) {
|
247 | if (this._overlayRef && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
248 | throw getMatScrollStrategyAlreadyAttachedError();
|
249 | }
|
250 | this._overlayRef = overlayRef;
|
251 | }
|
252 |
|
253 | enable() {
|
254 | if (!this._scrollSubscription) {
|
255 | const throttle = this._config ? this._config.scrollThrottle : 0;
|
256 | this._scrollSubscription = this._scrollDispatcher.scrolled(throttle).subscribe(() => {
|
257 | this._overlayRef.updatePosition();
|
258 |
|
259 | if (this._config && this._config.autoClose) {
|
260 | const overlayRect = this._overlayRef.overlayElement.getBoundingClientRect();
|
261 | const { width, height } = this._viewportRuler.getViewportSize();
|
262 |
|
263 |
|
264 | const parentRects = [{ width, height, bottom: height, right: width, top: 0, left: 0 }];
|
265 | if (isElementScrolledOutsideView(overlayRect, parentRects)) {
|
266 | this.disable();
|
267 | this._ngZone.run(() => this._overlayRef.detach());
|
268 | }
|
269 | }
|
270 | });
|
271 | }
|
272 | }
|
273 |
|
274 | disable() {
|
275 | if (this._scrollSubscription) {
|
276 | this._scrollSubscription.unsubscribe();
|
277 | this._scrollSubscription = null;
|
278 | }
|
279 | }
|
280 | detach() {
|
281 | this.disable();
|
282 | this._overlayRef = null;
|
283 | }
|
284 | }
|
285 |
|
286 |
|
287 |
|
288 |
|
289 |
|
290 |
|
291 |
|
292 |
|
293 |
|
294 |
|
295 |
|
296 |
|
297 |
|
298 |
|
299 | class ScrollStrategyOptions {
|
300 | constructor(_scrollDispatcher, _viewportRuler, _ngZone, document) {
|
301 | this._scrollDispatcher = _scrollDispatcher;
|
302 | this._viewportRuler = _viewportRuler;
|
303 | this._ngZone = _ngZone;
|
304 |
|
305 | this.noop = () => new NoopScrollStrategy();
|
306 | |
307 |
|
308 |
|
309 |
|
310 | this.close = (config) => new CloseScrollStrategy(this._scrollDispatcher, this._ngZone, this._viewportRuler, config);
|
311 |
|
312 | this.block = () => new BlockScrollStrategy(this._viewportRuler, this._document);
|
313 | |
314 |
|
315 |
|
316 |
|
317 |
|
318 | this.reposition = (config) => new RepositionScrollStrategy(this._scrollDispatcher, this._viewportRuler, this._ngZone, config);
|
319 | this._document = document;
|
320 | }
|
321 | }
|
322 | ScrollStrategyOptions.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: ScrollStrategyOptions, deps: [{ token: i1.ScrollDispatcher }, { token: i1.ViewportRuler }, { token: i0.NgZone }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
|
323 | ScrollStrategyOptions.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: ScrollStrategyOptions, providedIn: 'root' });
|
324 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: ScrollStrategyOptions, decorators: [{
|
325 | type: Injectable,
|
326 | args: [{ providedIn: 'root' }]
|
327 | }], ctorParameters: function () { return [{ type: i1.ScrollDispatcher }, { type: i1.ViewportRuler }, { type: i0.NgZone }, { type: undefined, decorators: [{
|
328 | type: Inject,
|
329 | args: [DOCUMENT]
|
330 | }] }]; } });
|
331 |
|
332 |
|
333 |
|
334 |
|
335 |
|
336 |
|
337 |
|
338 |
|
339 |
|
340 |
|
341 |
|
342 |
|
343 |
|
344 |
|
345 |
|
346 |
|
347 |
|
348 | class OverlayConfig {
|
349 | constructor(config) {
|
350 |
|
351 | this.scrollStrategy = new NoopScrollStrategy();
|
352 |
|
353 | this.panelClass = '';
|
354 |
|
355 | this.hasBackdrop = false;
|
356 |
|
357 | this.backdropClass = 'cdk-overlay-dark-backdrop';
|
358 | |
359 |
|
360 |
|
361 |
|
362 |
|
363 | this.disposeOnNavigation = false;
|
364 | if (config) {
|
365 |
|
366 |
|
367 |
|
368 | const configKeys = Object.keys(config);
|
369 | for (const key of configKeys) {
|
370 | if (config[key] !== undefined) {
|
371 |
|
372 |
|
373 |
|
374 |
|
375 |
|
376 |
|
377 | this[key] = config[key];
|
378 | }
|
379 | }
|
380 | }
|
381 | }
|
382 | }
|
383 |
|
384 |
|
385 |
|
386 |
|
387 |
|
388 |
|
389 |
|
390 |
|
391 |
|
392 | class ConnectionPositionPair {
|
393 | constructor(origin, overlay,
|
394 | /** Offset along the X axis. */
|
395 | offsetX,
|
396 | /** Offset along the Y axis. */
|
397 | offsetY,
|
398 | /** Class(es) to be applied to the panel while this position is active. */
|
399 | panelClass) {
|
400 | this.offsetX = offsetX;
|
401 | this.offsetY = offsetY;
|
402 | this.panelClass = panelClass;
|
403 | this.originX = origin.originX;
|
404 | this.originY = origin.originY;
|
405 | this.overlayX = overlay.overlayX;
|
406 | this.overlayY = overlay.overlayY;
|
407 | }
|
408 | }
|
409 |
|
410 |
|
411 |
|
412 |
|
413 |
|
414 |
|
415 |
|
416 |
|
417 |
|
418 |
|
419 |
|
420 |
|
421 |
|
422 |
|
423 |
|
424 |
|
425 |
|
426 |
|
427 |
|
428 |
|
429 |
|
430 |
|
431 |
|
432 |
|
433 |
|
434 | class ScrollingVisibility {
|
435 | }
|
436 |
|
437 | class ConnectedOverlayPositionChange {
|
438 | constructor(
|
439 | /** The position used as a result of this change. */
|
440 | connectionPair,
|
441 | /** @docs-private */
|
442 | scrollableViewProperties) {
|
443 | this.connectionPair = connectionPair;
|
444 | this.scrollableViewProperties = scrollableViewProperties;
|
445 | }
|
446 | }
|
447 |
|
448 |
|
449 |
|
450 |
|
451 |
|
452 |
|
453 | function validateVerticalPosition(property, value) {
|
454 | if (value !== 'top' && value !== 'bottom' && value !== 'center') {
|
455 | throw Error(`ConnectedPosition: Invalid ${property} "${value}". ` +
|
456 | `Expected "top", "bottom" or "center".`);
|
457 | }
|
458 | }
|
459 |
|
460 |
|
461 |
|
462 |
|
463 |
|
464 |
|
465 | function validateHorizontalPosition(property, value) {
|
466 | if (value !== 'start' && value !== 'end' && value !== 'center') {
|
467 | throw Error(`ConnectedPosition: Invalid ${property} "${value}". ` +
|
468 | `Expected "start", "end" or "center".`);
|
469 | }
|
470 | }
|
471 |
|
472 |
|
473 |
|
474 |
|
475 |
|
476 |
|
477 |
|
478 |
|
479 |
|
480 |
|
481 |
|
482 |
|
483 |
|
484 | class BaseOverlayDispatcher {
|
485 | constructor(document) {
|
486 |
|
487 | this._attachedOverlays = [];
|
488 | this._document = document;
|
489 | }
|
490 | ngOnDestroy() {
|
491 | this.detach();
|
492 | }
|
493 |
|
494 | add(overlayRef) {
|
495 |
|
496 | this.remove(overlayRef);
|
497 | this._attachedOverlays.push(overlayRef);
|
498 | }
|
499 |
|
500 | remove(overlayRef) {
|
501 | const index = this._attachedOverlays.indexOf(overlayRef);
|
502 | if (index > -1) {
|
503 | this._attachedOverlays.splice(index, 1);
|
504 | }
|
505 |
|
506 | if (this._attachedOverlays.length === 0) {
|
507 | this.detach();
|
508 | }
|
509 | }
|
510 | }
|
511 | BaseOverlayDispatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: BaseOverlayDispatcher, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
|
512 | BaseOverlayDispatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: BaseOverlayDispatcher, providedIn: 'root' });
|
513 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: BaseOverlayDispatcher, decorators: [{
|
514 | type: Injectable,
|
515 | args: [{ providedIn: 'root' }]
|
516 | }], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
517 | type: Inject,
|
518 | args: [DOCUMENT]
|
519 | }] }]; } });
|
520 |
|
521 |
|
522 |
|
523 |
|
524 |
|
525 |
|
526 |
|
527 |
|
528 |
|
529 |
|
530 |
|
531 |
|
532 |
|
533 | class OverlayKeyboardDispatcher extends BaseOverlayDispatcher {
|
534 | constructor(document,
|
535 | /** @breaking-change 14.0.0 _ngZone will be required. */
|
536 | _ngZone) {
|
537 | super(document);
|
538 | this._ngZone = _ngZone;
|
539 |
|
540 | this._keydownListener = (event) => {
|
541 | const overlays = this._attachedOverlays;
|
542 | for (let i = overlays.length - 1; i > -1; i--) {
|
543 |
|
544 |
|
545 |
|
546 |
|
547 |
|
548 |
|
549 | if (overlays[i]._keydownEvents.observers.length > 0) {
|
550 | const keydownEvents = overlays[i]._keydownEvents;
|
551 |
|
552 | if (this._ngZone) {
|
553 | this._ngZone.run(() => keydownEvents.next(event));
|
554 | }
|
555 | else {
|
556 | keydownEvents.next(event);
|
557 | }
|
558 | break;
|
559 | }
|
560 | }
|
561 | };
|
562 | }
|
563 |
|
564 | add(overlayRef) {
|
565 | super.add(overlayRef);
|
566 |
|
567 | if (!this._isAttached) {
|
568 |
|
569 | if (this._ngZone) {
|
570 | this._ngZone.runOutsideAngular(() => this._document.body.addEventListener('keydown', this._keydownListener));
|
571 | }
|
572 | else {
|
573 | this._document.body.addEventListener('keydown', this._keydownListener);
|
574 | }
|
575 | this._isAttached = true;
|
576 | }
|
577 | }
|
578 |
|
579 | detach() {
|
580 | if (this._isAttached) {
|
581 | this._document.body.removeEventListener('keydown', this._keydownListener);
|
582 | this._isAttached = false;
|
583 | }
|
584 | }
|
585 | }
|
586 | OverlayKeyboardDispatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayKeyboardDispatcher, deps: [{ token: DOCUMENT }, { token: i0.NgZone, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
|
587 | OverlayKeyboardDispatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayKeyboardDispatcher, providedIn: 'root' });
|
588 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayKeyboardDispatcher, decorators: [{
|
589 | type: Injectable,
|
590 | args: [{ providedIn: 'root' }]
|
591 | }], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
592 | type: Inject,
|
593 | args: [DOCUMENT]
|
594 | }] }, { type: i0.NgZone, decorators: [{
|
595 | type: Optional
|
596 | }] }]; } });
|
597 |
|
598 |
|
599 |
|
600 |
|
601 |
|
602 |
|
603 |
|
604 |
|
605 |
|
606 |
|
607 |
|
608 |
|
609 |
|
610 | class OverlayOutsideClickDispatcher extends BaseOverlayDispatcher {
|
611 | constructor(document, _platform,
|
612 | /** @breaking-change 14.0.0 _ngZone will be required. */
|
613 | _ngZone) {
|
614 | super(document);
|
615 | this._platform = _platform;
|
616 | this._ngZone = _ngZone;
|
617 | this._cursorStyleIsSet = false;
|
618 |
|
619 | this._pointerDownListener = (event) => {
|
620 | this._pointerDownEventTarget = _getEventTarget(event);
|
621 | };
|
622 |
|
623 | this._clickListener = (event) => {
|
624 | const target = _getEventTarget(event);
|
625 |
|
626 |
|
627 |
|
628 |
|
629 |
|
630 |
|
631 | const origin = event.type === 'click' && this._pointerDownEventTarget
|
632 | ? this._pointerDownEventTarget
|
633 | : target;
|
634 |
|
635 |
|
636 | this._pointerDownEventTarget = null;
|
637 |
|
638 |
|
639 |
|
640 | const overlays = this._attachedOverlays.slice();
|
641 |
|
642 |
|
643 |
|
644 |
|
645 | for (let i = overlays.length - 1; i > -1; i--) {
|
646 | const overlayRef = overlays[i];
|
647 | if (overlayRef._outsidePointerEvents.observers.length < 1 || !overlayRef.hasAttached()) {
|
648 | continue;
|
649 | }
|
650 |
|
651 |
|
652 |
|
653 | if (overlayRef.overlayElement.contains(target) ||
|
654 | overlayRef.overlayElement.contains(origin)) {
|
655 | break;
|
656 | }
|
657 | const outsidePointerEvents = overlayRef._outsidePointerEvents;
|
658 |
|
659 | if (this._ngZone) {
|
660 | this._ngZone.run(() => outsidePointerEvents.next(event));
|
661 | }
|
662 | else {
|
663 | outsidePointerEvents.next(event);
|
664 | }
|
665 | }
|
666 | };
|
667 | }
|
668 |
|
669 | add(overlayRef) {
|
670 | super.add(overlayRef);
|
671 |
|
672 |
|
673 |
|
674 |
|
675 |
|
676 |
|
677 | if (!this._isAttached) {
|
678 | const body = this._document.body;
|
679 |
|
680 | if (this._ngZone) {
|
681 | this._ngZone.runOutsideAngular(() => this._addEventListeners(body));
|
682 | }
|
683 | else {
|
684 | this._addEventListeners(body);
|
685 | }
|
686 |
|
687 |
|
688 | if (this._platform.IOS && !this._cursorStyleIsSet) {
|
689 | this._cursorOriginalValue = body.style.cursor;
|
690 | body.style.cursor = 'pointer';
|
691 | this._cursorStyleIsSet = true;
|
692 | }
|
693 | this._isAttached = true;
|
694 | }
|
695 | }
|
696 |
|
697 | detach() {
|
698 | if (this._isAttached) {
|
699 | const body = this._document.body;
|
700 | body.removeEventListener('pointerdown', this._pointerDownListener, true);
|
701 | body.removeEventListener('click', this._clickListener, true);
|
702 | body.removeEventListener('auxclick', this._clickListener, true);
|
703 | body.removeEventListener('contextmenu', this._clickListener, true);
|
704 | if (this._platform.IOS && this._cursorStyleIsSet) {
|
705 | body.style.cursor = this._cursorOriginalValue;
|
706 | this._cursorStyleIsSet = false;
|
707 | }
|
708 | this._isAttached = false;
|
709 | }
|
710 | }
|
711 | _addEventListeners(body) {
|
712 | body.addEventListener('pointerdown', this._pointerDownListener, true);
|
713 | body.addEventListener('click', this._clickListener, true);
|
714 | body.addEventListener('auxclick', this._clickListener, true);
|
715 | body.addEventListener('contextmenu', this._clickListener, true);
|
716 | }
|
717 | }
|
718 | OverlayOutsideClickDispatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayOutsideClickDispatcher, deps: [{ token: DOCUMENT }, { token: i1$1.Platform }, { token: i0.NgZone, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
|
719 | OverlayOutsideClickDispatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayOutsideClickDispatcher, providedIn: 'root' });
|
720 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayOutsideClickDispatcher, decorators: [{
|
721 | type: Injectable,
|
722 | args: [{ providedIn: 'root' }]
|
723 | }], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
724 | type: Inject,
|
725 | args: [DOCUMENT]
|
726 | }] }, { type: i1$1.Platform }, { type: i0.NgZone, decorators: [{
|
727 | type: Optional
|
728 | }] }]; } });
|
729 |
|
730 |
|
731 |
|
732 |
|
733 |
|
734 |
|
735 |
|
736 |
|
737 |
|
738 | class OverlayContainer {
|
739 | constructor(document, _platform) {
|
740 | this._platform = _platform;
|
741 | this._document = document;
|
742 | }
|
743 | ngOnDestroy() {
|
744 | this._containerElement?.remove();
|
745 | }
|
746 | |
747 |
|
748 |
|
749 |
|
750 |
|
751 |
|
752 | getContainerElement() {
|
753 | if (!this._containerElement) {
|
754 | this._createContainer();
|
755 | }
|
756 | return this._containerElement;
|
757 | }
|
758 | |
759 |
|
760 |
|
761 |
|
762 | _createContainer() {
|
763 | const containerClass = 'cdk-overlay-container';
|
764 |
|
765 |
|
766 |
|
767 | if (this._platform.isBrowser || _isTestEnvironment()) {
|
768 | const oppositePlatformContainers = this._document.querySelectorAll(`.${containerClass}[platform="server"], ` + `.${containerClass}[platform="test"]`);
|
769 |
|
770 |
|
771 | for (let i = 0; i < oppositePlatformContainers.length; i++) {
|
772 | oppositePlatformContainers[i].remove();
|
773 | }
|
774 | }
|
775 | const container = this._document.createElement('div');
|
776 | container.classList.add(containerClass);
|
777 |
|
778 |
|
779 |
|
780 |
|
781 |
|
782 |
|
783 |
|
784 |
|
785 |
|
786 | if (_isTestEnvironment()) {
|
787 | container.setAttribute('platform', 'test');
|
788 | }
|
789 | else if (!this._platform.isBrowser) {
|
790 | container.setAttribute('platform', 'server');
|
791 | }
|
792 | this._document.body.appendChild(container);
|
793 | this._containerElement = container;
|
794 | }
|
795 | }
|
796 | OverlayContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayContainer, deps: [{ token: DOCUMENT }, { token: i1$1.Platform }], target: i0.ɵɵFactoryTarget.Injectable });
|
797 | OverlayContainer.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayContainer, providedIn: 'root' });
|
798 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayContainer, decorators: [{
|
799 | type: Injectable,
|
800 | args: [{ providedIn: 'root' }]
|
801 | }], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
802 | type: Inject,
|
803 | args: [DOCUMENT]
|
804 | }] }, { type: i1$1.Platform }]; } });
|
805 |
|
806 |
|
807 |
|
808 |
|
809 |
|
810 |
|
811 |
|
812 |
|
813 |
|
814 |
|
815 |
|
816 |
|
817 | class OverlayRef {
|
818 | constructor(_portalOutlet, _host, _pane, _config, _ngZone, _keyboardDispatcher, _document, _location, _outsideClickDispatcher, _animationsDisabled = false) {
|
819 | this._portalOutlet = _portalOutlet;
|
820 | this._host = _host;
|
821 | this._pane = _pane;
|
822 | this._config = _config;
|
823 | this._ngZone = _ngZone;
|
824 | this._keyboardDispatcher = _keyboardDispatcher;
|
825 | this._document = _document;
|
826 | this._location = _location;
|
827 | this._outsideClickDispatcher = _outsideClickDispatcher;
|
828 | this._animationsDisabled = _animationsDisabled;
|
829 | this._backdropElement = null;
|
830 | this._backdropClick = new Subject();
|
831 | this._attachments = new Subject();
|
832 | this._detachments = new Subject();
|
833 | this._locationChanges = Subscription.EMPTY;
|
834 | this._backdropClickHandler = (event) => this._backdropClick.next(event);
|
835 | this._backdropTransitionendHandler = (event) => {
|
836 | this._disposeBackdrop(event.target);
|
837 | };
|
838 |
|
839 | this._keydownEvents = new Subject();
|
840 |
|
841 | this._outsidePointerEvents = new Subject();
|
842 | if (_config.scrollStrategy) {
|
843 | this._scrollStrategy = _config.scrollStrategy;
|
844 | this._scrollStrategy.attach(this);
|
845 | }
|
846 | this._positionStrategy = _config.positionStrategy;
|
847 | }
|
848 |
|
849 | get overlayElement() {
|
850 | return this._pane;
|
851 | }
|
852 |
|
853 | get backdropElement() {
|
854 | return this._backdropElement;
|
855 | }
|
856 | |
857 |
|
858 |
|
859 |
|
860 |
|
861 | get hostElement() {
|
862 | return this._host;
|
863 | }
|
864 | |
865 |
|
866 |
|
867 |
|
868 |
|
869 |
|
870 |
|
871 | attach(portal) {
|
872 |
|
873 |
|
874 | if (!this._host.parentElement && this._previousHostParent) {
|
875 | this._previousHostParent.appendChild(this._host);
|
876 | }
|
877 | const attachResult = this._portalOutlet.attach(portal);
|
878 | if (this._positionStrategy) {
|
879 | this._positionStrategy.attach(this);
|
880 | }
|
881 | this._updateStackingOrder();
|
882 | this._updateElementSize();
|
883 | this._updateElementDirection();
|
884 | if (this._scrollStrategy) {
|
885 | this._scrollStrategy.enable();
|
886 | }
|
887 |
|
888 |
|
889 |
|
890 | this._ngZone.onStable.pipe(take(1)).subscribe(() => {
|
891 |
|
892 | if (this.hasAttached()) {
|
893 | this.updatePosition();
|
894 | }
|
895 | });
|
896 |
|
897 | this._togglePointerEvents(true);
|
898 | if (this._config.hasBackdrop) {
|
899 | this._attachBackdrop();
|
900 | }
|
901 | if (this._config.panelClass) {
|
902 | this._toggleClasses(this._pane, this._config.panelClass, true);
|
903 | }
|
904 |
|
905 | this._attachments.next();
|
906 |
|
907 | this._keyboardDispatcher.add(this);
|
908 | if (this._config.disposeOnNavigation) {
|
909 | this._locationChanges = this._location.subscribe(() => this.dispose());
|
910 | }
|
911 | this._outsideClickDispatcher.add(this);
|
912 |
|
913 |
|
914 |
|
915 | if (typeof attachResult?.onDestroy === 'function') {
|
916 |
|
917 |
|
918 |
|
919 |
|
920 |
|
921 | attachResult.onDestroy(() => {
|
922 | if (this.hasAttached()) {
|
923 |
|
924 |
|
925 |
|
926 | this._ngZone.runOutsideAngular(() => Promise.resolve().then(() => this.detach()));
|
927 | }
|
928 | });
|
929 | }
|
930 | return attachResult;
|
931 | }
|
932 | |
933 |
|
934 |
|
935 |
|
936 | detach() {
|
937 | if (!this.hasAttached()) {
|
938 | return;
|
939 | }
|
940 | this.detachBackdrop();
|
941 |
|
942 |
|
943 |
|
944 | this._togglePointerEvents(false);
|
945 | if (this._positionStrategy && this._positionStrategy.detach) {
|
946 | this._positionStrategy.detach();
|
947 | }
|
948 | if (this._scrollStrategy) {
|
949 | this._scrollStrategy.disable();
|
950 | }
|
951 | const detachmentResult = this._portalOutlet.detach();
|
952 |
|
953 | this._detachments.next();
|
954 |
|
955 | this._keyboardDispatcher.remove(this);
|
956 |
|
957 |
|
958 | this._detachContentWhenStable();
|
959 | this._locationChanges.unsubscribe();
|
960 | this._outsideClickDispatcher.remove(this);
|
961 | return detachmentResult;
|
962 | }
|
963 |
|
964 | dispose() {
|
965 | const isAttached = this.hasAttached();
|
966 | if (this._positionStrategy) {
|
967 | this._positionStrategy.dispose();
|
968 | }
|
969 | this._disposeScrollStrategy();
|
970 | this._disposeBackdrop(this._backdropElement);
|
971 | this._locationChanges.unsubscribe();
|
972 | this._keyboardDispatcher.remove(this);
|
973 | this._portalOutlet.dispose();
|
974 | this._attachments.complete();
|
975 | this._backdropClick.complete();
|
976 | this._keydownEvents.complete();
|
977 | this._outsidePointerEvents.complete();
|
978 | this._outsideClickDispatcher.remove(this);
|
979 | this._host?.remove();
|
980 | this._previousHostParent = this._pane = this._host = null;
|
981 | if (isAttached) {
|
982 | this._detachments.next();
|
983 | }
|
984 | this._detachments.complete();
|
985 | }
|
986 |
|
987 | hasAttached() {
|
988 | return this._portalOutlet.hasAttached();
|
989 | }
|
990 |
|
991 | backdropClick() {
|
992 | return this._backdropClick;
|
993 | }
|
994 |
|
995 | attachments() {
|
996 | return this._attachments;
|
997 | }
|
998 |
|
999 | detachments() {
|
1000 | return this._detachments;
|
1001 | }
|
1002 |
|
1003 | keydownEvents() {
|
1004 | return this._keydownEvents;
|
1005 | }
|
1006 |
|
1007 | outsidePointerEvents() {
|
1008 | return this._outsidePointerEvents;
|
1009 | }
|
1010 |
|
1011 | getConfig() {
|
1012 | return this._config;
|
1013 | }
|
1014 |
|
1015 | updatePosition() {
|
1016 | if (this._positionStrategy) {
|
1017 | this._positionStrategy.apply();
|
1018 | }
|
1019 | }
|
1020 |
|
1021 | updatePositionStrategy(strategy) {
|
1022 | if (strategy === this._positionStrategy) {
|
1023 | return;
|
1024 | }
|
1025 | if (this._positionStrategy) {
|
1026 | this._positionStrategy.dispose();
|
1027 | }
|
1028 | this._positionStrategy = strategy;
|
1029 | if (this.hasAttached()) {
|
1030 | strategy.attach(this);
|
1031 | this.updatePosition();
|
1032 | }
|
1033 | }
|
1034 |
|
1035 | updateSize(sizeConfig) {
|
1036 | this._config = { ...this._config, ...sizeConfig };
|
1037 | this._updateElementSize();
|
1038 | }
|
1039 |
|
1040 | setDirection(dir) {
|
1041 | this._config = { ...this._config, direction: dir };
|
1042 | this._updateElementDirection();
|
1043 | }
|
1044 |
|
1045 | addPanelClass(classes) {
|
1046 | if (this._pane) {
|
1047 | this._toggleClasses(this._pane, classes, true);
|
1048 | }
|
1049 | }
|
1050 |
|
1051 | removePanelClass(classes) {
|
1052 | if (this._pane) {
|
1053 | this._toggleClasses(this._pane, classes, false);
|
1054 | }
|
1055 | }
|
1056 | |
1057 |
|
1058 |
|
1059 | getDirection() {
|
1060 | const direction = this._config.direction;
|
1061 | if (!direction) {
|
1062 | return 'ltr';
|
1063 | }
|
1064 | return typeof direction === 'string' ? direction : direction.value;
|
1065 | }
|
1066 |
|
1067 | updateScrollStrategy(strategy) {
|
1068 | if (strategy === this._scrollStrategy) {
|
1069 | return;
|
1070 | }
|
1071 | this._disposeScrollStrategy();
|
1072 | this._scrollStrategy = strategy;
|
1073 | if (this.hasAttached()) {
|
1074 | strategy.attach(this);
|
1075 | strategy.enable();
|
1076 | }
|
1077 | }
|
1078 |
|
1079 | _updateElementDirection() {
|
1080 | this._host.setAttribute('dir', this.getDirection());
|
1081 | }
|
1082 |
|
1083 | _updateElementSize() {
|
1084 | if (!this._pane) {
|
1085 | return;
|
1086 | }
|
1087 | const style = this._pane.style;
|
1088 | style.width = coerceCssPixelValue(this._config.width);
|
1089 | style.height = coerceCssPixelValue(this._config.height);
|
1090 | style.minWidth = coerceCssPixelValue(this._config.minWidth);
|
1091 | style.minHeight = coerceCssPixelValue(this._config.minHeight);
|
1092 | style.maxWidth = coerceCssPixelValue(this._config.maxWidth);
|
1093 | style.maxHeight = coerceCssPixelValue(this._config.maxHeight);
|
1094 | }
|
1095 |
|
1096 | _togglePointerEvents(enablePointer) {
|
1097 | this._pane.style.pointerEvents = enablePointer ? '' : 'none';
|
1098 | }
|
1099 |
|
1100 | _attachBackdrop() {
|
1101 | const showingClass = 'cdk-overlay-backdrop-showing';
|
1102 | this._backdropElement = this._document.createElement('div');
|
1103 | this._backdropElement.classList.add('cdk-overlay-backdrop');
|
1104 | if (this._animationsDisabled) {
|
1105 | this._backdropElement.classList.add('cdk-overlay-backdrop-noop-animation');
|
1106 | }
|
1107 | if (this._config.backdropClass) {
|
1108 | this._toggleClasses(this._backdropElement, this._config.backdropClass, true);
|
1109 | }
|
1110 |
|
1111 |
|
1112 | this._host.parentElement.insertBefore(this._backdropElement, this._host);
|
1113 |
|
1114 |
|
1115 | this._backdropElement.addEventListener('click', this._backdropClickHandler);
|
1116 |
|
1117 | if (!this._animationsDisabled && typeof requestAnimationFrame !== 'undefined') {
|
1118 | this._ngZone.runOutsideAngular(() => {
|
1119 | requestAnimationFrame(() => {
|
1120 | if (this._backdropElement) {
|
1121 | this._backdropElement.classList.add(showingClass);
|
1122 | }
|
1123 | });
|
1124 | });
|
1125 | }
|
1126 | else {
|
1127 | this._backdropElement.classList.add(showingClass);
|
1128 | }
|
1129 | }
|
1130 | |
1131 |
|
1132 |
|
1133 |
|
1134 |
|
1135 |
|
1136 |
|
1137 | _updateStackingOrder() {
|
1138 | if (this._host.nextSibling) {
|
1139 | this._host.parentNode.appendChild(this._host);
|
1140 | }
|
1141 | }
|
1142 |
|
1143 | detachBackdrop() {
|
1144 | const backdropToDetach = this._backdropElement;
|
1145 | if (!backdropToDetach) {
|
1146 | return;
|
1147 | }
|
1148 | if (this._animationsDisabled) {
|
1149 | this._disposeBackdrop(backdropToDetach);
|
1150 | return;
|
1151 | }
|
1152 | backdropToDetach.classList.remove('cdk-overlay-backdrop-showing');
|
1153 | this._ngZone.runOutsideAngular(() => {
|
1154 | backdropToDetach.addEventListener('transitionend', this._backdropTransitionendHandler);
|
1155 | });
|
1156 |
|
1157 |
|
1158 | backdropToDetach.style.pointerEvents = 'none';
|
1159 |
|
1160 |
|
1161 |
|
1162 | this._backdropTimeout = this._ngZone.runOutsideAngular(() => setTimeout(() => {
|
1163 | this._disposeBackdrop(backdropToDetach);
|
1164 | }, 500));
|
1165 | }
|
1166 |
|
1167 | _toggleClasses(element, cssClasses, isAdd) {
|
1168 | const classes = coerceArray(cssClasses || []).filter(c => !!c);
|
1169 | if (classes.length) {
|
1170 | isAdd ? element.classList.add(...classes) : element.classList.remove(...classes);
|
1171 | }
|
1172 | }
|
1173 |
|
1174 | _detachContentWhenStable() {
|
1175 |
|
1176 |
|
1177 |
|
1178 | this._ngZone.runOutsideAngular(() => {
|
1179 |
|
1180 |
|
1181 |
|
1182 | const subscription = this._ngZone.onStable
|
1183 | .pipe(takeUntil(merge(this._attachments, this._detachments)))
|
1184 | .subscribe(() => {
|
1185 |
|
1186 |
|
1187 | if (!this._pane || !this._host || this._pane.children.length === 0) {
|
1188 | if (this._pane && this._config.panelClass) {
|
1189 | this._toggleClasses(this._pane, this._config.panelClass, false);
|
1190 | }
|
1191 | if (this._host && this._host.parentElement) {
|
1192 | this._previousHostParent = this._host.parentElement;
|
1193 | this._host.remove();
|
1194 | }
|
1195 | subscription.unsubscribe();
|
1196 | }
|
1197 | });
|
1198 | });
|
1199 | }
|
1200 |
|
1201 | _disposeScrollStrategy() {
|
1202 | const scrollStrategy = this._scrollStrategy;
|
1203 | if (scrollStrategy) {
|
1204 | scrollStrategy.disable();
|
1205 | if (scrollStrategy.detach) {
|
1206 | scrollStrategy.detach();
|
1207 | }
|
1208 | }
|
1209 | }
|
1210 |
|
1211 | _disposeBackdrop(backdrop) {
|
1212 | if (backdrop) {
|
1213 | backdrop.removeEventListener('click', this._backdropClickHandler);
|
1214 | backdrop.removeEventListener('transitionend', this._backdropTransitionendHandler);
|
1215 | backdrop.remove();
|
1216 |
|
1217 |
|
1218 |
|
1219 | if (this._backdropElement === backdrop) {
|
1220 | this._backdropElement = null;
|
1221 | }
|
1222 | }
|
1223 | if (this._backdropTimeout) {
|
1224 | clearTimeout(this._backdropTimeout);
|
1225 | this._backdropTimeout = undefined;
|
1226 | }
|
1227 | }
|
1228 | }
|
1229 |
|
1230 |
|
1231 |
|
1232 |
|
1233 |
|
1234 |
|
1235 |
|
1236 |
|
1237 |
|
1238 |
|
1239 |
|
1240 | const boundingBoxClass = 'cdk-overlay-connected-position-bounding-box';
|
1241 |
|
1242 | const cssUnitPattern = /([A-Za-z%]+)$/;
|
1243 |
|
1244 |
|
1245 |
|
1246 |
|
1247 |
|
1248 |
|
1249 |
|
1250 | class FlexibleConnectedPositionStrategy {
|
1251 | constructor(connectedTo, _viewportRuler, _document, _platform, _overlayContainer) {
|
1252 | this._viewportRuler = _viewportRuler;
|
1253 | this._document = _document;
|
1254 | this._platform = _platform;
|
1255 | this._overlayContainer = _overlayContainer;
|
1256 |
|
1257 | this._lastBoundingBoxSize = { width: 0, height: 0 };
|
1258 |
|
1259 | this._isPushed = false;
|
1260 |
|
1261 | this._canPush = true;
|
1262 |
|
1263 | this._growAfterOpen = false;
|
1264 |
|
1265 | this._hasFlexibleDimensions = true;
|
1266 |
|
1267 | this._positionLocked = false;
|
1268 |
|
1269 | this._viewportMargin = 0;
|
1270 |
|
1271 | this._scrollables = [];
|
1272 |
|
1273 | this._preferredPositions = [];
|
1274 |
|
1275 | this._positionChanges = new Subject();
|
1276 |
|
1277 | this._resizeSubscription = Subscription.EMPTY;
|
1278 |
|
1279 | this._offsetX = 0;
|
1280 |
|
1281 | this._offsetY = 0;
|
1282 |
|
1283 | this._appliedPanelClasses = [];
|
1284 |
|
1285 | this.positionChanges = this._positionChanges;
|
1286 | this.setOrigin(connectedTo);
|
1287 | }
|
1288 |
|
1289 | get positions() {
|
1290 | return this._preferredPositions;
|
1291 | }
|
1292 |
|
1293 | attach(overlayRef) {
|
1294 | if (this._overlayRef &&
|
1295 | overlayRef !== this._overlayRef &&
|
1296 | (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1297 | throw Error('This position strategy is already attached to an overlay');
|
1298 | }
|
1299 | this._validatePositions();
|
1300 | overlayRef.hostElement.classList.add(boundingBoxClass);
|
1301 | this._overlayRef = overlayRef;
|
1302 | this._boundingBox = overlayRef.hostElement;
|
1303 | this._pane = overlayRef.overlayElement;
|
1304 | this._isDisposed = false;
|
1305 | this._isInitialRender = true;
|
1306 | this._lastPosition = null;
|
1307 | this._resizeSubscription.unsubscribe();
|
1308 | this._resizeSubscription = this._viewportRuler.change().subscribe(() => {
|
1309 |
|
1310 |
|
1311 |
|
1312 | this._isInitialRender = true;
|
1313 | this.apply();
|
1314 | });
|
1315 | }
|
1316 | |
1317 |
|
1318 |
|
1319 |
|
1320 |
|
1321 |
|
1322 |
|
1323 |
|
1324 |
|
1325 |
|
1326 |
|
1327 |
|
1328 |
|
1329 |
|
1330 | apply() {
|
1331 |
|
1332 | if (this._isDisposed || !this._platform.isBrowser) {
|
1333 | return;
|
1334 | }
|
1335 |
|
1336 |
|
1337 |
|
1338 | if (!this._isInitialRender && this._positionLocked && this._lastPosition) {
|
1339 | this.reapplyLastPosition();
|
1340 | return;
|
1341 | }
|
1342 | this._clearPanelClasses();
|
1343 | this._resetOverlayElementStyles();
|
1344 | this._resetBoundingBoxStyles();
|
1345 |
|
1346 |
|
1347 |
|
1348 | this._viewportRect = this._getNarrowedViewportRect();
|
1349 | this._originRect = this._getOriginRect();
|
1350 | this._overlayRect = this._pane.getBoundingClientRect();
|
1351 | this._containerRect = this._overlayContainer.getContainerElement().getBoundingClientRect();
|
1352 | const originRect = this._originRect;
|
1353 | const overlayRect = this._overlayRect;
|
1354 | const viewportRect = this._viewportRect;
|
1355 | const containerRect = this._containerRect;
|
1356 |
|
1357 | const flexibleFits = [];
|
1358 |
|
1359 | let fallback;
|
1360 |
|
1361 |
|
1362 | for (let pos of this._preferredPositions) {
|
1363 |
|
1364 | let originPoint = this._getOriginPoint(originRect, containerRect, pos);
|
1365 |
|
1366 |
|
1367 |
|
1368 | let overlayPoint = this._getOverlayPoint(originPoint, overlayRect, pos);
|
1369 |
|
1370 | let overlayFit = this._getOverlayFit(overlayPoint, overlayRect, viewportRect, pos);
|
1371 |
|
1372 | if (overlayFit.isCompletelyWithinViewport) {
|
1373 | this._isPushed = false;
|
1374 | this._applyPosition(pos, originPoint);
|
1375 | return;
|
1376 | }
|
1377 |
|
1378 |
|
1379 | if (this._canFitWithFlexibleDimensions(overlayFit, overlayPoint, viewportRect)) {
|
1380 |
|
1381 |
|
1382 | flexibleFits.push({
|
1383 | position: pos,
|
1384 | origin: originPoint,
|
1385 | overlayRect,
|
1386 | boundingBoxRect: this._calculateBoundingBoxRect(originPoint, pos),
|
1387 | });
|
1388 | continue;
|
1389 | }
|
1390 |
|
1391 |
|
1392 |
|
1393 | if (!fallback || fallback.overlayFit.visibleArea < overlayFit.visibleArea) {
|
1394 | fallback = { overlayFit, overlayPoint, originPoint, position: pos, overlayRect };
|
1395 | }
|
1396 | }
|
1397 |
|
1398 |
|
1399 | if (flexibleFits.length) {
|
1400 | let bestFit = null;
|
1401 | let bestScore = -1;
|
1402 | for (const fit of flexibleFits) {
|
1403 | const score = fit.boundingBoxRect.width * fit.boundingBoxRect.height * (fit.position.weight || 1);
|
1404 | if (score > bestScore) {
|
1405 | bestScore = score;
|
1406 | bestFit = fit;
|
1407 | }
|
1408 | }
|
1409 | this._isPushed = false;
|
1410 | this._applyPosition(bestFit.position, bestFit.origin);
|
1411 | return;
|
1412 | }
|
1413 |
|
1414 |
|
1415 | if (this._canPush) {
|
1416 |
|
1417 | this._isPushed = true;
|
1418 | this._applyPosition(fallback.position, fallback.originPoint);
|
1419 | return;
|
1420 | }
|
1421 |
|
1422 |
|
1423 | this._applyPosition(fallback.position, fallback.originPoint);
|
1424 | }
|
1425 | detach() {
|
1426 | this._clearPanelClasses();
|
1427 | this._lastPosition = null;
|
1428 | this._previousPushAmount = null;
|
1429 | this._resizeSubscription.unsubscribe();
|
1430 | }
|
1431 |
|
1432 | dispose() {
|
1433 | if (this._isDisposed) {
|
1434 | return;
|
1435 | }
|
1436 |
|
1437 |
|
1438 | if (this._boundingBox) {
|
1439 | extendStyles(this._boundingBox.style, {
|
1440 | top: '',
|
1441 | left: '',
|
1442 | right: '',
|
1443 | bottom: '',
|
1444 | height: '',
|
1445 | width: '',
|
1446 | alignItems: '',
|
1447 | justifyContent: '',
|
1448 | });
|
1449 | }
|
1450 | if (this._pane) {
|
1451 | this._resetOverlayElementStyles();
|
1452 | }
|
1453 | if (this._overlayRef) {
|
1454 | this._overlayRef.hostElement.classList.remove(boundingBoxClass);
|
1455 | }
|
1456 | this.detach();
|
1457 | this._positionChanges.complete();
|
1458 | this._overlayRef = this._boundingBox = null;
|
1459 | this._isDisposed = true;
|
1460 | }
|
1461 | |
1462 |
|
1463 |
|
1464 |
|
1465 |
|
1466 | reapplyLastPosition() {
|
1467 | if (this._isDisposed || !this._platform.isBrowser) {
|
1468 | return;
|
1469 | }
|
1470 | const lastPosition = this._lastPosition;
|
1471 | if (lastPosition) {
|
1472 | this._originRect = this._getOriginRect();
|
1473 | this._overlayRect = this._pane.getBoundingClientRect();
|
1474 | this._viewportRect = this._getNarrowedViewportRect();
|
1475 | this._containerRect = this._overlayContainer.getContainerElement().getBoundingClientRect();
|
1476 | const originPoint = this._getOriginPoint(this._originRect, this._containerRect, lastPosition);
|
1477 | this._applyPosition(lastPosition, originPoint);
|
1478 | }
|
1479 | else {
|
1480 | this.apply();
|
1481 | }
|
1482 | }
|
1483 | |
1484 |
|
1485 |
|
1486 |
|
1487 |
|
1488 | withScrollableContainers(scrollables) {
|
1489 | this._scrollables = scrollables;
|
1490 | return this;
|
1491 | }
|
1492 | |
1493 |
|
1494 |
|
1495 |
|
1496 | withPositions(positions) {
|
1497 | this._preferredPositions = positions;
|
1498 |
|
1499 |
|
1500 | if (positions.indexOf(this._lastPosition) === -1) {
|
1501 | this._lastPosition = null;
|
1502 | }
|
1503 | this._validatePositions();
|
1504 | return this;
|
1505 | }
|
1506 | |
1507 |
|
1508 |
|
1509 |
|
1510 | withViewportMargin(margin) {
|
1511 | this._viewportMargin = margin;
|
1512 | return this;
|
1513 | }
|
1514 |
|
1515 | withFlexibleDimensions(flexibleDimensions = true) {
|
1516 | this._hasFlexibleDimensions = flexibleDimensions;
|
1517 | return this;
|
1518 | }
|
1519 |
|
1520 | withGrowAfterOpen(growAfterOpen = true) {
|
1521 | this._growAfterOpen = growAfterOpen;
|
1522 | return this;
|
1523 | }
|
1524 |
|
1525 | withPush(canPush = true) {
|
1526 | this._canPush = canPush;
|
1527 | return this;
|
1528 | }
|
1529 | |
1530 |
|
1531 |
|
1532 |
|
1533 |
|
1534 |
|
1535 | withLockedPosition(isLocked = true) {
|
1536 | this._positionLocked = isLocked;
|
1537 | return this;
|
1538 | }
|
1539 | |
1540 |
|
1541 |
|
1542 |
|
1543 |
|
1544 |
|
1545 |
|
1546 | setOrigin(origin) {
|
1547 | this._origin = origin;
|
1548 | return this;
|
1549 | }
|
1550 | |
1551 |
|
1552 |
|
1553 |
|
1554 | withDefaultOffsetX(offset) {
|
1555 | this._offsetX = offset;
|
1556 | return this;
|
1557 | }
|
1558 | |
1559 |
|
1560 |
|
1561 |
|
1562 | withDefaultOffsetY(offset) {
|
1563 | this._offsetY = offset;
|
1564 | return this;
|
1565 | }
|
1566 | |
1567 |
|
1568 |
|
1569 |
|
1570 |
|
1571 |
|
1572 |
|
1573 |
|
1574 | withTransformOriginOn(selector) {
|
1575 | this._transformOriginSelector = selector;
|
1576 | return this;
|
1577 | }
|
1578 | |
1579 |
|
1580 |
|
1581 | _getOriginPoint(originRect, containerRect, pos) {
|
1582 | let x;
|
1583 | if (pos.originX == 'center') {
|
1584 |
|
1585 |
|
1586 | x = originRect.left + originRect.width / 2;
|
1587 | }
|
1588 | else {
|
1589 | const startX = this._isRtl() ? originRect.right : originRect.left;
|
1590 | const endX = this._isRtl() ? originRect.left : originRect.right;
|
1591 | x = pos.originX == 'start' ? startX : endX;
|
1592 | }
|
1593 |
|
1594 |
|
1595 | if (containerRect.left < 0) {
|
1596 | x -= containerRect.left;
|
1597 | }
|
1598 | let y;
|
1599 | if (pos.originY == 'center') {
|
1600 | y = originRect.top + originRect.height / 2;
|
1601 | }
|
1602 | else {
|
1603 | y = pos.originY == 'top' ? originRect.top : originRect.bottom;
|
1604 | }
|
1605 |
|
1606 |
|
1607 |
|
1608 |
|
1609 |
|
1610 | if (containerRect.top < 0) {
|
1611 | y -= containerRect.top;
|
1612 | }
|
1613 | return { x, y };
|
1614 | }
|
1615 | |
1616 |
|
1617 |
|
1618 |
|
1619 | _getOverlayPoint(originPoint, overlayRect, pos) {
|
1620 |
|
1621 |
|
1622 | let overlayStartX;
|
1623 | if (pos.overlayX == 'center') {
|
1624 | overlayStartX = -overlayRect.width / 2;
|
1625 | }
|
1626 | else if (pos.overlayX === 'start') {
|
1627 | overlayStartX = this._isRtl() ? -overlayRect.width : 0;
|
1628 | }
|
1629 | else {
|
1630 | overlayStartX = this._isRtl() ? 0 : -overlayRect.width;
|
1631 | }
|
1632 | let overlayStartY;
|
1633 | if (pos.overlayY == 'center') {
|
1634 | overlayStartY = -overlayRect.height / 2;
|
1635 | }
|
1636 | else {
|
1637 | overlayStartY = pos.overlayY == 'top' ? 0 : -overlayRect.height;
|
1638 | }
|
1639 |
|
1640 | return {
|
1641 | x: originPoint.x + overlayStartX,
|
1642 | y: originPoint.y + overlayStartY,
|
1643 | };
|
1644 | }
|
1645 |
|
1646 | _getOverlayFit(point, rawOverlayRect, viewport, position) {
|
1647 |
|
1648 |
|
1649 | const overlay = getRoundedBoundingClientRect(rawOverlayRect);
|
1650 | let { x, y } = point;
|
1651 | let offsetX = this._getOffset(position, 'x');
|
1652 | let offsetY = this._getOffset(position, 'y');
|
1653 |
|
1654 | if (offsetX) {
|
1655 | x += offsetX;
|
1656 | }
|
1657 | if (offsetY) {
|
1658 | y += offsetY;
|
1659 | }
|
1660 |
|
1661 | let leftOverflow = 0 - x;
|
1662 | let rightOverflow = x + overlay.width - viewport.width;
|
1663 | let topOverflow = 0 - y;
|
1664 | let bottomOverflow = y + overlay.height - viewport.height;
|
1665 |
|
1666 | let visibleWidth = this._subtractOverflows(overlay.width, leftOverflow, rightOverflow);
|
1667 | let visibleHeight = this._subtractOverflows(overlay.height, topOverflow, bottomOverflow);
|
1668 | let visibleArea = visibleWidth * visibleHeight;
|
1669 | return {
|
1670 | visibleArea,
|
1671 | isCompletelyWithinViewport: overlay.width * overlay.height === visibleArea,
|
1672 | fitsInViewportVertically: visibleHeight === overlay.height,
|
1673 | fitsInViewportHorizontally: visibleWidth == overlay.width,
|
1674 | };
|
1675 | }
|
1676 | |
1677 |
|
1678 |
|
1679 |
|
1680 |
|
1681 |
|
1682 | _canFitWithFlexibleDimensions(fit, point, viewport) {
|
1683 | if (this._hasFlexibleDimensions) {
|
1684 | const availableHeight = viewport.bottom - point.y;
|
1685 | const availableWidth = viewport.right - point.x;
|
1686 | const minHeight = getPixelValue(this._overlayRef.getConfig().minHeight);
|
1687 | const minWidth = getPixelValue(this._overlayRef.getConfig().minWidth);
|
1688 | const verticalFit = fit.fitsInViewportVertically || (minHeight != null && minHeight <= availableHeight);
|
1689 | const horizontalFit = fit.fitsInViewportHorizontally || (minWidth != null && minWidth <= availableWidth);
|
1690 | return verticalFit && horizontalFit;
|
1691 | }
|
1692 | return false;
|
1693 | }
|
1694 | |
1695 |
|
1696 |
|
1697 |
|
1698 |
|
1699 |
|
1700 |
|
1701 |
|
1702 |
|
1703 |
|
1704 |
|
1705 | _pushOverlayOnScreen(start, rawOverlayRect, scrollPosition) {
|
1706 |
|
1707 |
|
1708 |
|
1709 | if (this._previousPushAmount && this._positionLocked) {
|
1710 | return {
|
1711 | x: start.x + this._previousPushAmount.x,
|
1712 | y: start.y + this._previousPushAmount.y,
|
1713 | };
|
1714 | }
|
1715 |
|
1716 |
|
1717 | const overlay = getRoundedBoundingClientRect(rawOverlayRect);
|
1718 | const viewport = this._viewportRect;
|
1719 |
|
1720 |
|
1721 | const overflowRight = Math.max(start.x + overlay.width - viewport.width, 0);
|
1722 | const overflowBottom = Math.max(start.y + overlay.height - viewport.height, 0);
|
1723 | const overflowTop = Math.max(viewport.top - scrollPosition.top - start.y, 0);
|
1724 | const overflowLeft = Math.max(viewport.left - scrollPosition.left - start.x, 0);
|
1725 |
|
1726 | let pushX = 0;
|
1727 | let pushY = 0;
|
1728 |
|
1729 |
|
1730 |
|
1731 | if (overlay.width <= viewport.width) {
|
1732 | pushX = overflowLeft || -overflowRight;
|
1733 | }
|
1734 | else {
|
1735 | pushX = start.x < this._viewportMargin ? viewport.left - scrollPosition.left - start.x : 0;
|
1736 | }
|
1737 | if (overlay.height <= viewport.height) {
|
1738 | pushY = overflowTop || -overflowBottom;
|
1739 | }
|
1740 | else {
|
1741 | pushY = start.y < this._viewportMargin ? viewport.top - scrollPosition.top - start.y : 0;
|
1742 | }
|
1743 | this._previousPushAmount = { x: pushX, y: pushY };
|
1744 | return {
|
1745 | x: start.x + pushX,
|
1746 | y: start.y + pushY,
|
1747 | };
|
1748 | }
|
1749 | |
1750 |
|
1751 |
|
1752 |
|
1753 |
|
1754 | _applyPosition(position, originPoint) {
|
1755 | this._setTransformOrigin(position);
|
1756 | this._setOverlayElementStyles(originPoint, position);
|
1757 | this._setBoundingBoxStyles(originPoint, position);
|
1758 | if (position.panelClass) {
|
1759 | this._addPanelClasses(position.panelClass);
|
1760 | }
|
1761 |
|
1762 | this._lastPosition = position;
|
1763 |
|
1764 |
|
1765 |
|
1766 | if (this._positionChanges.observers.length) {
|
1767 | const scrollableViewProperties = this._getScrollVisibility();
|
1768 | const changeEvent = new ConnectedOverlayPositionChange(position, scrollableViewProperties);
|
1769 | this._positionChanges.next(changeEvent);
|
1770 | }
|
1771 | this._isInitialRender = false;
|
1772 | }
|
1773 |
|
1774 | _setTransformOrigin(position) {
|
1775 | if (!this._transformOriginSelector) {
|
1776 | return;
|
1777 | }
|
1778 | const elements = this._boundingBox.querySelectorAll(this._transformOriginSelector);
|
1779 | let xOrigin;
|
1780 | let yOrigin = position.overlayY;
|
1781 | if (position.overlayX === 'center') {
|
1782 | xOrigin = 'center';
|
1783 | }
|
1784 | else if (this._isRtl()) {
|
1785 | xOrigin = position.overlayX === 'start' ? 'right' : 'left';
|
1786 | }
|
1787 | else {
|
1788 | xOrigin = position.overlayX === 'start' ? 'left' : 'right';
|
1789 | }
|
1790 | for (let i = 0; i < elements.length; i++) {
|
1791 | elements[i].style.transformOrigin = `${xOrigin} ${yOrigin}`;
|
1792 | }
|
1793 | }
|
1794 | |
1795 |
|
1796 |
|
1797 |
|
1798 |
|
1799 |
|
1800 | _calculateBoundingBoxRect(origin, position) {
|
1801 | const viewport = this._viewportRect;
|
1802 | const isRtl = this._isRtl();
|
1803 | let height, top, bottom;
|
1804 | if (position.overlayY === 'top') {
|
1805 |
|
1806 | top = origin.y;
|
1807 | height = viewport.height - top + this._viewportMargin;
|
1808 | }
|
1809 | else if (position.overlayY === 'bottom') {
|
1810 |
|
1811 |
|
1812 |
|
1813 | bottom = viewport.height - origin.y + this._viewportMargin * 2;
|
1814 | height = viewport.height - bottom + this._viewportMargin;
|
1815 | }
|
1816 | else {
|
1817 |
|
1818 |
|
1819 |
|
1820 |
|
1821 | const smallestDistanceToViewportEdge = Math.min(viewport.bottom - origin.y + viewport.top, origin.y);
|
1822 | const previousHeight = this._lastBoundingBoxSize.height;
|
1823 | height = smallestDistanceToViewportEdge * 2;
|
1824 | top = origin.y - smallestDistanceToViewportEdge;
|
1825 | if (height > previousHeight && !this._isInitialRender && !this._growAfterOpen) {
|
1826 | top = origin.y - previousHeight / 2;
|
1827 | }
|
1828 | }
|
1829 |
|
1830 | const isBoundedByRightViewportEdge = (position.overlayX === 'start' && !isRtl) || (position.overlayX === 'end' && isRtl);
|
1831 |
|
1832 | const isBoundedByLeftViewportEdge = (position.overlayX === 'end' && !isRtl) || (position.overlayX === 'start' && isRtl);
|
1833 | let width, left, right;
|
1834 | if (isBoundedByLeftViewportEdge) {
|
1835 | right = viewport.width - origin.x + this._viewportMargin;
|
1836 | width = origin.x - this._viewportMargin;
|
1837 | }
|
1838 | else if (isBoundedByRightViewportEdge) {
|
1839 | left = origin.x;
|
1840 | width = viewport.right - origin.x;
|
1841 | }
|
1842 | else {
|
1843 |
|
1844 |
|
1845 |
|
1846 |
|
1847 | const smallestDistanceToViewportEdge = Math.min(viewport.right - origin.x + viewport.left, origin.x);
|
1848 | const previousWidth = this._lastBoundingBoxSize.width;
|
1849 | width = smallestDistanceToViewportEdge * 2;
|
1850 | left = origin.x - smallestDistanceToViewportEdge;
|
1851 | if (width > previousWidth && !this._isInitialRender && !this._growAfterOpen) {
|
1852 | left = origin.x - previousWidth / 2;
|
1853 | }
|
1854 | }
|
1855 | return { top: top, left: left, bottom: bottom, right: right, width, height };
|
1856 | }
|
1857 | |
1858 |
|
1859 |
|
1860 |
|
1861 |
|
1862 |
|
1863 |
|
1864 | _setBoundingBoxStyles(origin, position) {
|
1865 | const boundingBoxRect = this._calculateBoundingBoxRect(origin, position);
|
1866 |
|
1867 |
|
1868 | if (!this._isInitialRender && !this._growAfterOpen) {
|
1869 | boundingBoxRect.height = Math.min(boundingBoxRect.height, this._lastBoundingBoxSize.height);
|
1870 | boundingBoxRect.width = Math.min(boundingBoxRect.width, this._lastBoundingBoxSize.width);
|
1871 | }
|
1872 | const styles = {};
|
1873 | if (this._hasExactPosition()) {
|
1874 | styles.top = styles.left = '0';
|
1875 | styles.bottom = styles.right = styles.maxHeight = styles.maxWidth = '';
|
1876 | styles.width = styles.height = '100%';
|
1877 | }
|
1878 | else {
|
1879 | const maxHeight = this._overlayRef.getConfig().maxHeight;
|
1880 | const maxWidth = this._overlayRef.getConfig().maxWidth;
|
1881 | styles.height = coerceCssPixelValue(boundingBoxRect.height);
|
1882 | styles.top = coerceCssPixelValue(boundingBoxRect.top);
|
1883 | styles.bottom = coerceCssPixelValue(boundingBoxRect.bottom);
|
1884 | styles.width = coerceCssPixelValue(boundingBoxRect.width);
|
1885 | styles.left = coerceCssPixelValue(boundingBoxRect.left);
|
1886 | styles.right = coerceCssPixelValue(boundingBoxRect.right);
|
1887 |
|
1888 | if (position.overlayX === 'center') {
|
1889 | styles.alignItems = 'center';
|
1890 | }
|
1891 | else {
|
1892 | styles.alignItems = position.overlayX === 'end' ? 'flex-end' : 'flex-start';
|
1893 | }
|
1894 | if (position.overlayY === 'center') {
|
1895 | styles.justifyContent = 'center';
|
1896 | }
|
1897 | else {
|
1898 | styles.justifyContent = position.overlayY === 'bottom' ? 'flex-end' : 'flex-start';
|
1899 | }
|
1900 | if (maxHeight) {
|
1901 | styles.maxHeight = coerceCssPixelValue(maxHeight);
|
1902 | }
|
1903 | if (maxWidth) {
|
1904 | styles.maxWidth = coerceCssPixelValue(maxWidth);
|
1905 | }
|
1906 | }
|
1907 | this._lastBoundingBoxSize = boundingBoxRect;
|
1908 | extendStyles(this._boundingBox.style, styles);
|
1909 | }
|
1910 |
|
1911 | _resetBoundingBoxStyles() {
|
1912 | extendStyles(this._boundingBox.style, {
|
1913 | top: '0',
|
1914 | left: '0',
|
1915 | right: '0',
|
1916 | bottom: '0',
|
1917 | height: '',
|
1918 | width: '',
|
1919 | alignItems: '',
|
1920 | justifyContent: '',
|
1921 | });
|
1922 | }
|
1923 |
|
1924 | _resetOverlayElementStyles() {
|
1925 | extendStyles(this._pane.style, {
|
1926 | top: '',
|
1927 | left: '',
|
1928 | bottom: '',
|
1929 | right: '',
|
1930 | position: '',
|
1931 | transform: '',
|
1932 | });
|
1933 | }
|
1934 |
|
1935 | _setOverlayElementStyles(originPoint, position) {
|
1936 | const styles = {};
|
1937 | const hasExactPosition = this._hasExactPosition();
|
1938 | const hasFlexibleDimensions = this._hasFlexibleDimensions;
|
1939 | const config = this._overlayRef.getConfig();
|
1940 | if (hasExactPosition) {
|
1941 | const scrollPosition = this._viewportRuler.getViewportScrollPosition();
|
1942 | extendStyles(styles, this._getExactOverlayY(position, originPoint, scrollPosition));
|
1943 | extendStyles(styles, this._getExactOverlayX(position, originPoint, scrollPosition));
|
1944 | }
|
1945 | else {
|
1946 | styles.position = 'static';
|
1947 | }
|
1948 |
|
1949 |
|
1950 |
|
1951 |
|
1952 |
|
1953 | let transformString = '';
|
1954 | let offsetX = this._getOffset(position, 'x');
|
1955 | let offsetY = this._getOffset(position, 'y');
|
1956 | if (offsetX) {
|
1957 | transformString += `translateX(${offsetX}px) `;
|
1958 | }
|
1959 | if (offsetY) {
|
1960 | transformString += `translateY(${offsetY}px)`;
|
1961 | }
|
1962 | styles.transform = transformString.trim();
|
1963 |
|
1964 |
|
1965 |
|
1966 |
|
1967 |
|
1968 | if (config.maxHeight) {
|
1969 | if (hasExactPosition) {
|
1970 | styles.maxHeight = coerceCssPixelValue(config.maxHeight);
|
1971 | }
|
1972 | else if (hasFlexibleDimensions) {
|
1973 | styles.maxHeight = '';
|
1974 | }
|
1975 | }
|
1976 | if (config.maxWidth) {
|
1977 | if (hasExactPosition) {
|
1978 | styles.maxWidth = coerceCssPixelValue(config.maxWidth);
|
1979 | }
|
1980 | else if (hasFlexibleDimensions) {
|
1981 | styles.maxWidth = '';
|
1982 | }
|
1983 | }
|
1984 | extendStyles(this._pane.style, styles);
|
1985 | }
|
1986 |
|
1987 | _getExactOverlayY(position, originPoint, scrollPosition) {
|
1988 |
|
1989 |
|
1990 | let styles = { top: '', bottom: '' };
|
1991 | let overlayPoint = this._getOverlayPoint(originPoint, this._overlayRect, position);
|
1992 | if (this._isPushed) {
|
1993 | overlayPoint = this._pushOverlayOnScreen(overlayPoint, this._overlayRect, scrollPosition);
|
1994 | }
|
1995 |
|
1996 |
|
1997 | if (position.overlayY === 'bottom') {
|
1998 |
|
1999 |
|
2000 | const documentHeight = this._document.documentElement.clientHeight;
|
2001 | styles.bottom = `${documentHeight - (overlayPoint.y + this._overlayRect.height)}px`;
|
2002 | }
|
2003 | else {
|
2004 | styles.top = coerceCssPixelValue(overlayPoint.y);
|
2005 | }
|
2006 | return styles;
|
2007 | }
|
2008 |
|
2009 | _getExactOverlayX(position, originPoint, scrollPosition) {
|
2010 |
|
2011 |
|
2012 | let styles = { left: '', right: '' };
|
2013 | let overlayPoint = this._getOverlayPoint(originPoint, this._overlayRect, position);
|
2014 | if (this._isPushed) {
|
2015 | overlayPoint = this._pushOverlayOnScreen(overlayPoint, this._overlayRect, scrollPosition);
|
2016 | }
|
2017 |
|
2018 |
|
2019 |
|
2020 |
|
2021 | let horizontalStyleProperty;
|
2022 | if (this._isRtl()) {
|
2023 | horizontalStyleProperty = position.overlayX === 'end' ? 'left' : 'right';
|
2024 | }
|
2025 | else {
|
2026 | horizontalStyleProperty = position.overlayX === 'end' ? 'right' : 'left';
|
2027 | }
|
2028 |
|
2029 |
|
2030 | if (horizontalStyleProperty === 'right') {
|
2031 | const documentWidth = this._document.documentElement.clientWidth;
|
2032 | styles.right = `${documentWidth - (overlayPoint.x + this._overlayRect.width)}px`;
|
2033 | }
|
2034 | else {
|
2035 | styles.left = coerceCssPixelValue(overlayPoint.x);
|
2036 | }
|
2037 | return styles;
|
2038 | }
|
2039 | |
2040 |
|
2041 |
|
2042 |
|
2043 | _getScrollVisibility() {
|
2044 |
|
2045 | const originBounds = this._getOriginRect();
|
2046 | const overlayBounds = this._pane.getBoundingClientRect();
|
2047 |
|
2048 |
|
2049 |
|
2050 | const scrollContainerBounds = this._scrollables.map(scrollable => {
|
2051 | return scrollable.getElementRef().nativeElement.getBoundingClientRect();
|
2052 | });
|
2053 | return {
|
2054 | isOriginClipped: isElementClippedByScrolling(originBounds, scrollContainerBounds),
|
2055 | isOriginOutsideView: isElementScrolledOutsideView(originBounds, scrollContainerBounds),
|
2056 | isOverlayClipped: isElementClippedByScrolling(overlayBounds, scrollContainerBounds),
|
2057 | isOverlayOutsideView: isElementScrolledOutsideView(overlayBounds, scrollContainerBounds),
|
2058 | };
|
2059 | }
|
2060 |
|
2061 | _subtractOverflows(length, ...overflows) {
|
2062 | return overflows.reduce((currentValue, currentOverflow) => {
|
2063 | return currentValue - Math.max(currentOverflow, 0);
|
2064 | }, length);
|
2065 | }
|
2066 |
|
2067 | _getNarrowedViewportRect() {
|
2068 |
|
2069 |
|
2070 |
|
2071 |
|
2072 |
|
2073 | const width = this._document.documentElement.clientWidth;
|
2074 | const height = this._document.documentElement.clientHeight;
|
2075 | const scrollPosition = this._viewportRuler.getViewportScrollPosition();
|
2076 | return {
|
2077 | top: scrollPosition.top + this._viewportMargin,
|
2078 | left: scrollPosition.left + this._viewportMargin,
|
2079 | right: scrollPosition.left + width - this._viewportMargin,
|
2080 | bottom: scrollPosition.top + height - this._viewportMargin,
|
2081 | width: width - 2 * this._viewportMargin,
|
2082 | height: height - 2 * this._viewportMargin,
|
2083 | };
|
2084 | }
|
2085 |
|
2086 | _isRtl() {
|
2087 | return this._overlayRef.getDirection() === 'rtl';
|
2088 | }
|
2089 |
|
2090 | _hasExactPosition() {
|
2091 | return !this._hasFlexibleDimensions || this._isPushed;
|
2092 | }
|
2093 |
|
2094 | _getOffset(position, axis) {
|
2095 | if (axis === 'x') {
|
2096 |
|
2097 |
|
2098 | return position.offsetX == null ? this._offsetX : position.offsetX;
|
2099 | }
|
2100 | return position.offsetY == null ? this._offsetY : position.offsetY;
|
2101 | }
|
2102 |
|
2103 | _validatePositions() {
|
2104 | if (typeof ngDevMode === 'undefined' || ngDevMode) {
|
2105 | if (!this._preferredPositions.length) {
|
2106 | throw Error('FlexibleConnectedPositionStrategy: At least one position is required.');
|
2107 | }
|
2108 |
|
2109 |
|
2110 | this._preferredPositions.forEach(pair => {
|
2111 | validateHorizontalPosition('originX', pair.originX);
|
2112 | validateVerticalPosition('originY', pair.originY);
|
2113 | validateHorizontalPosition('overlayX', pair.overlayX);
|
2114 | validateVerticalPosition('overlayY', pair.overlayY);
|
2115 | });
|
2116 | }
|
2117 | }
|
2118 |
|
2119 | _addPanelClasses(cssClasses) {
|
2120 | if (this._pane) {
|
2121 | coerceArray(cssClasses).forEach(cssClass => {
|
2122 | if (cssClass !== '' && this._appliedPanelClasses.indexOf(cssClass) === -1) {
|
2123 | this._appliedPanelClasses.push(cssClass);
|
2124 | this._pane.classList.add(cssClass);
|
2125 | }
|
2126 | });
|
2127 | }
|
2128 | }
|
2129 |
|
2130 | _clearPanelClasses() {
|
2131 | if (this._pane) {
|
2132 | this._appliedPanelClasses.forEach(cssClass => {
|
2133 | this._pane.classList.remove(cssClass);
|
2134 | });
|
2135 | this._appliedPanelClasses = [];
|
2136 | }
|
2137 | }
|
2138 |
|
2139 | _getOriginRect() {
|
2140 | const origin = this._origin;
|
2141 | if (origin instanceof ElementRef) {
|
2142 | return origin.nativeElement.getBoundingClientRect();
|
2143 | }
|
2144 |
|
2145 | if (origin instanceof Element) {
|
2146 | return origin.getBoundingClientRect();
|
2147 | }
|
2148 | const width = origin.width || 0;
|
2149 | const height = origin.height || 0;
|
2150 |
|
2151 | return {
|
2152 | top: origin.y,
|
2153 | bottom: origin.y + height,
|
2154 | left: origin.x,
|
2155 | right: origin.x + width,
|
2156 | height,
|
2157 | width,
|
2158 | };
|
2159 | }
|
2160 | }
|
2161 |
|
2162 | function extendStyles(destination, source) {
|
2163 | for (let key in source) {
|
2164 | if (source.hasOwnProperty(key)) {
|
2165 | destination[key] = source[key];
|
2166 | }
|
2167 | }
|
2168 | return destination;
|
2169 | }
|
2170 |
|
2171 |
|
2172 |
|
2173 |
|
2174 | function getPixelValue(input) {
|
2175 | if (typeof input !== 'number' && input != null) {
|
2176 | const [value, units] = input.split(cssUnitPattern);
|
2177 | return !units || units === 'px' ? parseFloat(value) : null;
|
2178 | }
|
2179 | return input || null;
|
2180 | }
|
2181 |
|
2182 |
|
2183 |
|
2184 |
|
2185 |
|
2186 |
|
2187 | function getRoundedBoundingClientRect(clientRect) {
|
2188 | return {
|
2189 | top: Math.floor(clientRect.top),
|
2190 | right: Math.floor(clientRect.right),
|
2191 | bottom: Math.floor(clientRect.bottom),
|
2192 | left: Math.floor(clientRect.left),
|
2193 | width: Math.floor(clientRect.width),
|
2194 | height: Math.floor(clientRect.height),
|
2195 | };
|
2196 | }
|
2197 | const STANDARD_DROPDOWN_BELOW_POSITIONS = [
|
2198 | { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top' },
|
2199 | { originX: 'start', originY: 'top', overlayX: 'start', overlayY: 'bottom' },
|
2200 | { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top' },
|
2201 | { originX: 'end', originY: 'top', overlayX: 'end', overlayY: 'bottom' },
|
2202 | ];
|
2203 | const STANDARD_DROPDOWN_ADJACENT_POSITIONS = [
|
2204 | { originX: 'end', originY: 'top', overlayX: 'start', overlayY: 'top' },
|
2205 | { originX: 'end', originY: 'bottom', overlayX: 'start', overlayY: 'bottom' },
|
2206 | { originX: 'start', originY: 'top', overlayX: 'end', overlayY: 'top' },
|
2207 | { originX: 'start', originY: 'bottom', overlayX: 'end', overlayY: 'bottom' },
|
2208 | ];
|
2209 |
|
2210 |
|
2211 |
|
2212 |
|
2213 |
|
2214 |
|
2215 |
|
2216 |
|
2217 |
|
2218 | const wrapperClass = 'cdk-global-overlay-wrapper';
|
2219 |
|
2220 |
|
2221 |
|
2222 |
|
2223 |
|
2224 |
|
2225 | class GlobalPositionStrategy {
|
2226 | constructor() {
|
2227 | this._cssPosition = 'static';
|
2228 | this._topOffset = '';
|
2229 | this._bottomOffset = '';
|
2230 | this._alignItems = '';
|
2231 | this._xPosition = '';
|
2232 | this._xOffset = '';
|
2233 | this._width = '';
|
2234 | this._height = '';
|
2235 | this._isDisposed = false;
|
2236 | }
|
2237 | attach(overlayRef) {
|
2238 | const config = overlayRef.getConfig();
|
2239 | this._overlayRef = overlayRef;
|
2240 | if (this._width && !config.width) {
|
2241 | overlayRef.updateSize({ width: this._width });
|
2242 | }
|
2243 | if (this._height && !config.height) {
|
2244 | overlayRef.updateSize({ height: this._height });
|
2245 | }
|
2246 | overlayRef.hostElement.classList.add(wrapperClass);
|
2247 | this._isDisposed = false;
|
2248 | }
|
2249 | |
2250 |
|
2251 |
|
2252 |
|
2253 | top(value = '') {
|
2254 | this._bottomOffset = '';
|
2255 | this._topOffset = value;
|
2256 | this._alignItems = 'flex-start';
|
2257 | return this;
|
2258 | }
|
2259 | |
2260 |
|
2261 |
|
2262 |
|
2263 | left(value = '') {
|
2264 | this._xOffset = value;
|
2265 | this._xPosition = 'left';
|
2266 | return this;
|
2267 | }
|
2268 | |
2269 |
|
2270 |
|
2271 |
|
2272 | bottom(value = '') {
|
2273 | this._topOffset = '';
|
2274 | this._bottomOffset = value;
|
2275 | this._alignItems = 'flex-end';
|
2276 | return this;
|
2277 | }
|
2278 | |
2279 |
|
2280 |
|
2281 |
|
2282 | right(value = '') {
|
2283 | this._xOffset = value;
|
2284 | this._xPosition = 'right';
|
2285 | return this;
|
2286 | }
|
2287 | |
2288 |
|
2289 |
|
2290 |
|
2291 |
|
2292 | start(value = '') {
|
2293 | this._xOffset = value;
|
2294 | this._xPosition = 'start';
|
2295 | return this;
|
2296 | }
|
2297 | |
2298 |
|
2299 |
|
2300 |
|
2301 |
|
2302 | end(value = '') {
|
2303 | this._xOffset = value;
|
2304 | this._xPosition = 'end';
|
2305 | return this;
|
2306 | }
|
2307 | |
2308 |
|
2309 |
|
2310 |
|
2311 |
|
2312 |
|
2313 | width(value = '') {
|
2314 | if (this._overlayRef) {
|
2315 | this._overlayRef.updateSize({ width: value });
|
2316 | }
|
2317 | else {
|
2318 | this._width = value;
|
2319 | }
|
2320 | return this;
|
2321 | }
|
2322 | |
2323 |
|
2324 |
|
2325 |
|
2326 |
|
2327 |
|
2328 | height(value = '') {
|
2329 | if (this._overlayRef) {
|
2330 | this._overlayRef.updateSize({ height: value });
|
2331 | }
|
2332 | else {
|
2333 | this._height = value;
|
2334 | }
|
2335 | return this;
|
2336 | }
|
2337 | |
2338 |
|
2339 |
|
2340 |
|
2341 |
|
2342 |
|
2343 | centerHorizontally(offset = '') {
|
2344 | this.left(offset);
|
2345 | this._xPosition = 'center';
|
2346 | return this;
|
2347 | }
|
2348 | |
2349 |
|
2350 |
|
2351 |
|
2352 |
|
2353 |
|
2354 | centerVertically(offset = '') {
|
2355 | this.top(offset);
|
2356 | this._alignItems = 'center';
|
2357 | return this;
|
2358 | }
|
2359 | |
2360 |
|
2361 |
|
2362 |
|
2363 | apply() {
|
2364 |
|
2365 |
|
2366 |
|
2367 | if (!this._overlayRef || !this._overlayRef.hasAttached()) {
|
2368 | return;
|
2369 | }
|
2370 | const styles = this._overlayRef.overlayElement.style;
|
2371 | const parentStyles = this._overlayRef.hostElement.style;
|
2372 | const config = this._overlayRef.getConfig();
|
2373 | const { width, height, maxWidth, maxHeight } = config;
|
2374 | const shouldBeFlushHorizontally = (width === '100%' || width === '100vw') &&
|
2375 | (!maxWidth || maxWidth === '100%' || maxWidth === '100vw');
|
2376 | const shouldBeFlushVertically = (height === '100%' || height === '100vh') &&
|
2377 | (!maxHeight || maxHeight === '100%' || maxHeight === '100vh');
|
2378 | const xPosition = this._xPosition;
|
2379 | const xOffset = this._xOffset;
|
2380 | const isRtl = this._overlayRef.getConfig().direction === 'rtl';
|
2381 | let marginLeft = '';
|
2382 | let marginRight = '';
|
2383 | let justifyContent = '';
|
2384 | if (shouldBeFlushHorizontally) {
|
2385 | justifyContent = 'flex-start';
|
2386 | }
|
2387 | else if (xPosition === 'center') {
|
2388 | justifyContent = 'center';
|
2389 | if (isRtl) {
|
2390 | marginRight = xOffset;
|
2391 | }
|
2392 | else {
|
2393 | marginLeft = xOffset;
|
2394 | }
|
2395 | }
|
2396 | else if (isRtl) {
|
2397 | if (xPosition === 'left' || xPosition === 'end') {
|
2398 | justifyContent = 'flex-end';
|
2399 | marginLeft = xOffset;
|
2400 | }
|
2401 | else if (xPosition === 'right' || xPosition === 'start') {
|
2402 | justifyContent = 'flex-start';
|
2403 | marginRight = xOffset;
|
2404 | }
|
2405 | }
|
2406 | else if (xPosition === 'left' || xPosition === 'start') {
|
2407 | justifyContent = 'flex-start';
|
2408 | marginLeft = xOffset;
|
2409 | }
|
2410 | else if (xPosition === 'right' || xPosition === 'end') {
|
2411 | justifyContent = 'flex-end';
|
2412 | marginRight = xOffset;
|
2413 | }
|
2414 | styles.position = this._cssPosition;
|
2415 | styles.marginLeft = shouldBeFlushHorizontally ? '0' : marginLeft;
|
2416 | styles.marginTop = shouldBeFlushVertically ? '0' : this._topOffset;
|
2417 | styles.marginBottom = this._bottomOffset;
|
2418 | styles.marginRight = shouldBeFlushHorizontally ? '0' : marginRight;
|
2419 | parentStyles.justifyContent = justifyContent;
|
2420 | parentStyles.alignItems = shouldBeFlushVertically ? 'flex-start' : this._alignItems;
|
2421 | }
|
2422 | |
2423 |
|
2424 |
|
2425 |
|
2426 | dispose() {
|
2427 | if (this._isDisposed || !this._overlayRef) {
|
2428 | return;
|
2429 | }
|
2430 | const styles = this._overlayRef.overlayElement.style;
|
2431 | const parent = this._overlayRef.hostElement;
|
2432 | const parentStyles = parent.style;
|
2433 | parent.classList.remove(wrapperClass);
|
2434 | parentStyles.justifyContent =
|
2435 | parentStyles.alignItems =
|
2436 | styles.marginTop =
|
2437 | styles.marginBottom =
|
2438 | styles.marginLeft =
|
2439 | styles.marginRight =
|
2440 | styles.position =
|
2441 | '';
|
2442 | this._overlayRef = null;
|
2443 | this._isDisposed = true;
|
2444 | }
|
2445 | }
|
2446 |
|
2447 |
|
2448 |
|
2449 |
|
2450 |
|
2451 |
|
2452 |
|
2453 |
|
2454 |
|
2455 | class OverlayPositionBuilder {
|
2456 | constructor(_viewportRuler, _document, _platform, _overlayContainer) {
|
2457 | this._viewportRuler = _viewportRuler;
|
2458 | this._document = _document;
|
2459 | this._platform = _platform;
|
2460 | this._overlayContainer = _overlayContainer;
|
2461 | }
|
2462 | |
2463 |
|
2464 |
|
2465 | global() {
|
2466 | return new GlobalPositionStrategy();
|
2467 | }
|
2468 | |
2469 |
|
2470 |
|
2471 |
|
2472 | flexibleConnectedTo(origin) {
|
2473 | return new FlexibleConnectedPositionStrategy(origin, this._viewportRuler, this._document, this._platform, this._overlayContainer);
|
2474 | }
|
2475 | }
|
2476 | OverlayPositionBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayPositionBuilder, deps: [{ token: i1.ViewportRuler }, { token: DOCUMENT }, { token: i1$1.Platform }, { token: OverlayContainer }], target: i0.ɵɵFactoryTarget.Injectable });
|
2477 | OverlayPositionBuilder.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayPositionBuilder, providedIn: 'root' });
|
2478 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayPositionBuilder, decorators: [{
|
2479 | type: Injectable,
|
2480 | args: [{ providedIn: 'root' }]
|
2481 | }], ctorParameters: function () { return [{ type: i1.ViewportRuler }, { type: undefined, decorators: [{
|
2482 | type: Inject,
|
2483 | args: [DOCUMENT]
|
2484 | }] }, { type: i1$1.Platform }, { type: OverlayContainer }]; } });
|
2485 |
|
2486 |
|
2487 |
|
2488 |
|
2489 |
|
2490 |
|
2491 |
|
2492 |
|
2493 |
|
2494 | let nextUniqueId = 0;
|
2495 |
|
2496 |
|
2497 |
|
2498 |
|
2499 |
|
2500 |
|
2501 |
|
2502 |
|
2503 |
|
2504 |
|
2505 | class Overlay {
|
2506 | constructor(
|
2507 | /** Scrolling strategies that can be used when creating an overlay. */
|
2508 | scrollStrategies, _overlayContainer, _componentFactoryResolver, _positionBuilder, _keyboardDispatcher, _injector, _ngZone, _document, _directionality, _location, _outsideClickDispatcher, _animationsModuleType) {
|
2509 | this.scrollStrategies = scrollStrategies;
|
2510 | this._overlayContainer = _overlayContainer;
|
2511 | this._componentFactoryResolver = _componentFactoryResolver;
|
2512 | this._positionBuilder = _positionBuilder;
|
2513 | this._keyboardDispatcher = _keyboardDispatcher;
|
2514 | this._injector = _injector;
|
2515 | this._ngZone = _ngZone;
|
2516 | this._document = _document;
|
2517 | this._directionality = _directionality;
|
2518 | this._location = _location;
|
2519 | this._outsideClickDispatcher = _outsideClickDispatcher;
|
2520 | this._animationsModuleType = _animationsModuleType;
|
2521 | }
|
2522 | |
2523 |
|
2524 |
|
2525 |
|
2526 |
|
2527 | create(config) {
|
2528 | const host = this._createHostElement();
|
2529 | const pane = this._createPaneElement(host);
|
2530 | const portalOutlet = this._createPortalOutlet(pane);
|
2531 | const overlayConfig = new OverlayConfig(config);
|
2532 | overlayConfig.direction = overlayConfig.direction || this._directionality.value;
|
2533 | return new OverlayRef(portalOutlet, host, pane, overlayConfig, this._ngZone, this._keyboardDispatcher, this._document, this._location, this._outsideClickDispatcher, this._animationsModuleType === 'NoopAnimations');
|
2534 | }
|
2535 | |
2536 |
|
2537 |
|
2538 |
|
2539 |
|
2540 | position() {
|
2541 | return this._positionBuilder;
|
2542 | }
|
2543 | |
2544 |
|
2545 |
|
2546 |
|
2547 | _createPaneElement(host) {
|
2548 | const pane = this._document.createElement('div');
|
2549 | pane.id = `cdk-overlay-${nextUniqueId++}`;
|
2550 | pane.classList.add('cdk-overlay-pane');
|
2551 | host.appendChild(pane);
|
2552 | return pane;
|
2553 | }
|
2554 | |
2555 |
|
2556 |
|
2557 |
|
2558 |
|
2559 | _createHostElement() {
|
2560 | const host = this._document.createElement('div');
|
2561 | this._overlayContainer.getContainerElement().appendChild(host);
|
2562 | return host;
|
2563 | }
|
2564 | |
2565 |
|
2566 |
|
2567 |
|
2568 |
|
2569 | _createPortalOutlet(pane) {
|
2570 |
|
2571 |
|
2572 | if (!this._appRef) {
|
2573 | this._appRef = this._injector.get(ApplicationRef);
|
2574 | }
|
2575 | return new DomPortalOutlet(pane, this._componentFactoryResolver, this._appRef, this._injector, this._document);
|
2576 | }
|
2577 | }
|
2578 | Overlay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: Overlay, deps: [{ token: ScrollStrategyOptions }, { token: OverlayContainer }, { token: i0.ComponentFactoryResolver }, { token: OverlayPositionBuilder }, { token: OverlayKeyboardDispatcher }, { token: i0.Injector }, { token: i0.NgZone }, { token: DOCUMENT }, { token: i5.Directionality }, { token: i6.Location }, { token: OverlayOutsideClickDispatcher }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
|
2579 | Overlay.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: Overlay });
|
2580 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: Overlay, decorators: [{
|
2581 | type: Injectable
|
2582 | }], ctorParameters: function () { return [{ type: ScrollStrategyOptions }, { type: OverlayContainer }, { type: i0.ComponentFactoryResolver }, { type: OverlayPositionBuilder }, { type: OverlayKeyboardDispatcher }, { type: i0.Injector }, { type: i0.NgZone }, { type: undefined, decorators: [{
|
2583 | type: Inject,
|
2584 | args: [DOCUMENT]
|
2585 | }] }, { type: i5.Directionality }, { type: i6.Location }, { type: OverlayOutsideClickDispatcher }, { type: undefined, decorators: [{
|
2586 | type: Inject,
|
2587 | args: [ANIMATION_MODULE_TYPE]
|
2588 | }, {
|
2589 | type: Optional
|
2590 | }] }]; } });
|
2591 |
|
2592 |
|
2593 |
|
2594 |
|
2595 |
|
2596 |
|
2597 |
|
2598 |
|
2599 |
|
2600 | const defaultPositionList = [
|
2601 | {
|
2602 | originX: 'start',
|
2603 | originY: 'bottom',
|
2604 | overlayX: 'start',
|
2605 | overlayY: 'top',
|
2606 | },
|
2607 | {
|
2608 | originX: 'start',
|
2609 | originY: 'top',
|
2610 | overlayX: 'start',
|
2611 | overlayY: 'bottom',
|
2612 | },
|
2613 | {
|
2614 | originX: 'end',
|
2615 | originY: 'top',
|
2616 | overlayX: 'end',
|
2617 | overlayY: 'bottom',
|
2618 | },
|
2619 | {
|
2620 | originX: 'end',
|
2621 | originY: 'bottom',
|
2622 | overlayX: 'end',
|
2623 | overlayY: 'top',
|
2624 | },
|
2625 | ];
|
2626 |
|
2627 | const CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY = new InjectionToken('cdk-connected-overlay-scroll-strategy');
|
2628 |
|
2629 |
|
2630 |
|
2631 |
|
2632 | class CdkOverlayOrigin {
|
2633 | constructor(
|
2634 | /** Reference to the element on which the directive is applied. */
|
2635 | elementRef) {
|
2636 | this.elementRef = elementRef;
|
2637 | }
|
2638 | }
|
2639 | CdkOverlayOrigin.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: CdkOverlayOrigin, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
2640 | CdkOverlayOrigin.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"], ngImport: i0 });
|
2641 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: CdkOverlayOrigin, decorators: [{
|
2642 | type: Directive,
|
2643 | args: [{
|
2644 | selector: '[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]',
|
2645 | exportAs: 'cdkOverlayOrigin',
|
2646 | }]
|
2647 | }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
|
2648 |
|
2649 |
|
2650 |
|
2651 |
|
2652 | class CdkConnectedOverlay {
|
2653 |
|
2654 | constructor(_overlay, templateRef, viewContainerRef, scrollStrategyFactory, _dir) {
|
2655 | this._overlay = _overlay;
|
2656 | this._dir = _dir;
|
2657 | this._hasBackdrop = false;
|
2658 | this._lockPosition = false;
|
2659 | this._growAfterOpen = false;
|
2660 | this._flexibleDimensions = false;
|
2661 | this._push = false;
|
2662 | this._backdropSubscription = Subscription.EMPTY;
|
2663 | this._attachSubscription = Subscription.EMPTY;
|
2664 | this._detachSubscription = Subscription.EMPTY;
|
2665 | this._positionSubscription = Subscription.EMPTY;
|
2666 |
|
2667 | this.viewportMargin = 0;
|
2668 |
|
2669 | this.open = false;
|
2670 |
|
2671 | this.disableClose = false;
|
2672 |
|
2673 | this.backdropClick = new EventEmitter();
|
2674 |
|
2675 | this.positionChange = new EventEmitter();
|
2676 |
|
2677 | this.attach = new EventEmitter();
|
2678 |
|
2679 | this.detach = new EventEmitter();
|
2680 |
|
2681 | this.overlayKeydown = new EventEmitter();
|
2682 |
|
2683 | this.overlayOutsideClick = new EventEmitter();
|
2684 | this._templatePortal = new TemplatePortal(templateRef, viewContainerRef);
|
2685 | this._scrollStrategyFactory = scrollStrategyFactory;
|
2686 | this.scrollStrategy = this._scrollStrategyFactory();
|
2687 | }
|
2688 |
|
2689 | get offsetX() {
|
2690 | return this._offsetX;
|
2691 | }
|
2692 | set offsetX(offsetX) {
|
2693 | this._offsetX = offsetX;
|
2694 | if (this._position) {
|
2695 | this._updatePositionStrategy(this._position);
|
2696 | }
|
2697 | }
|
2698 |
|
2699 | get offsetY() {
|
2700 | return this._offsetY;
|
2701 | }
|
2702 | set offsetY(offsetY) {
|
2703 | this._offsetY = offsetY;
|
2704 | if (this._position) {
|
2705 | this._updatePositionStrategy(this._position);
|
2706 | }
|
2707 | }
|
2708 |
|
2709 | get hasBackdrop() {
|
2710 | return this._hasBackdrop;
|
2711 | }
|
2712 | set hasBackdrop(value) {
|
2713 | this._hasBackdrop = coerceBooleanProperty(value);
|
2714 | }
|
2715 |
|
2716 | get lockPosition() {
|
2717 | return this._lockPosition;
|
2718 | }
|
2719 | set lockPosition(value) {
|
2720 | this._lockPosition = coerceBooleanProperty(value);
|
2721 | }
|
2722 |
|
2723 | get flexibleDimensions() {
|
2724 | return this._flexibleDimensions;
|
2725 | }
|
2726 | set flexibleDimensions(value) {
|
2727 | this._flexibleDimensions = coerceBooleanProperty(value);
|
2728 | }
|
2729 |
|
2730 | get growAfterOpen() {
|
2731 | return this._growAfterOpen;
|
2732 | }
|
2733 | set growAfterOpen(value) {
|
2734 | this._growAfterOpen = coerceBooleanProperty(value);
|
2735 | }
|
2736 |
|
2737 | get push() {
|
2738 | return this._push;
|
2739 | }
|
2740 | set push(value) {
|
2741 | this._push = coerceBooleanProperty(value);
|
2742 | }
|
2743 |
|
2744 | get overlayRef() {
|
2745 | return this._overlayRef;
|
2746 | }
|
2747 |
|
2748 | get dir() {
|
2749 | return this._dir ? this._dir.value : 'ltr';
|
2750 | }
|
2751 | ngOnDestroy() {
|
2752 | this._attachSubscription.unsubscribe();
|
2753 | this._detachSubscription.unsubscribe();
|
2754 | this._backdropSubscription.unsubscribe();
|
2755 | this._positionSubscription.unsubscribe();
|
2756 | if (this._overlayRef) {
|
2757 | this._overlayRef.dispose();
|
2758 | }
|
2759 | }
|
2760 | ngOnChanges(changes) {
|
2761 | if (this._position) {
|
2762 | this._updatePositionStrategy(this._position);
|
2763 | this._overlayRef.updateSize({
|
2764 | width: this.width,
|
2765 | minWidth: this.minWidth,
|
2766 | height: this.height,
|
2767 | minHeight: this.minHeight,
|
2768 | });
|
2769 | if (changes['origin'] && this.open) {
|
2770 | this._position.apply();
|
2771 | }
|
2772 | }
|
2773 | if (changes['open']) {
|
2774 | this.open ? this._attachOverlay() : this._detachOverlay();
|
2775 | }
|
2776 | }
|
2777 |
|
2778 | _createOverlay() {
|
2779 | if (!this.positions || !this.positions.length) {
|
2780 | this.positions = defaultPositionList;
|
2781 | }
|
2782 | const overlayRef = (this._overlayRef = this._overlay.create(this._buildConfig()));
|
2783 | this._attachSubscription = overlayRef.attachments().subscribe(() => this.attach.emit());
|
2784 | this._detachSubscription = overlayRef.detachments().subscribe(() => this.detach.emit());
|
2785 | overlayRef.keydownEvents().subscribe((event) => {
|
2786 | this.overlayKeydown.next(event);
|
2787 | if (event.keyCode === ESCAPE && !this.disableClose && !hasModifierKey(event)) {
|
2788 | event.preventDefault();
|
2789 | this._detachOverlay();
|
2790 | }
|
2791 | });
|
2792 | this._overlayRef.outsidePointerEvents().subscribe((event) => {
|
2793 | this.overlayOutsideClick.next(event);
|
2794 | });
|
2795 | }
|
2796 |
|
2797 | _buildConfig() {
|
2798 | const positionStrategy = (this._position =
|
2799 | this.positionStrategy || this._createPositionStrategy());
|
2800 | const overlayConfig = new OverlayConfig({
|
2801 | direction: this._dir,
|
2802 | positionStrategy,
|
2803 | scrollStrategy: this.scrollStrategy,
|
2804 | hasBackdrop: this.hasBackdrop,
|
2805 | });
|
2806 | if (this.width || this.width === 0) {
|
2807 | overlayConfig.width = this.width;
|
2808 | }
|
2809 | if (this.height || this.height === 0) {
|
2810 | overlayConfig.height = this.height;
|
2811 | }
|
2812 | if (this.minWidth || this.minWidth === 0) {
|
2813 | overlayConfig.minWidth = this.minWidth;
|
2814 | }
|
2815 | if (this.minHeight || this.minHeight === 0) {
|
2816 | overlayConfig.minHeight = this.minHeight;
|
2817 | }
|
2818 | if (this.backdropClass) {
|
2819 | overlayConfig.backdropClass = this.backdropClass;
|
2820 | }
|
2821 | if (this.panelClass) {
|
2822 | overlayConfig.panelClass = this.panelClass;
|
2823 | }
|
2824 | return overlayConfig;
|
2825 | }
|
2826 |
|
2827 | _updatePositionStrategy(positionStrategy) {
|
2828 | const positions = this.positions.map(currentPosition => ({
|
2829 | originX: currentPosition.originX,
|
2830 | originY: currentPosition.originY,
|
2831 | overlayX: currentPosition.overlayX,
|
2832 | overlayY: currentPosition.overlayY,
|
2833 | offsetX: currentPosition.offsetX || this.offsetX,
|
2834 | offsetY: currentPosition.offsetY || this.offsetY,
|
2835 | panelClass: currentPosition.panelClass || undefined,
|
2836 | }));
|
2837 | return positionStrategy
|
2838 | .setOrigin(this._getFlexibleConnectedPositionStrategyOrigin())
|
2839 | .withPositions(positions)
|
2840 | .withFlexibleDimensions(this.flexibleDimensions)
|
2841 | .withPush(this.push)
|
2842 | .withGrowAfterOpen(this.growAfterOpen)
|
2843 | .withViewportMargin(this.viewportMargin)
|
2844 | .withLockedPosition(this.lockPosition)
|
2845 | .withTransformOriginOn(this.transformOriginSelector);
|
2846 | }
|
2847 |
|
2848 | _createPositionStrategy() {
|
2849 | const strategy = this._overlay
|
2850 | .position()
|
2851 | .flexibleConnectedTo(this._getFlexibleConnectedPositionStrategyOrigin());
|
2852 | this._updatePositionStrategy(strategy);
|
2853 | return strategy;
|
2854 | }
|
2855 | _getFlexibleConnectedPositionStrategyOrigin() {
|
2856 | if (this.origin instanceof CdkOverlayOrigin) {
|
2857 | return this.origin.elementRef;
|
2858 | }
|
2859 | else {
|
2860 | return this.origin;
|
2861 | }
|
2862 | }
|
2863 |
|
2864 | _attachOverlay() {
|
2865 | if (!this._overlayRef) {
|
2866 | this._createOverlay();
|
2867 | }
|
2868 | else {
|
2869 |
|
2870 | this._overlayRef.getConfig().hasBackdrop = this.hasBackdrop;
|
2871 | }
|
2872 | if (!this._overlayRef.hasAttached()) {
|
2873 | this._overlayRef.attach(this._templatePortal);
|
2874 | }
|
2875 | if (this.hasBackdrop) {
|
2876 | this._backdropSubscription = this._overlayRef.backdropClick().subscribe(event => {
|
2877 | this.backdropClick.emit(event);
|
2878 | });
|
2879 | }
|
2880 | else {
|
2881 | this._backdropSubscription.unsubscribe();
|
2882 | }
|
2883 | this._positionSubscription.unsubscribe();
|
2884 |
|
2885 |
|
2886 | if (this.positionChange.observers.length > 0) {
|
2887 | this._positionSubscription = this._position.positionChanges
|
2888 | .pipe(takeWhile(() => this.positionChange.observers.length > 0))
|
2889 | .subscribe(position => {
|
2890 | this.positionChange.emit(position);
|
2891 | if (this.positionChange.observers.length === 0) {
|
2892 | this._positionSubscription.unsubscribe();
|
2893 | }
|
2894 | });
|
2895 | }
|
2896 | }
|
2897 |
|
2898 | _detachOverlay() {
|
2899 | if (this._overlayRef) {
|
2900 | this._overlayRef.detach();
|
2901 | }
|
2902 | this._backdropSubscription.unsubscribe();
|
2903 | this._positionSubscription.unsubscribe();
|
2904 | }
|
2905 | }
|
2906 | CdkConnectedOverlay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: CdkConnectedOverlay, deps: [{ token: Overlay }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY }, { token: i5.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
2907 | CdkConnectedOverlay.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: { origin: ["cdkConnectedOverlayOrigin", "origin"], positions: ["cdkConnectedOverlayPositions", "positions"], positionStrategy: ["cdkConnectedOverlayPositionStrategy", "positionStrategy"], offsetX: ["cdkConnectedOverlayOffsetX", "offsetX"], offsetY: ["cdkConnectedOverlayOffsetY", "offsetY"], width: ["cdkConnectedOverlayWidth", "width"], height: ["cdkConnectedOverlayHeight", "height"], minWidth: ["cdkConnectedOverlayMinWidth", "minWidth"], minHeight: ["cdkConnectedOverlayMinHeight", "minHeight"], backdropClass: ["cdkConnectedOverlayBackdropClass", "backdropClass"], panelClass: ["cdkConnectedOverlayPanelClass", "panelClass"], viewportMargin: ["cdkConnectedOverlayViewportMargin", "viewportMargin"], scrollStrategy: ["cdkConnectedOverlayScrollStrategy", "scrollStrategy"], open: ["cdkConnectedOverlayOpen", "open"], disableClose: ["cdkConnectedOverlayDisableClose", "disableClose"], transformOriginSelector: ["cdkConnectedOverlayTransformOriginOn", "transformOriginSelector"], hasBackdrop: ["cdkConnectedOverlayHasBackdrop", "hasBackdrop"], lockPosition: ["cdkConnectedOverlayLockPosition", "lockPosition"], flexibleDimensions: ["cdkConnectedOverlayFlexibleDimensions", "flexibleDimensions"], growAfterOpen: ["cdkConnectedOverlayGrowAfterOpen", "growAfterOpen"], push: ["cdkConnectedOverlayPush", "push"] }, outputs: { backdropClick: "backdropClick", positionChange: "positionChange", attach: "attach", detach: "detach", overlayKeydown: "overlayKeydown", overlayOutsideClick: "overlayOutsideClick" }, exportAs: ["cdkConnectedOverlay"], usesOnChanges: true, ngImport: i0 });
|
2908 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: CdkConnectedOverlay, decorators: [{
|
2909 | type: Directive,
|
2910 | args: [{
|
2911 | selector: '[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]',
|
2912 | exportAs: 'cdkConnectedOverlay',
|
2913 | }]
|
2914 | }], ctorParameters: function () { return [{ type: Overlay }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
|
2915 | type: Inject,
|
2916 | args: [CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY]
|
2917 | }] }, { type: i5.Directionality, decorators: [{
|
2918 | type: Optional
|
2919 | }] }]; }, propDecorators: { origin: [{
|
2920 | type: Input,
|
2921 | args: ['cdkConnectedOverlayOrigin']
|
2922 | }], positions: [{
|
2923 | type: Input,
|
2924 | args: ['cdkConnectedOverlayPositions']
|
2925 | }], positionStrategy: [{
|
2926 | type: Input,
|
2927 | args: ['cdkConnectedOverlayPositionStrategy']
|
2928 | }], offsetX: [{
|
2929 | type: Input,
|
2930 | args: ['cdkConnectedOverlayOffsetX']
|
2931 | }], offsetY: [{
|
2932 | type: Input,
|
2933 | args: ['cdkConnectedOverlayOffsetY']
|
2934 | }], width: [{
|
2935 | type: Input,
|
2936 | args: ['cdkConnectedOverlayWidth']
|
2937 | }], height: [{
|
2938 | type: Input,
|
2939 | args: ['cdkConnectedOverlayHeight']
|
2940 | }], minWidth: [{
|
2941 | type: Input,
|
2942 | args: ['cdkConnectedOverlayMinWidth']
|
2943 | }], minHeight: [{
|
2944 | type: Input,
|
2945 | args: ['cdkConnectedOverlayMinHeight']
|
2946 | }], backdropClass: [{
|
2947 | type: Input,
|
2948 | args: ['cdkConnectedOverlayBackdropClass']
|
2949 | }], panelClass: [{
|
2950 | type: Input,
|
2951 | args: ['cdkConnectedOverlayPanelClass']
|
2952 | }], viewportMargin: [{
|
2953 | type: Input,
|
2954 | args: ['cdkConnectedOverlayViewportMargin']
|
2955 | }], scrollStrategy: [{
|
2956 | type: Input,
|
2957 | args: ['cdkConnectedOverlayScrollStrategy']
|
2958 | }], open: [{
|
2959 | type: Input,
|
2960 | args: ['cdkConnectedOverlayOpen']
|
2961 | }], disableClose: [{
|
2962 | type: Input,
|
2963 | args: ['cdkConnectedOverlayDisableClose']
|
2964 | }], transformOriginSelector: [{
|
2965 | type: Input,
|
2966 | args: ['cdkConnectedOverlayTransformOriginOn']
|
2967 | }], hasBackdrop: [{
|
2968 | type: Input,
|
2969 | args: ['cdkConnectedOverlayHasBackdrop']
|
2970 | }], lockPosition: [{
|
2971 | type: Input,
|
2972 | args: ['cdkConnectedOverlayLockPosition']
|
2973 | }], flexibleDimensions: [{
|
2974 | type: Input,
|
2975 | args: ['cdkConnectedOverlayFlexibleDimensions']
|
2976 | }], growAfterOpen: [{
|
2977 | type: Input,
|
2978 | args: ['cdkConnectedOverlayGrowAfterOpen']
|
2979 | }], push: [{
|
2980 | type: Input,
|
2981 | args: ['cdkConnectedOverlayPush']
|
2982 | }], backdropClick: [{
|
2983 | type: Output
|
2984 | }], positionChange: [{
|
2985 | type: Output
|
2986 | }], attach: [{
|
2987 | type: Output
|
2988 | }], detach: [{
|
2989 | type: Output
|
2990 | }], overlayKeydown: [{
|
2991 | type: Output
|
2992 | }], overlayOutsideClick: [{
|
2993 | type: Output
|
2994 | }] } });
|
2995 |
|
2996 | function CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) {
|
2997 | return () => overlay.scrollStrategies.reposition();
|
2998 | }
|
2999 |
|
3000 | const CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER = {
|
3001 | provide: CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY,
|
3002 | deps: [Overlay],
|
3003 | useFactory: CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY,
|
3004 | };
|
3005 |
|
3006 |
|
3007 |
|
3008 |
|
3009 |
|
3010 |
|
3011 |
|
3012 |
|
3013 | class OverlayModule {
|
3014 | }
|
3015 | OverlayModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
3016 | OverlayModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.1", ngImport: i0, type: OverlayModule, declarations: [CdkConnectedOverlay, CdkOverlayOrigin], imports: [BidiModule, PortalModule, ScrollingModule], exports: [CdkConnectedOverlay, CdkOverlayOrigin, ScrollingModule] });
|
3017 | OverlayModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayModule, providers: [Overlay, CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER], imports: [BidiModule, PortalModule, ScrollingModule, ScrollingModule] });
|
3018 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: OverlayModule, decorators: [{
|
3019 | type: NgModule,
|
3020 | args: [{
|
3021 | imports: [BidiModule, PortalModule, ScrollingModule],
|
3022 | exports: [CdkConnectedOverlay, CdkOverlayOrigin, ScrollingModule],
|
3023 | declarations: [CdkConnectedOverlay, CdkOverlayOrigin],
|
3024 | providers: [Overlay, CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER],
|
3025 | }]
|
3026 | }] });
|
3027 |
|
3028 |
|
3029 |
|
3030 |
|
3031 |
|
3032 |
|
3033 |
|
3034 |
|
3035 |
|
3036 |
|
3037 |
|
3038 |
|
3039 |
|
3040 |
|
3041 |
|
3042 |
|
3043 |
|
3044 |
|
3045 |
|
3046 |
|
3047 |
|
3048 |
|
3049 |
|
3050 | class FullscreenOverlayContainer extends OverlayContainer {
|
3051 | constructor(_document, platform) {
|
3052 | super(_document, platform);
|
3053 | }
|
3054 | ngOnDestroy() {
|
3055 | super.ngOnDestroy();
|
3056 | if (this._fullScreenEventName && this._fullScreenListener) {
|
3057 | this._document.removeEventListener(this._fullScreenEventName, this._fullScreenListener);
|
3058 | }
|
3059 | }
|
3060 | _createContainer() {
|
3061 | super._createContainer();
|
3062 | this._adjustParentForFullscreenChange();
|
3063 | this._addFullscreenChangeListener(() => this._adjustParentForFullscreenChange());
|
3064 | }
|
3065 | _adjustParentForFullscreenChange() {
|
3066 | if (!this._containerElement) {
|
3067 | return;
|
3068 | }
|
3069 | const fullscreenElement = this.getFullscreenElement();
|
3070 | const parent = fullscreenElement || this._document.body;
|
3071 | parent.appendChild(this._containerElement);
|
3072 | }
|
3073 | _addFullscreenChangeListener(fn) {
|
3074 | const eventName = this._getEventName();
|
3075 | if (eventName) {
|
3076 | if (this._fullScreenListener) {
|
3077 | this._document.removeEventListener(eventName, this._fullScreenListener);
|
3078 | }
|
3079 | this._document.addEventListener(eventName, fn);
|
3080 | this._fullScreenListener = fn;
|
3081 | }
|
3082 | }
|
3083 | _getEventName() {
|
3084 | if (!this._fullScreenEventName) {
|
3085 | const _document = this._document;
|
3086 | if (_document.fullscreenEnabled) {
|
3087 | this._fullScreenEventName = 'fullscreenchange';
|
3088 | }
|
3089 | else if (_document.webkitFullscreenEnabled) {
|
3090 | this._fullScreenEventName = 'webkitfullscreenchange';
|
3091 | }
|
3092 | else if (_document.mozFullScreenEnabled) {
|
3093 | this._fullScreenEventName = 'mozfullscreenchange';
|
3094 | }
|
3095 | else if (_document.msFullscreenEnabled) {
|
3096 | this._fullScreenEventName = 'MSFullscreenChange';
|
3097 | }
|
3098 | }
|
3099 | return this._fullScreenEventName;
|
3100 | }
|
3101 | |
3102 |
|
3103 |
|
3104 |
|
3105 | getFullscreenElement() {
|
3106 | const _document = this._document;
|
3107 | return (_document.fullscreenElement ||
|
3108 | _document.webkitFullscreenElement ||
|
3109 | _document.mozFullScreenElement ||
|
3110 | _document.msFullscreenElement ||
|
3111 | null);
|
3112 | }
|
3113 | }
|
3114 | FullscreenOverlayContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: FullscreenOverlayContainer, deps: [{ token: DOCUMENT }, { token: i1$1.Platform }], target: i0.ɵɵFactoryTarget.Injectable });
|
3115 | FullscreenOverlayContainer.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: FullscreenOverlayContainer, providedIn: 'root' });
|
3116 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: FullscreenOverlayContainer, decorators: [{
|
3117 | type: Injectable,
|
3118 | args: [{ providedIn: 'root' }]
|
3119 | }], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
3120 | type: Inject,
|
3121 | args: [DOCUMENT]
|
3122 | }] }, { type: i1$1.Platform }]; } });
|
3123 |
|
3124 |
|
3125 |
|
3126 |
|
3127 |
|
3128 |
|
3129 |
|
3130 |
|
3131 |
|
3132 |
|
3133 |
|
3134 |
|
3135 |
|
3136 |
|
3137 |
|
3138 |
|
3139 |
|
3140 |
|
3141 |
|
3142 |
|
3143 |
|
3144 | export { BlockScrollStrategy, CdkConnectedOverlay, CdkOverlayOrigin, CloseScrollStrategy, ConnectedOverlayPositionChange, ConnectionPositionPair, FlexibleConnectedPositionStrategy, FullscreenOverlayContainer, GlobalPositionStrategy, NoopScrollStrategy, Overlay, OverlayConfig, OverlayContainer, OverlayKeyboardDispatcher, OverlayModule, OverlayOutsideClickDispatcher, OverlayPositionBuilder, OverlayRef, RepositionScrollStrategy, STANDARD_DROPDOWN_ADJACENT_POSITIONS, STANDARD_DROPDOWN_BELOW_POSITIONS, ScrollStrategyOptions, ScrollingVisibility, validateHorizontalPosition, validateVerticalPosition };
|
3145 |
|