@skyux/lists 7.0.0-beta.2 → 7.0.0-beta.3

package/fesm2015/skyux-lists.mjs

@@ -8,6 +8,7 @@ import * as i3 from '@skyux/theme';
 import { SkyThemeModule } from '@skyux/theme';
 import * as i4 from '@skyux/i18n';
 import { getLibStringForLocale, SkyI18nModule, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
+import { __classPrivateFieldSet, __classPrivateFieldGet } from 'tslib';
 import { Subject, fromEvent, BehaviorSubject, forkJoin } from 'rxjs';
 import { takeUntil, filter, map } from 'rxjs/operators';
 import * as i1$1 from '@skyux/core';
@@ -102,9 +103,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
                 }]
         }] });
 
+var _SkyFilterButtonComponent_defaultButtonId, _SkyFilterButtonComponent_filterButtonIdOrDefault;
 let nextId = 0;
 class SkyFilterButtonComponent {
     constructor() {
+        /**
+         * Indicates whether the filtering options are exposed.
+         * To support [accessibility rules for disclosures](https://www.w3.org/TR/wai-aria-practices-1.1/#disclosure),
+         * this property is necessary when using inline filters.
+         */
+        this.ariaExpanded = false;
         /**
          * Indicates whether to highlight the filter button to indicate that filters were applied.
          * We recommend setting this property to `true` when no indication of filtering is visible
@@ -123,26 +131,30 @@ class SkyFilterButtonComponent {
          * Fires when the filter button is selected.
          */
         this.filterButtonClick = new EventEmitter();
+        _SkyFilterButtonComponent_defaultButtonId.set(this, void 0);
+        _SkyFilterButtonComponent_filterButtonIdOrDefault.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyFilterButtonComponent_filterButtonIdOrDefault, __classPrivateFieldSet(this, _SkyFilterButtonComponent_defaultButtonId, `sky-filter-button-${++nextId}`, "f"), "f");
     }
     /**
      * Specifies an ID for the filter button.
      */
     get filterButtonId() {
-        return this._filterButtonId || `sky-filter-button-${++nextId}`;
+        return __classPrivateFieldGet(this, _SkyFilterButtonComponent_filterButtonIdOrDefault, "f");
     }
     set filterButtonId(value) {
-        this._filterButtonId = value;
+        __classPrivateFieldSet(this, _SkyFilterButtonComponent_filterButtonIdOrDefault, value || __classPrivateFieldGet(this, _SkyFilterButtonComponent_defaultButtonId, "f"), "f");
     }
     filterButtonOnClick() {
-        this.filterButtonClick.emit(undefined);
+        this.filterButtonClick.emit();
     }
 }
