@skyux/core 6.16.0 → 6.18.0

package/fesm2020/skyux-core.mjs

@@ -45,7 +45,7 @@ var SkyMediaBreakpoints;
     SkyMediaBreakpoints[SkyMediaBreakpoints["lg"] = 4] = "lg";
 })(SkyMediaBreakpoints || (SkyMediaBreakpoints = {}));
 
-var _SkyCoreAdapterService_renderer;
+var _SkyCoreAdapterService_instances, _SkyCoreAdapterService_renderer, _SkyCoreAdapterService_focusFirstElement, _SkyCoreAdapterService_isVisible;
 const SKY_TABBABLE_SELECTOR = [
     'a[href]',
     'area[href]',
@@ -62,6 +62,7 @@ const SKY_TABBABLE_SELECTOR = [
 class SkyCoreAdapterService {
     constructor(rendererFactory) {
         this.rendererFactory = rendererFactory;
+        _SkyCoreAdapterService_instances.add(this);
         _SkyCoreAdapterService_renderer.set(this, void 0);
         __classPrivateFieldSet(this, _SkyCoreAdapterService_renderer, this.rendererFactory.createRenderer(undefined, null), "f");
     }
@@ -147,7 +148,7 @@ class SkyCoreAdapterService {
         if (containerElement) {
             const focusableChildren = this.getFocusableChildren(containerElement);
             // Focus first focusable child if available. Otherwise, set focus on container.
-            if (!this.focusFirstElement(focusableChildren) &&
+            if (!__classPrivateFieldGet(this, _SkyCoreAdapterService_instances, "m", _SkyCoreAdapterService_focusFirstElement).call(this, focusableChildren) &&
                 focusOnContainerIfNoChildrenFound) {
                 containerElement.focus();
             }
@@ -173,7 +174,7 @@ class SkyCoreAdapterService {
         // Unless ignoreVisibility = true, filter out elements that are not visible.
         if (!options || !options.ignoreVisibility) {
             elements = elements.filter((el) => {
-                return this.isVisible(el);
+                return __classPrivateFieldGet(this, _SkyCoreAdapterService_instances, "m", _SkyCoreAdapterService_isVisible).call(this, el);
             });
         }
         return elements;
@@ -241,26 +242,24 @@ class SkyCoreAdapterService {
             }
         }
     }
-    focusFirstElement(list) {
-        if (list.length > 0) {
-            list[0].focus();
-            return true;
-        }
-        return false;
+}
+_SkyCoreAdapterService_renderer = new WeakMap(), _SkyCoreAdapterService_instances = new WeakSet(), _SkyCoreAdapterService_focusFirstElement = function _SkyCoreAdapterService_focusFirstElement(list) {
+    if (list.length > 0) {
+        list[0].focus();
+        return true;
     }
-    isVisible(element) {
-        const style = window.getComputedStyle(element);
-        const isHidden = style.display === 'none' || style.visibility === 'hidden';
-        if (isHidden) {
-            return false;
-        }
-        const hasBounds = !!(element.offsetWidth ||
-            element.offsetHeight ||
-            element.getClientRects().length);
-        return hasBounds;
+    return false;
+}, _SkyCoreAdapterService_isVisible = function _SkyCoreAdapterService_isVisible(element) {
+    const style = window.getComputedStyle(element);
+    const isHidden = style.display === 'none' || style.visibility === 'hidden';
+    if (isHidden) {
+        return false;
     }
-}
-_SkyCoreAdapterService_renderer = new WeakMap();
+    const hasBounds = !!(element.offsetWidth ||
+        element.offsetHeight ||
+        element.getClientRects().length);
+    return hasBounds;
+};
 SkyCoreAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyCoreAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyCoreAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyCoreAdapterService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyCoreAdapterService, decorators: [{
@@ -305,11 +304,11 @@ function getInversePlacement(placement) {
  * @param element The HTML element.
  * @param bufferOffset An optional offset to add/subtract to the element's actual offset.
  */
-function getElementOffset(element, bufferOffset = {}) {
-    const bufferOffsetBottom = bufferOffset.bottom || 0;
-    const bufferOffsetLeft = bufferOffset.left || 0;
-    const bufferOffsetRight = bufferOffset.right || 0;
-    const bufferOffsetTop = bufferOffset.top || 0;
+function getElementOffset(element, bufferOffset) {
+    const bufferOffsetBottom = bufferOffset?.bottom || 0;
+    const bufferOffsetLeft = bufferOffset?.left || 0;
+    const bufferOffsetRight = bufferOffset?.right || 0;
+    const bufferOffsetTop = bufferOffset?.top || 0;
     let top;
     let left;
     let right;
@@ -341,7 +340,7 @@ function getElementOffset(element, bufferOffset = {}) {
 function getOverflowParents(child) {
     const bodyElement = window.document.body;
     const results = [bodyElement];
-    let parentElement = child.parentNode;
+    let parentElement = child?.parentNode;
     while (parentElement !== undefined &&
         parentElement !== bodyElement &&
         parentElement instanceof HTMLElement) {
@@ -377,6 +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_getPreferredOffset, _SkyAffixer_adjustOffsetToOverflowParent, _SkyAffixer_getImmediateOverflowParent, _SkyAffixer_getAutoFitContextParent, _SkyAffixer_notifyPlacementChange, _SkyAffixer_reset, _SkyAffixer_isNewOffset, _SkyAffixer_isBaseElementVisible, _SkyAffixer_addScrollListeners, _SkyAffixer_addResizeListener, _SkyAffixer_removeResizeListener, _SkyAffixer_removeScrollListeners;
 const DEFAULT_AFFIX_CONFIG = {
     autoFitContext: SkyAffixAutoFitContext.OverflowParent,
     enableAutoFit: false,
@@ -386,17 +386,36 @@ const DEFAULT_AFFIX_CONFIG = {
 };
 class SkyAffixer {
     constructor(affixedElement, renderer) {
-        this.affixedElement = affixedElement;
-        this.renderer = renderer;
-        this._offsetChange = new Subject();
-        this._overflowScroll = new Subject();
-        this._placementChange = new Subject();
+        _SkyAffixer_instances.add(this);
+        _SkyAffixer_affixedElement.set(this, void 0);
+        _SkyAffixer_baseElement.set(this, void 0);
+        _SkyAffixer_currentOffset.set(this, void 0);
+        _SkyAffixer_currentPlacement.set(this, void 0);
+        _SkyAffixer_offsetChange.set(this, void 0);
+        _SkyAffixer_offsetChangeObs.set(this, void 0);
+        _SkyAffixer_overflowParents.set(this, []);
+        _SkyAffixer_overflowScroll.set(this, void 0);
+        _SkyAffixer_overflowScrollObs.set(this, void 0);
+        _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__config.set(this, DEFAULT_AFFIX_CONFIG);
+        __classPrivateFieldSet(this, _SkyAffixer_affixedElement, affixedElement, "f");
+        __classPrivateFieldSet(this, _SkyAffixer_renderer, renderer, "f");
+        __classPrivateFieldSet(this, _SkyAffixer_offsetChange, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyAffixer_overflowScroll, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyAffixer_placementChange, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyAffixer_offsetChangeObs, __classPrivateFieldGet(this, _SkyAffixer_offsetChange, "f").asObservable(), "f");
+        __classPrivateFieldSet(this, _SkyAffixer_overflowScrollObs, __classPrivateFieldGet(this, _SkyAffixer_overflowScroll, "f").asObservable(), "f");
+        __classPrivateFieldSet(this, _SkyAffixer_placementChangeObs, __classPrivateFieldGet(this, _SkyAffixer_placementChange, "f").asObservable(), "f");
     }
     /**
      * Fires when the affixed element's offset changes.
      */
     get offsetChange() {
-        return this._offsetChange.asObservable();
+        return __classPrivateFieldGet(this, _SkyAffixer_offsetChangeObs, "f");
     }
     /**
      * Fires when the base element's nearest overflow parent is scrolling. This is useful if you need
@@ -404,27 +423,14 @@ class SkyAffixer {
      * event listener.
      */
     get overflowScroll() {
-        return this._overflowScroll.asObservable();
+        return __classPrivateFieldGet(this, _SkyAffixer_overflowScrollObs, "f");
     }
     /**
      * Fires when the placement value changes. A `null` value indicates that a suitable
      * placement could not be found.
      */
     get placementChange() {
-        return this._placementChange.asObservable();
-    }
-    get config() {
-        return this._config;
-    }
-    set config(value) {
-        const merged = { ...DEFAULT_AFFIX_CONFIG, ...value };
-        // Make sure none of the values are undefined.
-        Object.keys(merged).forEach((k) => {
-            if (merged[k] === undefined) {
-                merged[k] = DEFAULT_AFFIX_CONFIG[k];
-            }
-        });
-        this._config = merged;
+        return __classPrivateFieldGet(this, _SkyAffixer_placementChangeObs, "f");
     }
     /**
      * Affixes an element to a base element.
@@ -432,292 +438,290 @@ class SkyAffixer {
      * @param config Configuration for the affix action.
      */
     affixTo(baseElement, config) {
-        this.reset();
-        this.config = config;
-        this.baseElement = baseElement;
-        this.overflowParents = getOverflowParents(baseElement);
-        this.affix();
-        if (this.config.isSticky) {
-            this.addScrollListeners();
-            this.addResizeListener();
+        __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_reset).call(this);
+        __classPrivateFieldSet(this, _SkyAffixer_instances, config, "a", _SkyAffixer_config_set);
+        __classPrivateFieldSet(this, _SkyAffixer_baseElement, baseElement, "f");
+        __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);
         }
     }
+    getConfig() {
+        return __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get);
+    }
     /**
      * Re-runs the affix calculation.
      */
     reaffix() {
         // Reset current placement to preferred placement.
-        this.currentPlacement = this.config.placement;
-        this.affix();
+        __classPrivateFieldSet(this, _SkyAffixer_currentPlacement, __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).placement, "f");
+        __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_affix).call(this);
     }
     /**
      * Destroys the affixer.
      */
     destroy() {
-        this.reset();
-        this._placementChange.complete();
-        this._offsetChange.complete();
-        this._overflowScroll.complete();
-        this._offsetChange =
-            this._placementChange =
-                this._overflowScroll =
-                    undefined;
-    }
-    affix() {
-        this.baseRect = this.baseElement.getBoundingClientRect();
-        this.affixedRect = this.affixedElement.getBoundingClientRect();
-        const offset = this.getOffset();
-        if (this.isNewOffset(offset)) {
-            this.renderer.setStyle(this.affixedElement, 'top', `${offset.top}px`);
-            this.renderer.setStyle(this.affixedElement, 'left', `${offset.left}px`);
-            this._offsetChange.next({ offset });
-        }
-    }
-    getOffset() {
-        const parent = this.getAutoFitContextParent();
-        const maxAttempts = 4;
-        let attempts = 0;
-        let isAffixedElementFullyVisible = false;
-        let offset;
-        let placement = this.config.placement;
-        do {
-            offset = this.getPreferredOffset(placement);
-            isAffixedElementFullyVisible = isOffsetFullyVisibleWithinParent(parent, offset, this.config.autoFitOverflowOffset);
-            if (!this.config.enableAutoFit) {
-                break;
-            }
-            if (!isAffixedElementFullyVisible) {
-                placement =
-                    attempts % 2 === 0
-                        ? getInversePlacement(placement)
-                        : getNextPlacement(placement);
-            }
-            attempts++;
-        } while (!isAffixedElementFullyVisible && attempts < maxAttempts);
-        if (isAffixedElementFullyVisible) {
-            if (this.isBaseElementVisible()) {
-                this.notifyPlacementChange(placement);
-            }
-            else {
-                this.notifyPlacementChange(null);
-            }
-            return offset;
-        }
-        if (this.config.enableAutoFit) {
-            this.notifyPlacementChange(null);
-        }
-        // No suitable placement was found, so revert to preferred placement.
-        return this.getPreferredOffset(this.config.placement);
-    }
-    getPreferredOffset(placement) {
-        const affixedRect = this.affixedRect;
-        const baseRect = this.baseRect;
-        const horizontalAlignment = this.config.horizontalAlignment;
-        const verticalAlignment = this.config.verticalAlignment;
-        const enableAutoFit = this.config.enableAutoFit;
-        let top;
-        let left;
-        if (placement === 'above' || placement === 'below') {
-            if (placement === 'above') {
-                top = baseRect.top - affixedRect.height;
-                switch (verticalAlignment) {
-                    case 'top':
-                        top = top + affixedRect.height;
-                        break;
-                    case 'middle':
-                        top = top + affixedRect.height / 2;
-                        break;
-                    case 'bottom':
-                    default:
-                        break;
-                }
-            }
-            else {
-                top = baseRect.bottom;
-                switch (verticalAlignment) {
-                    case 'top':
-                    default:
-                        break;
-                    case 'middle':
-                        top = top - affixedRect.height / 2;
-                        break;
-                    case 'bottom':
-                        top = top - affixedRect.height;
-                        break;
-                }
-            }
-            switch (horizontalAlignment) {
-                case 'left':
-                    left = baseRect.left;
+        __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_reset).call(this);
+        __classPrivateFieldGet(this, _SkyAffixer_placementChange, "f").complete();
+        __classPrivateFieldGet(this, _SkyAffixer_offsetChange, "f").complete();
+        __classPrivateFieldGet(this, _SkyAffixer_overflowScroll, "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() {
+    return __classPrivateFieldGet(this, _SkyAffixer__config, "f");
+}, _SkyAffixer_config_set = function _SkyAffixer_config_set(value) {
+    const merged = {
+        ...DEFAULT_AFFIX_CONFIG,
+        ...value,
+    };
+    // Make sure none of the values are undefined.
+    let key;
+    for (key in merged) {
+        if (merged[key] === undefined) {
+            merged[key] = DEFAULT_AFFIX_CONFIG[key];
+        }
+    }
+    __classPrivateFieldSet(this, _SkyAffixer__config, merged, "f");
+}, _SkyAffixer_affix = function _SkyAffixer_affix() {
+    const offset = __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getOffset).call(this);
+    if (__classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_isNewOffset).call(this, offset)) {
+        __classPrivateFieldGet(this, _SkyAffixer_renderer, "f").setStyle(__classPrivateFieldGet(this, _SkyAffixer_affixedElement, "f"), 'top', `${offset.top}px`);
+        __classPrivateFieldGet(this, _SkyAffixer_renderer, "f").setStyle(__classPrivateFieldGet(this, _SkyAffixer_affixedElement, "f"), 'left', `${offset.left}px`);
+        __classPrivateFieldGet(this, _SkyAffixer_offsetChange, "f").next({ offset });
+    }
+}, _SkyAffixer_getOffset = function _SkyAffixer_getOffset() {
+    const parent = __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getAutoFitContextParent).call(this);
+    const maxAttempts = 4;
+    let attempts = 0;
+    let isAffixedElementFullyVisible = false;
+    let offset;
+    let placement = __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).placement;
+    do {
+        offset = __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getPreferredOffset).call(this, placement);
+        isAffixedElementFullyVisible = isOffsetFullyVisibleWithinParent(parent, offset, __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).autoFitOverflowOffset);
+        if (!__classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).enableAutoFit) {
+            break;
+        }
+        if (!isAffixedElementFullyVisible) {
+            placement =
+                attempts % 2 === 0
+                    ? getInversePlacement(placement)
+                    : getNextPlacement(placement);
+        }
+        attempts++;
+    } while (!isAffixedElementFullyVisible && attempts < maxAttempts);
+    if (isAffixedElementFullyVisible) {
+        if (__classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_isBaseElementVisible).call(this)) {
+            __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_notifyPlacementChange).call(this, placement);
+        }
+        else {
+            __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_notifyPlacementChange).call(this, null);
+        }
+        return offset;
+    }
+    if (__classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).enableAutoFit) {
+        __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_notifyPlacementChange).call(this, null);
+    }
+    // No suitable placement was found, so revert to preferred placement.
+    return __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getPreferredOffset).call(this, __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).placement);
+}, _SkyAffixer_getPreferredOffset = function _SkyAffixer_getPreferredOffset(placement) {
+    if (!__classPrivateFieldGet(this, _SkyAffixer_baseElement, "f")) {
+        return { top: 0, left: 0, bottom: 0, right: 0 };
+    }
+    const affixedRect = __classPrivateFieldGet(this, _SkyAffixer_affixedElement, "f").getBoundingClientRect();
+    const baseRect = __classPrivateFieldGet(this, _SkyAffixer_baseElement, "f").getBoundingClientRect();
+    const horizontalAlignment = __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).horizontalAlignment;
+    const verticalAlignment = __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).verticalAlignment;
+    const enableAutoFit = __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).enableAutoFit;
+    let top;
+    let left;
+    if (placement === 'above' || placement === 'below') {
+        if (placement === 'above') {
+            top = baseRect.top - affixedRect.height;
+            switch (verticalAlignment) {
+                case 'top':
+                    top = top + affixedRect.height;
                     break;
-                case 'center':
-                default:
-                    left = baseRect.left + baseRect.width / 2 - affixedRect.width / 2;
+                case 'middle':
+                    top = top + affixedRect.height / 2;
                     break;
-                case 'right':
-                    left = baseRect.right - affixedRect.width;
+                case 'bottom':
+                default:
                     break;
             }
         }
         else {
-            if (placement === 'left') {
-                left = baseRect.left - affixedRect.width;
-            }
-            else {
-                left = baseRect.right;
-            }
+            top = baseRect.bottom;
             switch (verticalAlignment) {
                 case 'top':
-                    top = baseRect.top;
+                default:
                     break;
                 case 'middle':
-                default:
-                    top = baseRect.top + baseRect.height / 2 - affixedRect.height / 2;
+                    top = top - affixedRect.height / 2;
                     break;
                 case 'bottom':
-                    top = baseRect.bottom - affixedRect.height;
+                    top = top - affixedRect.height;
                     break;
             }
         }
-        let offset = { left, top };
-        if (enableAutoFit) {
-            offset = this.adjustOffsetToOverflowParent({ ...offset }, placement);
-        }
-        offset.bottom = offset.top + affixedRect.height;
-        offset.right = offset.left + affixedRect.width;
-        return offset;
-    }
-    /**
-     * Slightly adjust the offset to fit within the scroll parent's boundaries if
-     * the affixed element would otherwise be clipped.
-     */
-    adjustOffsetToOverflowParent(offset, placement) {
-        const parent = this.getAutoFitContextParent();
-        const parentOffset = getElementOffset(parent, this.config.autoFitOverflowOffset);
-        const affixedRect = this.affixedRect;
-        const baseRect = this.baseRect;
-        // A pixel value representing the leeway between the edge of the overflow parent and the edge
-        // of the base element before it dissapears from view.
-        // If the visible portion of the base element is less than this pixel value, the auto-fit
-        // functionality attempts to find another placement.
-        const defaultPixelTolerance = 40;
-        let pixelTolerance;
-        const originalOffsetTop = offset.top;
-        const originalOffsetLeft = offset.left;
-        switch (placement) {
-            case 'above':
-            case 'below':
-                // Keep the affixed element within the overflow parent.
-                if (offset.left < parentOffset.left) {
-                    offset.left = parentOffset.left;
-                }
-                else if (offset.left + affixedRect.width > parentOffset.right) {
-                    offset.left = parentOffset.right - affixedRect.width;
-                }
-                // Use a smaller pixel tolerance if the base element width is less than the default.
-                pixelTolerance = Math.min(defaultPixelTolerance, baseRect.width);
-                // Make sure the affixed element never detaches from the base element.
-                if (offset.left + pixelTolerance > baseRect.right ||
-                    offset.left + affixedRect.width - pixelTolerance < baseRect.left) {
-                    offset.left = originalOffsetLeft;
-                }
-                break;
+        switch (horizontalAlignment) {
             case 'left':
+                left = baseRect.left;
+                break;
+            case 'center':
+            default:
+                left = baseRect.left + baseRect.width / 2 - affixedRect.width / 2;
+                break;
             case 'right':
-                // Keep the affixed element within the overflow parent.
-                if (offset.top < parentOffset.top) {
-                    offset.top = parentOffset.top;
-                }
-                else if (offset.top + affixedRect.height > parentOffset.bottom) {
-                    offset.top = parentOffset.bottom - affixedRect.height;
-                }
-                // Use a smaller pixel tolerance if the base element height is less than the default.
-                pixelTolerance = Math.min(defaultPixelTolerance, baseRect.height);
-                // Make sure the affixed element never detaches from the base element.
-                if (offset.top + pixelTolerance > baseRect.bottom ||
-                    offset.top + affixedRect.height - pixelTolerance < baseRect.top) {
-                    offset.top = originalOffsetTop;
-                }
+                left = baseRect.right - affixedRect.width;
                 break;
         }
-        return offset;
-    }
-    getImmediateOverflowParent() {
-        return this.overflowParents[this.overflowParents.length - 1];
-    }
-    getAutoFitContextParent() {
-        const bodyElement = this.overflowParents[0];
-        return this.config.autoFitContext === SkyAffixAutoFitContext.OverflowParent
-            ? this.getImmediateOverflowParent()
-            : bodyElement;
     }
-    notifyPlacementChange(placement) {
-        if (this.currentPlacement !== placement) {
-            this.currentPlacement = placement;
-            this._placementChange.next({
-                placement,
-            });
+    else {
+        if (placement === 'left') {
+            left = baseRect.left - affixedRect.width;
         }
-    }
-    reset() {
-        this.removeScrollListeners();
-        this.removeResizeListener();
-        this._config =
-            this.affixedRect =
-                this.baseElement =
-                    this.baseRect =
-                        this.currentPlacement =
-                            this.currentOffset =
-                                this.overflowParents =
-                                    undefined;
-    }
-    isNewOffset(offset) {
-        if (this.currentOffset === undefined) {
-            this.currentOffset = offset;
-            return true;
+        else {
+            left = baseRect.right;
         }
-        if (this.currentOffset.top === offset.top &&
-            this.currentOffset.left === offset.left) {
-            return false;
+        switch (verticalAlignment) {
+            case 'top':
+                top = baseRect.top;
+                break;
+            case 'middle':
+            default:
+                top = baseRect.top + baseRect.height / 2 - affixedRect.height / 2;
+                break;
+            case 'bottom':
+                top = baseRect.bottom - affixedRect.height;
+                break;
         }
-        this.currentOffset = offset;
-        return true;
     }
-    isBaseElementVisible() {
-        return isOffsetPartiallyVisibleWithinParent(this.getImmediateOverflowParent(), {
-            top: this.baseRect.top,
-            left: this.baseRect.left,
-            right: this.baseRect.right,
-            bottom: this.baseRect.bottom,
-        }, this.config.autoFitOverflowOffset);
-    }
-    addScrollListeners() {
-        this.scrollListeners = this.overflowParents.map((parentElement) => {
-            const overflow = parentElement === document.body ? 'window' : parentElement;
-            return this.renderer.listen(overflow, 'scroll', () => {
-                this.affix();
-                this._overflowScroll.next();
-            });
+    const offset = { top, left, bottom: 0, right: 0 };
+    if (enableAutoFit) {
+        const adjustments = __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_adjustOffsetToOverflowParent).call(this, { top, left }, placement, __classPrivateFieldGet(this, _SkyAffixer_baseElement, "f"));
+        offset.top = adjustments.top;
+        offset.left = adjustments.left;
+    }
+    offset.bottom = offset.top + affixedRect.height;
+    offset.right = offset.left + affixedRect.width;
+    return offset;
+}, _SkyAffixer_adjustOffsetToOverflowParent = function _SkyAffixer_adjustOffsetToOverflowParent(offset, placement, baseElement) {
+    const parent = __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getAutoFitContextParent).call(this);
+    const parentOffset = getElementOffset(parent, __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).autoFitOverflowOffset);
+    const affixedRect = __classPrivateFieldGet(this, _SkyAffixer_affixedElement, "f").getBoundingClientRect();
+    const baseRect = baseElement.getBoundingClientRect();
+    // A pixel value representing the leeway between the edge of the overflow parent and the edge
+    // of the base element before it dissapears from view.
+    // If the visible portion of the base element is less than this pixel value, the auto-fit
+    // functionality attempts to find another placement.
+    const defaultPixelTolerance = 40;
+    let pixelTolerance;
+    const originalOffsetTop = offset.top;
+    const originalOffsetLeft = offset.left;
+    switch (placement) {
+        case 'above':
+        case 'below':
+            // Keep the affixed element within the overflow parent.
+            if (offset.left < parentOffset.left) {
+                offset.left = parentOffset.left;
+            }
+            else if (offset.left + affixedRect.width > parentOffset.right) {
+                offset.left = parentOffset.right - affixedRect.width;
+            }
+            // Use a smaller pixel tolerance if the base element width is less than the default.
+            pixelTolerance = Math.min(defaultPixelTolerance, baseRect.width);
+            // Make sure the affixed element never detaches from the base element.
+            if (offset.left + pixelTolerance > baseRect.right ||
+                offset.left + affixedRect.width - pixelTolerance < baseRect.left) {
+                offset.left = originalOffsetLeft;
+            }
+            break;
+        case 'left':
+        case 'right':
+            // Keep the affixed element within the overflow parent.
+            if (offset.top < parentOffset.top) {
+                offset.top = parentOffset.top;
+            }
+            else if (offset.top + affixedRect.height > parentOffset.bottom) {
+                offset.top = parentOffset.bottom - affixedRect.height;
+            }
+            // Use a smaller pixel tolerance if the base element height is less than the default.
+            pixelTolerance = Math.min(defaultPixelTolerance, baseRect.height);
+            // Make sure the affixed element never detaches from the base element.
+            if (offset.top + pixelTolerance > baseRect.bottom ||
+                offset.top + affixedRect.height - pixelTolerance < baseRect.top) {
+                offset.top = originalOffsetTop;
+            }
+            break;
+    }
+    return offset;
+}, _SkyAffixer_getImmediateOverflowParent = function _SkyAffixer_getImmediateOverflowParent() {
+    return __classPrivateFieldGet(this, _SkyAffixer_overflowParents, "f")[__classPrivateFieldGet(this, _SkyAffixer_overflowParents, "f").length - 1];
+}, _SkyAffixer_getAutoFitContextParent = function _SkyAffixer_getAutoFitContextParent() {
+    const bodyElement = __classPrivateFieldGet(this, _SkyAffixer_overflowParents, "f")[0];
+    return __classPrivateFieldGet(this, _SkyAffixer_instances, "a", _SkyAffixer_config_get).autoFitContext === SkyAffixAutoFitContext.OverflowParent
+        ? __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getImmediateOverflowParent).call(this)
+        : bodyElement;
+}, _SkyAffixer_notifyPlacementChange = function _SkyAffixer_notifyPlacementChange(placement) {
+    if (__classPrivateFieldGet(this, _SkyAffixer_currentPlacement, "f") !== placement) {
+        __classPrivateFieldSet(this, _SkyAffixer_currentPlacement, placement ?? undefined, "f");
+        __classPrivateFieldGet(this, _SkyAffixer_placementChange, "f").next({
+            placement,
         });
     }
-    addResizeListener() {
-        this.resizeListener = fromEvent(window, 'resize').subscribe(() => this.affix());
+}, _SkyAffixer_reset = function _SkyAffixer_reset() {
+    __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_removeScrollListeners).call(this);
+    __classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_removeResizeListener).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) {
+    if (__classPrivateFieldGet(this, _SkyAffixer_currentOffset, "f") === undefined) {
+        __classPrivateFieldSet(this, _SkyAffixer_currentOffset, offset, "f");
+        return true;
     }
-    removeResizeListener() {
-        if (this.resizeListener) {
-            this.resizeListener.unsubscribe();
-            this.resizeListener = undefined;
-        }
+    if (__classPrivateFieldGet(this, _SkyAffixer_currentOffset, "f").top === offset.top &&
+        __classPrivateFieldGet(this, _SkyAffixer_currentOffset, "f").left === offset.left) {
+        return false;
     }
-    removeScrollListeners() {
-        if (this.scrollListeners) {
-            // Remove renderer-generated listeners by calling the listener itself.
-            // https://github.com/angular/angular/issues/9368#issuecomment-227199778
-            this.scrollListeners.forEach((listener) => listener());
-            this.scrollListeners = undefined;
-        }
+    __classPrivateFieldSet(this, _SkyAffixer_currentOffset, offset, "f");
+    return true;
+}, _SkyAffixer_isBaseElementVisible = function _SkyAffixer_isBaseElementVisible() {
+    if (!__classPrivateFieldGet(this, _SkyAffixer_baseElement, "f")) {
+        return false;
     }
-}
+    const baseRect = __classPrivateFieldGet(this, _SkyAffixer_baseElement, "f").getBoundingClientRect();
+    return isOffsetPartiallyVisibleWithinParent(__classPrivateFieldGet(this, _SkyAffixer_instances, "m", _SkyAffixer_getImmediateOverflowParent).call(this), {
+        top: baseRect.top,
+        left: baseRect.left,
+        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();
+        });
+    }), "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");
+    }
+};
 
 var _SkyAffixService_renderer;
 class SkyAffixService {
@@ -743,12 +747,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
 
+var _SkyAffixDirective_affixer, _SkyAffixDirective_affixService, _SkyAffixDirective_elementRef, _SkyAffixDirective_ngUnsubscribe;
 /**
  * Affixes the host element to a base element.
  */
 class SkyAffixDirective {
     constructor(elementRef, affixService) {
-        this.affixService = affixService;
         /**
          * Fires when the affixed element's offset changes.
          */
@@ -761,17 +765,25 @@ class SkyAffixDirective {
          * Fires when the placement value changes.
          */
         this.affixPlacementChange = new EventEmitter();
-        this.ngUnsubscribe = new Subject();
-        this.affixer = this.affixService.createAffixer(elementRef);
-        this.affixer.offsetChange
-            .pipe(takeUntil(this.ngUnsubscribe))
+        _SkyAffixDirective_affixer.set(this, void 0);
+        _SkyAffixDirective_affixService.set(this, void 0);
+        _SkyAffixDirective_elementRef.set(this, void 0);
+        _SkyAffixDirective_ngUnsubscribe.set(this, new Subject());
+        __classPrivateFieldSet(this, _SkyAffixDirective_elementRef, elementRef, "f");
+        __classPrivateFieldSet(this, _SkyAffixDirective_affixService, affixService, "f");
+    }
+    ngOnInit() {
+        __classPrivateFieldSet(this, _SkyAffixDirective_affixer, __classPrivateFieldGet(this, _SkyAffixDirective_affixService, "f").createAffixer(__classPrivateFieldGet(this, _SkyAffixDirective_elementRef, "f")), "f");
+        __classPrivateFieldGet(this, _SkyAffixDirective_affixer, "f").offsetChange
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyAffixDirective_ngUnsubscribe, "f")))
             .subscribe((change) => this.affixOffsetChange.emit(change));
-        this.affixer.overflowScroll
-            .pipe(takeUntil(this.ngUnsubscribe))
+        __classPrivateFieldGet(this, _SkyAffixDirective_affixer, "f").overflowScroll
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyAffixDirective_ngUnsubscribe, "f")))
             .subscribe((change) => this.affixOverflowScroll.emit(change));
