@skyux/core 8.10.1 → 8.10.3

package/fesm2020/skyux-core.mjs

@@ -1,10 +1,11 @@
 import * as i0 from '@angular/core';
-import { NgModule, Injectable, EventEmitter, Directive, Input, Output, Injector, ViewContainerRef, Component, ChangeDetectionStrategy, ViewChild, createComponent, inject, InjectionToken, Optional, Inject, Pipe, ElementRef, HostBinding } from '@angular/core';
+import { NgModule, Injectable, inject, RendererFactory2, NgZone, EventEmitter, Directive, Input, Output, Injector, ViewContainerRef, Component, ChangeDetectionStrategy, ViewChild, createComponent, InjectionToken, Optional, Inject, Pipe, ElementRef, HostBinding } from '@angular/core';
 import { __classPrivateFieldSet, __classPrivateFieldGet } from 'tslib';
 import * as i5 from '@angular/common';
 import { CommonModule, DOCUMENT } from '@angular/common';
-import { Subject, fromEvent, ReplaySubject, BehaviorSubject, Observable, of, concat, animationFrameScheduler } from 'rxjs';
+import { Subject, Subscription, ReplaySubject, fromEvent, BehaviorSubject, Observable, of, concat, animationFrameScheduler } from 'rxjs';
 import { takeUntil, debounceTime, finalize, switchMap, map } from 'rxjs/operators';
+import { ViewportRuler } from '@angular/cdk/overlay';
 import * as i1 from '@skyux/i18n';
 import { getLibStringForLocale, SkyI18nModule, SKY_LIB_RESOURCES_PROVIDERS, SkyIntlNumberFormatStyle, SkyIntlNumberFormatter } from '@skyux/i18n';
 import * as i4 from '@angular/router';
@@ -375,7 +376,7 @@ function isOffsetPartiallyVisibleWithinParent(parent, offset, bufferOffset) {
         parentOffset.left >= offset.right);
 }
 