+_SkyFilterButtonComponent_defaultButtonId = new WeakMap(), _SkyFilterButtonComponent_filterButtonIdOrDefault = new WeakMap();
 SkyFilterButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyFilterButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 SkyFilterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: SkyFilterButtonComponent, selector: "sky-filter-button", inputs: { filterButtonId: "filterButtonId", ariaControls: "ariaControls", ariaExpanded: "ariaExpanded", active: "active", disabled: "disabled", showButtonText: "showButtonText" }, outputs: { filterButtonClick: "filterButtonClick" }, ngImport: i0, template: "<button\n  class=\"sky-btn sky-btn-default sky-filter-btn\"\n  type=\"button\"\n  [attr.aria-controls]=\"ariaControls\"\n  [attr.aria-expanded]=\"ariaExpanded\"\n  [attr.aria-label]=\"'skyux_filter_button_title' | skyLibResources\"\n  [attr.title]=\"'skyux_filter_button_title' | skyLibResources\"\n  [disabled]=\"disabled\"\n  [id]=\"filterButtonId\"\n  [ngClass]=\"{\n    'sky-filter-btn-active': active\n  }\"\n  [skyThemeClass]=\"{\n    'sky-rounded-corners': 'default',\n    'sky-theme-modern': 'modern'\n  }\"\n  (click)=\"filterButtonOnClick()\"\n>\n  <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\" size=\"lg\"> </sky-icon>\n  <sky-icon *skyThemeIf=\"'modern'\" icon=\"filter\" iconType=\"skyux\"></sky-icon>\n  <span *ngIf=\"showButtonText\" class=\"sky-filter-btn-text\">\n    {{ 'skyux_filter_button_title' | skyLibResources }}\n  </span>\n</button>\n", styles: [".sky-filter-btn-active,.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#72bf44;border:2px solid #72bf44;padding:5px 11px}.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#212327}.sky-theme-modern.sky-filter-btn-active,.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:focus{color:initial;border:none;box-shadow:inset 0 0 0 1px #0974a1;background-color:#c1e8fb;color:#212327;padding:9px 21px}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:focus:hover{border:none;box-shadow:inset 0 0 0 1px #0974a1;text-decoration:none}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:hover,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{color:#212327}.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 2px #0974a1;background-image:none}.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active[disabled],.sky-theme-modern.sky-filter-btn-active[disabled]:hover,.sky-theme-modern.sky-filter-btn-active[disabled]:focus,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active[disabled]:active,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover[disabled],.sky-theme-modern.sky-filter-btn-active:hover[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:active,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus[disabled],.sky-theme-modern.sky-filter-btn-active:focus[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:active,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 1px #d2d2d2;background-color:#ededee;color:#686c73;opacity:1}.sky-theme-modern.sky-filter-btn-active:focus,.sky-theme-modern.sky-filter-btn-active:hover:focus,.sky-theme-modern.sky-filter-btn-active:focus:focus{outline:none}.sky-theme-modern.sky-filter-btn-active:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:hover:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:focus:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #0974a1,0 1px 8px #0000004d}:host .sky-filter-btn-text{display:none}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn-text,:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}@media (min-width: 768px){:host .sky-filter-btn-text{display:inline}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}}:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:inline}:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "directive", type: i3.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyFilterButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sky-filter-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  class=\"sky-btn sky-btn-default sky-filter-btn\"\n  type=\"button\"\n  [attr.aria-controls]=\"ariaControls\"\n  [attr.aria-expanded]=\"ariaExpanded\"\n  [attr.aria-label]=\"'skyux_filter_button_title' | skyLibResources\"\n  [attr.title]=\"'skyux_filter_button_title' | skyLibResources\"\n  [disabled]=\"disabled\"\n  [id]=\"filterButtonId\"\n  [ngClass]=\"{\n    'sky-filter-btn-active': active\n  }\"\n  [skyThemeClass]=\"{\n    'sky-rounded-corners': 'default',\n    'sky-theme-modern': 'modern'\n  }\"\n  (click)=\"filterButtonOnClick()\"\n>\n  <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\" size=\"lg\"> </sky-icon>\n  <sky-icon *skyThemeIf=\"'modern'\" icon=\"filter\" iconType=\"skyux\"></sky-icon>\n  <span *ngIf=\"showButtonText\" class=\"sky-filter-btn-text\">\n    {{ 'skyux_filter_button_title' | skyLibResources }}\n  </span>\n</button>\n", styles: [".sky-filter-btn-active,.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#72bf44;border:2px solid #72bf44;padding:5px 11px}.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#212327}.sky-theme-modern.sky-filter-btn-active,.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:focus{color:initial;border:none;box-shadow:inset 0 0 0 1px #0974a1;background-color:#c1e8fb;color:#212327;padding:9px 21px}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:focus:hover{border:none;box-shadow:inset 0 0 0 1px #0974a1;text-decoration:none}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:hover,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{color:#212327}.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 2px #0974a1;background-image:none}.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active[disabled],.sky-theme-modern.sky-filter-btn-active[disabled]:hover,.sky-theme-modern.sky-filter-btn-active[disabled]:focus,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active[disabled]:active,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover[disabled],.sky-theme-modern.sky-filter-btn-active:hover[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:active,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus[disabled],.sky-theme-modern.sky-filter-btn-active:focus[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:active,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 1px #d2d2d2;background-color:#ededee;color:#686c73;opacity:1}.sky-theme-modern.sky-filter-btn-active:focus,.sky-theme-modern.sky-filter-btn-active:hover:focus,.sky-theme-modern.sky-filter-btn-active:focus:focus{outline:none}.sky-theme-modern.sky-filter-btn-active:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:hover:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:focus:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #0974a1,0 1px 8px #0000004d}:host .sky-filter-btn-text{display:none}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn-text,:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}@media (min-width: 768px){:host .sky-filter-btn-text{display:inline}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}}:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:inline}:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}\n"] }]
-        }], propDecorators: { filterButtonId: [{
+        }], ctorParameters: function () { return []; }, propDecorators: { filterButtonId: [{
                 type: Input
             }], ariaControls: [{
                 type: Input
@@ -182,15 +194,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
             args: [{ selector: 'sky-filter-inline', template: "<div class=\"sky-filter-inline sky-padding-even-default\">\n  <ng-content></ng-content>\n</div>\n", styles: [".sky-filter-inline{background-color:#eeeeef;display:flex;align-items:center}\n"] }]
         }] });
 