-        this.affixer.placementChange
-            .pipe(takeUntil(this.ngUnsubscribe))
+        __classPrivateFieldGet(this, _SkyAffixDirective_affixer, "f").placementChange
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyAffixDirective_ngUnsubscribe, "f")))
             .subscribe((change) => this.affixPlacementChange.emit(change));
+        this.updateAlignment();
     }
     ngOnChanges(changes) {
         /* istanbul ignore else */
@@ -789,22 +801,29 @@ class SkyAffixDirective {
         this.affixOffsetChange.complete();
         this.affixOverflowScroll.complete();
         this.affixPlacementChange.complete();
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
-        this.affixer.destroy();
+        __classPrivateFieldGet(this, _SkyAffixDirective_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyAffixDirective_ngUnsubscribe, "f").complete();
+        /*istanbul ignore else*/
+        if (__classPrivateFieldGet(this, _SkyAffixDirective_affixer, "f")) {
+            __classPrivateFieldGet(this, _SkyAffixDirective_affixer, "f").destroy();
+            __classPrivateFieldSet(this, _SkyAffixDirective_affixer, undefined, "f");
+        }
     }
     updateAlignment() {
-        this.affixer.affixTo(this.skyAffixTo, {
-            autoFitContext: this.affixAutoFitContext,
-            autoFitOverflowOffset: this.affixAutoFitOverflowOffset,
-            enableAutoFit: this.affixEnableAutoFit,
-            horizontalAlignment: this.affixHorizontalAlignment,
-            isSticky: this.affixIsSticky,
-            placement: this.affixPlacement,
-            verticalAlignment: this.affixVerticalAlignment,
-        });
+        if (this.skyAffixTo && __classPrivateFieldGet(this, _SkyAffixDirective_affixer, "f")) {
+            __classPrivateFieldGet(this, _SkyAffixDirective_affixer, "f").affixTo(this.skyAffixTo, {
+                autoFitContext: this.affixAutoFitContext,
+                autoFitOverflowOffset: this.affixAutoFitOverflowOffset,
+                enableAutoFit: this.affixEnableAutoFit,
+                horizontalAlignment: this.affixHorizontalAlignment,
+                isSticky: this.affixIsSticky,
+                placement: this.affixPlacement,
+                verticalAlignment: this.affixVerticalAlignment,
+            });
+        }
     }
 }
+_SkyAffixDirective_affixer = new WeakMap(), _SkyAffixDirective_affixService = new WeakMap(), _SkyAffixDirective_elementRef = new WeakMap(), _SkyAffixDirective_ngUnsubscribe = new WeakMap();
 SkyAffixDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAffixDirective, deps: [{ token: i0.ElementRef }, { token: SkyAffixService }], target: i0.ɵɵFactoryTarget.Directive });
 SkyAffixDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.2", type: SkyAffixDirective, selector: "[skyAffixTo]", inputs: { skyAffixTo: "skyAffixTo", affixAutoFitContext: "affixAutoFitContext", affixAutoFitOverflowOffset: "affixAutoFitOverflowOffset", affixEnableAutoFit: "affixEnableAutoFit", affixHorizontalAlignment: "affixHorizontalAlignment", affixIsSticky: "affixIsSticky", affixPlacement: "affixPlacement", affixVerticalAlignment: "affixVerticalAlignment" }, outputs: { affixOffsetChange: "affixOffsetChange", affixOverflowScroll: "affixOverflowScroll", affixPlacementChange: "affixPlacementChange" }, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAffixDirective, decorators: [{
@@ -850,6 +869,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }] });
 
+var _SkyDockItem_destroyed, _SkyDockItem_destroyedObs;
 /**
  * Represents a single item added to the dock.
  */
@@ -861,22 +881,25 @@ class SkyDockItem {
     constructor(componentInstance, stackOrder) {
         this.componentInstance = componentInstance;
         this.stackOrder = stackOrder;
-        this._destroyed = new Subject();
+        _SkyDockItem_destroyed.set(this, new Subject());
+        _SkyDockItem_destroyedObs.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyDockItem_destroyedObs, __classPrivateFieldGet(this, _SkyDockItem_destroyed, "f").asObservable(), "f");
     }
     /**
      * An event that emits when the item is removed from the dock.
      */
     get destroyed() {
-        return this._destroyed.asObservable();
+        return __classPrivateFieldGet(this, _SkyDockItem_destroyedObs, "f");
     }
     /**
      * Removes the item from the dock.
      */
     destroy() {
-        this._destroyed.next();
-        this._destroyed.complete();
+        __classPrivateFieldGet(this, _SkyDockItem_destroyed, "f").next();
+        __classPrivateFieldGet(this, _SkyDockItem_destroyed, "f").complete();
     }
 }