-var _SkyAffixer_instances, _SkyAffixer_config_get, _SkyAffixer_config_set, _SkyAffixer_affixedElement, _SkyAffixer_baseElement, _SkyAffixer_currentOffset, _SkyAffixer_currentPlacement, _SkyAffixer_offsetChange, _SkyAffixer_offsetChangeObs, _SkyAffixer_overflowParents, _SkyAffixer_overflowScroll, _SkyAffixer_overflowScrollObs, _SkyAffixer_placementChange, _SkyAffixer_placementChangeObs, _SkyAffixer_renderer, _SkyAffixer_resizeListener, _SkyAffixer_scrollListeners, _SkyAffixer__config, _SkyAffixer_affix, _SkyAffixer_getOffset, _SkyAffixer_getRect, _SkyAffixer_getPreferredOffset, _SkyAffixer_adjustOffsetToOverflowParent, _SkyAffixer_getImmediateOverflowParent, _SkyAffixer_getAutoFitContextParent, _SkyAffixer_notifyPlacementChange, _SkyAffixer_reset, _SkyAffixer_isNewOffset, _SkyAffixer_isBaseElementVisible, _SkyAffixer_addScrollListeners, _SkyAffixer_addResizeListener, _SkyAffixer_removeResizeListener, _SkyAffixer_removeScrollListeners;
+var _SkyAffixer_instances, _SkyAffixer_config_get, _SkyAffixer_config_set, _SkyAffixer_affixedElement, _SkyAffixer_baseElement, _SkyAffixer_currentOffset, _SkyAffixer_currentPlacement, _SkyAffixer_offsetChange, _SkyAffixer_offsetChangeObs, _SkyAffixer_overflowParents, _SkyAffixer_overflowScroll, _SkyAffixer_overflowScrollObs, _SkyAffixer_placementChange, _SkyAffixer_placementChangeObs, _SkyAffixer_renderer, _SkyAffixer_scrollChange, _SkyAffixer_viewportListeners, _SkyAffixer_viewportRuler, _SkyAffixer_zone, _SkyAffixer__config, _SkyAffixer_scrollChangeListener, _SkyAffixer_affix, _SkyAffixer_getOffset, _SkyAffixer_getRect, _SkyAffixer_getPreferredOffset, _SkyAffixer_adjustOffsetToOverflowParent, _SkyAffixer_getImmediateOverflowParent, _SkyAffixer_getAutoFitContextParent, _SkyAffixer_notifyPlacementChange, _SkyAffixer_reset, _SkyAffixer_isNewOffset, _SkyAffixer_isBaseElementVisible, _SkyAffixer_addViewportListeners, _SkyAffixer_removeViewportListeners;
 const DEFAULT_AFFIX_CONFIG = {
     autoFitContext: SkyAffixAutoFitContext.OverflowParent,
     enableAutoFit: false,
@@ -405,7 +406,7 @@ class SkyAffixer {
     get placementChange() {
         return __classPrivateFieldGet(this, _SkyAffixer_placementChangeObs, "f");
     }
-    constructor(affixedElement, renderer) {
+    constructor(affixedElement, renderer, viewportRuler, zone) {
         _SkyAffixer_instances.add(this);
         _SkyAffixer_affixedElement.set(this, void 0);
         _SkyAffixer_baseElement.set(this, void 0);
@@ -419,11 +420,16 @@ class SkyAffixer {
         _SkyAffixer_placementChange.set(this, void 0);
         _SkyAffixer_placementChangeObs.set(this, void 0);
         _SkyAffixer_renderer.set(this, void 0);
-        _SkyAffixer_resizeListener.set(this, void 0);
-        _SkyAffixer_scrollListeners.set(this, void 0);
+        _SkyAffixer_scrollChange.set(this, new Subject());
+        _SkyAffixer_viewportListeners.set(this, void 0);
+        _SkyAffixer_viewportRuler.set(this, void 0);
+        _SkyAffixer_zone.set(this, void 0);
         _SkyAffixer__config.set(this, DEFAULT_AFFIX_CONFIG);
+        _SkyAffixer_scrollChangeListener.set(this, () => __classPrivateFieldGet(this, _SkyAffixer_scrollChange, "f").next());
         __classPrivateFieldSet(this, _SkyAffixer_affixedElement, affixedElement, "f");
         __classPrivateFieldSet(this, _SkyAffixer_renderer, renderer, "f");
+        __classPrivateFieldSet(this, _SkyAffixer_viewportRuler, viewportRuler, "f");
+        __classPrivateFieldSet(this, _SkyAffixer_zone, zone, "f");
         __classPrivateFieldSet(this, _SkyAffixer_offsetChange, new Subject(), "f");
         __classPrivateFieldSet(this, _SkyAffixer_overflowScroll, new Subject(), "f");
         __classPrivateFieldSet(this, _SkyAffixer_placementChange, new Subject(), "f");
@@ -443,8 +449,7 @@ class SkyAffixer {
         __classPrivateFieldSet(this, _SkyAffixer_overflowParents, getOverflowParents(baseElement), "f");
         __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_affix).call(this);
         if (__classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).isSticky) {
-            __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_addScrollListeners).call(this);
-            __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_addResizeListener).call(this);
+            __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_addViewportListeners).call(this);
         }
     }
     getConfig() {
@@ -466,9 +471,10 @@ class SkyAffixer {
         __classPrivateFieldGet(this, _SkyAffixer_placementChange, "f").complete();
         __classPrivateFieldGet(this, _SkyAffixer_offsetChange, "f").complete();
         __classPrivateFieldGet(this, _SkyAffixer_overflowScroll, "f").complete();
+        __classPrivateFieldGet(this, _SkyAffixer_scrollChange, "f").complete();
     }
 }