+var _SkyFilterSummaryItemComponent__dismissible;
 /**
  * Specifies a filter that was applied.
  */
 class SkyFilterSummaryItemComponent {
     constructor() {
-        /**
-         * Indicates whether the filter summary item has a close button.
-         */
-        this.dismissible = true;
         /**
          * Fires when the summary item close button is selected.
          */
@@ -199,6 +208,16 @@ class SkyFilterSummaryItemComponent {
          * Fires when the summary item is selected.
          */
         this.itemClick = new EventEmitter();
+        _SkyFilterSummaryItemComponent__dismissible.set(this, true);
+    }
+    /**
+     * Indicates whether the filter summary item has a close button.
+     */
+    get dismissible() {
+        return __classPrivateFieldGet(this, _SkyFilterSummaryItemComponent__dismissible, "f");
+    }
+    set dismissible(value) {
+        __classPrivateFieldSet(this, _SkyFilterSummaryItemComponent__dismissible, value !== false, "f");
     }
     onItemDismiss() {
         this.dismiss.emit();
@@ -210,6 +229,7 @@ class SkyFilterSummaryItemComponent {
         this.itemClick.emit();
     }
 }
+_SkyFilterSummaryItemComponent__dismissible = new WeakMap();
 SkyFilterSummaryItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyFilterSummaryItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 SkyFilterSummaryItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: SkyFilterSummaryItemComponent, selector: "sky-filter-summary-item", inputs: { dismissible: "dismissible" }, outputs: { dismiss: "dismiss", itemClick: "itemClick" }, ngImport: i0, template: "<div\n  class=\"sky-filter-summary-item\"\n  (click)=\"onItemClick()\"\n  (keypress.enter)=\"onItemKeypress()\"\n>\n  <sky-token\n    [ariaLabel]=\"'skyux_filter_summary_close' | skyLibResources\"\n    [dismissible]=\"dismissible\"\n    (dismiss)=\"onItemDismiss()\"\n  >\n    <ng-content> </ng-content>\n  </sky-token>\n</div>\n", styles: [".sky-filter-summary-item{display:inline-block}:host:not(:last-child){margin-right:5px}:host-context(.sky-theme-modern) .sky-filter-summary-item{padding:0 0 5px}.sky-theme-modern .sky-filter-summary-item{padding:0 0 5px}\n"], dependencies: [{ kind: "component", type: i2.λ12, selector: "sky-token", inputs: ["disabled", "ariaLabel", "dismissible", "focusable"], outputs: ["dismiss", "tokenFocus"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyFilterSummaryItemComponent, decorators: [{
@@ -283,19 +303,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
                 }]
         }] });
 
+var _SkyInfiniteScrollDomAdapterService_instances, _SkyInfiniteScrollDomAdapterService_ngUnsubscribe, _SkyInfiniteScrollDomAdapterService_observer, _SkyInfiniteScrollDomAdapterService_parentChanges, _SkyInfiniteScrollDomAdapterService_parentChangesObs, _SkyInfiniteScrollDomAdapterService_scrollableHostSvc, _SkyInfiniteScrollDomAdapterService_windowRef, _SkyInfiniteScrollDomAdapterService_createObserver, _SkyInfiniteScrollDomAdapterService_isElementScrolledInView;
 /**
  * @internal
  */
 class SkyInfiniteScrollDomAdapterService {
-    constructor(windowRef) {
-        this.windowRef = windowRef;
-        this.ngUnsubscribe = new Subject();
-        this._parentChanges = new EventEmitter();
+    constructor(scrollableHostSvc, windowRef) {
+        _SkyInfiniteScrollDomAdapterService_instances.add(this);
+        _SkyInfiniteScrollDomAdapterService_ngUnsubscribe.set(this, new Subject());
+        _SkyInfiniteScrollDomAdapterService_observer.set(this, void 0);
+        _SkyInfiniteScrollDomAdapterService_parentChanges.set(this, void 0);
+        _SkyInfiniteScrollDomAdapterService_parentChangesObs.set(this, void 0);
+        _SkyInfiniteScrollDomAdapterService_scrollableHostSvc.set(this, void 0);
+        _SkyInfiniteScrollDomAdapterService_windowRef.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyInfiniteScrollDomAdapterService_scrollableHostSvc, scrollableHostSvc, "f");
+        __classPrivateFieldSet(this, _SkyInfiniteScrollDomAdapterService_windowRef, windowRef, "f");
+        __classPrivateFieldSet(this, _SkyInfiniteScrollDomAdapterService_parentChanges, new Subject(), "f");
+        __classPrivateFieldSet(this, _SkyInfiniteScrollDomAdapterService_parentChangesObs, __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_parentChanges, "f").asObservable(), "f");
     }
     ngOnDestroy() {
-        this._parentChanges.complete();
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
+        __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_parentChanges, "f").complete();
+        __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_ngUnsubscribe, "f").complete();
     }
     /**
      * This event is triggered when child nodes are added to the infinite
@@ -303,8 +332,8 @@ class SkyInfiniteScrollDomAdapterService {
      * @param elementRef The infinite scroll element reference.
      */
     parentChanges(elementRef) {
-        this.createObserver(elementRef.nativeElement);
-        return this._parentChanges;
+        __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_instances, "m", _SkyInfiniteScrollDomAdapterService_createObserver).call(this, elementRef);
+        return __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_parentChangesObs, "f");
     }
     /**
      * This event is triggered when the provided element reference
@@ -312,69 +341,50 @@ class SkyInfiniteScrollDomAdapterService {
      * @param elementRef The infinite scroll element reference.
      */
     scrollTo(elementRef) {
-        const parent = this.findScrollableParent(elementRef.nativeElement);
-        return fromEvent(parent, 'scroll').pipe(takeUntil(this.ngUnsubscribe), filter(() => {
-            return this.isElementScrolledInView(elementRef.nativeElement, parent);
+        const parent = __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_scrollableHostSvc, "f").getScrollableHost(elementRef);
+        return fromEvent(parent, 'scroll').pipe(takeUntil(__classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_ngUnsubscribe, "f")), filter(() => {
+            return __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_instances, "m", _SkyInfiniteScrollDomAdapterService_isElementScrolledInView).call(this, elementRef.nativeElement, parent);
         }), map(() => undefined) // Change to void return type
         );
     }