+_SkyDockItem_destroyed = new WeakMap(), _SkyDockItem_destroyedObs = new WeakMap();
 
 /**
  * The location on the page where the dock component should be rendered.
@@ -897,7 +920,9 @@ var SkyDockLocation;
     SkyDockLocation[SkyDockLocation["ElementBottom"] = 2] = "ElementBottom";
 })(SkyDockLocation || (SkyDockLocation = {}));
 
+// TODO: Prefix this service with `Sky` in a breaking change.
 class MutationObserverService {
+    // TODO: Give the `callback` parameter a stricter type in a breaking change.
     create(callback) {
         return new MutationObserver(callback);
     }
@@ -911,74 +936,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }] });
 
+var _SkyDockDomAdapterService_instances, _SkyDockDomAdapterService_currentDockHeight, _SkyDockDomAdapterService_mutationSvc, _SkyDockDomAdapterService_ngUnsubscribe, _SkyDockDomAdapterService_observer, _SkyDockDomAdapterService_renderer, _SkyDockDomAdapterService_styleElement, _SkyDockDomAdapterService_adjustBodyStyles, _SkyDockDomAdapterService_destroyStyleElement;
 /**
  * @internal
  */
 class SkyDockDomAdapterService {
-    constructor(mutationService, rendererFactory) {
-        this.mutationService = mutationService;
-        this.ngUnsubscribe = new Subject();
-        this.renderer = rendererFactory.createRenderer(undefined, undefined);
+    constructor(mutationSvc, rendererFactory) {
+        _SkyDockDomAdapterService_instances.add(this);
+        _SkyDockDomAdapterService_currentDockHeight.set(this, void 0);
+        _SkyDockDomAdapterService_mutationSvc.set(this, void 0);
+        _SkyDockDomAdapterService_ngUnsubscribe.set(this, new Subject());
+        _SkyDockDomAdapterService_observer.set(this, void 0);
+        _SkyDockDomAdapterService_renderer.set(this, void 0);
+        _SkyDockDomAdapterService_styleElement.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyDockDomAdapterService_mutationSvc, mutationSvc, "f");
+        __classPrivateFieldSet(this, _SkyDockDomAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
     }
     ngOnDestroy() {
-        if (this.observer) {
-            this.observer.disconnect();
+        if (__classPrivateFieldGet(this, _SkyDockDomAdapterService_observer, "f")) {
+            __classPrivateFieldGet(this, _SkyDockDomAdapterService_observer, "f").disconnect();
         }
-        this.ngUnsubscribe.next();
-        if (this.styleElement) {
-            this.destroyStyleElement();
+        __classPrivateFieldGet(this, _SkyDockDomAdapterService_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyDockDomAdapterService_ngUnsubscribe, "f").complete();
+        if (__classPrivateFieldGet(this, _SkyDockDomAdapterService_styleElement, "f")) {
+            __classPrivateFieldGet(this, _SkyDockDomAdapterService_instances, "m", _SkyDockDomAdapterService_destroyStyleElement).call(this);
         }
-        this.currentDockHeight =
-            this.ngUnsubscribe =
-                this.observer =
-                    this.styleElement =
-                        undefined;
+        __classPrivateFieldSet(this, _SkyDockDomAdapterService_currentDockHeight, __classPrivateFieldSet(this, _SkyDockDomAdapterService_observer, __classPrivateFieldSet(this, _SkyDockDomAdapterService_styleElement, undefined, "f"), "f"), "f");
     }
     setSticky(elementRef) {
-        this.renderer.addClass(elementRef.nativeElement, 'sky-dock-sticky');
+        __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").addClass(elementRef.nativeElement, 'sky-dock-sticky');
     }
     setZIndex(zIndex, elementRef) {
-        this.renderer.setStyle(elementRef.nativeElement, 'z-index', zIndex);
+        __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").setStyle(elementRef.nativeElement, 'z-index', zIndex);
     }
     unbindDock(elementRef) {
-        this.renderer.addClass(elementRef.nativeElement, 'sky-dock-unbound');
+        __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").addClass(elementRef.nativeElement, 'sky-dock-unbound');
     }
     watchDomChanges(elementRef) {
-        this.observer = this.mutationService.create(() => {
-            this.adjustBodyStyles(elementRef);
-        });
-        this.observer.observe(elementRef.nativeElement, {
+        __classPrivateFieldSet(this, _SkyDockDomAdapterService_observer, __classPrivateFieldGet(this, _SkyDockDomAdapterService_mutationSvc, "f").create(() => {
+            __classPrivateFieldGet(this, _SkyDockDomAdapterService_instances, "m", _SkyDockDomAdapterService_adjustBodyStyles).call(this, elementRef);
+        }), "f");
+        __classPrivateFieldGet(this, _SkyDockDomAdapterService_observer, "f").observe(elementRef.nativeElement, {
             attributes: true,
             childList: true,
             characterData: true,
             subtree: true,
         });
         fromEvent(window, 'resize')
-            .pipe(debounceTime(250), takeUntil(this.ngUnsubscribe))
-            .subscribe(() => this.adjustBodyStyles(elementRef));
-    }
-    adjustBodyStyles(elementRef) {
-        const dockHeight = elementRef.nativeElement.getBoundingClientRect().height;
-        if (dockHeight === this.currentDockHeight) {
-            return;
-        }
-        // Create a style element to avoid overwriting any existing inline body styles.
-        const styleElement = this.renderer.createElement('style');
-        const textNode = this.renderer.createText(`body { margin-bottom: ${dockHeight}px; }`);
-        // Apply a `data-` attribute to make unit testing easier.
-        this.renderer.setAttribute(styleElement, 'data-test-selector', 'sky-layout-dock-bottom-styles');
-        this.renderer.appendChild(styleElement, textNode);
-        this.renderer.appendChild(document.head, styleElement);
-        if (this.styleElement) {
-            this.destroyStyleElement();
-        }
-        this.currentDockHeight = dockHeight;
-        this.styleElement = styleElement;
-    }
-    destroyStyleElement() {
-        this.renderer.removeChild(document.head, this.styleElement);
-    }
-}
+            .pipe(debounceTime(250), takeUntil(__classPrivateFieldGet(this, _SkyDockDomAdapterService_ngUnsubscribe, "f")))
+            .subscribe(() => __classPrivateFieldGet(this, _SkyDockDomAdapterService_instances, "m", _SkyDockDomAdapterService_adjustBodyStyles).call(this, elementRef));
+    }
+}
+_SkyDockDomAdapterService_currentDockHeight = new WeakMap(), _SkyDockDomAdapterService_mutationSvc = new WeakMap(), _SkyDockDomAdapterService_ngUnsubscribe = new WeakMap(), _SkyDockDomAdapterService_observer = new WeakMap(), _SkyDockDomAdapterService_renderer = new WeakMap(), _SkyDockDomAdapterService_styleElement = new WeakMap(), _SkyDockDomAdapterService_instances = new WeakSet(), _SkyDockDomAdapterService_adjustBodyStyles = function _SkyDockDomAdapterService_adjustBodyStyles(elementRef) {
+    const dockHeight = elementRef.nativeElement.getBoundingClientRect().height;
+    if (dockHeight === __classPrivateFieldGet(this, _SkyDockDomAdapterService_currentDockHeight, "f")) {
+        return;
+    }
+    // Create a style element to avoid overwriting any existing inline body styles.
+    const styleElement = __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").createElement('style');
+    const textNode = __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").createText(`body { margin-bottom: ${dockHeight}px; }`);
+    // Apply a `data-` attribute to make unit testing easier.
+    __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").setAttribute(styleElement, 'data-test-selector', 'sky-layout-dock-bottom-styles');
+    __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").appendChild(styleElement, textNode);
+    __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").appendChild(document.head, styleElement);
+    if (__classPrivateFieldGet(this, _SkyDockDomAdapterService_styleElement, "f")) {
+        __classPrivateFieldGet(this, _SkyDockDomAdapterService_instances, "m", _SkyDockDomAdapterService_destroyStyleElement).call(this);
+    }
+    __classPrivateFieldSet(this, _SkyDockDomAdapterService_currentDockHeight, dockHeight, "f");
+    __classPrivateFieldSet(this, _SkyDockDomAdapterService_styleElement, styleElement, "f");
+}, _SkyDockDomAdapterService_destroyStyleElement = function _SkyDockDomAdapterService_destroyStyleElement() {
+    __classPrivateFieldGet(this, _SkyDockDomAdapterService_renderer, "f").removeChild(document.head, __classPrivateFieldGet(this, _SkyDockDomAdapterService_styleElement, "f"));
+};
 SkyDockDomAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDockDomAdapterService, deps: [{ token: MutationObserverService }, { token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyDockDomAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDockDomAdapterService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDockDomAdapterService, decorators: [{
@@ -998,75 +1026,98 @@ function sortByStackOrder(a, b) {
     return 0;
 }
 
+var _SkyDockComponent_instances, _SkyDockComponent_changeDetector, _SkyDockComponent_domAdapter, _SkyDockComponent_elementRef, _SkyDockComponent_injector, _SkyDockComponent_itemRefs, _SkyDockComponent_options, _SkyDockComponent_resolver, _SkyDockComponent_sortItemsByStackOrder, _SkyDockComponent_getHighestStackOrder;
 /**
  * @internal
  */
 class SkyDockComponent {
+    // TODO: Replace deprecated `ComponentFactoryResolver`.
     constructor(changeDetector, resolver, elementRef, injector, domAdapter) {
-        this.changeDetector = changeDetector;
-        this.resolver = resolver;
-        this.elementRef = elementRef;
-        this.injector = injector;
-        this.domAdapter = domAdapter;
-        this.itemRefs = [];
+        _SkyDockComponent_instances.add(this);
+        _SkyDockComponent_changeDetector.set(this, void 0);
+        _SkyDockComponent_domAdapter.set(this, void 0);
+        _SkyDockComponent_elementRef.set(this, void 0);
+        _SkyDockComponent_injector.set(this, void 0);
+        _SkyDockComponent_itemRefs.set(this, []);
+        _SkyDockComponent_options.set(this, void 0);
+        _SkyDockComponent_resolver.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyDockComponent_changeDetector, changeDetector, "f");
+        __classPrivateFieldSet(this, _SkyDockComponent_resolver, resolver, "f");
+        __classPrivateFieldSet(this, _SkyDockComponent_elementRef, elementRef, "f");
+        __classPrivateFieldSet(this, _SkyDockComponent_injector, injector, "f");
+        __classPrivateFieldSet(this, _SkyDockComponent_domAdapter, domAdapter, "f");
     }
     insertComponent(component, config = {}) {
-        const factory = this.resolver.resolveComponentFactory(component);
+        /*istanbul ignore if: untestable*/
+        if (!this.target) {
+            throw Error('[SkyDockComponent] Could not insert the component because the target element could not be found.');
+        }
+        const factory = __classPrivateFieldGet(this, _SkyDockComponent_resolver, "f").resolveComponentFactory(component);
         const injector = Injector.create({
             providers: config.providers || [],
-            parent: this.injector,
+            parent: __classPrivateFieldGet(this, _SkyDockComponent_injector, "f"),
         });
         const componentRef = this.target.createComponent(factory, undefined, injector);
         const stackOrder = config.stackOrder !== null && config.stackOrder !== undefined
             ? config.stackOrder
-            : this.getHighestStackOrder();
-        this.itemRefs.push({
+            : __classPrivateFieldGet(this, _SkyDockComponent_instances, "m", _SkyDockComponent_getHighestStackOrder).call(this);
+        __classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f").push({
             componentRef,
             stackOrder,
         });
-        this.sortItemsByStackOrder();
-        this.changeDetector.markForCheck();
+        __classPrivateFieldGet(this, _SkyDockComponent_instances, "m", _SkyDockComponent_sortItemsByStackOrder).call(this);
+        __classPrivateFieldGet(this, _SkyDockComponent_changeDetector, "f").markForCheck();
         return {
             componentRef,
             stackOrder,
         };
     }
     removeItem(item) {
+        /*istanbul ignore if: untestable*/
+        if (!this.target) {
+            throw Error('[SkyDockComponent] Could not remove the item because the target element could not be found.');
+        }
         const viewRef = item.componentRef.hostView;
         this.target.remove(this.target.indexOf(viewRef));
-        const found = this.itemRefs.find((i) => i.componentRef.hostView === viewRef);
-        this.itemRefs.splice(this.itemRefs.indexOf(found), 1);
+        const found = __classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f").find((i) => i.componentRef.hostView === viewRef);
+        if (found) {
+            __classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f").splice(__classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f").indexOf(found), 1);
+        }
     }
     setOptions(options) {
-        this.options = options;
-        switch (this.options?.location) {
+        __classPrivateFieldSet(this, _SkyDockComponent_options, options, "f");
+        switch (__classPrivateFieldGet(this, _SkyDockComponent_options, "f")?.location) {
             case SkyDockLocation.BeforeElement:
-                this.domAdapter.unbindDock(this.elementRef);
+                __classPrivateFieldGet(this, _SkyDockComponent_domAdapter, "f").unbindDock(__classPrivateFieldGet(this, _SkyDockComponent_elementRef, "f"));
                 break;
             case SkyDockLocation.ElementBottom:
-                this.domAdapter.setSticky(this.elementRef);
+                __classPrivateFieldGet(this, _SkyDockComponent_domAdapter, "f").setSticky(__classPrivateFieldGet(this, _SkyDockComponent_elementRef, "f"));
                 break;
             case SkyDockLocation.BodyBottom:
             default:
-                this.domAdapter.watchDomChanges(this.elementRef);
+                __classPrivateFieldGet(this, _SkyDockComponent_domAdapter, "f").watchDomChanges(__classPrivateFieldGet(this, _SkyDockComponent_elementRef, "f"));
                 break;
         }
-        if (this.options?.zIndex) {
-            this.domAdapter.setZIndex(this.options.zIndex, this.elementRef);
+        if (__classPrivateFieldGet(this, _SkyDockComponent_options, "f")?.zIndex) {
+            __classPrivateFieldGet(this, _SkyDockComponent_domAdapter, "f").setZIndex(__classPrivateFieldGet(this, _SkyDockComponent_options, "f").zIndex, __classPrivateFieldGet(this, _SkyDockComponent_elementRef, "f"));
         }
     }
-    sortItemsByStackOrder() {
-        this.itemRefs.sort(sortByStackOrder);
+}
+_SkyDockComponent_changeDetector = new WeakMap(), _SkyDockComponent_domAdapter = new WeakMap(), _SkyDockComponent_elementRef = new WeakMap(), _SkyDockComponent_injector = new WeakMap(), _SkyDockComponent_itemRefs = new WeakMap(), _SkyDockComponent_options = new WeakMap(), _SkyDockComponent_resolver = new WeakMap(), _SkyDockComponent_instances = new WeakSet(), _SkyDockComponent_sortItemsByStackOrder = function _SkyDockComponent_sortItemsByStackOrder() {
+    if (this.target) {
+        __classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f").sort(sortByStackOrder);
         // Reassign the correct index for each view.
-        this.itemRefs.forEach((item, i) => this.target.move(item.componentRef.hostView, i));
-    }
-    getHighestStackOrder() {
-        if (this.itemRefs.length === 0) {
-            return 0;
+        for (let i = 0, len = __classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f").length; i < len; i++) {
+            const item = __classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f")[i];
+            this.target.move(item.componentRef.hostView, i);
         }
-        return this.itemRefs[0].stackOrder + 1;
     }
-}
+}, _SkyDockComponent_getHighestStackOrder = function _SkyDockComponent_getHighestStackOrder() {
+    if (__classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f").length === 0) {
+        return 0;
+    }
+    return __classPrivateFieldGet(this, _SkyDockComponent_itemRefs, "f")[0].stackOrder + 1;
+};
 SkyDockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDockComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ComponentFactoryResolver }, { token: i0.ElementRef }, { token: i0.Injector }, { token: SkyDockDomAdapterService }], target: i0.ɵɵFactoryTarget.Component });
 SkyDockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyDockComponent, selector: "sky-dock", providers: [SkyDockDomAdapterService], viewQueries: [{ propertyName: "target", first: true, predicate: ["target"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<ng-container #target></ng-container>\n", styles: [":host{display:flex;flex-direction:column;width:100%}:host:not(.sky-dock-unbound){position:fixed;left:0;bottom:0;right:0}:host.sky-dock-sticky{position:sticky}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDockComponent, decorators: [{
@@ -1149,20 +1200,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }] });
 
+var _SkyDynamicComponentService_instances, _SkyDynamicComponentService_applicationRef, _SkyDynamicComponentService_componentFactoryResolver, _SkyDynamicComponentService_injector, _SkyDynamicComponentService_renderer, _SkyDynamicComponentService_windowRef, _SkyDynamicComponentService_getRootNode;
 /**
  * Angular service for creating and rendering a dynamic component.
  */
 class SkyDynamicComponentService {
+    // TODO: Replace deprecated `ComponentFactoryResolver`.
     constructor(componentFactoryResolver, applicationRef, injector, windowRef, rendererFactory) {
-        this.componentFactoryResolver = componentFactoryResolver;
-        this.applicationRef = applicationRef;
-        this.injector = injector;
-        this.windowRef = windowRef;
+        _SkyDynamicComponentService_instances.add(this);
+        _SkyDynamicComponentService_applicationRef.set(this, void 0);
+        _SkyDynamicComponentService_componentFactoryResolver.set(this, void 0);
+        _SkyDynamicComponentService_injector.set(this, void 0);
+        _SkyDynamicComponentService_renderer.set(this, void 0);
+        _SkyDynamicComponentService_windowRef.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyDynamicComponentService_componentFactoryResolver, componentFactoryResolver, "f");
+        __classPrivateFieldSet(this, _SkyDynamicComponentService_applicationRef, applicationRef, "f");
+        __classPrivateFieldSet(this, _SkyDynamicComponentService_injector, injector, "f");
+        __classPrivateFieldSet(this, _SkyDynamicComponentService_windowRef, windowRef, "f");
         // Based on suggestions from https://github.com/angular/angular/issues/17824
         // for accessing an instance of Renderer2 in a service since Renderer2 can't
         // be injected into a service.  Passing undefined for both parameters results
         // in the default renderer which is what we want here.
-        this.renderer = rendererFactory.createRenderer(undefined, undefined);
+        __classPrivateFieldSet(this, _SkyDynamicComponentService_renderer, rendererFactory.createRenderer(undefined, null), "f");
     }
     /**
      * Creates an instance of the specified component and adds it to the specified location
@@ -1175,29 +1234,35 @@ class SkyDynamicComponentService {
         };
         const injector = Injector.create({
             providers: options.providers || [],
-            parent: this.injector,
+            parent: __classPrivateFieldGet(this, _SkyDynamicComponentService_injector, "f"),
         });
-        const componentRef = this.componentFactoryResolver
+        const componentRef = __classPrivateFieldGet(this, _SkyDynamicComponentService_componentFactoryResolver, "f")
             .resolveComponentFactory(componentType)
             .create(injector);
-        this.applicationRef.attachView(componentRef.hostView);
-        const el = this.getRootNode(componentRef);
-        const bodyEl = this.windowRef.nativeWindow.document.body;
+        __classPrivateFieldGet(this, _SkyDynamicComponentService_applicationRef, "f").attachView(componentRef.hostView);
+        const el = __classPrivateFieldGet(this, _SkyDynamicComponentService_instances, "m", _SkyDynamicComponentService_getRootNode).call(this, componentRef);
+        const bodyEl = __classPrivateFieldGet(this, _SkyDynamicComponentService_windowRef, "f").nativeWindow.document.body;
         switch (options.location) {
             case SkyDynamicComponentLocation.BeforeElement:
-                this.renderer.insertBefore(options.referenceEl.parentElement, el, options.referenceEl);
+                if (!options.referenceEl) {
+                    throw new Error('[SkyDynamicComponentService] Could not create a component at location `SkyDynamicComponentLocation.BeforeElement` because a reference element was not provided.');
+                }
+                __classPrivateFieldGet(this, _SkyDynamicComponentService_renderer, "f").insertBefore(options.referenceEl.parentElement, el, options.referenceEl);
                 break;
             case SkyDynamicComponentLocation.ElementTop:
-                this.renderer.insertBefore(options.referenceEl, el, options.referenceEl.firstChild);
+                if (!options.referenceEl) {
+                    throw new Error('[SkyDynamicComponentService] Could not create a component at location `SkyDynamicComponentLocation.ElementTop` because a reference element was not provided.');
+                }
+                __classPrivateFieldGet(this, _SkyDynamicComponentService_renderer, "f").insertBefore(options.referenceEl, el, options.referenceEl.firstChild);
                 break;
             case SkyDynamicComponentLocation.ElementBottom:
-                this.renderer.appendChild(options.referenceEl, el);
+                __classPrivateFieldGet(this, _SkyDynamicComponentService_renderer, "f").appendChild(options.referenceEl, el);
                 break;
             case SkyDynamicComponentLocation.BodyTop:
-                this.renderer.insertBefore(bodyEl, el, bodyEl.firstChild);
+                __classPrivateFieldGet(this, _SkyDynamicComponentService_renderer, "f").insertBefore(bodyEl, el, bodyEl.firstChild);
                 break;
             default:
-                this.renderer.appendChild(bodyEl, el);
+                __classPrivateFieldGet(this, _SkyDynamicComponentService_renderer, "f").appendChild(bodyEl, el);
                 break;
         }
         return componentRef;
@@ -1210,15 +1275,15 @@ class SkyDynamicComponentService {
         if (!componentRef) {
             return;
         }
-        this.applicationRef.detachView(componentRef.hostView);
+        __classPrivateFieldGet(this, _SkyDynamicComponentService_applicationRef, "f").detachView(componentRef.hostView);
         componentRef.destroy();
     }
-    getRootNode(componentRef) {
-        // Technique for retrieving the component's root node taken from here:
-        // https://malcoded.com/posts/angular-dynamic-components
-        return componentRef.hostView.rootNodes[0];
-    }
 }
+_SkyDynamicComponentService_applicationRef = new WeakMap(), _SkyDynamicComponentService_componentFactoryResolver = new WeakMap(), _SkyDynamicComponentService_injector = new WeakMap(), _SkyDynamicComponentService_renderer = new WeakMap(), _SkyDynamicComponentService_windowRef = new WeakMap(), _SkyDynamicComponentService_instances = new WeakSet(), _SkyDynamicComponentService_getRootNode = function _SkyDynamicComponentService_getRootNode(componentRef) {
+    // Technique for retrieving the component's root node taken from here:
+    // https://malcoded.com/posts/angular-dynamic-components
+    return componentRef.hostView.rootNodes[0];
+};
 SkyDynamicComponentService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDynamicComponentService, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: i0.Injector }, { token: SkyAppWindowRef }, { token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyDynamicComponentService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDynamicComponentService, providedIn: 'any' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDynamicComponentService, decorators: [{
@@ -1231,12 +1296,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }, { type: i0.ApplicationRef }, { type: i0.Injector }, { type: SkyAppWindowRef }, { type: i0.RendererFactory2 }]; } });
 
+var _SkyDockService_instances, _SkyDockService_dynamicComponentSvc, _SkyDockService_options, _SkyDockService_createDock, _SkyDockService_destroyDock;
 /**
  * This service docks components to specific areas on the page.
  */
 class SkyDockService {
-    constructor(dynamicComponentService) {
-        this.dynamicComponentService = dynamicComponentService;
+    constructor(dynamicComponentSvc) {
+        _SkyDockService_instances.add(this);
+        _SkyDockService_dynamicComponentSvc.set(this, void 0);
+        _SkyDockService_options.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyDockService_dynamicComponentSvc, dynamicComponentSvc, "f");
     }
     /**
      * Returns all docked items.
@@ -1250,16 +1319,15 @@ class SkyDockService {
      * @param config Options that affect the docking action.
      */
     insertComponent(component, config) {
-        if (!SkyDockService.dockRef) {
-            this.createDock();
-        }
-        const itemRef = SkyDockService.dockRef.instance.insertComponent(component, config);
+        const dockRef = (SkyDockService.dockRef =
+            SkyDockService.dockRef || __classPrivateFieldGet(this, _SkyDockService_instances, "m", _SkyDockService_createDock).call(this));
+        const itemRef = dockRef.instance.insertComponent(component, config);
         const item = new SkyDockItem(itemRef.componentRef.instance, itemRef.stackOrder);
         item.destroyed.subscribe(() => {
-            SkyDockService.dockRef.instance.removeItem(itemRef);
+            dockRef.instance.removeItem(itemRef);
             SkyDockService._items.splice(SkyDockService._items.indexOf(item), 1);
             if (SkyDockService._items.length === 0) {
-                this.destroyDock();
+                __classPrivateFieldGet(this, _SkyDockService_instances, "m", _SkyDockService_destroyDock).call(this);
             }
         });
         SkyDockService._items.push(item);
@@ -1274,36 +1342,36 @@ class SkyDockService {
      * @param options The options for positioning and styling
      */
     setDockOptions(options) {
-        this.options = options;
-    }
-    createDock() {
-        let dockOptions;
-        if (this.options) {
-            let dynamicLocation;
-            switch (this.options.location) {
-                case SkyDockLocation.BeforeElement:
-                    dynamicLocation = SkyDynamicComponentLocation.BeforeElement;
-                    break;
-                case SkyDockLocation.ElementBottom:
-                    dynamicLocation = SkyDynamicComponentLocation.ElementBottom;
-                    break;
-                default:
-                    dynamicLocation = SkyDynamicComponentLocation.BodyTop;
-                    break;
-            }
-            dockOptions = {
-                location: dynamicLocation,
-                referenceEl: this.options.referenceEl,
-            };
-        }
-        SkyDockService.dockRef = this.dynamicComponentService.createComponent(SkyDockComponent, dockOptions);
-        SkyDockService.dockRef.instance.setOptions(this.options);
-    }
-    destroyDock() {
-        this.dynamicComponentService.removeComponent(SkyDockService.dockRef);
-        SkyDockService.dockRef = undefined;
+        __classPrivateFieldSet(this, _SkyDockService_options, options, "f");
     }
 }
+_SkyDockService_dynamicComponentSvc = new WeakMap(), _SkyDockService_options = new WeakMap(), _SkyDockService_instances = new WeakSet(), _SkyDockService_createDock = function _SkyDockService_createDock() {
+    let dockOptions;
+    if (__classPrivateFieldGet(this, _SkyDockService_options, "f")) {
+        let dynamicLocation;
+        switch (__classPrivateFieldGet(this, _SkyDockService_options, "f").location) {
+            case SkyDockLocation.BeforeElement:
+                dynamicLocation = SkyDynamicComponentLocation.BeforeElement;
+                break;
+            case SkyDockLocation.ElementBottom:
+                dynamicLocation = SkyDynamicComponentLocation.ElementBottom;
+                break;
+            default:
+                dynamicLocation = SkyDynamicComponentLocation.BodyTop;
+                break;
+        }
+        dockOptions = {
+            location: dynamicLocation,
+            referenceEl: __classPrivateFieldGet(this, _SkyDockService_options, "f").referenceEl,
+        };
+    }
+    const dockRef = __classPrivateFieldGet(this, _SkyDockService_dynamicComponentSvc, "f").createComponent(SkyDockComponent, dockOptions);
+    dockRef.instance.setOptions(__classPrivateFieldGet(this, _SkyDockService_options, "f"));
+    return dockRef;
+}, _SkyDockService_destroyDock = function _SkyDockService_destroyDock() {
+    __classPrivateFieldGet(this, _SkyDockService_dynamicComponentSvc, "f").removeComponent(SkyDockService.dockRef);
+    SkyDockService.dockRef = undefined;
+};
 SkyDockService._items = [];
 SkyDockService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDockService, deps: [{ token: SkyDynamicComponentService }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyDockService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyDockService, providedIn: 'any' });
@@ -1432,17 +1500,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
  */
 const SKY_LOG_LEVEL = new InjectionToken('SkyLogLevel');
 
+var _SkyLogService_instances, _SkyLogService_applicationLogLevel, _SkyLogService_formatter, _SkyLogService_convertStringToCode, _SkyLogService_canLog, _SkyLogService_logBasedOnLevel;
 /**
  * Logs information to the console based on the application's log level as provided by the `SKY_LOG_LEVEL` injection token. If no token is provided, only `error` logs will be shown.
  * @internal
  */
 class SkyLogService {
     constructor(formatter, applicationLogLevel) {
-        this.formatter = formatter;
-        this.applicationLogLevel = applicationLogLevel;
-        if (!this.applicationLogLevel) {
-            this.applicationLogLevel = 3 /* Error */;
-        }
+        _SkyLogService_instances.add(this);
+        _SkyLogService_applicationLogLevel.set(this, void 0);
+        _SkyLogService_formatter.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyLogService_formatter, formatter, "f");
+        __classPrivateFieldSet(this, _SkyLogService_applicationLogLevel, applicationLogLevel ?? 3 /* Error */, "f");
     }
     /**
      * Logs a deprecation warning for a class, property, function, etc. This will be logged as a console warning unless a different log level is given in the the `args` parameter.
@@ -1452,17 +1521,17 @@ class SkyLogService {
      */
     async deprecated(name, args) {
         const logLevel = args?.logLevel ?? 2 /* Warn */;
-        name = this.convertStringToCode(name);
-        if (this.canLog(logLevel)) {
+        name = __classPrivateFieldGet(this, _SkyLogService_instances, "m", _SkyLogService_convertStringToCode).call(this, name);
+        if (__classPrivateFieldGet(this, _SkyLogService_instances, "m", _SkyLogService_canLog).call(this, logLevel)) {
             const localizedStrings = [];
             if (args?.deprecationMajorVersion) {
-                localizedStrings.push(this.formatter.formatText('{0} is deprecated starting in SKY UX {1}.', name, args.deprecationMajorVersion.toLocaleString()));
+                localizedStrings.push(__classPrivateFieldGet(this, _SkyLogService_formatter, "f").formatText('{0} is deprecated starting in SKY UX {1}.', name, args.deprecationMajorVersion.toLocaleString()));
             }
             else {
-                localizedStrings.push(this.formatter.formatText('{0} is deprecated.', name));
+                localizedStrings.push(__classPrivateFieldGet(this, _SkyLogService_formatter, "f").formatText('{0} is deprecated.', name));
             }
             if (args?.removalMajorVersion) {
-                localizedStrings.push(this.formatter.formatText('We will remove it in version {0}.', args.removalMajorVersion.toLocaleString()));
+                localizedStrings.push(__classPrivateFieldGet(this, _SkyLogService_formatter, "f").formatText('We will remove it in version {0}.', args.removalMajorVersion.toLocaleString()));
             }
             else {
                 localizedStrings.push('We will remove it in a future major version.');
@@ -1471,9 +1540,9 @@ class SkyLogService {
                 localizedStrings.push(args.replacementRecommendation);
             }
             if (args?.moreInfoUrl) {
-                localizedStrings.push(this.formatter.formatText('For more information, see {0}.', args.moreInfoUrl));
+                localizedStrings.push(__classPrivateFieldGet(this, _SkyLogService_formatter, "f").formatText('For more information, see {0}.', args.moreInfoUrl));
             }
-            this.logBasedOnLevel(logLevel, localizedStrings.join(' '));
+            __classPrivateFieldGet(this, _SkyLogService_instances, "m", _SkyLogService_logBasedOnLevel).call(this, logLevel, localizedStrings.join(' '));
         }
         return Promise.resolve();
     }
@@ -1483,7 +1552,7 @@ class SkyLogService {
      * @param params Optional parameters for the error message.
      */
     error(message, params) {
-        if (this.canLog(3 /* Error */)) {
+        if (__classPrivateFieldGet(this, _SkyLogService_instances, "m", _SkyLogService_canLog).call(this, 3 /* Error */)) {
             if (params) {
                 console.error(message, ...params);
             }
@@ -1498,7 +1567,7 @@ class SkyLogService {
      * @param params Optional parameters for the informational message.
      */
     info(message, params) {
-        if (this.canLog(1 /* Info */)) {
+        if (__classPrivateFieldGet(this, _SkyLogService_instances, "m", _SkyLogService_canLog).call(this, 1 /* Info */)) {
             if (params) {
                 console.log(message, ...params);
             }
@@ -1513,7 +1582,7 @@ class SkyLogService {
      * @param params Optional parameters for the warning message.
      */
     warn(message, params) {
-        if (this.canLog(2 /* Warn */)) {
+        if (__classPrivateFieldGet(this, _SkyLogService_instances, "m", _SkyLogService_canLog).call(this, 2 /* Warn */)) {
             if (params) {
                 console.warn(message, ...params);
             }
@@ -1522,29 +1591,27 @@ class SkyLogService {
             }
         }
     }
-    convertStringToCode(typeString) {
-        if (typeString.charAt(0) !== '`' && typeString.charAt(-1) !== '`') {
-            typeString = '`' + typeString + '`';
-        }
-        return typeString;
+}
+_SkyLogService_applicationLogLevel = new WeakMap(), _SkyLogService_formatter = new WeakMap(), _SkyLogService_instances = new WeakSet(), _SkyLogService_convertStringToCode = function _SkyLogService_convertStringToCode(typeString) {
+    if (typeString.charAt(0) !== '`' && typeString.charAt(-1) !== '`') {
+        typeString = '`' + typeString + '`';
     }
-    canLog(intendedLogLevel) {
-        return intendedLogLevel >= this.applicationLogLevel;
+    return typeString;
+}, _SkyLogService_canLog = function _SkyLogService_canLog(intendedLogLevel) {
+    return intendedLogLevel >= __classPrivateFieldGet(this, _SkyLogService_applicationLogLevel, "f");
+}, _SkyLogService_logBasedOnLevel = function _SkyLogService_logBasedOnLevel(logLevel, message, params) {
+    switch (logLevel) {
+        case 1 /* Info */:
+            this.info(message, params);
+            break;
+        case 2 /* Warn */:
+            this.warn(message, params);
+            break;
+        case 3 /* Error */:
+            this.error(message, params);
+            break;
     }
-    logBasedOnLevel(logLevel, message, params) {
-        switch (logLevel) {
-            case 1 /* Info */:
-                this.info(message, params);
-                break;
-            case 2 /* Warn */:
-                this.warn(message, params);
-                break;
-            case 3 /* Error */:
-                this.error(message, params);
-                break;
-        }
-    }
-}
+};
 SkyLogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyLogService, deps: [{ token: SkyAppFormat }, { token: SKY_LOG_LEVEL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyLogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyLogService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyLogService, decorators: [{
@@ -1573,12 +1640,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{}]
         }] });
 
+var _SkyMediaQueryService_instances, _SkyMediaQueryService_currentSubject, _SkyMediaQueryService_currentBreakpoint, _SkyMediaQueryService_breakpoints, _SkyMediaQueryService_mediaQueries, _SkyMediaQueryService_zone, _SkyMediaQueryService_addListeners, _SkyMediaQueryService_removeListeners, _SkyMediaQueryService_notifyBreakpointChange;
+const DEFAULT_BREAKPOINT$1 = SkyMediaBreakpoints.md;
 class SkyMediaQueryService {
     constructor(zone) {
-        this.zone = zone;
-        this.currentSubject = new BehaviorSubject(this.current);
-        this._current = SkyMediaBreakpoints.md;
-        this.breakpoints = [
+        _SkyMediaQueryService_instances.add(this);
+        _SkyMediaQueryService_currentSubject.set(this, new BehaviorSubject(DEFAULT_BREAKPOINT$1));
+        _SkyMediaQueryService_currentBreakpoint.set(this, DEFAULT_BREAKPOINT$1);
+        _SkyMediaQueryService_breakpoints.set(this, [
             {
                 mediaQueryString: SkyMediaQueryService.xs,
                 name: SkyMediaBreakpoints.xs,
@@ -1595,26 +1664,28 @@ class SkyMediaQueryService {
                 mediaQueryString: SkyMediaQueryService.lg,
                 name: SkyMediaBreakpoints.lg,
             },
-        ];
-        this.mediaQueries = [];
-        this.addListeners();
+        ]);
+        _SkyMediaQueryService_mediaQueries.set(this, []);
+        _SkyMediaQueryService_zone.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyMediaQueryService_zone, zone, "f");
+        __classPrivateFieldGet(this, _SkyMediaQueryService_instances, "m", _SkyMediaQueryService_addListeners).call(this);
     }
     /**
      * Returns the current breakpoint.
      */
     get current() {
-        return this._current;
+        return __classPrivateFieldGet(this, _SkyMediaQueryService_currentBreakpoint, "f");
     }
     ngOnDestroy() {
-        this.removeListeners();
-        this.currentSubject.complete();
+        __classPrivateFieldGet(this, _SkyMediaQueryService_instances, "m", _SkyMediaQueryService_removeListeners).call(this);
+        __classPrivateFieldGet(this, _SkyMediaQueryService_currentSubject, "f").complete();
     }
     /**
      * Subscribes to screen size changes.
      * @param listener Specifies a function that is called when breakpoints change.
      */
     subscribe(listener) {
-        return this.currentSubject.subscribe({
+        return __classPrivateFieldGet(this, _SkyMediaQueryService_currentSubject, "f").subscribe({
             next: (breakpoints) => {
                 listener(breakpoints);
             },
@@ -1624,43 +1695,41 @@ class SkyMediaQueryService {
      * @internal
      */
     destroy() {
-        this.removeListeners();
-        this.currentSubject.complete();
-    }
-    addListeners() {
-        this.mediaQueries = this.breakpoints.map((breakpoint) => {
-            const mq = matchMedia(breakpoint.mediaQueryString);
-            const listener = (event) => {
-                // Run the check outside of Angular's change detection since Angular
-                // does not wrap matchMedia listeners in NgZone.
-                // See: https://blog.assaf.co/angular-2-change-detection-zones-and-an-example/
-                this.zone.run(() => {
-                    if (event.matches) {
-                        this.notifyBreakpointChange(breakpoint.name);
-                    }
-                });
-            };
-            mq.addListener(listener);
-            if (mq.matches) {
-                this.notifyBreakpointChange(breakpoint.name);
-            }
-            return {
-                mediaQueryList: mq,
-                listener,
-            };
-        });
-    }
-    removeListeners() {
-        this.mediaQueries.forEach((mediaQuery) => {
-            mediaQuery.mediaQueryList.removeListener(mediaQuery.listener);
-        });
-        this.mediaQueries = [];
-    }
-    notifyBreakpointChange(breakpoint) {
-        this._current = breakpoint;
-        this.currentSubject.next(breakpoint);
-    }
-}
+        __classPrivateFieldGet(this, _SkyMediaQueryService_instances, "m", _SkyMediaQueryService_removeListeners).call(this);
+        __classPrivateFieldGet(this, _SkyMediaQueryService_currentSubject, "f").complete();
+    }
+}
+_SkyMediaQueryService_currentSubject = new WeakMap(), _SkyMediaQueryService_currentBreakpoint = new WeakMap(), _SkyMediaQueryService_breakpoints = new WeakMap(), _SkyMediaQueryService_mediaQueries = new WeakMap(), _SkyMediaQueryService_zone = new WeakMap(), _SkyMediaQueryService_instances = new WeakSet(), _SkyMediaQueryService_addListeners = function _SkyMediaQueryService_addListeners() {
+    __classPrivateFieldSet(this, _SkyMediaQueryService_mediaQueries, __classPrivateFieldGet(this, _SkyMediaQueryService_breakpoints, "f").map((breakpoint) => {
+        const mq = matchMedia(breakpoint.mediaQueryString);
+        const listener = (event) => {
+            // Run the check outside of Angular's change detection since Angular
+            // does not wrap matchMedia listeners in NgZone.
+            // See: https://blog.assaf.co/angular-2-change-detection-zones-and-an-example/
+            __classPrivateFieldGet(this, _SkyMediaQueryService_zone, "f").run(() => {
+                if (event.matches) {
+                    __classPrivateFieldGet(this, _SkyMediaQueryService_instances, "m", _SkyMediaQueryService_notifyBreakpointChange).call(this, breakpoint.name);
+                }
+            });
+        };
+        mq.addListener(listener);
+        if (mq.matches) {
+            __classPrivateFieldGet(this, _SkyMediaQueryService_instances, "m", _SkyMediaQueryService_notifyBreakpointChange).call(this, breakpoint.name);
+        }
+        return {
+            mediaQueryList: mq,
+            listener,
+        };
+    }), "f");
+}, _SkyMediaQueryService_removeListeners = function _SkyMediaQueryService_removeListeners() {
+    __classPrivateFieldGet(this, _SkyMediaQueryService_mediaQueries, "f").forEach((mediaQuery) => {
+        mediaQuery.mediaQueryList.removeListener(mediaQuery.listener);
+    });
+    __classPrivateFieldSet(this, _SkyMediaQueryService_mediaQueries, [], "f");
+}, _SkyMediaQueryService_notifyBreakpointChange = function _SkyMediaQueryService_notifyBreakpointChange(breakpoint) {
+    __classPrivateFieldSet(this, _SkyMediaQueryService_currentBreakpoint, breakpoint, "f");
+    __classPrivateFieldGet(this, _SkyMediaQueryService_currentSubject, "f").next(breakpoint);
+};
 /**
  * The size for the `xs` breakpoint.
  * @default "(max-width: 767px)"
@@ -1819,25 +1888,28 @@ class SkyNumberFormatUtility {
 }
 SkyNumberFormatUtility._NUMBER_FORMAT_REGEXP = /^(\d+)?\.((\d+)(-(\d+))?)?$/;
 
+var _SkyNumericService_instances, _SkyNumericService_resourcesSvc, _SkyNumericService_symbolIndex, _SkyNumericService_roundNumber, _SkyNumericService_scaleNumberByPowerOfTen, _SkyNumericService_storeShortenSymbol, _SkyNumericService_replaceShortenSymbol, _SkyNumericService_getSymbol;
 class SkyNumericService {
-    constructor(resourcesService) {
-        this.resourcesService = resourcesService;
-        this.symbolIndex = [
-            { value: 1e12, label: this.getSymbol('skyux_numeric_trillions_symbol') },
-            { value: 1e9, label: this.getSymbol('skyux_numeric_billions_symbol') },
-            { value: 1e6, label: this.getSymbol('skyux_numeric_millions_symbol') },
-            { value: 1e3, label: this.getSymbol('skyux_numeric_thousands_symbol') },
-        ];
-    }
-    /**
-     * The browser's current locale.
-     * @internal
-     */
-    set currentLocale(value) {
-        this._locale = value;
-    }
-    get currentLocale() {
-        return this._locale || 'en-US';
+    constructor(resourcesSvc) {
+        _SkyNumericService_instances.add(this);
+        /**
+         * The browser's current locale.
+         * @internal
+         */
+        this.currentLocale = 'en-US';
+        /**
+         * @internal
+         */
+        this.shortSymbol = '';
+        _SkyNumericService_resourcesSvc.set(this, void 0);
+        _SkyNumericService_symbolIndex.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyNumericService_resourcesSvc, resourcesSvc, "f");
+        __classPrivateFieldSet(this, _SkyNumericService_symbolIndex, [
+            { value: 1e12, label: __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_getSymbol).call(this, 'skyux_numeric_trillions_symbol') },
+            { value: 1e9, label: __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_getSymbol).call(this, 'skyux_numeric_billions_symbol') },
+            { value: 1e6, label: __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_getSymbol).call(this, 'skyux_numeric_millions_symbol') },
+            { value: 1e3, label: __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_getSymbol).call(this, 'skyux_numeric_thousands_symbol') },
+        ], "f");
     }
     /**
      * Formats a number based on the provided options.
@@ -1849,20 +1921,23 @@ class SkyNumericService {
             return '';
         }
         const decimalPlaceRegExp = /\.0+$|(\.[0-9]*[1-9])0+$/;
+        const locale = options.locale || this.currentLocale;
+        const digits = options.digits || 0;
         // Get the symbol for the number after rounding, since rounding could push the number
         // into a different symbol range.
-        let roundedNumber = this.roundNumber(value, options.digits);
+        let roundedNumber = __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_roundNumber).call(this, value, digits);
         const roundedNumberAbs = Math.abs(roundedNumber);
         let suffix = '';
-        for (let i = 0; i < this.symbolIndex.length; i++) {
-            let symbol = this.symbolIndex[i];
+        for (let i = 0; i < __classPrivateFieldGet(this, _SkyNumericService_symbolIndex, "f").length; i++) {
+            let symbol = __classPrivateFieldGet(this, _SkyNumericService_symbolIndex, "f")[i];
             if (options.truncate &&
+                options.truncateAfter &&
                 roundedNumberAbs >= options.truncateAfter &&
                 roundedNumberAbs >= symbol.value) {
-                roundedNumber = this.roundNumber(value / symbol.value, options.digits);
+                roundedNumber = __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_roundNumber).call(this, value / symbol.value, digits);
                 if (Math.abs(roundedNumber) === 1000 && i > 0) {
                     // Rounding caused the number to cross into the range of the next symbol.
-                    symbol = this.symbolIndex[i - 1];
+                    symbol = __classPrivateFieldGet(this, _SkyNumericService_symbolIndex, "f")[i - 1];
                     roundedNumber /= 1000;
                 }
                 suffix = symbol.label;
@@ -1870,10 +1945,9 @@ class SkyNumericService {
             }
         }
         let output = roundedNumber.toString().replace(decimalPlaceRegExp, '$1') + suffix;
-        this.storeShortenSymbol(output);
-        const locale = options.locale || this.currentLocale;
-        let digits;
-        let isDecimal;
+        __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_storeShortenSymbol).call(this, output);
+        let digitsFormatted;
+        let isDecimal = false;
         // Checks the string entered for format. Using toLowerCase to ignore case.
         switch (options.format?.toLowerCase()) {
             // In a case where a decimal value was not shortened and
@@ -1884,20 +1958,21 @@ class SkyNumericService {
             case 'currency':
                 isDecimal = value % 1 !== 0;
                 if (options.minDigits) {
-                    digits = `1.${options.minDigits}-${options.digits}`;
+                    digitsFormatted = `1.${options.minDigits}-${digits}`;
                 }
-                else if (isDecimal && options.digits >= 2) {
-                    digits = `1.2-${options.digits}`;
+                else if (isDecimal && digits >= 2) {
+                    digitsFormatted = `1.2-${digits}`;
                 }
                 else {
-                    digits = `1.0-${options.digits}`;
+                    digitsFormatted = `1.0-${digits}`;
                 }
-                output = SkyNumberFormatUtility.formatNumber(locale, parseFloat(output), SkyIntlNumberFormatStyle.Currency, digits, options.iso, 
+                output = SkyNumberFormatUtility.formatNumber(locale, parseFloat(output), SkyIntlNumberFormatStyle.Currency, digitsFormatted, options.iso, 
                 // Angular 5+ needs a string for this parameter, but Angular 4 needs a boolean.
                 // To support both versions we can supply 'symbol' which will evaluate truthy for Angular 4
                 // and the appropriate string value for Angular 5+.
                 // See: https://angular.io/api/common/CurrencyPipe#parameters
                 'symbol', options.currencySign);
+                //   ^^^^^^ Result can't be null since the sanitized input is always a number.
                 break;
             // The following is a catch-all to ensure that if
             // anything but currency (or a future option) are entered,
@@ -1906,91 +1981,69 @@ class SkyNumericService {
                 // Ensures localization of the number to ensure comma and
                 // decimal separator
                 if (options.minDigits) {
-                    digits = `1.${options.minDigits}-${options.digits}`;
+                    digitsFormatted = `1.${options.minDigits}-${digits}`;
                 }
                 else if (options.truncate) {
-                    digits = `1.0-${options.digits}`;
+                    digitsFormatted = `1.0-${digits}`;
                 }
                 else {
-                    digits = `1.${options.digits}-${options.digits}`;
+                    digitsFormatted = `1.${digits}-${digits}`;
                 }
-                output = SkyNumberFormatUtility.formatNumber(locale, parseFloat(output), SkyIntlNumberFormatStyle.Decimal, digits);
+                output = SkyNumberFormatUtility.formatNumber(locale, parseFloat(output), SkyIntlNumberFormatStyle.Decimal, digitsFormatted);
+                //   ^^^^^^ Result can't be null since the sanitized input is always a number.
                 break;
         }
         if (options.truncate) {
-            output = this.replaceShortenSymbol(output);
+            output = __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_replaceShortenSymbol).call(this, output);
         }
         return output;
     }
-    /**
-     * Rounds a given number
-     *
-     * JS's limitation - numbers bigger than Number.MIN_SAFE_INTEGER or Number.MAX_SAFE_INTEGER
-     * are not guaranteed to be represented or rounded correctly
-     * @param value - value to round
-     * @param precision - what precision to round with, defaults to 0 decimal places
-     */
-    roundNumber(value, precision = 0) {
-        if (precision < 0) {
-            throw new Error('SkyInvalidArgument: precision must be >= 0');
-        }
-        /* Sanity check - ignoring coverage but should not ignore if we make this method public */
-        /* istanbul ignore next */
-        if (isNaN(value) || value === null) {
-            return 0;
-        }
-        const scaledValue = this.scaleNumberByPowerOfTen(value, precision, true);
-        const scaledRoundedValue = Math.round(scaledValue);
-        const unscaledRoundedValue = this.scaleNumberByPowerOfTen(scaledRoundedValue, precision, false);
-        return unscaledRoundedValue;
-    }
-    /**
-     * Scales a given number by a power of 10
-     * @param value - value to scale
-     * @param scalar - 10^scalar
-     * @param scaleUp - whether to increase or decrease the value
-     */
-    scaleNumberByPowerOfTen(value, scalar, scaleUp) {
-        const valueStr = value.toString().toLowerCase();
-        const isExponentFormat = valueStr.includes('e');
-        if (isExponentFormat) {
-            const [base, exp] = valueStr.split('e');
-            const newExp = scaleUp ? Number(exp) + scalar : Number(exp) - scalar;
-            return Number(`${base}e${newExp}`);
-        }
-        else {
-            const e = scaleUp ? 'e' : 'e-';
-            return Number(`${value}${e}${scalar}`);
-        }
+}
+_SkyNumericService_resourcesSvc = new WeakMap(), _SkyNumericService_symbolIndex = new WeakMap(), _SkyNumericService_instances = new WeakSet(), _SkyNumericService_roundNumber = function _SkyNumericService_roundNumber(value, precision) {
+    if (precision < 0) {
+        throw new Error('SkyInvalidArgument: precision must be >= 0');
     }
-    /**
-     * Stores the symbol added from shortening to reapply later.
-     * @param value The string to derive the shorten symbol from.
-     */
-    storeShortenSymbol(value) {
-        const symbols = this.symbolIndex.map((s) => s.label);
-        const regexp = new RegExp(symbols.join('|'), 'ig');
-        const match = value.match(regexp);
-        this.shortSymbol = match ? match.toString() : '';
+    /* Sanity check - ignoring coverage but should not ignore if we make this method public */
+    /* istanbul ignore next */
+    if (isNaN(value) || value === null) {
+        return 0;
+    }
+    const scaledValue = __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_scaleNumberByPowerOfTen).call(this, value, precision, true);
+    const scaledRoundedValue = Math.round(scaledValue);
+    const unscaledRoundedValue = __classPrivateFieldGet(this, _SkyNumericService_instances, "m", _SkyNumericService_scaleNumberByPowerOfTen).call(this, scaledRoundedValue, precision, false);
+    return unscaledRoundedValue;
+}, _SkyNumericService_scaleNumberByPowerOfTen = function _SkyNumericService_scaleNumberByPowerOfTen(value, scalar, scaleUp) {
+    const valueStr = value.toString().toLowerCase();
+    const isExponentFormat = valueStr.includes('e');
+    if (isExponentFormat) {
+        const [base, exp] = valueStr.split('e');
+        const newExp = scaleUp ? Number(exp) + scalar : Number(exp) - scalar;
+        return Number(`${base}e${newExp}`);
     }
-    /**
-     * Must have previously called storeShortenSymbol to have something to replace.
-     * Finds the last number in the formatted number, gets the index of the position
-     * after that character and re-inserts the symbol.
-     * Works regardless of currency symbol position.
-     * @param value The string to modify.
-     */
-    replaceShortenSymbol(value) {
-        const result = /(\d)(?!.*\d)/g.exec(value);
+    else {
+        const e = scaleUp ? 'e' : 'e-';
+        return Number(`${value}${e}${scalar}`);
+    }
+}, _SkyNumericService_storeShortenSymbol = function _SkyNumericService_storeShortenSymbol(value) {
+    const symbols = __classPrivateFieldGet(this, _SkyNumericService_symbolIndex, "f").map((s) => s.label);
+    const regexp = new RegExp(symbols.join('|'), 'ig');
+    const match = value.match(regexp);
+    this.shortSymbol = match ? match.toString() : '';
+}, _SkyNumericService_replaceShortenSymbol = function _SkyNumericService_replaceShortenSymbol(value) {
+    const result = /(\d)(?!.*\d)/g.exec(value);
+    /*istanbul ignore else*/
+    if (result) {
         const pos = result.index + result.length;
         const output = value.substring(0, pos) + this.shortSymbol + value.substring(pos);
         return output;
     }
-    getSymbol(key) {
-        // TODO: Need to implement the async `getString` method in a breaking change.
-        return this.resourcesService.getStringForLocale({ locale: 'en_US' }, key);
+    else {
+        return value;
     }
-}
+}, _SkyNumericService_getSymbol = function _SkyNumericService_getSymbol(key) {
+    // TODO: Need to implement the async `getString` method in a breaking change.
+    return __classPrivateFieldGet(this, _SkyNumericService_resourcesSvc, "f").getStringForLocale({ locale: 'en_US' }, key);
+};
 SkyNumericService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyNumericService, deps: [{ token: i1.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyNumericService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyNumericService, providedIn: 'any' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyNumericService, decorators: [{
@@ -2000,6 +2053,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i1.SkyLibResourcesService }]; } });
 
+var _SkyNumericPipe_cacheKey, _SkyNumericPipe_changeDetector, _SkyNumericPipe_formattedValue, _SkyNumericPipe_ngUnsubscribe, _SkyNumericPipe_numericSvc, _SkyNumericPipe_providerLocale;
 /**
  * Shortens numbers to rounded numbers and abbreviation characters such as K for thousands,
  * M for millions, B for billions, and T for trillions. The pipe also formats for currency.
@@ -2007,34 +2061,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
  * a space before the two curly brackets closing the pipe or it will not work.
  */
 class SkyNumericPipe {
-    constructor(localeProvider, numericService, changeDetector) {
-        this.localeProvider = localeProvider;
-        this.numericService = numericService;
-        this.changeDetector = changeDetector;
-        this.ngUnsubscribe = new Subject();
-        this.localeProvider
+    constructor(localeProvider, numericSvc, changeDetector) {
+        _SkyNumericPipe_cacheKey.set(this, void 0);
+        _SkyNumericPipe_changeDetector.set(this, void 0);
+        _SkyNumericPipe_formattedValue.set(this, void 0);
+        _SkyNumericPipe_ngUnsubscribe.set(this, new Subject());
+        _SkyNumericPipe_numericSvc.set(this, void 0);
+        _SkyNumericPipe_providerLocale.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyNumericPipe_numericSvc, numericSvc, "f");
+        __classPrivateFieldSet(this, _SkyNumericPipe_changeDetector, changeDetector, "f");
+        localeProvider
             .getLocaleInfo()
-            .pipe(takeUntil(this.ngUnsubscribe))
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyNumericPipe_ngUnsubscribe, "f")))
             .subscribe((localeInfo) => {
-            this.providerLocale = localeInfo.locale;
-            numericService.currentLocale = this.providerLocale;
-            this.changeDetector.markForCheck();
+            __classPrivateFieldSet(this, _SkyNumericPipe_providerLocale, localeInfo.locale, "f");
+            numericSvc.currentLocale = __classPrivateFieldGet(this, _SkyNumericPipe_providerLocale, "f");
+            __classPrivateFieldGet(this, _SkyNumericPipe_changeDetector, "f").markForCheck();
         });
     }
     ngOnDestroy() {
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
+        __classPrivateFieldGet(this, _SkyNumericPipe_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyNumericPipe_ngUnsubscribe, "f").complete();
     }
     /**
      * Formats a number based on the provided options.
      */
     transform(value, config) {
         const newCacheKey = (config ? JSON.stringify(config, Object.keys(config).sort()) : '') +
-            `${value}_${config?.locale || this.providerLocale}`;
+            `${value}_${config?.locale || __classPrivateFieldGet(this, _SkyNumericPipe_providerLocale, "f")}`;
         /* If the value and locale are the same as the last transform then return the previous value
         instead of reformatting. */
-        if (this.formattedValue && this.cacheKey === newCacheKey) {
-            return this.formattedValue;
+        if (__classPrivateFieldGet(this, _SkyNumericPipe_formattedValue, "f") && __classPrivateFieldGet(this, _SkyNumericPipe_cacheKey, "f") === newCacheKey) {
+            return __classPrivateFieldGet(this, _SkyNumericPipe_formattedValue, "f");
         }
         const options = new NumericOptions();
         // The default number of digits is `1`. When truncate is disabled, set digits
@@ -2055,11 +2113,12 @@ class SkyNumericPipe {
         }
         Object.assign(options, config);
         // Assign properties for proper result caching.
-        this.cacheKey = newCacheKey;
-        this.formattedValue = this.numericService.formatNumber(value, options);
-        return this.formattedValue;
+        __classPrivateFieldSet(this, _SkyNumericPipe_cacheKey, newCacheKey, "f");
+        __classPrivateFieldSet(this, _SkyNumericPipe_formattedValue, __classPrivateFieldGet(this, _SkyNumericPipe_numericSvc, "f").formatNumber(value, options), "f");
+        return __classPrivateFieldGet(this, _SkyNumericPipe_formattedValue, "f");
     }
 }
+_SkyNumericPipe_cacheKey = new WeakMap(), _SkyNumericPipe_changeDetector = new WeakMap(), _SkyNumericPipe_formattedValue = new WeakMap(), _SkyNumericPipe_ngUnsubscribe = new WeakMap(), _SkyNumericPipe_numericSvc = new WeakMap(), _SkyNumericPipe_providerLocale = new WeakMap();
 SkyNumericPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyNumericPipe, deps: [{ token: i1.SkyAppLocaleProvider }, { token: SkyNumericService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Pipe });
 SkyNumericPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyNumericPipe, name: "skyNumeric", pure: false });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyNumericPipe, decorators: [{
@@ -2085,6 +2144,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }] });
 
+var _SkyOverlayInstance_backdropClick, _SkyOverlayInstance_backdropClickObs, _SkyOverlayInstance_closed, _SkyOverlayInstance_closedObs;
 /**
  * Represents a new overlay instance. It is used to manage the "closed" state of the overlay,
  * and access any public members on the appended content component instance.
@@ -2097,29 +2157,35 @@ class SkyOverlayInstance {
     config, componentRef) {
         this.config = config;
         this.componentRef = componentRef;
-        this._backdropClick = new Subject();
-        this._closed = new Subject();
+        _SkyOverlayInstance_backdropClick.set(this, void 0);
+        _SkyOverlayInstance_backdropClickObs.set(this, void 0);
+        _SkyOverlayInstance_closed.set(this, void 0);
+        _SkyOverlayInstance_closedObs.set(this, void 0);
         this.id = this.componentRef.instance.id;
         this.componentRef.instance.closed.subscribe(() => {
-            this._closed.next();
-            this._closed.complete();
-            this._backdropClick.complete();
+            __classPrivateFieldGet(this, _SkyOverlayInstance_closed, "f").next();
+            __classPrivateFieldGet(this, _SkyOverlayInstance_closed, "f").complete();
+            __classPrivateFieldGet(this, _SkyOverlayInstance_backdropClick, "f").complete();
         });
         this.componentRef.instance.backdropClick.subscribe(() => {
-            this._backdropClick.next();
+            __classPrivateFieldGet(this, _SkyOverlayInstance_backdropClick, "f").next();
         });
+        __classPrivateFieldSet(this, _SkyOverlayInstance_backdropClick, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyOverlayInstance_closed, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyOverlayInstance_backdropClickObs, __classPrivateFieldGet(this, _SkyOverlayInstance_backdropClick, "f").asObservable(), "f");
+        __classPrivateFieldSet(this, _SkyOverlayInstance_closedObs, __classPrivateFieldGet(this, _SkyOverlayInstance_closed, "f").asObservable(), "f");
     }
     /**
      * Emits when the overlay is clicked (but not its content).
      */
     get backdropClick() {
-        return this._backdropClick.asObservable();
+        return __classPrivateFieldGet(this, _SkyOverlayInstance_backdropClickObs, "f");
     }
     /**
      * Emits after the overlay is closed.
      */
     get closed() {
-        return this._closed.asObservable();
+        return __classPrivateFieldGet(this, _SkyOverlayInstance_closedObs, "f");
     }
     /**
      * Creates and attaches a component to the overlay.
@@ -2139,6 +2205,7 @@ class SkyOverlayInstance {
         this.componentRef.instance.attachTemplate(templateRef, context);
     }
 }
+_SkyOverlayInstance_backdropClick = new WeakMap(), _SkyOverlayInstance_backdropClickObs = new WeakMap(), _SkyOverlayInstance_closed = new WeakMap(), _SkyOverlayInstance_closedObs = new WeakMap();
 
 /**
  * Provides contextual information to each overlay created.
@@ -2150,6 +2217,7 @@ class SkyOverlayContext {
     }
 }
 
+var _SkyOverlayComponent_instances, _SkyOverlayComponent_backdropClick, _SkyOverlayComponent_backdropClickObs, _SkyOverlayComponent_changeDetector, _SkyOverlayComponent_closed, _SkyOverlayComponent_closedObs, _SkyOverlayComponent_context, _SkyOverlayComponent_coreAdapter, _SkyOverlayComponent_injector, _SkyOverlayComponent_ngUnsubscribe, _SkyOverlayComponent_resolver, _SkyOverlayComponent_router, _SkyOverlayComponent_routerSubscription, _SkyOverlayComponent_applyConfig, _SkyOverlayComponent_addBackdropClickListener, _SkyOverlayComponent_addRouteListener, _SkyOverlayComponent_removeRouteListener;
 /**
  * Omnibar is 1000.
  * See: https://github.com/blackbaud/auth-client/blob/master/src/omnibar/omnibar.ts#L139
@@ -2168,51 +2236,70 @@ let uniqueZIndex = 5000;
  * @internal
  */
 class SkyOverlayComponent {
+    // TODO: Replace deprecated `ComponentFactoryResolver`.
     constructor(changeDetector, resolver, injector, coreAdapter, context, idSvc, router) {
-        this.changeDetector = changeDetector;
-        this.resolver = resolver;
-        this.injector = injector;
-        this.coreAdapter = coreAdapter;
-        this.context = context;
-        this.router = router;
+        _SkyOverlayComponent_instances.add(this);
         this.wrapperClass = '';
         this.enablePointerEvents = false;
         this.showBackdrop = false;
         this.zIndex = `${++uniqueZIndex}`;
-        this.ngUnsubscribe = new Subject();
-        this._backdropClick = new Subject();
-        this._closed = new Subject();
+        _SkyOverlayComponent_backdropClick.set(this, void 0);
+        _SkyOverlayComponent_backdropClickObs.set(this, void 0);
+        _SkyOverlayComponent_changeDetector.set(this, void 0);
+        _SkyOverlayComponent_closed.set(this, void 0);
+        _SkyOverlayComponent_closedObs.set(this, void 0);
+        _SkyOverlayComponent_context.set(this, void 0);
+        _SkyOverlayComponent_coreAdapter.set(this, void 0);
+        _SkyOverlayComponent_injector.set(this, void 0);
+        _SkyOverlayComponent_ngUnsubscribe.set(this, new Subject());
+        _SkyOverlayComponent_resolver.set(this, void 0);
+        _SkyOverlayComponent_router.set(this, void 0);
+        _SkyOverlayComponent_routerSubscription.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyOverlayComponent_changeDetector, changeDetector, "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_resolver, resolver, "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_injector, injector, "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_coreAdapter, coreAdapter, "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_context, context, "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_router, router, "f");
         this.id = idSvc.generateId();
+        __classPrivateFieldSet(this, _SkyOverlayComponent_backdropClick, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_closed, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_backdropClickObs, __classPrivateFieldGet(this, _SkyOverlayComponent_backdropClick, "f").asObservable(), "f");
+        __classPrivateFieldSet(this, _SkyOverlayComponent_closedObs, __classPrivateFieldGet(this, _SkyOverlayComponent_closed, "f").asObservable(), "f");
     }
     get backdropClick() {
-        return this._backdropClick.asObservable();
+        return __classPrivateFieldGet(this, _SkyOverlayComponent_backdropClickObs, "f");
     }
     get closed() {
-        return this._closed.asObservable();
+        return __classPrivateFieldGet(this, _SkyOverlayComponent_closedObs, "f");
     }
     ngOnInit() {
-        this.applyConfig(this.context.config);
+        __classPrivateFieldGet(this, _SkyOverlayComponent_instances, "m", _SkyOverlayComponent_applyConfig).call(this, __classPrivateFieldGet(this, _SkyOverlayComponent_context, "f").config);
         setTimeout(() => {
-            this.addBackdropClickListener();
+            __classPrivateFieldGet(this, _SkyOverlayComponent_instances, "m", _SkyOverlayComponent_addBackdropClickListener).call(this);
         });
-        if (this.context.config.closeOnNavigation) {
-            this.addRouteListener();
+        if (__classPrivateFieldGet(this, _SkyOverlayComponent_context, "f").config.closeOnNavigation) {
+            __classPrivateFieldGet(this, _SkyOverlayComponent_instances, "m", _SkyOverlayComponent_addRouteListener).call(this);
         }
     }
     ngOnDestroy() {
-        this.removeRouteListener();
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
-        this._backdropClick.complete();
-        this._closed.next();
-        this._closed.complete();
+        __classPrivateFieldGet(this, _SkyOverlayComponent_instances, "m", _SkyOverlayComponent_removeRouteListener).call(this);
+        __classPrivateFieldGet(this, _SkyOverlayComponent_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyOverlayComponent_ngUnsubscribe, "f").complete();
+        __classPrivateFieldGet(this, _SkyOverlayComponent_backdropClick, "f").complete();
+        __classPrivateFieldGet(this, _SkyOverlayComponent_closed, "f").next();
+        __classPrivateFieldGet(this, _SkyOverlayComponent_closed, "f").complete();
     }
     attachComponent(component, providers = []) {
+        /*istanbul ignore if: untestable*/
+        if (!this.targetRef) {
+            throw new Error('[SkyOverlayComponent] Could not attach the component because the target element could not be found.');
+        }
         this.targetRef.clear();
-        const factory = this.resolver.resolveComponentFactory(component);
+        const factory = __classPrivateFieldGet(this, _SkyOverlayComponent_resolver, "f").resolveComponentFactory(component);
         const injector = Injector.create({
             providers,
-            parent: this.injector,
+            parent: __classPrivateFieldGet(this, _SkyOverlayComponent_injector, "f"),
         });
         const componentRef = this.targetRef.createComponent(factory, undefined, injector);
         // Run an initial change detection cycle after the component has been created.
@@ -2220,48 +2307,51 @@ class SkyOverlayComponent {
         return componentRef;
     }
     attachTemplate(templateRef, context) {
+        /*istanbul ignore if: untestable*/
+        if (!this.targetRef) {
+            throw new Error('[SkyOverlayComponent] Could not attach the template because the target element could not be found.');
+        }
         this.targetRef.clear();
         return this.targetRef.createEmbeddedView(templateRef, context);
     }
-    applyConfig(config) {
-        this.wrapperClass = config.wrapperClass || '';
-        this.showBackdrop = config.showBackdrop;
-        this.enablePointerEvents = config.enablePointerEvents;
-        this.changeDetector.markForCheck();
-    }
-    addBackdropClickListener() {
-        fromEvent(window.document, 'click')
-            .pipe(takeUntil(this.ngUnsubscribe))
-            .subscribe((event) => {
+}
+_SkyOverlayComponent_backdropClick = new WeakMap(), _SkyOverlayComponent_backdropClickObs = new WeakMap(), _SkyOverlayComponent_changeDetector = new WeakMap(), _SkyOverlayComponent_closed = new WeakMap(), _SkyOverlayComponent_closedObs = new WeakMap(), _SkyOverlayComponent_context = new WeakMap(), _SkyOverlayComponent_coreAdapter = new WeakMap(), _SkyOverlayComponent_injector = new WeakMap(), _SkyOverlayComponent_ngUnsubscribe = new WeakMap(), _SkyOverlayComponent_resolver = new WeakMap(), _SkyOverlayComponent_router = new WeakMap(), _SkyOverlayComponent_routerSubscription = new WeakMap(), _SkyOverlayComponent_instances = new WeakSet(), _SkyOverlayComponent_applyConfig = function _SkyOverlayComponent_applyConfig(config) {
+    this.wrapperClass = config.wrapperClass || '';
+    this.showBackdrop = !!config.showBackdrop;
+    this.enablePointerEvents = !!config.enablePointerEvents;
+    __classPrivateFieldGet(this, _SkyOverlayComponent_changeDetector, "f").markForCheck();
+}, _SkyOverlayComponent_addBackdropClickListener = function _SkyOverlayComponent_addBackdropClickListener() {
+    fromEvent(window.document, 'click')
+        .pipe(takeUntil(__classPrivateFieldGet(this, _SkyOverlayComponent_ngUnsubscribe, "f")))
+        .subscribe((event) => {
+        if (event.target && this.overlayContentRef && this.overlayRef) {
             const isChild = this.overlayContentRef.nativeElement.contains(event.target);
-            const isAbove = this.coreAdapter.isTargetAboveElement(event.target, this.overlayRef.nativeElement);
+            const isAbove = __classPrivateFieldGet(this, _SkyOverlayComponent_coreAdapter, "f").isTargetAboveElement(event.target, this.overlayRef.nativeElement);
             /* istanbul ignore else */
             if (!isChild && !isAbove) {
-                this._backdropClick.next();
-                if (this.context.config.enableClose) {
-                    this._closed.next();
+                __classPrivateFieldGet(this, _SkyOverlayComponent_backdropClick, "f").next();
+                if (__classPrivateFieldGet(this, _SkyOverlayComponent_context, "f").config.enableClose) {
+                    __classPrivateFieldGet(this, _SkyOverlayComponent_closed, "f").next();
                 }
             }
-        });
-    }
-    addRouteListener() {
-        /*istanbul ignore else*/
-        if (this.router) {
-            this.routerSubscription = this.router.events.subscribe((event) => {
-                /* istanbul ignore else */
-                if (event instanceof NavigationStart) {
-                    this._closed.next();
-                }
-            });
         }
+    });
+}, _SkyOverlayComponent_addRouteListener = function _SkyOverlayComponent_addRouteListener() {
+    /*istanbul ignore else*/
+    if (__classPrivateFieldGet(this, _SkyOverlayComponent_router, "f")) {
+        __classPrivateFieldSet(this, _SkyOverlayComponent_routerSubscription, __classPrivateFieldGet(this, _SkyOverlayComponent_router, "f").events.subscribe((event) => {
+            /* istanbul ignore else */
+            if (event instanceof NavigationStart) {
+                __classPrivateFieldGet(this, _SkyOverlayComponent_closed, "f").next();
+            }
+        }), "f");
     }
-    removeRouteListener() {
-        if (this.routerSubscription) {
-            this.routerSubscription.unsubscribe();
-            this.routerSubscription = undefined;
-        }
+}, _SkyOverlayComponent_removeRouteListener = function _SkyOverlayComponent_removeRouteListener() {
+    if (__classPrivateFieldGet(this, _SkyOverlayComponent_routerSubscription, "f")) {
+        __classPrivateFieldGet(this, _SkyOverlayComponent_routerSubscription, "f").unsubscribe();
+        __classPrivateFieldSet(this, _SkyOverlayComponent_routerSubscription, undefined, "f");
     }
-}
+};
 SkyOverlayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyOverlayComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: SkyCoreAdapterService }, { token: SkyOverlayContext }, { token: SkyIdService }, { token: i4.Router, optional: true }], target: i0.ɵɵFactoryTarget.Component });
 SkyOverlayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyOverlayComponent, selector: "sky-overlay", host: { properties: { "id": "this.id" } }, viewQueries: [{ propertyName: "overlayContentRef", first: true, predicate: ["overlayContentRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "overlayRef", first: true, predicate: ["overlayRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "targetRef", first: true, predicate: ["target"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<div\n  [class]=\"wrapperClass\"\n  [style.zIndex]=\"zIndex\"\n  [ngClass]=\"{\n    'enable-pointer-events-pass-through': enablePointerEvents,\n    'sky-overlay': true\n  }\"\n  #overlayRef\n>\n  <div class=\"sky-overlay-content\" #overlayContentRef>\n    <ng-template #target> </ng-template>\n  </div>\n  <div *ngIf=\"showBackdrop\" class=\"sky-overlay-backdrop\"></div>\n</div>\n", styles: [".sky-overlay{position:fixed;top:0;right:0;left:0;bottom:0;width:100%;height:100%;display:flex;pointer-events:auto}.sky-overlay-content{position:relative;z-index:1;display:inline-flex;align-self:start;pointer-events:auto}.sky-overlay-backdrop{background:rgba(0,0,0,.5);top:0;right:0;left:0;bottom:0;width:100%;height:100%;position:absolute}.enable-pointer-events-pass-through,.enable-pointer-events-pass-through .sky-overlay-backdrop{pointer-events:none}.enable-pointer-events-pass-through .sky-overlay-content{pointer-events:auto}\n"], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyOverlayComponent, decorators: [{
@@ -2305,36 +2395,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }] });
 
+var _SkyOverlayAdapterService_instances, _SkyOverlayAdapterService_renderer, _SkyOverlayAdapterService_styleElement, _SkyOverlayAdapterService_destroyStyleElement;
 /**
  * @internal
  */
 class SkyOverlayAdapterService {
     constructor(rendererFactory) {
-        this.renderer = rendererFactory.createRenderer(undefined, undefined);
+        _SkyOverlayAdapterService_instances.add(this);
+        _SkyOverlayAdapterService_renderer.set(this, void 0);
+        _SkyOverlayAdapterService_styleElement.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyOverlayAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
     }
     restrictBodyScroll() {
         // Create a style element to avoid overwriting any existing inline body styles.
-        const styleElement = this.renderer.createElement('style');
-        const textNode = this.renderer.createText('body { overflow: hidden }');
+        const styleElement = __classPrivateFieldGet(this, _SkyOverlayAdapterService_renderer, "f").createElement('style');
+        const textNode = __classPrivateFieldGet(this, _SkyOverlayAdapterService_renderer, "f").createText('body { overflow: hidden }');
         // Apply a `data-` attribute to make unit testing easier.
-        this.renderer.setAttribute(styleElement, 'data-test-selector', 'sky-overlay-restrict-scroll-styles');
-        this.renderer.appendChild(styleElement, textNode);
-        this.renderer.appendChild(document.head, styleElement);
-        if (this.styleElement) {
-            this.destroyStyleElement();
+        __classPrivateFieldGet(this, _SkyOverlayAdapterService_renderer, "f").setAttribute(styleElement, 'data-test-selector', 'sky-overlay-restrict-scroll-styles');
+        __classPrivateFieldGet(this, _SkyOverlayAdapterService_renderer, "f").appendChild(styleElement, textNode);
+        __classPrivateFieldGet(this, _SkyOverlayAdapterService_renderer, "f").appendChild(document.head, styleElement);
+        if (__classPrivateFieldGet(this, _SkyOverlayAdapterService_styleElement, "f")) {
+            __classPrivateFieldGet(this, _SkyOverlayAdapterService_instances, "m", _SkyOverlayAdapterService_destroyStyleElement).call(this);
         }
-        this.styleElement = styleElement;
+        __classPrivateFieldSet(this, _SkyOverlayAdapterService_styleElement, styleElement, "f");
     }
     releaseBodyScroll() {
-        this.destroyStyleElement();
-    }
-    destroyStyleElement() {
-        /* istanbul ignore else */
-        if (this.styleElement.parentElement === document.head) {
-            this.renderer.removeChild(document.head, this.styleElement);
-        }
+        __classPrivateFieldGet(this, _SkyOverlayAdapterService_instances, "m", _SkyOverlayAdapterService_destroyStyleElement).call(this);
     }
 }
+_SkyOverlayAdapterService_renderer = new WeakMap(), _SkyOverlayAdapterService_styleElement = new WeakMap(), _SkyOverlayAdapterService_instances = new WeakSet(), _SkyOverlayAdapterService_destroyStyleElement = function _SkyOverlayAdapterService_destroyStyleElement() {
+    /* istanbul ignore else */
+    if (__classPrivateFieldGet(this, _SkyOverlayAdapterService_styleElement, "f") &&
+        __classPrivateFieldGet(this, _SkyOverlayAdapterService_styleElement, "f").parentElement === document.head) {
+        __classPrivateFieldGet(this, _SkyOverlayAdapterService_renderer, "f").removeChild(document.head, __classPrivateFieldGet(this, _SkyOverlayAdapterService_styleElement, "f"));
+    }
+};
 SkyOverlayAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyOverlayAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyOverlayAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyOverlayAdapterService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyOverlayAdapterService, decorators: [{
@@ -2344,27 +2439,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
 
+var _SkyOverlayService_instances, _SkyOverlayService_adapter, _SkyOverlayService_applicationRef, _SkyOverlayService_componentFactoryResolver, _SkyOverlayService_injector, _SkyOverlayService_createOverlay, _SkyOverlayService_prepareConfig, _SkyOverlayService_destroyOverlay;
 /**
  * This service is used to create new overlays.
  * @dynamic
  */
 class SkyOverlayService {
+    // TODO: Replace deprecated `ComponentFactoryResolver`.
     constructor(applicationRef, componentFactoryResolver, injector, adapter) {
-        this.applicationRef = applicationRef;
-        this.componentFactoryResolver = componentFactoryResolver;
-        this.injector = injector;
-        this.adapter = adapter;
+        _SkyOverlayService_instances.add(this);
+        _SkyOverlayService_adapter.set(this, void 0);
+        _SkyOverlayService_applicationRef.set(this, void 0);
+        _SkyOverlayService_componentFactoryResolver.set(this, void 0);
+        _SkyOverlayService_injector.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyOverlayService_applicationRef, applicationRef, "f");
+        __classPrivateFieldSet(this, _SkyOverlayService_componentFactoryResolver, componentFactoryResolver, "f");
+        __classPrivateFieldSet(this, _SkyOverlayService_injector, injector, "f");
+        __classPrivateFieldSet(this, _SkyOverlayService_adapter, adapter, "f");
     }
     /**
      * Creates an empty overlay. Use the returned `SkyOverlayInstance` to append content.
      * @param config Configuration for the overlay.
      */
     create(config) {
-        const settings = this.prepareConfig(config);
+        const settings = __classPrivateFieldGet(this, _SkyOverlayService_instances, "m", _SkyOverlayService_prepareConfig).call(this, config);
         if (settings.enableScroll === false) {
-            this.adapter.restrictBodyScroll();
+            __classPrivateFieldGet(this, _SkyOverlayService_adapter, "f").restrictBodyScroll();
         }
-        const componentRef = this.createOverlay(settings);
+        const componentRef = __classPrivateFieldGet(this, _SkyOverlayService_instances, "m", _SkyOverlayService_createOverlay).call(this, settings);
         const instance = new SkyOverlayInstance(settings, componentRef);
         instance.closed.subscribe(() => {
             // Only execute the service's close method if the instance still exists.
@@ -2381,8 +2483,8 @@ class SkyOverlayService {
      * @param instance The instance to close.
      */
     close(instance) {
-        this.destroyOverlay(instance);
-        this.applicationRef.detachView(instance.componentRef.hostView);
+        __classPrivateFieldGet(this, _SkyOverlayService_instances, "m", _SkyOverlayService_destroyOverlay).call(this, instance);
+        __classPrivateFieldGet(this, _SkyOverlayService_applicationRef, "f").detachView(instance.componentRef.hostView);
         instance.componentRef.destroy();
         // In some cases, Angular keeps dynamically-generated component's nodes in the DOM during
         // unit tests. This can make querying difficult because the older DOM nodes still exist and
@@ -2406,47 +2508,45 @@ class SkyOverlayService {
             this.close(SkyOverlayService.overlays[0]);
         }
     }
-    createOverlay(config) {
-        const injector = Injector.create({
-            parent: this.injector,
-            providers: [
-                {
-                    provide: SkyOverlayContext,
-                    useValue: new SkyOverlayContext(config),
-                },
-            ],
-        });
-        const componentRef = this.componentFactoryResolver
-            .resolveComponentFactory(SkyOverlayComponent)
-            .create(injector);
-        this.applicationRef.attachView(componentRef.hostView);
-        const domElem = componentRef.hostView
-            .rootNodes[0];
-        document.body.appendChild(domElem);
-        return componentRef;
-    }
-    prepareConfig(config) {
-        const defaults = {
-            closeOnNavigation: true,
-            enableClose: false,
-            enablePointerEvents: false,
-            enableScroll: true,
-            showBackdrop: false,
-            wrapperClass: '',
-        };
-        return { ...defaults, ...config };
-    }
-    destroyOverlay(instance) {
-        SkyOverlayService.overlays.splice(SkyOverlayService.overlays.indexOf(instance), 1);
-        if (instance.config.enableScroll === false) {
-            // Only release the body scroll if no other overlay wishes it to be disabled.
-            const anotherOverlayDisablesScroll = SkyOverlayService.overlays.some((o) => !o.config.enableScroll);
-            if (!anotherOverlayDisablesScroll) {
-                this.adapter.releaseBodyScroll();
-            }
+}
+_SkyOverlayService_adapter = new WeakMap(), _SkyOverlayService_applicationRef = new WeakMap(), _SkyOverlayService_componentFactoryResolver = new WeakMap(), _SkyOverlayService_injector = new WeakMap(), _SkyOverlayService_instances = new WeakSet(), _SkyOverlayService_createOverlay = function _SkyOverlayService_createOverlay(config) {
+    const injector = Injector.create({
+        parent: __classPrivateFieldGet(this, _SkyOverlayService_injector, "f"),
+        providers: [
+            {
+                provide: SkyOverlayContext,
+                useValue: new SkyOverlayContext(config),
+            },
+        ],
+    });
+    const componentRef = __classPrivateFieldGet(this, _SkyOverlayService_componentFactoryResolver, "f")
+        .resolveComponentFactory(SkyOverlayComponent)
+        .create(injector);
+    __classPrivateFieldGet(this, _SkyOverlayService_applicationRef, "f").attachView(componentRef.hostView);
+    const domElem = componentRef.hostView
+        .rootNodes[0];
+    document.body.appendChild(domElem);
+    return componentRef;
+}, _SkyOverlayService_prepareConfig = function _SkyOverlayService_prepareConfig(config = {}) {
+    const defaults = {
+        closeOnNavigation: true,
+        enableClose: false,
+        enablePointerEvents: false,
+        enableScroll: true,
+        showBackdrop: false,
+        wrapperClass: '',
+    };
+    return { ...defaults, ...config };
+}, _SkyOverlayService_destroyOverlay = function _SkyOverlayService_destroyOverlay(instance) {
+    SkyOverlayService.overlays.splice(SkyOverlayService.overlays.indexOf(instance), 1);
+    if (instance.config.enableScroll === false) {
+        // Only release the body scroll if no other overlay wishes it to be disabled.
+        const anotherOverlayDisablesScroll = SkyOverlayService.overlays.some((o) => !o.config.enableScroll);
+        if (!anotherOverlayDisablesScroll) {
+            __classPrivateFieldGet(this, _SkyOverlayService_adapter, "f").releaseBodyScroll();
         }
     }
-}
+};
 SkyOverlayService.overlays = [];
 SkyOverlayService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyOverlayService, deps: [{ token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: SkyOverlayAdapterService }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyOverlayService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyOverlayService, providedIn: 'root' });
@@ -2457,37 +2557,47 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: SkyOverlayAdapterService }]; } });
 
+var _SkyPercentPipe_instances, _SkyPercentPipe_defaultFormat, _SkyPercentPipe_defaultLocale, _SkyPercentPipe_format, _SkyPercentPipe_formattedValue, _SkyPercentPipe_locale, _SkyPercentPipe_ngUnsubscribe, _SkyPercentPipe_value, _SkyPercentPipe_updateFormattedValue;
 class SkyPercentPipe {
     constructor(localeProvider) {
-        this.localeProvider = localeProvider;
-        this.defaultFormat = '1.0-2';
-        this.defaultLocale = 'en-US';
-        this.ngUnsubscribe = new Subject();
-        this.localeProvider
+        _SkyPercentPipe_instances.add(this);
+        _SkyPercentPipe_defaultFormat.set(this, '1.0-2');
+        _SkyPercentPipe_defaultLocale.set(this, 'en-US');
+        _SkyPercentPipe_format.set(this, void 0);
+        _SkyPercentPipe_formattedValue.set(this, '');
+        _SkyPercentPipe_locale.set(this, void 0);
+        _SkyPercentPipe_ngUnsubscribe.set(this, new Subject());
+        _SkyPercentPipe_value.set(this, void 0);
+        localeProvider
             .getLocaleInfo()
-            .pipe(takeUntil(this.ngUnsubscribe))
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyPercentPipe_ngUnsubscribe, "f")))
             .subscribe((localeInfo) => {
-            this.defaultLocale = localeInfo.locale;
-            this.updateFormattedValue();
+            __classPrivateFieldSet(this, _SkyPercentPipe_defaultLocale, localeInfo.locale, "f");
+            __classPrivateFieldGet(this, _SkyPercentPipe_instances, "m", _SkyPercentPipe_updateFormattedValue).call(this);
         });
     }
+    get defaultLocale() {
+        return __classPrivateFieldGet(this, _SkyPercentPipe_defaultLocale, "f");
+    }
     ngOnDestroy() {
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
+        __classPrivateFieldGet(this, _SkyPercentPipe_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyPercentPipe_ngUnsubscribe, "f").complete();
     }
     transform(value, format, locale) {
-        this.value = value;
-        this.format = format;
-        this.locale = locale;
-        this.updateFormattedValue();
-        return this.formattedValue;
-    }
-    updateFormattedValue() {
-        const locale = this.locale || this.defaultLocale;
-        const format = this.format || this.defaultFormat;
-        this.formattedValue = SkyNumberFormatUtility.formatNumber(locale, this.value, SkyIntlNumberFormatStyle.Percent, format);
-    }
-}
+        __classPrivateFieldSet(this, _SkyPercentPipe_value, value, "f");
+        __classPrivateFieldSet(this, _SkyPercentPipe_format, format, "f");
+        __classPrivateFieldSet(this, _SkyPercentPipe_locale, locale, "f");
+        __classPrivateFieldGet(this, _SkyPercentPipe_instances, "m", _SkyPercentPipe_updateFormattedValue).call(this);
+        return __classPrivateFieldGet(this, _SkyPercentPipe_formattedValue, "f");
+    }
+}
+_SkyPercentPipe_defaultFormat = new WeakMap(), _SkyPercentPipe_defaultLocale = new WeakMap(), _SkyPercentPipe_format = new WeakMap(), _SkyPercentPipe_formattedValue = new WeakMap(), _SkyPercentPipe_locale = new WeakMap(), _SkyPercentPipe_ngUnsubscribe = new WeakMap(), _SkyPercentPipe_value = new WeakMap(), _SkyPercentPipe_instances = new WeakSet(), _SkyPercentPipe_updateFormattedValue = function _SkyPercentPipe_updateFormattedValue() {
+    const locale = __classPrivateFieldGet(this, _SkyPercentPipe_locale, "f") || __classPrivateFieldGet(this, _SkyPercentPipe_defaultLocale, "f");
+    const format = __classPrivateFieldGet(this, _SkyPercentPipe_format, "f") || __classPrivateFieldGet(this, _SkyPercentPipe_defaultFormat, "f");
+    __classPrivateFieldSet(this, _SkyPercentPipe_formattedValue, __classPrivateFieldGet(this, _SkyPercentPipe_value, "f")
+        ? SkyNumberFormatUtility.formatNumber(locale, __classPrivateFieldGet(this, _SkyPercentPipe_value, "f"), SkyIntlNumberFormatStyle.Percent, format)
+        : '', "f");
+};
 SkyPercentPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPercentPipe, deps: [{ token: i1.SkyAppLocaleProvider }], target: i0.ɵɵFactoryTarget.Pipe });
 SkyPercentPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPercentPipe, name: "skyPercent", pure: false });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPercentPipe, decorators: [{
@@ -2587,13 +2697,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
 
-var _SkyResizeObserverMediaQueryService_breakpoints, _SkyResizeObserverMediaQueryService_currentBreakpointObservable, _SkyResizeObserverMediaQueryService_stopListening, _SkyResizeObserverMediaQueryService_target;
+var _SkyResizeObserverMediaQueryService_instances, _SkyResizeObserverMediaQueryService_breakpoints, _SkyResizeObserverMediaQueryService_currentBreakpoint, _SkyResizeObserverMediaQueryService_currentBreakpointObs, _SkyResizeObserverMediaQueryService_ngUnsubscribe, _SkyResizeObserverMediaQueryService_resizeObserverSvc, _SkyResizeObserverMediaQueryService_target, _SkyResizeObserverMediaQueryService_updateBreakpoint, _SkyResizeObserverMediaQueryService_checkBreakpoint, _SkyResizeObserverMediaQueryService_checkWidth;
+const DEFAULT_BREAKPOINT = SkyMediaBreakpoints.md;
 /**
  * Acts like `SkyMediaQueryService` for a container element, emitting the same responsive breakpoints.
  */
 class SkyResizeObserverMediaQueryService {
-    constructor(resizeObserverService) {
-        this.resizeObserverService = resizeObserverService;
+    constructor(resizeObserverSvc) {
+        _SkyResizeObserverMediaQueryService_instances.add(this);
         _SkyResizeObserverMediaQueryService_breakpoints.set(this, [
             {
                 check: (width) => width > 0 && width <= 767,
@@ -2612,25 +2723,23 @@ class SkyResizeObserverMediaQueryService {
                 name: SkyMediaBreakpoints.lg,
             },
         ]);
-        _SkyResizeObserverMediaQueryService_currentBreakpointObservable.set(this, new ReplaySubject(1));
-        _SkyResizeObserverMediaQueryService_stopListening.set(this, new Subject());
+        _SkyResizeObserverMediaQueryService_currentBreakpoint.set(this, DEFAULT_BREAKPOINT);
+        _SkyResizeObserverMediaQueryService_currentBreakpointObs.set(this, new ReplaySubject(1));
+        _SkyResizeObserverMediaQueryService_ngUnsubscribe.set(this, new Subject());
+        _SkyResizeObserverMediaQueryService_resizeObserverSvc.set(this, void 0);
         _SkyResizeObserverMediaQueryService_target.set(this, void 0);
-        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_stopListening, "f").subscribe(() => {
-            __classPrivateFieldSet(this, _SkyResizeObserverMediaQueryService_target, undefined, "f");
-            this.updateBreakpoint(undefined);
-        });
+        __classPrivateFieldSet(this, _SkyResizeObserverMediaQueryService_resizeObserverSvc, resizeObserverSvc, "f");
     }
     /**
      * Returns the current breakpoint.
      */
     get current() {
-        return this._currentBreakpoint;
+        return __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpoint, "f");
     }
     ngOnDestroy() {
-        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_stopListening, "f").next();
-        this._currentBreakpoint = undefined;
-        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_stopListening, "f").complete();
-        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpointObservable, "f").complete();
+        this.unobserve();
+        __classPrivateFieldSet(this, _SkyResizeObserverMediaQueryService_target, undefined, "f");
+        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpointObs, "f").complete();
     }
     /**
      * @internal
@@ -2647,18 +2756,17 @@ class SkyResizeObserverMediaQueryService {
             if (__classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_target, "f") === element) {
                 return this;
             }
-            __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_stopListening, "f").next();
+            this.unobserve();
         }
         __classPrivateFieldSet(this, _SkyResizeObserverMediaQueryService_target, element, "f");
-        this.checkWidth(element);
-        this.resizeObserverService
+        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_instances, "m", _SkyResizeObserverMediaQueryService_checkWidth).call(this, element);
+        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_resizeObserverSvc, "f")
             .observe(element)
-            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_stopListening, "f")))
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_ngUnsubscribe, "f")))
             .subscribe((value) => {
-            const breakpoint = this.checkBreakpoint(value.contentRect.width);
-            /* istanbul ignore else */
-            if (breakpoint !== this.current) {
-                this.updateBreakpoint(breakpoint);
+            const breakpoint = __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_instances, "m", _SkyResizeObserverMediaQueryService_checkBreakpoint).call(this, value.contentRect.width);
+            if (breakpoint && breakpoint !== this.current) {
+                __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_instances, "m", _SkyResizeObserverMediaQueryService_updateBreakpoint).call(this, breakpoint);
             }
         });
         return this;