-_SkyAffixer_affixedElement = new WeakMap(), _SkyAffixer_baseElement = new WeakMap(), _SkyAffixer_currentOffset = new WeakMap(), _SkyAffixer_currentPlacement = new WeakMap(), _SkyAffixer_offsetChange = new WeakMap(), _SkyAffixer_offsetChangeObs = new WeakMap(), _SkyAffixer_overflowParents = new WeakMap(), _SkyAffixer_overflowScroll = new WeakMap(), _SkyAffixer_overflowScrollObs = new WeakMap(), _SkyAffixer_placementChange = new WeakMap(), _SkyAffixer_placementChangeObs = new WeakMap(), _SkyAffixer_renderer = new WeakMap(), _SkyAffixer_resizeListener = new WeakMap(), _SkyAffixer_scrollListeners = new WeakMap(), _SkyAffixer__config = new WeakMap(), _SkyAffixer_instances = new WeakSet(), _SkyAffixer_config_get = function _SkyAffixer_config_get() {
+_SkyAffixer_affixedElement = new WeakMap(), _SkyAffixer_baseElement = new WeakMap(), _SkyAffixer_currentOffset = new WeakMap(), _SkyAffixer_currentPlacement = new WeakMap(), _SkyAffixer_offsetChange = new WeakMap(), _SkyAffixer_offsetChangeObs = new WeakMap(), _SkyAffixer_overflowParents = new WeakMap(), _SkyAffixer_overflowScroll = new WeakMap(), _SkyAffixer_overflowScrollObs = new WeakMap(), _SkyAffixer_placementChange = new WeakMap(), _SkyAffixer_placementChangeObs = new WeakMap(), _SkyAffixer_renderer = new WeakMap(), _SkyAffixer_scrollChange = new WeakMap(), _SkyAffixer_viewportListeners = new WeakMap(), _SkyAffixer_viewportRuler = new WeakMap(), _SkyAffixer_zone = new WeakMap(), _SkyAffixer__config = new WeakMap(), _SkyAffixer_scrollChangeListener = new WeakMap(), _SkyAffixer_instances = new WeakSet(), _SkyAffixer_config_get = function _SkyAffixer_config_get() {
     return __classPrivateFieldGet(this, _SkyAffixer__config, "f");
 }, _SkyAffixer_config_set = function _SkyAffixer_config_set(value) {
     const merged = {
@@ -504,8 +510,11 @@ _SkyAffixer_affixedElement = new WeakMap(), _SkyAffixer_baseElement = new WeakMa
         top: 0,
     };
     if (__classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).position === 'absolute') {
-        autoFitOverflowOffset.top =
-            (autoFitOverflowOffset.top || 0) + window.scrollY;
+        const { top, left } = __classPrivateFieldGet(this, _SkyAffixer_viewportRuler, "f").getViewportScrollPosition();
+        autoFitOverflowOffset.top = (autoFitOverflowOffset.top || 0) + top;
+        autoFitOverflowOffset.left = (autoFitOverflowOffset.left || 0) + left;
+        autoFitOverflowOffset.bottom = (autoFitOverflowOffset.bottom || 0) + top;
+        autoFitOverflowOffset.right = (autoFitOverflowOffset.right || 0) + left;
     }
     do {
         offset = __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getPreferredOffset).call(this, placement);
@@ -546,8 +555,11 @@ _SkyAffixer_affixedElement = new WeakMap(), _SkyAffixer_baseElement = new WeakMa
         height: baseDomRect.height,
     };
     if (__classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).position === 'absolute') {
-        baseRect.top += window.scrollY;
-        baseRect.bottom = baseRect.top + baseDomRect.height;
+        const { left, top } = __classPrivateFieldGet(this, _SkyAffixer_viewportRuler, "f").getViewportScrollPosition();
+        baseRect.top += top;
+        baseRect.left += left;
+        baseRect.bottom += top;
+        baseRect.right += left;
     }
     return baseRect;
 }, _SkyAffixer_getPreferredOffset = function _SkyAffixer_getPreferredOffset(placement) {
@@ -697,8 +709,7 @@ _SkyAffixer_affixedElement = new WeakMap(), _SkyAffixer_baseElement = new WeakMa
         });
     }
 }, _SkyAffixer_reset = function _SkyAffixer_reset() {
-    __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_removeScrollListeners).call(this);
-    __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_removeResizeListener).call(this);
+    __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_removeViewportListeners).call(this);
     __classPrivateFieldSet(this, _SkyAffixer_overflowParents, [], "f");
     __classPrivateFieldSet(this, _SkyAffixer_instances, __classPrivateFieldSet(this, _SkyAffixer_baseElement, __classPrivateFieldSet(this, _SkyAffixer_currentPlacement, __classPrivateFieldSet(this, _SkyAffixer_currentOffset, undefined, "f"), "f"), "f"), "a", _SkyAffixer_config_set);
 }, _SkyAffixer_isNewOffset = function _SkyAffixer_isNewOffset(offset) {
@@ -723,53 +734,56 @@ _SkyAffixer_affixedElement = new WeakMap(), _SkyAffixer_baseElement = new WeakMa
         right: baseRect.right,
         bottom: baseRect.bottom,
     }, __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).autoFitOverflowOffset);