-    createObserver(element) {
-        this.observer = new MutationObserver((mutations) => {
-            const hasUpdates = !!mutations.find((mutation) => {
-                return (!element.contains(mutation.target) && mutation.addedNodes.length > 0);
-            });
-            if (hasUpdates) {
-                this._parentChanges.emit();
-            }
-        });
-        const windowObj = this.windowRef.nativeWindow;
-        const parent = this.findScrollableParent(element);
-        const observedParent = parent === windowObj ? windowObj.document.body : parent;
-        this.observer.observe(observedParent, {
-            childList: true,
-            subtree: true,
+}
+_SkyInfiniteScrollDomAdapterService_ngUnsubscribe = new WeakMap(), _SkyInfiniteScrollDomAdapterService_observer = new WeakMap(), _SkyInfiniteScrollDomAdapterService_parentChanges = new WeakMap(), _SkyInfiniteScrollDomAdapterService_parentChangesObs = new WeakMap(), _SkyInfiniteScrollDomAdapterService_scrollableHostSvc = new WeakMap(), _SkyInfiniteScrollDomAdapterService_windowRef = new WeakMap(), _SkyInfiniteScrollDomAdapterService_instances = new WeakSet(), _SkyInfiniteScrollDomAdapterService_createObserver = function _SkyInfiniteScrollDomAdapterService_createObserver(elementRef) {
+    __classPrivateFieldSet(this, _SkyInfiniteScrollDomAdapterService_observer, new MutationObserver((mutations) => {
+        const hasUpdates = !!mutations.find((mutation) => {
+            return (!elementRef.nativeElement.contains(mutation.target) &&
+                mutation.addedNodes.length > 0);
         });
-    }
-    findScrollableParent(element) {
-        const regex = /(auto|scroll)/;
-        const windowObj = this.windowRef.nativeWindow;
-        const bodyObj = windowObj.document.body;
-        let style = windowObj.getComputedStyle(element);
-        let parent = element;
-        do {
-            parent = parent.parentNode;
-            style = windowObj.getComputedStyle(parent);
-        } while (!regex.test(style.overflow) &&
-            !regex.test(style.overflowY) &&
-            parent.parentNode &&
-            parent !== bodyObj);
-        if (parent === bodyObj) {
-            return windowObj;
-        }
-        return parent;
-    }
-    isElementScrolledInView(element, parentElement) {
-        const windowObj = this.windowRef.nativeWindow;
-        if (parentElement === windowObj) {
-            return (parentElement.pageYOffset + parentElement.innerHeight >
-                element.offsetTop);
+        if (hasUpdates) {
+            __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_parentChanges, "f").next();
         }
-        const elementRect = element.getBoundingClientRect();
-        const parentRect = parentElement.getBoundingClientRect();
-        return elementRect.top < parentRect.top + parentRect.height;
-    }
-}
-SkyInfiniteScrollDomAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyInfiniteScrollDomAdapterService, deps: [{ token: i1$1.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
+    }), "f");
+    const windowObj = __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_windowRef, "f").nativeWindow;
+    const parent = __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_scrollableHostSvc, "f").getScrollableHost(elementRef);
+    const observedParent = parent === windowObj ? windowObj.document.body : parent;
+    __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_observer, "f").observe(observedParent, {
+        childList: true,
+        subtree: true,
+    });
+}, _SkyInfiniteScrollDomAdapterService_isElementScrolledInView = function _SkyInfiniteScrollDomAdapterService_isElementScrolledInView(element, parentElement) {
+    const windowObj = __classPrivateFieldGet(this, _SkyInfiniteScrollDomAdapterService_windowRef, "f").nativeWindow;
+    if (parentElement === windowObj) {
+        return (parentElement.pageYOffset + parentElement.innerHeight >
+            element.offsetTop);
+    }
+    const elementRect = element.getBoundingClientRect();
+    const parentRect = parentElement.getBoundingClientRect();
+    return elementRect.top < parentRect.top + parentRect.height;
+};
+SkyInfiniteScrollDomAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyInfiniteScrollDomAdapterService, deps: [{ token: i1$1.SkyScrollableHostService }, { token: i1$1.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
 SkyInfiniteScrollDomAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyInfiniteScrollDomAdapterService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyInfiniteScrollDomAdapterService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$1.SkyAppWindowRef }]; } });