@@ -2667,39 +2775,33 @@ class SkyResizeObserverMediaQueryService {
      * Stop watching the container element.
      */
     unobserve() {
-        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_stopListening, "f").next();
+        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_ngUnsubscribe, "f").complete();
     }
     /**
      * Subscribes to element size changes that cross breakpoints.
      */
     subscribe(listener) {
-        return __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpointObservable, "f")
-            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_stopListening, "f")))
+        return __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpointObs, "f")
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_ngUnsubscribe, "f")))
             .subscribe((value) => {
             listener(value);
         });
     }
-    updateBreakpoint(breakpoint) {
-        this._currentBreakpoint = breakpoint;
-        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpointObservable, "f").next(breakpoint);
-    }
-    checkBreakpoint(width) {
-        const breakpoint = __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_breakpoints, "f").find((breakpoint) => breakpoint.check(width));
-        /* istanbul ignore else */
-        if (breakpoint) {
-            return breakpoint.name;
-        }
-    }
-    checkWidth(element) {
-        const width = element.nativeElement.offsetWidth || 0;
-        const breakpoint = this.checkBreakpoint(width);
-        /* istanbul ignore else */
-        if (breakpoint !== this._currentBreakpoint) {
-            this.updateBreakpoint(breakpoint);
-        }
-    }
 }