-}, _SkyAffixer_addScrollListeners = function _SkyAffixer_addScrollListeners() {
-    __classPrivateFieldSet(this, _SkyAffixer_scrollListeners, __classPrivateFieldGet(this, _SkyAffixer_overflowParents, "f").map((parentElement) => {
-        const overflow = parentElement === document.body ? 'window' : parentElement;
-        return __classPrivateFieldGet(this, _SkyAffixer_renderer, "f").listen(overflow, 'scroll', () => {
-            __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_affix).call(this);
-            __classPrivateFieldGet(this, _SkyAffixer_overflowScroll, "f").next();
+}, _SkyAffixer_addViewportListeners = function _SkyAffixer_addViewportListeners() {
+    __classPrivateFieldSet(this, _SkyAffixer_viewportListeners, new Subscription(), "f");
+    // Resize and orientation changes.
+    __classPrivateFieldGet(this, _SkyAffixer_viewportListeners, "f").add(__classPrivateFieldGet(this, _SkyAffixer_viewportRuler, "f").change().subscribe(() => {
+        __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_affix).call(this);
+    }));
+    __classPrivateFieldGet(this, _SkyAffixer_viewportListeners, "f").add(__classPrivateFieldGet(this, _SkyAffixer_scrollChange, "f").subscribe(() => {
+        __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_affix).call(this);
+        __classPrivateFieldGet(this, _SkyAffixer_overflowScroll, "f").next();
+    }));
+    // Listen for scroll events on the window, visual viewport, and any overflow parents.
+    // https://developer.chrome.com/blog/visual-viewport-api/#events-only-fire-when-the-visual-viewport-changes
+    __classPrivateFieldGet(this, _SkyAffixer_zone, "f").runOutsideAngular(() => {
+        [window, window.visualViewport, ...__classPrivateFieldGet(this, _SkyAffixer_overflowParents, "f")].forEach((parentElement) => {
+            parentElement?.addEventListener('scroll', __classPrivateFieldGet(this, _SkyAffixer_scrollChangeListener, "f"));
         });
-    }), "f");
-}, _SkyAffixer_addResizeListener = function _SkyAffixer_addResizeListener() {
-    __classPrivateFieldSet(this, _SkyAffixer_resizeListener, fromEvent(window, 'resize').subscribe(() => __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_affix).call(this)), "f");
-}, _SkyAffixer_removeResizeListener = function _SkyAffixer_removeResizeListener() {
-    if (__classPrivateFieldGet(this, _SkyAffixer_resizeListener, "f")) {
-        __classPrivateFieldGet(this, _SkyAffixer_resizeListener, "f").unsubscribe();
-        __classPrivateFieldSet(this, _SkyAffixer_resizeListener, undefined, "f");
-    }
-}, _SkyAffixer_removeScrollListeners = function _SkyAffixer_removeScrollListeners() {
-    if (__classPrivateFieldGet(this, _SkyAffixer_scrollListeners, "f")) {
-        // Remove renderer-generated listeners by calling the listener itself.
-        // https://github.com/angular/angular/issues/9368#issuecomment-227199778
-        __classPrivateFieldGet(this, _SkyAffixer_scrollListeners, "f").forEach((listener) => listener());
-        __classPrivateFieldSet(this, _SkyAffixer_scrollListeners, undefined, "f");
-    }
+    });
+}, _SkyAffixer_removeViewportListeners = function _SkyAffixer_removeViewportListeners() {
+    __classPrivateFieldGet(this, _SkyAffixer_viewportListeners, "f")?.unsubscribe();
+    __classPrivateFieldGet(this, _SkyAffixer_zone, "f").runOutsideAngular(() => {
+        [window, window.visualViewport, ...__classPrivateFieldGet(this, _SkyAffixer_overflowParents, "f")].forEach((parentElement) => {
+            parentElement?.removeEventListener('scroll', __classPrivateFieldGet(this, _SkyAffixer_scrollChangeListener, "f"));
+        });
+    });
 };
 
-var _SkyAffixService_renderer;
+var _SkyAffixService_renderer, _SkyAffixService_viewportRuler, _SkyAffixService_zone;
 class SkyAffixService {
-    constructor(rendererFactory) {
-        _SkyAffixService_renderer.set(this, void 0);
-        __classPrivateFieldSet(this, _SkyAffixService_renderer, rendererFactory.createRenderer(undefined, null), "f");
+    constructor() {
+        _SkyAffixService_renderer.set(this, inject(RendererFactory2).createRenderer(undefined, null));
+        _SkyAffixService_viewportRuler.set(this, inject(ViewportRuler));
+        _SkyAffixService_zone.set(this, inject(NgZone));
     }
     /**
      * Creates an instance of [[SkyAffixer]].
      * @param affixed The element to be affixed.
      */
     createAffixer(affixed) {
-        return new SkyAffixer(affixed.nativeElement, __classPrivateFieldGet(this, _SkyAffixService_renderer, "f"));
+        return new SkyAffixer(affixed.nativeElement, __classPrivateFieldGet(this, _SkyAffixService_renderer, "f"), __classPrivateFieldGet(this, _SkyAffixService_viewportRuler, "f"), __classPrivateFieldGet(this, _SkyAffixService_zone, "f"));
     }
 }
-_SkyAffixService_renderer = new WeakMap();
-SkyAffixService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAffixService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
+_SkyAffixService_renderer = new WeakMap(), _SkyAffixService_viewportRuler = new WeakMap(), _SkyAffixService_zone = new WeakMap();
+SkyAffixService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAffixService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
 SkyAffixService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAffixService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAffixService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
+        }] });
 
 var _SkyAffixDirective_instances, _SkyAffixDirective_affixer, _SkyAffixDirective_affixService, _SkyAffixDirective_elementRef, _SkyAffixDirective_ngUnsubscribe, _SkyAffixDirective_updateAlignment;
 /**