+        }], ctorParameters: function () { return [{ type: i1$1.SkyScrollableHostService }, { type: i1$1.SkyAppWindowRef }]; } });
 
+var _SkyInfiniteScrollComponent_instances, _SkyInfiniteScrollComponent_changeDetector, _SkyInfiniteScrollComponent_domAdapter, _SkyInfiniteScrollComponent_elementRef, _SkyInfiniteScrollComponent_ngUnsubscribe, _SkyInfiniteScrollComponent__enabled, _SkyInfiniteScrollComponent__loading, _SkyInfiniteScrollComponent_notifyScrollEnd, _SkyInfiniteScrollComponent_setListeners;
 class SkyInfiniteScrollComponent {
     constructor(changeDetector, elementRef, domAdapter) {
-        this.changeDetector = changeDetector;
-        this.elementRef = elementRef;
-        this.domAdapter = domAdapter;
+        _SkyInfiniteScrollComponent_instances.add(this);
         /**
          * Fires when scrolling triggers the need to load more data or when users select the button
          * to load more data. This event only fires when the `enabled` property is set to `true`
@@ -382,7 +392,15 @@ class SkyInfiniteScrollComponent {
          */
         this.scrollEnd = new EventEmitter();
         this.isWaiting = false;
-        this.ngUnsubscribe = new Subject();
+        _SkyInfiniteScrollComponent_changeDetector.set(this, void 0);
+        _SkyInfiniteScrollComponent_domAdapter.set(this, void 0);
+        _SkyInfiniteScrollComponent_elementRef.set(this, void 0);
+        _SkyInfiniteScrollComponent_ngUnsubscribe.set(this, new Subject());
+        _SkyInfiniteScrollComponent__enabled.set(this, false);
+        _SkyInfiniteScrollComponent__loading.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyInfiniteScrollComponent_changeDetector, changeDetector, "f");
+        __classPrivateFieldSet(this, _SkyInfiniteScrollComponent_elementRef, elementRef, "f");
+        __classPrivateFieldSet(this, _SkyInfiniteScrollComponent_domAdapter, domAdapter, "f");
     }
     /**
      * Indicates whether to make the infinite scroll component active when more data is available
@@ -390,12 +408,12 @@ class SkyInfiniteScrollComponent {
      * @default false
      */
     get enabled() {
-        return this._enabled || false;
+        return __classPrivateFieldGet(this, _SkyInfiniteScrollComponent__enabled, "f");
     }
     set enabled(value) {
-        if (this._enabled !== value) {
-            this._enabled = value;
-            this.setListeners();
+        if (__classPrivateFieldGet(this, _SkyInfiniteScrollComponent__enabled, "f") !== value) {
+            __classPrivateFieldSet(this, _SkyInfiniteScrollComponent__enabled, value, "f");
+            __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_instances, "m", _SkyInfiniteScrollComponent_setListeners).call(this);
         }
     }
     /**
@@ -409,54 +427,53 @@ class SkyInfiniteScrollComponent {
      * @required
      */
     get loading() {
-        return this._loading;
+        return __classPrivateFieldGet(this, _SkyInfiniteScrollComponent__loading, "f");
     }
     set loading(value) {
-        this._loading = value;
+        __classPrivateFieldSet(this, _SkyInfiniteScrollComponent__loading, value, "f");
         if (value !== undefined) {
             this.isWaiting = value;
         }
     }
     ngOnDestroy() {
         this.enabled = false;
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
+        __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_ngUnsubscribe, "f").next();
+        __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_ngUnsubscribe, "f").complete();
     }
     startInfiniteScrollLoad() {
-        this.notifyScrollEnd();
+        __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_instances, "m", _SkyInfiniteScrollComponent_notifyScrollEnd).call(this);
     }