-_SkyResizeObserverMediaQueryService_breakpoints = new WeakMap(), _SkyResizeObserverMediaQueryService_currentBreakpointObservable = new WeakMap(), _SkyResizeObserverMediaQueryService_stopListening = new WeakMap(), _SkyResizeObserverMediaQueryService_target = new WeakMap();
+_SkyResizeObserverMediaQueryService_breakpoints = new WeakMap(), _SkyResizeObserverMediaQueryService_currentBreakpoint = new WeakMap(), _SkyResizeObserverMediaQueryService_currentBreakpointObs = new WeakMap(), _SkyResizeObserverMediaQueryService_ngUnsubscribe = new WeakMap(), _SkyResizeObserverMediaQueryService_resizeObserverSvc = new WeakMap(), _SkyResizeObserverMediaQueryService_target = new WeakMap(), _SkyResizeObserverMediaQueryService_instances = new WeakSet(), _SkyResizeObserverMediaQueryService_updateBreakpoint = function _SkyResizeObserverMediaQueryService_updateBreakpoint(breakpoint) {
+    __classPrivateFieldSet(this, _SkyResizeObserverMediaQueryService_currentBreakpoint, breakpoint, "f");
+    __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpointObs, "f").next(breakpoint);
+}, _SkyResizeObserverMediaQueryService_checkBreakpoint = function _SkyResizeObserverMediaQueryService_checkBreakpoint(width) {
+    const breakpoint = __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_breakpoints, "f").find((breakpoint) => breakpoint.check(width));
+    return breakpoint ? breakpoint.name : undefined;
+}, _SkyResizeObserverMediaQueryService_checkWidth = function _SkyResizeObserverMediaQueryService_checkWidth(el) {
+    const width = el.nativeElement.offsetWidth || 0;
+    const breakpoint = __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_instances, "m", _SkyResizeObserverMediaQueryService_checkBreakpoint).call(this, width);
+    if (breakpoint && breakpoint !== __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_currentBreakpoint, "f")) {
+        __classPrivateFieldGet(this, _SkyResizeObserverMediaQueryService_instances, "m", _SkyResizeObserverMediaQueryService_updateBreakpoint).call(this, breakpoint);
+    }
+};
 SkyResizeObserverMediaQueryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyResizeObserverMediaQueryService, deps: [{ token: SkyResizeObserverService }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyResizeObserverMediaQueryService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyResizeObserverMediaQueryService, providedIn: 'any' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyResizeObserverMediaQueryService, decorators: [{
@@ -2709,6 +2811,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: SkyResizeObserverService }]; } });
 
+var _SkyScrollableHostService_instances, _SkyScrollableHostService_mutationObserverSvc, _SkyScrollableHostService_windowRef, _SkyScrollableHostService_findScrollableHost, _SkyScrollableHostService_observeDocumentHiddenElementChanges, _SkyScrollableHostService_observeForScrollableHostChanges, _SkyScrollableHostService_isElementVisible;
 function notifySubscribers(subscribers, item) {
     for (const subscriber of subscribers) {
         subscriber.next(item);
@@ -2716,8 +2819,11 @@ function notifySubscribers(subscribers, item) {
 }
 class SkyScrollableHostService {
     constructor(mutationObserverSvc, windowRef) {
-        this.mutationObserverSvc = mutationObserverSvc;
-        this.windowRef = windowRef;
+        _SkyScrollableHostService_instances.add(this);
+        _SkyScrollableHostService_mutationObserverSvc.set(this, void 0);
+        _SkyScrollableHostService_windowRef.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyScrollableHostService_mutationObserverSvc, mutationObserverSvc, "f");
+        __classPrivateFieldSet(this, _SkyScrollableHostService_windowRef, windowRef, "f");
     }
     /**
      * Returns the given element's current scrollable host
@@ -2725,7 +2831,7 @@ class SkyScrollableHostService {
      * @returns The current scrollable host
      */
     getScrollableHost(elementRef) {
-        return this.findScrollableHost(elementRef.nativeElement);
+        return __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_findScrollableHost).call(this, elementRef.nativeElement);
     }
     /**
      * Returns an observable which emits the given element's current scrollable host
@@ -2739,30 +2845,31 @@ class SkyScrollableHostService {
         let documentHiddenElementMutationObserver;
         return new Observable((subscriber) => {
             subscribers.push(subscriber);
-            let scrollableHost = this.findScrollableHost(elementRef.nativeElement);
+            let scrollableHost = __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_findScrollableHost).call(this, elementRef.nativeElement);
             // Setup mutation observers only once, for all subscribers.
             if (subscribers.length === 1) {
-                parentMutationObserver = this.mutationObserverSvc.create(() => {
-                    const newScrollableHost = this.findScrollableHost(elementRef.nativeElement);
+                parentMutationObserver = __classPrivateFieldGet(this, _SkyScrollableHostService_mutationObserverSvc, "f").create(() => {
+                    const newScrollableHost = __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_findScrollableHost).call(this, elementRef.nativeElement);
                     // Reset observer if scrollable host changes.
                     if (newScrollableHost !== scrollableHost &&
-                        this.isElementVisible(elementRef)) {
+                        __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_isElementVisible).call(this, elementRef)) {
                         scrollableHost = newScrollableHost;
-                        this.observeForScrollableHostChanges(scrollableHost, parentMutationObserver);
+                        __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_observeForScrollableHostChanges).call(this, scrollableHost, parentMutationObserver);
                         notifySubscribers(subscribers, scrollableHost);
                     }
                 });
-                this.observeForScrollableHostChanges(scrollableHost, parentMutationObserver);
-                documentHiddenElementMutationObserver = this.mutationObserverSvc.create(() => {
-                    if (scrollableHost && !this.isElementVisible(elementRef)) {
-                        // If the scrollable host is not visible, set it to undefined and unsubscribe from its mutation changes.
-                        // Then, observe the document element so that a new scrollable host can be found.
-                        scrollableHost = undefined;
-                        this.observeForScrollableHostChanges(scrollableHost, parentMutationObserver);
-                        notifySubscribers(subscribers, scrollableHost);
-                    }
-                });
-                this.observeDocumentHiddenElementChanges(documentHiddenElementMutationObserver);
+                __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_observeForScrollableHostChanges).call(this, scrollableHost, parentMutationObserver);
+                documentHiddenElementMutationObserver =
+                    __classPrivateFieldGet(this, _SkyScrollableHostService_mutationObserverSvc, "f").create(() => {
+                        if (scrollableHost && !__classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_isElementVisible).call(this, elementRef)) {
+                            // If the scrollable host is not visible, set it to undefined and unsubscribe from its mutation changes.
+                            // Then, observe the document element so that a new scrollable host can be found.
+                            scrollableHost = undefined;
+                            __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_observeForScrollableHostChanges).call(this, scrollableHost, parentMutationObserver);
+                            notifySubscribers(subscribers, scrollableHost);
+                        }
+                    });
+                __classPrivateFieldGet(this, _SkyScrollableHostService_instances, "m", _SkyScrollableHostService_observeDocumentHiddenElementChanges).call(this, documentHiddenElementMutationObserver);
             }
             // Emit the scrollable host to the subscriber.
             subscriber.next(scrollableHost);
@@ -2829,56 +2936,49 @@ class SkyScrollableHostService {
             });
         });
     }
-    findScrollableHost(element) {
-        const regex = /(auto|scroll)/;
-        const windowObj = this.windowRef.nativeWindow;
-        const bodyObj = windowObj.document.body;
-        if (!element) {
-            return windowObj;
-        }
-        let style = windowObj.getComputedStyle(element);
-        let parent = element;
-        do {
-            parent = parent.parentNode;
-            // Return `window` if the parent element has been removed from the DOM.
-            if (!(parent instanceof HTMLElement)) {
-                return windowObj;
-            }
-            style = windowObj.getComputedStyle(parent);
-        } while (!regex.test(style.overflow) &&
-            !regex.test(style.overflowY) &&
-            parent !== bodyObj);
-        if (parent === bodyObj) {
+}
+_SkyScrollableHostService_mutationObserverSvc = new WeakMap(), _SkyScrollableHostService_windowRef = new WeakMap(), _SkyScrollableHostService_instances = new WeakSet(), _SkyScrollableHostService_findScrollableHost = function _SkyScrollableHostService_findScrollableHost(element) {
+    const regex = /(auto|scroll)/;
+    const windowObj = __classPrivateFieldGet(this, _SkyScrollableHostService_windowRef, "f").nativeWindow;
+    const bodyObj = windowObj.document.body;
+    if (!element) {
+        return windowObj;
+    }
+    let style = windowObj.getComputedStyle(element);
+    let parent = element;
+    do {
+        parent = parent.parentNode;
+        // Return `window` if the parent element has been removed from the DOM.
+        if (!(parent instanceof HTMLElement)) {
             return windowObj;
         }
-        return parent;
-    }
-    observeDocumentHiddenElementChanges(mutationObserver) {
-        mutationObserver.observe(document.documentElement, {
-            attributes: true,
-            attributeFilter: ['class', 'style', 'hidden'],
-            childList: true,
-            subtree: true,
-        });
-    }
-    observeForScrollableHostChanges(element, mutationObserver) {
-        mutationObserver.disconnect();
-        const target = element instanceof HTMLElement ? element : document.documentElement;
-        mutationObserver.observe(target, {
-            attributes: true,
-            attributeFilter: ['class', 'style'],
-            childList: true,
-            subtree: true,
-        });
-    }
-    /**
-     * Determines if an element is "visible" in the DOM.
-     * @see https://stackoverflow.com/a/11639664/6178885
-     */
-    isElementVisible(elementRef) {
-        return elementRef.nativeElement.offsetParent;
-    }
-}
+        style = windowObj.getComputedStyle(parent);
+    } while (!regex.test(style.overflow) &&
+        !regex.test(style.overflowY) &&
+        parent !== bodyObj);
+    if (parent === bodyObj) {
+        return windowObj;
+    }
+    return parent;
+}, _SkyScrollableHostService_observeDocumentHiddenElementChanges = function _SkyScrollableHostService_observeDocumentHiddenElementChanges(mutationObserver) {
+    mutationObserver.observe(document.documentElement, {
+        attributes: true,
+        attributeFilter: ['class', 'style', 'hidden'],
+        childList: true,
+        subtree: true,
+    });
+}, _SkyScrollableHostService_observeForScrollableHostChanges = function _SkyScrollableHostService_observeForScrollableHostChanges(element, mutationObserver) {
+    mutationObserver.disconnect();
+    const target = element instanceof HTMLElement ? element : document.documentElement;
+    mutationObserver.observe(target, {
+        attributes: true,
+        attributeFilter: ['class', 'style'],
+        childList: true,
+        subtree: true,
+    });
+}, _SkyScrollableHostService_isElementVisible = function _SkyScrollableHostService_isElementVisible(elementRef) {
+    return elementRef.nativeElement.offsetParent;
+};
 SkyScrollableHostService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyScrollableHostService, deps: [{ token: MutationObserverService }, { token: SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyScrollableHostService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyScrollableHostService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyScrollableHostService, decorators: [{
@@ -2888,12 +2988,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: MutationObserverService }, { type: SkyAppWindowRef }]; } });
 