-    notifyScrollEnd() {
-        this.isWaiting = true;
-        this.scrollEnd.emit();
-        this.changeDetector.markForCheck();
+}
+_SkyInfiniteScrollComponent_changeDetector = new WeakMap(), _SkyInfiniteScrollComponent_domAdapter = new WeakMap(), _SkyInfiniteScrollComponent_elementRef = new WeakMap(), _SkyInfiniteScrollComponent_ngUnsubscribe = new WeakMap(), _SkyInfiniteScrollComponent__enabled = new WeakMap(), _SkyInfiniteScrollComponent__loading = new WeakMap(), _SkyInfiniteScrollComponent_instances = new WeakSet(), _SkyInfiniteScrollComponent_notifyScrollEnd = function _SkyInfiniteScrollComponent_notifyScrollEnd() {
+    this.isWaiting = true;
+    this.scrollEnd.emit();
+    __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_changeDetector, "f").markForCheck();
+}, _SkyInfiniteScrollComponent_setListeners = function _SkyInfiniteScrollComponent_setListeners() {
+    if (this.enabled) {
+        // The user has scrolled to the infinite scroll element.
+        __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_domAdapter, "f")
+            .scrollTo(__classPrivateFieldGet(this, _SkyInfiniteScrollComponent_elementRef, "f"))
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyInfiniteScrollComponent_ngUnsubscribe, "f")))
+            .subscribe(() => {
+            if (!this.isWaiting && this.enabled) {
+                __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_instances, "m", _SkyInfiniteScrollComponent_notifyScrollEnd).call(this);
+            }
+        });
+        // New items have been loaded into the parent element.
+        __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_domAdapter, "f")
+            .parentChanges(__classPrivateFieldGet(this, _SkyInfiniteScrollComponent_elementRef, "f"))
+            .pipe(takeUntil(__classPrivateFieldGet(this, _SkyInfiniteScrollComponent_ngUnsubscribe, "f")))
+            .subscribe(() => {
+            if (!this.loading) {
+                this.isWaiting = false;
+                __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_changeDetector, "f").markForCheck();
+            }
+        });
     }
-    setListeners() {
-        if (this.enabled) {
-            // The user has scrolled to the infinite scroll element.
-            this.domAdapter
-                .scrollTo(this.elementRef)
-                .pipe(takeUntil(this.ngUnsubscribe))
-                .subscribe(() => {
-                if (!this.isWaiting && this.enabled) {
-                    this.notifyScrollEnd();
-                }
-            });
-            // New items have been loaded into the parent element.
-            this.domAdapter
-                .parentChanges(this.elementRef)
-                .pipe(takeUntil(this.ngUnsubscribe))
-                .subscribe(() => {
-                if (!this.loading) {
-                    this.isWaiting = false;
-                    this.changeDetector.markForCheck();
-                }
-            });
-        }
-        else {
-            this.ngUnsubscribe.next();
-        }
+    else {
+        __classPrivateFieldGet(this, _SkyInfiniteScrollComponent_ngUnsubscribe, "f").next();
     }
-}
+};
 SkyInfiniteScrollComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyInfiniteScrollComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: SkyInfiniteScrollDomAdapterService }], target: i0.ɵɵFactoryTarget.Component });
 SkyInfiniteScrollComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: SkyInfiniteScrollComponent, selector: "sky-infinite-scroll", inputs: { enabled: "enabled", loading: "loading" }, outputs: { scrollEnd: "scrollEnd" }, providers: [SkyInfiniteScrollDomAdapterService], ngImport: i0, template: "<div *ngIf=\"enabled\" class=\"sky-infinite-scroll\">\n  <button\n    *ngIf=\"!isWaiting && enabled\"\n    class=\"sky-btn sky-btn-default sky-infinite-scroll-load-more-button\"\n    type=\"button\"\n    (click)=\"startInfiniteScrollLoad()\"\n  >\n    {{ 'skyux_infinite_scroll_load_more_button' | skyLibResources }}\n  </button>\n  <sky-wait [isWaiting]=\"isWaiting\"> </sky-wait>\n</div>\n", styles: [".sky-infinite-scroll{margin-top:20px;text-align:center;min-height:75px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyInfiniteScrollComponent, decorators: [{
@@ -484,8 +501,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
                 }]
         }] });
 
+var _SkyPagingComponent_instances, _SkyPagingComponent_getDisplayedPageNumbers, _SkyPagingComponent_setPageCount, _SkyPagingComponent_setDisplayedPages;
 class SkyPagingComponent {
     constructor() {
+        _SkyPagingComponent_instances.add(this);
         /**
          * Specifies the page number of the current page. Page numbers start at 1 and increment.
          */
@@ -514,7 +533,7 @@ class SkyPagingComponent {
     }
     setPage(pageNumber) {
         const previousPage = this.currentPage;
-        this.setPageCount();
+        __classPrivateFieldGet(this, _SkyPagingComponent_instances, "m", _SkyPagingComponent_setPageCount).call(this);
         if (pageNumber < 1 || this.pageCount < 1) {
             this.currentPage = 1;
         }
@@ -524,7 +543,7 @@ class SkyPagingComponent {
         else {
             this.currentPage = pageNumber;
         }
-        this.setDisplayedPages();
+        __classPrivateFieldGet(this, _SkyPagingComponent_instances, "m", _SkyPagingComponent_setDisplayedPages).call(this);
         if (previousPage !== this.currentPage) {
             this.currentPageChange.emit(this.currentPage);
         }
@@ -541,46 +560,44 @@ class SkyPagingComponent {
     get isNextButtonDisabled() {
         return this.currentPage === this.pageCount;
     }
-    getDisplayedPageNumbers(pageCount, maxDisplayedPages, pageNumber) {
-        const pageIndex = pageNumber - 1;
-        const pageBounds = Math.floor(maxDisplayedPages / 2);
-        let upperBound = pageIndex + pageBounds;
-        let lowerBound = pageIndex - pageBounds;
-        if (maxDisplayedPages % 2 !== 0) {
-            upperBound += 1;
-        }
-        // Wrap negative values to increase the upperbound
-        if (lowerBound < 0) {
-            upperBound -= lowerBound;
-            lowerBound = 0;
-        }
-        // Wrap overflow to decrease the lowerbound
-        if (upperBound > pageCount) {
-            lowerBound -= upperBound - pageCount;
-            upperBound = pageCount;
-        }
-        // If both are the same ignore everything else and just display it all
-        if (pageCount < maxDisplayedPages) {
-            lowerBound = 0;
-            upperBound = pageCount;
-        }
-        const displayedPageNumbers = [];
-        for (let i = lowerBound; i < upperBound; i++) {
-            displayedPageNumbers.push(i + 1);
-        }
-        return displayedPageNumbers;
-    }
-    setPageCount() {
-        if (this.itemCount === 0 || this.pageSize === 0) {
-            this.pageCount = 0;
-            return;
-        }
-        this.pageCount = Math.ceil(this.itemCount / this.pageSize);
-    }
-    setDisplayedPages() {
-        this.displayedPages = this.getDisplayedPageNumbers(this.pageCount, this.maxPages, this.currentPage);
-    }
 }
+_SkyPagingComponent_instances = new WeakSet(), _SkyPagingComponent_getDisplayedPageNumbers = function _SkyPagingComponent_getDisplayedPageNumbers(pageCount, maxDisplayedPages, pageNumber) {
+    const pageIndex = pageNumber - 1;
+    const pageBounds = Math.floor(maxDisplayedPages / 2);
+    let upperBound = pageIndex + pageBounds;
+    let lowerBound = pageIndex - pageBounds;
+    if (maxDisplayedPages % 2 !== 0) {
+        upperBound += 1;
+    }
+    // Wrap negative values to increase the upperbound
+    if (lowerBound < 0) {
+        upperBound -= lowerBound;
+        lowerBound = 0;
+    }
+    // Wrap overflow to decrease the lowerbound
+    if (upperBound > pageCount) {
+        lowerBound -= upperBound - pageCount;
+        upperBound = pageCount;
+    }
+    // If both are the same ignore everything else and just display it all
+    if (pageCount < maxDisplayedPages) {
+        lowerBound = 0;
+        upperBound = pageCount;
+    }
+    const displayedPageNumbers = [];
+    for (let i = lowerBound; i < upperBound; i++) {
+        displayedPageNumbers.push(i + 1);
+    }
+    return displayedPageNumbers;
+}, _SkyPagingComponent_setPageCount = function _SkyPagingComponent_setPageCount() {
+    if (this.itemCount === 0 || this.pageSize === 0) {
+        this.pageCount = 0;
+        return;
+    }
+    this.pageCount = Math.ceil(this.itemCount / this.pageSize);
+}, _SkyPagingComponent_setDisplayedPages = function _SkyPagingComponent_setDisplayedPages() {
+    this.displayedPages = __classPrivateFieldGet(this, _SkyPagingComponent_instances, "m", _SkyPagingComponent_getDisplayedPageNumbers).call(this, this.pageCount, this.maxPages, this.currentPage);
+};
 SkyPagingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyPagingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 SkyPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: SkyPagingComponent, selector: "sky-paging", inputs: { currentPage: "currentPage", itemCount: "itemCount", maxPages: "maxPages", pageSize: "pageSize", pagingLabel: "pagingLabel" }, outputs: { currentPageChange: "currentPageChange" }, usesOnChanges: true, ngImport: i0, template: "<nav\n  *ngIf=\"pageCount > 1\"\n  class=\"sky-paging\"\n  [attr.aria-label]=\"pagingLabel || ('skyux_paging_label' | skyLibResources)\"\n>\n  <ul>\n    <li>\n      <button\n        class=\"sky-btn sky-btn-default sky-paging-btn sky-paging-btn-previous sky-box\"\n        sky-cmp-id=\"previous\"\n        type=\"button\"\n        [attr.aria-label]=\"'skyux_paging_previous' | skyLibResources\"\n        [disabled]=\"isPreviousButtonDisabled\"\n        (click)=\"previousPage()\"\n      >\n        <sky-icon *skyThemeIf=\"'default'\" icon=\"caret-left\"></sky-icon>\n        <sky-icon\n          *skyThemeIf=\"'modern'\"\n          icon=\"chevron-left\"\n          iconType=\"skyux\"\n        ></sky-icon>\n      </button>\n    </li>\n    <li *ngFor=\"let pageNumber of displayedPages\" class=\"sky-list-paging-link\">\n      <button\n        class=\"sky-btn sky-btn-default sky-paging-btn sky-box\"\n        type=\"button\"\n        [attr.aria-current]=\"currentPage === pageNumber ? 'page' : null\"\n        [attr.sky-cmp-id]=\"pageNumber\"\n        [attr.aria-label]=\"\n          'skyux_paging_page_link_aria_label' | skyLibResources: pageNumber\n        \"\n        [disabled]=\"currentPage === pageNumber\"\n        [ngClass]=\"{ 'sky-paging-current': currentPage === pageNumber }\"\n        (click)=\"setPage(pageNumber)\"\n      >\n        {{ pageNumber }}\n      </button>\n    </li>\n    <li>\n      <button\n        class=\"sky-btn sky-btn-default sky-paging-btn sky-paging-btn-next sky-box\"\n        sky-cmp-id=\"next\"\n        type=\"button\"\n        [attr.aria-label]=\"'skyux_paging_next' | skyLibResources\"\n        [disabled]=\"isNextButtonDisabled\"\n        (click)=\"nextPage()\"\n      >\n        <sky-icon *skyThemeIf=\"'default'\" icon=\"caret-right\"></sky-icon>\n        <sky-icon\n          *skyThemeIf=\"'modern'\"\n          icon=\"chevron-right\"\n          iconType=\"skyux\"\n        ></sky-icon>\n      </button>\n    </li>\n  </ul>\n</nav>\n", styles: [":host{display:block}ul{margin:15px 0 0;display:inline-block;padding-left:0;border-radius:4px}li{display:inline}.sky-paging-btn{border-top:1px solid #e2e3e4;border-right:1px solid #e2e3e4;border-bottom:1px solid #e2e3e4;border-left:1px solid #e2e3e4;border-radius:0;background-color:#fff;color:inherit;float:left;margin-left:-1px;padding:4px 10px;text-decoration:none;line-height:1.428571429;font-size:15px;cursor:pointer}.sky-paging-btn.sky-paging-caret{transform:none}.sky-paging-btn.sky-paging-current,.sky-paging-btn.sky-paging-current:disabled,.sky-paging-btn.sky-paging-current[disabled]{background-color:#eeeeef;cursor:default;color:inherit;opacity:1}.sky-paging-btn:hover{background-color:#d4d4d6}.sky-paging-btn:disabled{color:#686c73;cursor:not-allowed;pointer-events:none}.sky-paging-btn.sky-paging-btn-previous,.sky-paging-btn.sky-paging-btn-next{padding-left:8.5px;padding-right:8.5px}:host-context(.sky-theme-modern) .sky-paging-btn{background-color:transparent;border:none;box-shadow:none;border-radius:6px;margin-right:10px;padding:3px 10px}:host-context(.sky-theme-modern) .sky-paging-btn:hover{background-color:transparent;border:solid 1px #1870B8;padding:2px 9px;z-index:1}:host-context(.sky-theme-modern) .sky-paging-btn:active,:host-context(.sky-theme-modern) .sky-paging-btn:focus{border:solid 2px #1870B8;color:#212327;padding:1px 8px}:host-context(.sky-theme-modern) .sky-paging-btn:focus:not(:active){outline:none;box-shadow:0 1px 3px #0000004d}:host-context(.sky-theme-modern) .sky-paging-current{background-color:#c1e8fb;border:solid 1px #1870B8;padding:2px 9px}.sky-theme-modern .sky-paging-btn{background-color:transparent;border:none;box-shadow:none;border-radius:6px;margin-right:10px;padding:3px 10px}.sky-theme-modern .sky-paging-btn:hover{background-color:transparent;border:solid 1px #1870B8;padding:2px 9px;z-index:1}.sky-theme-modern .sky-paging-btn:active,.sky-theme-modern .sky-paging-btn:focus{border:solid 2px #1870B8;color:#212327;padding:1px 8px}.sky-theme-modern .sky-paging-btn:focus:not(:active){outline:none;box-shadow:0 1px 3px #0000004d}.sky-theme-modern .sky-paging-current{background-color:#c1e8fb;border:solid 1px #1870B8;padding:2px 9px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-btn:active,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-btn:focus{color:#fbfcfe}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-current{background-color:#1870b8}.sky-theme-modern.sky-theme-mode-dark .sky-paging-btn:active,.sky-theme-modern.sky-theme-mode-dark .sky-paging-btn:focus{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-paging-current{background-color:#1870b8}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i3.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkyPagingComponent, decorators: [{