+var _SkyAppTitleService_title;
 /**
  * Provides a method for setting a formatted title on the current window.
  */
 class SkyAppTitleService {
     constructor(title) {
-        this.title = title;
+        _SkyAppTitleService_title.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyAppTitleService_title, title, "f");
     }
     /**
      * Sets the title on the current window.
@@ -2901,11 +3003,12 @@ class SkyAppTitleService {
      * each part.
      */
     setTitle(args) {
-        if (args && args.titleParts) {
-            this.title.setTitle(args.titleParts.join(' - '));
+        if (args?.titleParts) {
+            __classPrivateFieldGet(this, _SkyAppTitleService_title, "f").setTitle(args.titleParts.join(' - '));
         }
     }
 }
+_SkyAppTitleService_title = new WeakMap();
 SkyAppTitleService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAppTitleService, deps: [{ token: i1$1.Title }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyAppTitleService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAppTitleService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAppTitleService, decorators: [{
@@ -2915,21 +3018,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i1$1.Title }]; } });
 
-var _SkyTrimDirective_instances, _SkyTrimDirective_obs, _SkyTrimDirective_observe, _SkyTrimDirective_disconnect, _SkyTrimDirective_trim;
+var _SkyTrimDirective_instances, _SkyTrimDirective_elRef, _SkyTrimDirective_obs, _SkyTrimDirective_observe, _SkyTrimDirective_disconnect, _SkyTrimDirective_trim;
 /**
  * Trims whitespace in each text node that is a direct descendent of the current element.
  */
 class SkyTrimDirective {
     constructor(elRef, mutationObs) {
-        this.elRef = elRef;
-        this.mutationObs = mutationObs;
         _SkyTrimDirective_instances.add(this);
+        _SkyTrimDirective_elRef.set(this, void 0);
         _SkyTrimDirective_obs.set(this, void 0);
-        __classPrivateFieldSet(this, _SkyTrimDirective_obs, this.mutationObs.create((mutations) => {
+        __classPrivateFieldSet(this, _SkyTrimDirective_elRef, elRef, "f");
+        __classPrivateFieldSet(this, _SkyTrimDirective_obs, mutationObs.create((mutations) => {
             const nodes = [];
             // Only trim white space inside direct descendents of the current element.
             for (const mutation of mutations) {
-                if (mutation.target.parentNode === this.elRef.nativeElement) {
+                if (mutation.target.parentNode === elRef.nativeElement) {
                     nodes.push(mutation.target);
                 }
             }
@@ -2938,16 +3041,15 @@ class SkyTrimDirective {
         __classPrivateFieldGet(this, _SkyTrimDirective_instances, "m", _SkyTrimDirective_observe).call(this);
     }
     ngOnInit() {
-        const el = this.elRef.nativeElement;
+        const el = __classPrivateFieldGet(this, _SkyTrimDirective_elRef, "f").nativeElement;
         __classPrivateFieldGet(this, _SkyTrimDirective_instances, "m", _SkyTrimDirective_trim).call(this, Array.from(el.childNodes));
     }
     ngOnDestroy() {
         __classPrivateFieldGet(this, _SkyTrimDirective_instances, "m", _SkyTrimDirective_disconnect).call(this);
-        __classPrivateFieldSet(this, _SkyTrimDirective_obs, undefined, "f");
     }
 }
-_SkyTrimDirective_obs = new WeakMap(), _SkyTrimDirective_instances = new WeakSet(), _SkyTrimDirective_observe = function _SkyTrimDirective_observe() {
-    __classPrivateFieldGet(this, _SkyTrimDirective_obs, "f").observe(this.elRef.nativeElement, {
+_SkyTrimDirective_elRef = new WeakMap(), _SkyTrimDirective_obs = new WeakMap(), _SkyTrimDirective_instances = new WeakSet(), _SkyTrimDirective_observe = function _SkyTrimDirective_observe() {
+    __classPrivateFieldGet(this, _SkyTrimDirective_obs, "f").observe(__classPrivateFieldGet(this, _SkyTrimDirective_elRef, "f").nativeElement, {
         characterData: true,
         subtree: true,
     });
@@ -2958,7 +3060,7 @@ _SkyTrimDirective_obs = new WeakMap(), _SkyTrimDirective_instances = new WeakSet
     // doesn't retrigger the observe callback.
     __classPrivateFieldGet(this, _SkyTrimDirective_instances, "m", _SkyTrimDirective_disconnect).call(this);
     for (const node of nodes) {
-        if (node.nodeType === Node.TEXT_NODE) {
+        if (node.nodeType === Node.TEXT_NODE && node.textContent) {
             const textContent = node.textContent;
             const textContentTrimmed = textContent.trim();
             if (textContent !== textContentTrimmed) {
@@ -3016,6 +3118,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             type: Injectable
         }] });
 
+var _SkyViewkeeper_instances, _SkyViewkeeper_boundaryEl, _SkyViewkeeper_el, _SkyViewkeeper_id, _SkyViewkeeper_setWidth, _SkyViewkeeper_verticalOffset, _SkyViewkeeper_verticalOffsetEl, _SkyViewkeeper_viewportMarginTop, _SkyViewkeeper_currentElFixedLeft, _SkyViewkeeper_currentElFixedTop, _SkyViewkeeper_currentElFixedWidth, _SkyViewkeeper_isDestroyed, _SkyViewkeeper_scrollableHost, _SkyViewkeeper_syncElPositionHandler, _SkyViewkeeper_getSpacerId, _SkyViewkeeper_unfixEl, _SkyViewkeeper_calculateVerticalOffset, _SkyViewkeeper_shouldFixEl, _SkyViewkeeper_getFixedStyles, _SkyViewkeeper_needsUpdating, _SkyViewkeeper_fixEl, _SkyViewkeeper_getBoundaryInfo;
 const CLS_VIEWKEEPER_FIXED = 'sky-viewkeeper-fixed';
 const EVT_AFTER_VIEWKEEPER_SYNC = 'afterViewkeeperSync';
 let styleEl;
@@ -3082,204 +3185,214 @@ function createCustomEvent(name) {
 }
 class SkyViewkeeper {
     constructor(options) {
+        _SkyViewkeeper_instances.add(this);
+        _SkyViewkeeper_boundaryEl.set(this, void 0);
+        _SkyViewkeeper_el.set(this, void 0);
+        _SkyViewkeeper_id.set(this, void 0);
+        _SkyViewkeeper_setWidth.set(this, void 0);
+        _SkyViewkeeper_verticalOffset.set(this, void 0);
+        _SkyViewkeeper_verticalOffsetEl.set(this, void 0);
+        _SkyViewkeeper_viewportMarginTop.set(this, 0);
+        _SkyViewkeeper_currentElFixedLeft.set(this, void 0);
+        _SkyViewkeeper_currentElFixedTop.set(this, void 0);
+        _SkyViewkeeper_currentElFixedWidth.set(this, void 0);
+        _SkyViewkeeper_isDestroyed.set(this, false);
+        _SkyViewkeeper_scrollableHost.set(this, void 0);
+        _SkyViewkeeper_syncElPositionHandler.set(this, void 0);
         options = options || /* istanbul ignore next */ {};
-        this.setWidth = options.setWidth;
-        this.id = nextId();
-        this.el = options.el;
-        this.boundaryEl = options.boundaryEl;
-        this.scrollableHost = options.scrollableHost;
-        this.verticalOffset = options.verticalOffset || 0;
-        this.verticalOffsetEl = options.verticalOffsetEl;
-        this.viewportMarginTop = options.viewportMarginTop || 0;
-        this.syncElPositionHandler = () => this.syncElPosition();
-        if (this.verticalOffsetEl) {
-            this.verticalOffsetEl.addEventListener(EVT_AFTER_VIEWKEEPER_SYNC, this.syncElPositionHandler);
-        }
-        window.addEventListener('scroll', this.syncElPositionHandler, true);
-        window.addEventListener('resize', this.syncElPositionHandler);
-        window.addEventListener('orientationchange', this.syncElPositionHandler);
+        __classPrivateFieldSet(this, _SkyViewkeeper_el, options.el, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeper_boundaryEl, options.boundaryEl, "f");
+        if (!__classPrivateFieldGet(this, _SkyViewkeeper_el, "f")) {
+            throw new Error('[SkyViewkeeper] The option `el` is required.');
+        }
+        if (!__classPrivateFieldGet(this, _SkyViewkeeper_boundaryEl, "f")) {
+            throw new Error('[SkyViewkeeper] The option `boundaryEl` is required.');
+        }
+        const el = __classPrivateFieldGet(this, _SkyViewkeeper_el, "f");
+        const boundaryEl = __classPrivateFieldGet(this, _SkyViewkeeper_boundaryEl, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeper_setWidth, !!options.setWidth, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeper_id, nextId(), "f");
+        __classPrivateFieldSet(this, _SkyViewkeeper_scrollableHost, options.scrollableHost, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeper_verticalOffset, options.verticalOffset || 0, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeper_verticalOffsetEl, options.verticalOffsetEl, "f");
+        // Only set viewport margin if the scrollable host is undefined.
+        if (!__classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f")) {
+            __classPrivateFieldSet(this, _SkyViewkeeper_viewportMarginTop, options.viewportMarginTop ?? 0, "f");
+        }
+        __classPrivateFieldSet(this, _SkyViewkeeper_syncElPositionHandler, () => this.syncElPosition(el, boundaryEl), "f");
+        if (__classPrivateFieldGet(this, _SkyViewkeeper_verticalOffsetEl, "f")) {
+            __classPrivateFieldGet(this, _SkyViewkeeper_verticalOffsetEl, "f").addEventListener(EVT_AFTER_VIEWKEEPER_SYNC, __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"));
+        }
+        window.addEventListener('scroll', __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"), true);
+        window.addEventListener('resize', __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"));
+        window.addEventListener('orientationchange', __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"));
         ensureStyleEl();
-        this.syncElPosition();
-    }
-    set viewportMarginTop(margin) {
-        this._viewportMarginTop = margin;
+        this.syncElPosition(el, boundaryEl);
     }
-    get viewportMarginTop() {
-        if (this.scrollableHost) {
-            return 0;
-        }
-        else {
-            return this._viewportMarginTop;
-        }
-    }
-    syncElPosition() {
-        const verticalOffset = this.calculateVerticalOffset();
+    syncElPosition(el, boundaryEl) {
+        const verticalOffset = __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_calculateVerticalOffset).call(this);
         // When the element isn't visible, its size can't be calculated, so don't attempt syncing position in this case.
-        if (this.el.offsetWidth === 0 && this.el.offsetHeight === 0) {
+        if (el.offsetWidth === 0 && el.offsetHeight === 0) {
             return;
         }
-        const boundaryInfo = this.getBoundaryInfo();
-        const fixedStyles = this.getFixedStyles(boundaryInfo, verticalOffset);
-        const doFixEl = this.shouldFixEl(boundaryInfo, verticalOffset);
-        if (this.needsUpdating(doFixEl, fixedStyles)) {
+        const boundaryInfo = __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_getBoundaryInfo).call(this, el, boundaryEl);
+        const fixedStyles = __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_getFixedStyles).call(this, boundaryInfo, verticalOffset);
+        const doFixEl = __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_shouldFixEl).call(this, el, boundaryInfo, verticalOffset);
+        if (__classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_needsUpdating).call(this, doFixEl, fixedStyles)) {
             if (doFixEl) {
-                this.fixEl(boundaryInfo, fixedStyles);
+                __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_fixEl).call(this, el, boundaryInfo, fixedStyles);
             }
             else {
-                this.unfixEl();
+                __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_unfixEl).call(this, el);
             }
         }
         const evt = createCustomEvent(EVT_AFTER_VIEWKEEPER_SYNC);
-        this.el.dispatchEvent(evt);
+        el.dispatchEvent(evt);
     }
     destroy() {
-        if (!this.isDestroyed) {
-            window.removeEventListener('scroll', this.syncElPositionHandler, true);
-            window.removeEventListener('resize', this.syncElPositionHandler);
-            window.removeEventListener('orientationchange', this.syncElPositionHandler);
-            this.unfixEl();
-            if (this.verticalOffsetEl) {
-                this.verticalOffsetEl.removeEventListener(EVT_AFTER_VIEWKEEPER_SYNC, this.syncElPositionHandler);
+        if (!__classPrivateFieldGet(this, _SkyViewkeeper_isDestroyed, "f")) {
+            window.removeEventListener('scroll', __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"), true);
+            window.removeEventListener('resize', __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"));
+            window.removeEventListener('orientationchange', __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"));
+            if (__classPrivateFieldGet(this, _SkyViewkeeper_el, "f")) {
+                __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_unfixEl).call(this, __classPrivateFieldGet(this, _SkyViewkeeper_el, "f"));
             }
-            this.el = this.boundaryEl = this.verticalOffsetEl = undefined;
-            this.isDestroyed = true;
-        }
-    }
-    getSpacerId() {
-        return this.id + '-spacer';
-    }
-    unfixEl() {
-        const spacerEl = document.getElementById(this.getSpacerId());
-        if (spacerEl) {
-            spacerEl.parentElement.removeChild(spacerEl);
-        }
-        this.el.classList.remove(CLS_VIEWKEEPER_FIXED);
-        this.currentElFixedLeft =
-            this.currentElFixedTop =
-                this.currentElFixedWidth =
-                    undefined;
-        let width;
-        if (this.setWidth) {
-            width = 'auto';
-        }
-        setElPosition(this.el, '', '', width, '');
-    }
-    calculateVerticalOffset() {
-        let offset = this.verticalOffset;
-        if (this.verticalOffsetEl) {
-            const verticalOffsetElTopStyle = this.verticalOffsetEl.style.top;
-            const verticalOffsetElTop = parseInt(verticalOffsetElTopStyle, 10) || 0;
-            offset += this.verticalOffsetEl.offsetHeight + verticalOffsetElTop;
-        }
-        else if (this.scrollableHost) {
-            offset += this.scrollableHost.getBoundingClientRect().top;
+            if (__classPrivateFieldGet(this, _SkyViewkeeper_verticalOffsetEl, "f")) {
+                __classPrivateFieldGet(this, _SkyViewkeeper_verticalOffsetEl, "f").removeEventListener(EVT_AFTER_VIEWKEEPER_SYNC, __classPrivateFieldGet(this, _SkyViewkeeper_syncElPositionHandler, "f"));
+            }
+            __classPrivateFieldSet(this, _SkyViewkeeper_el, __classPrivateFieldSet(this, _SkyViewkeeper_boundaryEl, __classPrivateFieldSet(this, _SkyViewkeeper_verticalOffsetEl, undefined, "f"), "f"), "f");
+            __classPrivateFieldSet(this, _SkyViewkeeper_isDestroyed, true, "f");
         }
-        return offset;
     }
-    shouldFixEl(boundaryInfo, verticalOffset) {
-        let anchorTop;
-        if (boundaryInfo.spacerEl) {
-            anchorTop = getOffset(boundaryInfo.spacerEl, this.scrollableHost).top;
-        }
-        else {
-            anchorTop = getOffset(this.el, this.scrollableHost).top;
-        }
-        const doFixEl = boundaryInfo.scrollTop + verticalOffset + this.viewportMarginTop >
-            anchorTop;
-        return doFixEl;
-    }
-    getFixedStyles(boundaryInfo, verticalOffset) {
-        // If the element needs to be fixed, this will calculate its position.  The position
-        // will be 0 (fully visible) unless the user is scrolling the boundary out of view.
-        // In that case, the element should begin to scroll out of view with the
-        // rest of the boundary by setting its top position to a negative value.
-        const elFixedTop = Math.min(boundaryInfo.boundaryBottom -
-            boundaryInfo.elHeight -
-            boundaryInfo.scrollTop, verticalOffset);
-        const elFixedWidth = boundaryInfo.boundaryEl.getBoundingClientRect().width;
-        const elFixedLeft = boundaryInfo.boundaryOffset.left - boundaryInfo.scrollLeft;
-        return {
-            elFixedLeft,
-            elFixedTop,
-            elFixedWidth,
-        };
+}
+_SkyViewkeeper_boundaryEl = new WeakMap(), _SkyViewkeeper_el = new WeakMap(), _SkyViewkeeper_id = new WeakMap(), _SkyViewkeeper_setWidth = new WeakMap(), _SkyViewkeeper_verticalOffset = new WeakMap(), _SkyViewkeeper_verticalOffsetEl = new WeakMap(), _SkyViewkeeper_viewportMarginTop = new WeakMap(), _SkyViewkeeper_currentElFixedLeft = new WeakMap(), _SkyViewkeeper_currentElFixedTop = new WeakMap(), _SkyViewkeeper_currentElFixedWidth = new WeakMap(), _SkyViewkeeper_isDestroyed = new WeakMap(), _SkyViewkeeper_scrollableHost = new WeakMap(), _SkyViewkeeper_syncElPositionHandler = new WeakMap(), _SkyViewkeeper_instances = new WeakSet(), _SkyViewkeeper_getSpacerId = function _SkyViewkeeper_getSpacerId() {
+    return __classPrivateFieldGet(this, _SkyViewkeeper_id, "f") + '-spacer';
+}, _SkyViewkeeper_unfixEl = function _SkyViewkeeper_unfixEl(el) {
+    const spacerEl = document.getElementById(__classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_getSpacerId).call(this));
+    /*istanbul ignore else*/
+    if (spacerEl?.parentElement) {
+        spacerEl.parentElement.removeChild(spacerEl);
+    }
+    el.classList.remove(CLS_VIEWKEEPER_FIXED);
+    __classPrivateFieldSet(this, _SkyViewkeeper_currentElFixedLeft, __classPrivateFieldSet(this, _SkyViewkeeper_currentElFixedTop, __classPrivateFieldSet(this, _SkyViewkeeper_currentElFixedWidth, undefined, "f"), "f"), "f");
+    let width = '';
+    if (__classPrivateFieldGet(this, _SkyViewkeeper_setWidth, "f")) {
+        width = 'auto';
+    }
+    setElPosition(el, '', '', width, '');
+}, _SkyViewkeeper_calculateVerticalOffset = function _SkyViewkeeper_calculateVerticalOffset() {
+    let offset = __classPrivateFieldGet(this, _SkyViewkeeper_verticalOffset, "f");
+    if (__classPrivateFieldGet(this, _SkyViewkeeper_verticalOffsetEl, "f")) {
+        const verticalOffsetElTopStyle = __classPrivateFieldGet(this, _SkyViewkeeper_verticalOffsetEl, "f").style.top;
+        const verticalOffsetElTop = parseInt(verticalOffsetElTopStyle, 10) || 0;
+        offset += __classPrivateFieldGet(this, _SkyViewkeeper_verticalOffsetEl, "f").offsetHeight + verticalOffsetElTop;
+    }
+    else if (__classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f")) {
+        offset += __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f").getBoundingClientRect().top;
+    }
+    return offset;
+}, _SkyViewkeeper_shouldFixEl = function _SkyViewkeeper_shouldFixEl(el, boundaryInfo, verticalOffset) {
+    let anchorTop;
+    if (boundaryInfo.spacerEl) {
+        anchorTop = getOffset(boundaryInfo.spacerEl, __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f")).top;
     }
-    needsUpdating(doFixEl, fixedStyles) {
-        if ((doFixEl &&
-            this.currentElFixedLeft === fixedStyles.elFixedLeft &&
-            this.currentElFixedTop === fixedStyles.elFixedTop &&
-            this.currentElFixedWidth === fixedStyles.elFixedWidth) ||
-            (!doFixEl &&
-                !(this.currentElFixedLeft !== undefined &&
-                    this.currentElFixedLeft !== null))) {
-            // The element is either currently fixed and its position and width do not need
-            // to change, or the element is not currently fixed and does not need to be fixed.
-            // No changes are needed.
-            return false;
-        }
-        return true;
+    else {
+        anchorTop = getOffset(el, __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f")).top;
+    }
+    const doFixEl = boundaryInfo.scrollTop + verticalOffset + __classPrivateFieldGet(this, _SkyViewkeeper_viewportMarginTop, "f") >
+        anchorTop;
+    return doFixEl;
+}, _SkyViewkeeper_getFixedStyles = function _SkyViewkeeper_getFixedStyles(boundaryInfo, verticalOffset) {
+    // If the element needs to be fixed, this will calculate its position.  The position
+    // will be 0 (fully visible) unless the user is scrolling the boundary out of view.
+    // In that case, the element should begin to scroll out of view with the
+    // rest of the boundary by setting its top position to a negative value.
+    const elFixedTop = Math.min(boundaryInfo.boundaryBottom -
+        boundaryInfo.elHeight -
+        boundaryInfo.scrollTop, verticalOffset);
+    const elFixedWidth = boundaryInfo.boundaryEl.getBoundingClientRect().width;
+    const elFixedLeft = boundaryInfo.boundaryOffset.left - boundaryInfo.scrollLeft;
+    return {
+        elFixedLeft,
+        elFixedTop,
+        elFixedWidth,
+    };
+}, _SkyViewkeeper_needsUpdating = function _SkyViewkeeper_needsUpdating(doFixEl, fixedStyles) {
+    if ((doFixEl &&
+        __classPrivateFieldGet(this, _SkyViewkeeper_currentElFixedLeft, "f") === fixedStyles.elFixedLeft &&
+        __classPrivateFieldGet(this, _SkyViewkeeper_currentElFixedTop, "f") === fixedStyles.elFixedTop &&
+        __classPrivateFieldGet(this, _SkyViewkeeper_currentElFixedWidth, "f") === fixedStyles.elFixedWidth) ||
+        (!doFixEl &&
+            !(__classPrivateFieldGet(this, _SkyViewkeeper_currentElFixedLeft, "f") !== undefined &&
+                __classPrivateFieldGet(this, _SkyViewkeeper_currentElFixedLeft, "f") !== null))) {
+        // The element is either currently fixed and its position and width do not need
+        // to change, or the element is not currently fixed and does not need to be fixed.
+        // No changes are needed.
+        return false;
     }
-    fixEl(boundaryInfo, fixedStyles) {
-        const el = this.el;
-        /* istanbul ignore else */
-        /* sanity check */
-        if (!boundaryInfo.spacerEl) {
-            const spacerHeight = boundaryInfo.elHeight;
-            const spacerEl = document.createElement('div');
-            spacerEl.id = boundaryInfo.spacerId;
-            spacerEl.style.height = px(spacerHeight);
+    return true;
+}, _SkyViewkeeper_fixEl = function _SkyViewkeeper_fixEl(el, boundaryInfo, fixedStyles) {
+    /* istanbul ignore else */
+    /* sanity check */
+    if (!boundaryInfo.spacerEl) {
+        const spacerHeight = boundaryInfo.elHeight;
+        const spacerEl = document.createElement('div');
+        spacerEl.id = boundaryInfo.spacerId;
+        spacerEl.style.height = px(spacerHeight);
+        /*istanbul ignore else*/
+        if (el.parentNode) {
             el.parentNode.insertBefore(spacerEl, el.nextSibling);
         }
-        el.classList.add(CLS_VIEWKEEPER_FIXED);
-        this.currentElFixedTop = fixedStyles.elFixedTop;
-        this.currentElFixedLeft = fixedStyles.elFixedLeft;
-        this.currentElFixedWidth = fixedStyles.elFixedWidth;
-        let width;
-        if (this.setWidth) {
-            width = fixedStyles.elFixedWidth;
-        }
-        setElPosition(el, fixedStyles.elFixedLeft, fixedStyles.elFixedTop, width, this.viewportMarginTop);
-    }
-    getBoundaryInfo() {
-        const spacerId = this.getSpacerId();
-        const spacerEl = document.getElementById(spacerId);
-        const boundaryEl = this.boundaryEl;
-        const boundaryOffset = getOffset(boundaryEl, this.scrollableHost);
-        const boundaryTop = boundaryOffset.top;
-        const boundaryBottom = boundaryTop + boundaryEl.getBoundingClientRect().height;
-        const scrollLeft = this.scrollableHost
-            ? this.scrollableHost.scrollLeft
-            : document.documentElement.scrollLeft;
-        const scrollTop = this.scrollableHost
-            ? this.scrollableHost.scrollTop
-            : document.documentElement.scrollTop;
-        const elHeight = getHeightWithMargin(this.el);
-        return {
-            boundaryBottom,
-            boundaryOffset,
-            boundaryEl,
-            elHeight,
-            scrollLeft,
-            scrollTop,
-            spacerId,
-            spacerEl,
-        };
     }
-}
+    el.classList.add(CLS_VIEWKEEPER_FIXED);
+    __classPrivateFieldSet(this, _SkyViewkeeper_currentElFixedTop, fixedStyles.elFixedTop, "f");
+    __classPrivateFieldSet(this, _SkyViewkeeper_currentElFixedLeft, fixedStyles.elFixedLeft, "f");
+    __classPrivateFieldSet(this, _SkyViewkeeper_currentElFixedWidth, fixedStyles.elFixedWidth, "f");
+    let width = 0;
+    if (__classPrivateFieldGet(this, _SkyViewkeeper_setWidth, "f")) {
+        width = fixedStyles.elFixedWidth;
+    }
+    setElPosition(el, fixedStyles.elFixedLeft, fixedStyles.elFixedTop, width, __classPrivateFieldGet(this, _SkyViewkeeper_viewportMarginTop, "f"));
+}, _SkyViewkeeper_getBoundaryInfo = function _SkyViewkeeper_getBoundaryInfo(el, boundaryEl) {
+    const spacerId = __classPrivateFieldGet(this, _SkyViewkeeper_instances, "m", _SkyViewkeeper_getSpacerId).call(this);
+    const spacerEl = document.getElementById(spacerId);
+    const boundaryOffset = getOffset(boundaryEl, __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f"));
+    const boundaryTop = boundaryOffset.top;
+    const boundaryBottom = boundaryTop + boundaryEl.getBoundingClientRect().height;
+    const scrollLeft = __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f")
+        ? __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f").scrollLeft
+        : document.documentElement.scrollLeft;
+    const scrollTop = __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f")
+        ? __classPrivateFieldGet(this, _SkyViewkeeper_scrollableHost, "f").scrollTop
+        : document.documentElement.scrollTop;
+    const elHeight = getHeightWithMargin(el);
+    return {
+        boundaryBottom,
+        boundaryOffset,
+        boundaryEl,
+        elHeight,
+        scrollLeft,
+        scrollTop,
+        spacerId,
+        spacerEl,
+    };
+};
 
+var _SkyViewkeeperService_hostOptions;
 /**
  * Provides methods for creating and destroying viewkeeper instances.
  */
 class SkyViewkeeperService {
     constructor(hostOptions) {
-        this.hostOptions = hostOptions;
+        _SkyViewkeeperService_hostOptions.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyViewkeeperService_hostOptions, hostOptions, "f");
     }
     /**
      *
      * @param options Creates a viewkeeper instance, applying host options where applicable.
      */
     create(options) {
-        options = Object.assign({}, this.hostOptions || {}, options);
+        options = Object.assign({}, __classPrivateFieldGet(this, _SkyViewkeeperService_hostOptions, "f") || {}, options);
         return new SkyViewkeeper(options);
     }
     /**
@@ -3290,6 +3403,7 @@ class SkyViewkeeperService {
         vk.destroy();
     }
 }
+_SkyViewkeeperService_hostOptions = new WeakMap();
 SkyViewkeeperService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyViewkeeperService, deps: [{ token: SkyViewkeeperHostOptions, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyViewkeeperService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyViewkeeperService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyViewkeeperService, decorators: [{
@@ -3301,88 +3415,102 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                     type: Optional
                 }] }]; } });
 
+var _SkyViewkeeperDirective_instances, _SkyViewkeeperDirective__skyViewkeeper, _SkyViewkeeperDirective_currentViewkeeperEls, _SkyViewkeeperDirective_el, _SkyViewkeeperDirective_mutationObserverSvc, _SkyViewkeeperDirective_observer, _SkyViewkeeperDirective_scrollableHostSvc, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, _SkyViewkeeperDirective_viewkeepers, _SkyViewkeeperDirective_viewkeeperSvc, _SkyViewkeeperDirective_destroyViewkeepers, _SkyViewkeeperDirective_getViewkeeperEls, _SkyViewkeeperDirective_viewkeeperElsChanged, _SkyViewkeeperDirective_detectElements;
 class SkyViewkeeperDirective {
-    constructor(el, mutationObserverSvc, viewkeeperSvc, scrollableHostService) {
-        this.el = el;
-        this.mutationObserverSvc = mutationObserverSvc;
-        this.viewkeeperSvc = viewkeeperSvc;
-        this.scrollableHostService = scrollableHostService;
-        this.viewkeepers = [];
-        this.scrollableHostWatchUnsubscribe = undefined;
+    constructor(el, mutationObserverSvc, viewkeeperSvc, scrollableHostSvc) {
+        _SkyViewkeeperDirective_instances.add(this);
+        _SkyViewkeeperDirective__skyViewkeeper.set(this, void 0);
+        _SkyViewkeeperDirective_currentViewkeeperEls.set(this, void 0);
+        _SkyViewkeeperDirective_el.set(this, void 0);
+        _SkyViewkeeperDirective_mutationObserverSvc.set(this, void 0);
+        _SkyViewkeeperDirective_observer.set(this, void 0);
+        _SkyViewkeeperDirective_scrollableHostSvc.set(this, void 0);
+        _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe.set(this, void 0);
+        _SkyViewkeeperDirective_viewkeepers.set(this, []);
+        _SkyViewkeeperDirective_viewkeeperSvc.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyViewkeeperDirective_el, el, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeperDirective_mutationObserverSvc, mutationObserverSvc, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeperDirective_viewkeeperSvc, viewkeeperSvc, "f");
+        __classPrivateFieldSet(this, _SkyViewkeeperDirective_scrollableHostSvc, scrollableHostSvc, "f");
     }
     set skyViewkeeper(value) {
-        this._skyViewkeeper = value;
-        this.detectElements();
+        __classPrivateFieldSet(this, _SkyViewkeeperDirective__skyViewkeeper, value, "f");
+        __classPrivateFieldGet(this, _SkyViewkeeperDirective_instances, "m", _SkyViewkeeperDirective_detectElements).call(this);
     }
     get skyViewkeeper() {
-        return this._skyViewkeeper;
+        return __classPrivateFieldGet(this, _SkyViewkeeperDirective__skyViewkeeper, "f");
     }
     ngOnInit() {
-        this.observer = this.mutationObserverSvc.create(() => this.detectElements());
-        this.observer.observe(this.el.nativeElement, {
+        __classPrivateFieldSet(this, _SkyViewkeeperDirective_observer, __classPrivateFieldGet(this, _SkyViewkeeperDirective_mutationObserverSvc, "f").create(() => __classPrivateFieldGet(this, _SkyViewkeeperDirective_instances, "m", _SkyViewkeeperDirective_detectElements).call(this)), "f");
+        __classPrivateFieldGet(this, _SkyViewkeeperDirective_observer, "f").observe(__classPrivateFieldGet(this, _SkyViewkeeperDirective_el, "f").nativeElement, {
             childList: true,
             subtree: true,
         });
     }
     ngOnDestroy() {
-        this.observer.disconnect();
-        this.scrollableHostWatchUnsubscribe?.next();
-        this.scrollableHostWatchUnsubscribe?.complete();
-        this.destroyViewkeepers();
-    }
-    destroyViewkeepers() {
-        for (const viewkeeper of this.viewkeepers) {
-            this.viewkeeperSvc.destroy(viewkeeper);
-        }
-        this.viewkeepers = [];
-    }
-    getViewkeeperEls() {
-        let viewkeeperEls;
-        if (this.skyViewkeeper) {
-            viewkeeperEls = [];
-            for (const item of this.skyViewkeeper) {
-                const matchingEls = Array.from(this.el.nativeElement.querySelectorAll(item));
-                viewkeeperEls = [...viewkeeperEls, ...matchingEls];
-            }
+        /*istanbul ignore else*/
+        if (__classPrivateFieldGet(this, _SkyViewkeeperDirective_observer, "f")) {
+            __classPrivateFieldGet(this, _SkyViewkeeperDirective_observer, "f").disconnect();
+        }
+        /*istanbul ignore else*/
+        if (__classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, "f")) {
+            __classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, "f").next();
+            __classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, "f").complete();
         }
-        return viewkeeperEls;
+        __classPrivateFieldGet(this, _SkyViewkeeperDirective_instances, "m", _SkyViewkeeperDirective_destroyViewkeepers).call(this);
+    }
+}
+_SkyViewkeeperDirective__skyViewkeeper = new WeakMap(), _SkyViewkeeperDirective_currentViewkeeperEls = new WeakMap(), _SkyViewkeeperDirective_el = new WeakMap(), _SkyViewkeeperDirective_mutationObserverSvc = new WeakMap(), _SkyViewkeeperDirective_observer = new WeakMap(), _SkyViewkeeperDirective_scrollableHostSvc = new WeakMap(), _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe = new WeakMap(), _SkyViewkeeperDirective_viewkeepers = new WeakMap(), _SkyViewkeeperDirective_viewkeeperSvc = new WeakMap(), _SkyViewkeeperDirective_instances = new WeakSet(), _SkyViewkeeperDirective_destroyViewkeepers = function _SkyViewkeeperDirective_destroyViewkeepers() {
+    for (const viewkeeper of __classPrivateFieldGet(this, _SkyViewkeeperDirective_viewkeepers, "f")) {
+        __classPrivateFieldGet(this, _SkyViewkeeperDirective_viewkeeperSvc, "f").destroy(viewkeeper);
     }
-    viewkeeperElsChanged(viewkeeperEls) {
-        if (!viewkeeperEls !== !this.currentViewkeeperEls) {
+    __classPrivateFieldSet(this, _SkyViewkeeperDirective_viewkeepers, [], "f");
+}, _SkyViewkeeperDirective_getViewkeeperEls = function _SkyViewkeeperDirective_getViewkeeperEls() {
+    let viewkeeperEls = [];
+    if (this.skyViewkeeper) {
+        viewkeeperEls = [];
+        for (const item of this.skyViewkeeper) {
+            const matchingEls = Array.from(__classPrivateFieldGet(this, _SkyViewkeeperDirective_el, "f").nativeElement.querySelectorAll(item));
+            viewkeeperEls = [...viewkeeperEls, ...matchingEls];
+        }
+    }
+    return viewkeeperEls;
+}, _SkyViewkeeperDirective_viewkeeperElsChanged = function _SkyViewkeeperDirective_viewkeeperElsChanged(viewkeeperEls) {
+    if (!viewkeeperEls !== !__classPrivateFieldGet(this, _SkyViewkeeperDirective_currentViewkeeperEls, "f")) {
+        return true;
+    }
+    if (viewkeeperEls && __classPrivateFieldGet(this, _SkyViewkeeperDirective_currentViewkeeperEls, "f")) {
+        if (viewkeeperEls.length !== __classPrivateFieldGet(this, _SkyViewkeeperDirective_currentViewkeeperEls, "f").length) {
             return true;
         }
-        if (viewkeeperEls && this.currentViewkeeperEls) {
-            if (viewkeeperEls.length !== this.currentViewkeeperEls.length) {
+        for (let i = 0, n = viewkeeperEls.length; i < n; i++) {
+            if (viewkeeperEls[i] !== __classPrivateFieldGet(this, _SkyViewkeeperDirective_currentViewkeeperEls, "f")[i]) {
                 return true;
             }
-            for (let i = 0, n = viewkeeperEls.length; i < n; i++) {
-                if (viewkeeperEls[i] !== this.currentViewkeeperEls[i]) {
-                    return true;
-                }
-            }
         }
-        return false;
     }
-    detectElements() {
-        const viewkeeperEls = this.getViewkeeperEls();
-        if (this.viewkeeperElsChanged(viewkeeperEls)) {
-            if (this.scrollableHostWatchUnsubscribe) {
-                this.scrollableHostWatchUnsubscribe.next();
-                this.scrollableHostWatchUnsubscribe.complete();
-                this.scrollableHostWatchUnsubscribe = new Subject();
-            }
-            else {
-                this.scrollableHostWatchUnsubscribe = new Subject();
-            }
-            this.scrollableHostService
-                .watchScrollableHost(this.el)
-                .pipe(takeUntil(this.scrollableHostWatchUnsubscribe))
+    return false;
+}, _SkyViewkeeperDirective_detectElements = function _SkyViewkeeperDirective_detectElements() {
+    const viewkeeperEls = __classPrivateFieldGet(this, _SkyViewkeeperDirective_instances, "m", _SkyViewkeeperDirective_getViewkeeperEls).call(this);
+    if (__classPrivateFieldGet(this, _SkyViewkeeperDirective_instances, "m", _SkyViewkeeperDirective_viewkeeperElsChanged).call(this, viewkeeperEls)) {
+        if (__classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, "f")) {
+            __classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, "f").next();
+            __classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, "f").complete();
+            __classPrivateFieldSet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, new Subject(), "f");
+        }
+        else {
+            __classPrivateFieldSet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, new Subject(), "f");
+        }
+        if (__classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostSvc, "f")) {
+            __classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostSvc, "f")
+                .watchScrollableHost(__classPrivateFieldGet(this, _SkyViewkeeperDirective_el, "f"))
+                .pipe(takeUntil(__classPrivateFieldGet(this, _SkyViewkeeperDirective_scrollableHostWatchUnsubscribe, "f")))
                 .subscribe((scrollableHost) => {
-                this.destroyViewkeepers();
+                __classPrivateFieldGet(this, _SkyViewkeeperDirective_instances, "m", _SkyViewkeeperDirective_destroyViewkeepers).call(this);
                 let previousViewkeeperEl;
                 for (const viewkeeperEl of viewkeeperEls) {
-                    this.viewkeepers.push(this.viewkeeperSvc.create({
-                        boundaryEl: this.el.nativeElement,
+                    __classPrivateFieldGet(this, _SkyViewkeeperDirective_viewkeepers, "f").push(__classPrivateFieldGet(this, _SkyViewkeeperDirective_viewkeeperSvc, "f").create({
+                        boundaryEl: __classPrivateFieldGet(this, _SkyViewkeeperDirective_el, "f").nativeElement,
                         scrollableHost: scrollableHost instanceof HTMLElement
                             ? scrollableHost
                             : undefined,
@@ -3393,10 +3521,10 @@ class SkyViewkeeperDirective {
                     previousViewkeeperEl = viewkeeperEl;
                 }
             });
-            this.currentViewkeeperEls = viewkeeperEls;
         }
+        __classPrivateFieldSet(this, _SkyViewkeeperDirective_currentViewkeeperEls, viewkeeperEls, "f");
     }
-}
+};
 SkyViewkeeperDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyViewkeeperDirective, deps: [{ token: i0.ElementRef }, { token: MutationObserverService }, { token: SkyViewkeeperService }, { token: SkyScrollableHostService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
 SkyViewkeeperDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.2", type: SkyViewkeeperDirective, selector: "[skyViewkeeper]", inputs: { skyViewkeeper: "skyViewkeeper" }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyViewkeeperDirective, decorators: [{