@skyux/modals 5.0.0-beta.2 → 5.0.0-beta.6

package/bundles/skyux-modals.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@skyux/i18n'), require('@skyux/theme'), require('@angular/router'), require('@skyux/indicators'), require('@skyux/core'), require('rxjs/operators'), require('rxjs'), require('@angular/animations')) :
-    typeof define === 'function' && define.amd ? define('@skyux/modals', ['exports', '@angular/core', '@angular/common', '@skyux/i18n', '@skyux/theme', '@angular/router', '@skyux/indicators', '@skyux/core', 'rxjs/operators', 'rxjs', '@angular/animations'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.skyux = global.skyux || {}, global.skyux.modals = {}), global.ng.core, global.ng.common, global.i18n, global.theme, global.ng.router, global.indicators, global.i1, global.rxjs.operators, global.rxjs, global.ng.animations));
-}(this, (function (exports, i0, common, i18n, theme, router, indicators, i1, operators, rxjs, animations) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@skyux/theme'), require('@angular/router'), require('@skyux/indicators'), require('@skyux/i18n'), require('rxjs/operators'), require('@skyux/core'), require('rxjs'), require('@angular/animations')) :
+    typeof define === 'function' && define.amd ? define('@skyux/modals', ['exports', '@angular/core', '@angular/common', '@skyux/theme', '@angular/router', '@skyux/indicators', '@skyux/i18n', 'rxjs/operators', '@skyux/core', 'rxjs', '@angular/animations'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.skyux = global.skyux || {}, global.skyux.modals = {}), global.ng.core, global.ng.common, global.i1, global.ng.router, global.i5, global.i3, global.rxjs.operators, global.i3$1, global.rxjs, global.ng.animations));
+}(this, (function (exports, i0, i6, i1, i2, i5, i3, operators, i3$1, rxjs, animations) { 'use strict';
 
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -25,7 +25,12 @@
     }
 
     var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
+    var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
     var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
+    var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
+    var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
+    var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3);
+    var i3__namespace = /*#__PURE__*/_interopNamespace(i3$1);
 
     var SkyConfirmInstance = /** @class */ (function () {
         function SkyConfirmInstance() {
@@ -71,25 +76,6 @@
         SkyConfirmType[SkyConfirmType["YesNoCancel"] = 3] = "YesNoCancel";
     })(exports.SkyConfirmType || (exports.SkyConfirmType = {}));
 
-    /**
-     * @internal
-     * @deprecated This module can be removed after we upgrade SKY UX development dependencies to version 5.
-     */
-    var SkyModalForRootCompatModule = /** @class */ (function () {
-        function SkyModalForRootCompatModule() {
-        }
-        return SkyModalForRootCompatModule;
-    }());
-    SkyModalForRootCompatModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    providers: [
-                        i1.MutationObserverService,
-                        i1.SkyAppWindowRef,
-                        i1.SkyDynamicComponentService
-                    ]
-                },] }
-    ];
-
     /**
      * NOTICE: DO NOT MODIFY THIS FILE!
      * The contents of this file were automatically generated by
@@ -103,7 +89,7 @@
         function SkyModalsResourcesProvider() {
         }
         SkyModalsResourcesProvider.prototype.getString = function (localeInfo, name) {
-            return i18n.getLibStringForLocale(RESOURCES, localeInfo.locale, name);
+            return i3.getLibStringForLocale(RESOURCES, localeInfo.locale, name);
         };
         return SkyModalsResourcesProvider;
     }());
@@ -115,16 +101,24 @@
         }
         return SkyModalsResourcesModule;
     }());
-    SkyModalsResourcesModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    exports: [i18n.SkyI18nModule],
-                    providers: [{
-                            provide: i18n.SKY_LIB_RESOURCES_PROVIDERS,
-                            useClass: SkyModalsResourcesProvider,
-                            multi: true
-                        }]
-                },] }
-    ];
+    SkyModalsResourcesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalsResourcesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    SkyModalsResourcesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalsResourcesModule, exports: [i3.SkyI18nModule] });
+    SkyModalsResourcesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalsResourcesModule, providers: [{
+                provide: i3.SKY_LIB_RESOURCES_PROVIDERS,
+                useClass: SkyModalsResourcesProvider,
+                multi: true
+            }], imports: [i3.SkyI18nModule] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalsResourcesModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        exports: [i3.SkyI18nModule],
+                        providers: [{
+                                provide: i3.SKY_LIB_RESOURCES_PROVIDERS,
+                                useClass: SkyModalsResourcesProvider,
+                                multi: true
+                            }]
+                    }]
+            }] });
 
     /**
      * Specifies content to display in the modal's body.
@@ -134,14 +128,17 @@
         }
         return SkyModalContentComponent;
     }());
-    SkyModalContentComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'sky-modal-content',
-                    template: "<ng-content></ng-content>\n",
-                    encapsulation: i0.ViewEncapsulation.None,
-                    styles: ["sky-modal-content{display:block;min-height:100%}.sky-theme-modern sky-modal-content{padding:10px 30px 30px}\n"]
-                },] }
-    ];
+    SkyModalContentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalContentComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    SkyModalContentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: SkyModalContentComponent, selector: "sky-modal-content", ngImport: i0__namespace, template: "<ng-content></ng-content>\n", styles: ["sky-modal-content{display:block;min-height:100%}.sky-theme-modern sky-modal-content{padding:10px 30px 30px}\n"], encapsulation: i0__namespace.ViewEncapsulation.None });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalContentComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'sky-modal-content',
+                        templateUrl: './modal-content.component.html',
+                        styleUrls: ['./modal-content.component.scss'],
+                        encapsulation: i0.ViewEncapsulation.None
+                    }]
+            }] });
 
     /**
      * Specifies content to display in the modal's footer.
@@ -151,13 +148,16 @@
         }
         return SkyModalFooterComponent;
     }());
-    SkyModalFooterComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'sky-modal-footer',
-                    template: "<div class=\"sky-modal-footer-container sky-padding-even-large\">\n  <ng-content></ng-content>\n</div>\n",
-                    styles: [".sky-modal-footer-container{background-color:#fff;border-top:1px solid #e2e3e4}.sky-modal-footer-container ::ng-deep .sky-btn-link:first-child{margin-left:-12px}.sky-theme-modern .sky-modal-footer-container,:host-context(.sky-theme-modern) .sky-modal-footer-container{border-top:none;padding:20px 30px}.sky-theme-modern.sky-theme-mode-dark .sky-modal-footer-container,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-footer-container{background-color:transparent}\n"]
-                },] }
-    ];
+    SkyModalFooterComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalFooterComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    SkyModalFooterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: SkyModalFooterComponent, selector: "sky-modal-footer", ngImport: i0__namespace, template: "<div class=\"sky-modal-footer-container sky-padding-even-large\">\n  <ng-content></ng-content>\n</div>\n", styles: [".sky-modal-footer-container{background-color:#fff;border-top:1px solid #e2e3e4}.sky-modal-footer-container ::ng-deep .sky-btn-link:first-child{margin-left:-12px}:host-context(.sky-theme-modern) .sky-modal-footer-container{border-top:none;padding:20px 30px}.sky-theme-modern .sky-modal-footer-container{border-top:none;padding:20px 30px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-footer-container{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-modal-footer-container{background-color:transparent}\n"] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalFooterComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'sky-modal-footer',
+                        templateUrl: './modal-footer.component.html',
+                        styleUrls: ['./modal-footer.component.scss']
+                    }]
+            }] });
 
     /**
      * Specifies a header for the modal.
@@ -167,13 +167,18 @@
         }
         return SkyModalHeaderComponent;
     }());
-    SkyModalHeaderComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'sky-modal-header',
-                    template: "<h1\n  class=\"sky-emphasized\"\n  [skyThemeClass]=\"{\n    'sky-font-display-3': 'modern'\n  }\"\n>\n  <ng-content></ng-content>\n</h1>\n",
-                    styles: ["h1{margin:0;line-height:1.2}.sky-theme-modern.sky-theme-mode-dark h1,:host-context(.sky-theme-modern.sky-theme-mode-dark) h1{color:#fbfcfe}\n"]
-                },] }
-    ];
+    SkyModalHeaderComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalHeaderComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    SkyModalHeaderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: SkyModalHeaderComponent, selector: "sky-modal-header", ngImport: i0__namespace, template: "<h1\n  class=\"sky-emphasized\"\n  [skyThemeClass]=\"{\n    'sky-font-display-3': 'modern'\n  }\"\n>\n  <ng-content></ng-content>\n</h1>\n", styles: ["h1{margin:0;line-height:1.2}:host-context(.sky-theme-modern.sky-theme-mode-dark) h1{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark h1{color:#fbfcfe}\n"], directives: [{ type: i1__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalHeaderComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'sky-modal-header',
+                        templateUrl: './modal-header.component.html',
+                        styleUrls: [
+                            './modal-header.component.scss'
+                        ]
+                    }]
+            }] });
 
     /**
      * @internal
@@ -213,12 +218,11 @@
     }());
     SkyModalAdapterService.MODAL_BODY_FULL_CLASS = 'sky-modal-body-full-page';
     SkyModalAdapterService.MODAL_BODY_CLASS = 'sky-modal-body-open';
-    SkyModalAdapterService.decorators = [
-        { type: i0.Injectable }
-    ];
-    SkyModalAdapterService.ctorParameters = function () { return [
-        { type: i1.SkyAppWindowRef }
-    ]; };
+    SkyModalAdapterService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalAdapterService, deps: [{ token: i3__namespace.SkyAppWindowRef }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    SkyModalAdapterService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalAdapterService });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalAdapterService, decorators: [{
+                type: i0.Injectable
+            }], ctorParameters: function () { return [{ type: i3__namespace.SkyAppWindowRef }]; } });
 
     /**
      * @internal
@@ -284,13 +288,14 @@
         return SkyModalHostService;
     }());
     SkyModalHostService.modalHosts = [];
-    SkyModalHostService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function SkyModalHostService_Factory() { return new SkyModalHostService(); }, token: SkyModalHostService, providedIn: "root" });
-    SkyModalHostService.decorators = [
-        { type: i0.Injectable, args: [{
-                    providedIn: 'root'
-                },] }
-    ];
-    SkyModalHostService.ctorParameters = function () { return []; };
+    SkyModalHostService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalHostService, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    SkyModalHostService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalHostService, providedIn: 'root' });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalHostService, decorators: [{
+                type: i0.Injectable,
+                args: [{
+                        providedIn: 'root'
+                    }]
+            }], ctorParameters: function () { return []; } });
 
     /**
      * @internal
@@ -302,10 +307,14 @@
         }
         return SkyModalConfiguration;
     }());
-    SkyModalConfiguration.decorators = [
-        { type: i0.Injectable }
-    ];
-    SkyModalConfiguration.ctorParameters = function () { return []; };
+    SkyModalConfiguration.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalConfiguration, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    SkyModalConfiguration.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalConfiguration, providedIn: 'any' });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalConfiguration, decorators: [{
+                type: i0.Injectable,
+                args: [{
+                        providedIn: 'any'
+                    }]
+            }], ctorParameters: function () { return []; } });
 
     /**
      * @internal
@@ -378,7 +387,7 @@
                 .pipe(operators.takeWhile(function () { return isOpen; }))
                 .subscribe(function (event) {
                 /* istanbul ignore else */
-                if (event instanceof router.NavigationStart) {
+                if (event instanceof i2.NavigationStart) {
                     modalInstance.close();
                 }
             });
@@ -391,27 +400,23 @@
         };
         return SkyModalHostComponent;
     }());
-    SkyModalHostComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'sky-modal-host',
-                    template: "<div\n    class=\"sky-modal-host-backdrop\"\n    [hidden]=\"!modalOpen\"\n    [ngStyle]=\"{\n      zIndex: backdropZIndex\n    }\"\n>\n</div>\n<div #target></div>\n",
-                    viewProviders: [SkyModalAdapterService],
-                    styles: [".sky-modal-host-backdrop{background-color:#00000080;position:fixed;top:0;left:0;bottom:0;right:0}\n"]
-                },] }
-    ];
-    SkyModalHostComponent.ctorParameters = function () { return [
-        { type: i0.ComponentFactoryResolver },
-        { type: SkyModalAdapterService },
-        { type: i0.Injector },
-        { type: router.Router },
-        { type: i0.ChangeDetectorRef }
-    ]; };
-    SkyModalHostComponent.propDecorators = {
-        target: [{ type: i0.ViewChild, args: ['target', {
-                        read: i0.ViewContainerRef,
-                        static: true
-                    },] }]
-    };
+    SkyModalHostComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalHostComponent, deps: [{ token: i0__namespace.ComponentFactoryResolver }, { token: SkyModalAdapterService }, { token: i0__namespace.Injector }, { token: i2__namespace.Router }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    SkyModalHostComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: SkyModalHostComponent, selector: "sky-modal-host", viewQueries: [{ propertyName: "target", first: true, predicate: ["target"], descendants: true, read: i0.ViewContainerRef, static: true }], ngImport: i0__namespace, template: "<div\n    class=\"sky-modal-host-backdrop\"\n    [hidden]=\"!modalOpen\"\n    [ngStyle]=\"{\n      zIndex: backdropZIndex\n    }\"\n>\n</div>\n<div #target></div>\n", styles: [".sky-modal-host-backdrop{background-color:#00000080;position:fixed;top:0;left:0;bottom:0;right:0}\n"], directives: [{ type: i6__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], viewProviders: [SkyModalAdapterService] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalHostComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'sky-modal-host',
+                        templateUrl: './modal-host.component.html',
+                        styleUrls: ['./modal-host.component.scss'],
+                        viewProviders: [SkyModalAdapterService]
+                    }]
+            }], ctorParameters: function () { return [{ type: i0__namespace.ComponentFactoryResolver }, { type: SkyModalAdapterService }, { type: i0__namespace.Injector }, { type: i2__namespace.Router }, { type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { target: [{
+                    type: i0.ViewChild,
+                    args: ['target', {
+                            read: i0.ViewContainerRef,
+                            static: true
+                        }]
+                }] } });
 
     /**
      * Raises an event when the box shadow for the modal header or footer should be adjusted
@@ -440,7 +445,7 @@
                     .pipe(operators.takeUntil(this.ngUnsubscribe))
                     .subscribe(function (themeSettings) {
                     _this.currentTheme = themeSettings.currentSettings.theme;
-                    if (_this.currentTheme === theme.SkyTheme.presets.modern) {
+                    if (_this.currentTheme === i1.SkyTheme.presets.modern) {
                         _this.initMutationObserver();
                     }
                     else {
@@ -485,7 +490,7 @@
             }
         };
         SkyModalScrollShadowDirective.prototype.checkForShadow = function () {
-            if (this.currentTheme === theme.SkyTheme.presets.modern) {
+            if (this.currentTheme === i1.SkyTheme.presets.modern) {
                 var el = this.elRef.nativeElement;
                 var topShadow = this.buildShadowStyle(el.scrollTop);
                 var bottomShadow = this.buildShadowStyle((el.scrollHeight - el.scrollTop) - el.clientHeight);
@@ -513,33 +518,33 @@
         };
         return SkyModalScrollShadowDirective;
     }());
-    SkyModalScrollShadowDirective.decorators = [
-        { type: i0.Directive, args: [{
-                    selector: '[skyModalScrollShadow]'
-                },] }
-    ];
-    SkyModalScrollShadowDirective.ctorParameters = function () { return [
-        { type: i0.ElementRef },
-        { type: theme.SkyThemeService, decorators: [{ type: i0.Optional }] },
-        { type: i1.MutationObserverService },
-        { type: i0.NgZone }
-    ]; };
-    SkyModalScrollShadowDirective.propDecorators = {
-        skyModalScrollShadow: [{ type: i0.Output }],
-        windowResize: [{ type: i0.HostListener, args: ['window:resize',] }],
-        scroll: [{ type: i0.HostListener, args: ['scroll',] }]
-    };
+    SkyModalScrollShadowDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalScrollShadowDirective, deps: [{ token: i0__namespace.ElementRef }, { token: i1__namespace.SkyThemeService, optional: true }, { token: i3__namespace.MutationObserverService }, { token: i0__namespace.NgZone }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    SkyModalScrollShadowDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.6", type: SkyModalScrollShadowDirective, selector: "[skyModalScrollShadow]", outputs: { skyModalScrollShadow: "skyModalScrollShadow" }, host: { listeners: { "window:resize": "windowResize()", "scroll": "scroll()" } }, ngImport: i0__namespace });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalScrollShadowDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: '[skyModalScrollShadow]'
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i0__namespace.ElementRef }, { type: i1__namespace.SkyThemeService, decorators: [{
+                            type: i0.Optional
+                        }] }, { type: i3__namespace.MutationObserverService }, { type: i0__namespace.NgZone }];
+        }, propDecorators: { skyModalScrollShadow: [{
+                    type: i0.Output
+                }], windowResize: [{
+                    type: i0.HostListener,
+                    args: ['window:resize']
+                }], scroll: [{
+                    type: i0.HostListener,
+                    args: ['scroll']
+                }] } });
 
-    /* tslint:disable */
-    var tabbableSelector = 'a[href], area[href], input:not([disabled]):not([tabindex=\'-1\']), ' +
-        'button:not([disabled]):not([tabindex=\'-1\']),select:not([disabled]):not([tabindex=\'-1\']), textarea:not([disabled]):not([tabindex=\'-1\']), ' +
-        'iframe, object, embed, *[tabindex]:not([tabindex=\'-1\']), *[contenteditable=true]';
-    /* tslint:enable */
     /**
      * @internal
      */
     var SkyModalComponentAdapterService = /** @class */ (function () {
-        function SkyModalComponentAdapterService() {
+        function SkyModalComponentAdapterService(coreAdapter) {
+            this.coreAdapter = coreAdapter;
         }
         SkyModalComponentAdapterService.prototype.handleWindowChange = function (modalEl) {
             var boundedHeightEl = modalEl.nativeElement.querySelector('.sky-modal');
@@ -562,9 +567,6 @@
                 modalContentEl.style.maxHeight = contentHeight.toString() + 'px';
             }
         };
-        SkyModalComponentAdapterService.prototype.loadFocusElementList = function (modalEl) {
-            return this.loadFocusableChildren(modalEl.nativeElement);
-        };
         SkyModalComponentAdapterService.prototype.isFocusInFirstItem = function (event, list) {
             /* istanbul ignore next */
             /* sanity check */
@@ -609,36 +611,11 @@
                     inputWithAutofocus.focus();
                 }
                 else {
-                    var focusEl = modalEl.nativeElement.querySelector('.sky-modal-content');
-                    var focusableChildren = this.loadFocusableChildren(focusEl);
-                    // Focus first focusable child if available. Otherwise focus content pane.
-                    if (!this.focusFirstElement(focusableChildren)) {
-                        focusEl.focus();
-                    }
+                    this.coreAdapter.getFocusableChildrenAndApplyFocus(modalEl, '.sky-modal-content', true);
                 }
                 window.scrollTo(currentScrollX, currentScrollY);
             }
         };
-        SkyModalComponentAdapterService.prototype.loadFocusableChildren = function (elem) {
-            var _this = this;
-            var elements = Array.prototype.slice.call(elem.querySelectorAll(tabbableSelector));
-            return elements.filter(function (element) {
-                return _this.isVisible(element);
-            });
-        };
-        SkyModalComponentAdapterService.prototype.isVisible = function (element) {
-            var style = window.getComputedStyle(element);
-            var isHidden = style.display === 'none' || style.visibility === 'hidden';
-            if (isHidden) {
-                return false;
-            }
-            var hasBounds = !!(element.offsetWidth ||
-                /* istanbul ignore next */
-                element.offsetHeight ||
-                /* istanbul ignore next */
-                element.getClientRects().length);
-            return hasBounds;
-        };
         SkyModalComponentAdapterService.prototype.setFullPageHeight = function (fullPageModalEl) {
             var windowHeight = window.innerHeight;
             var fullPageModalStyle = getComputedStyle(fullPageModalEl);
@@ -650,10 +627,11 @@
         };
         return SkyModalComponentAdapterService;
     }());
-    SkyModalComponentAdapterService.decorators = [
-        { type: i0.Injectable }
-    ];
-    SkyModalComponentAdapterService.ctorParameters = function () { return []; };
+    SkyModalComponentAdapterService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalComponentAdapterService, deps: [{ token: i3__namespace.SkyCoreAdapterService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    SkyModalComponentAdapterService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalComponentAdapterService });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalComponentAdapterService, decorators: [{
+                type: i0.Injectable
+            }], ctorParameters: function () { return [{ type: i3__namespace.SkyCoreAdapterService }]; } });
 
     var skyAnimationModalState = animations.trigger('modalState', [
         animations.state('in', animations.style({ opacity: '1.0' })),
@@ -675,12 +653,14 @@
      * [write unit tests for modals](https://developer.blackbaud.com/skyux/learn/get-started/advanced/unit-test-modals).
      */
     var SkyModalComponent = /** @class */ (function () {
-        function SkyModalComponent(hostService, config, elRef, windowRef, componentAdapter) {
+        function SkyModalComponent(hostService, config, elRef, windowRef, componentAdapter, coreAdapter, dockService) {
             this.hostService = hostService;
             this.config = config;
             this.elRef = elRef;
             this.windowRef = windowRef;
             this.componentAdapter = componentAdapter;
+            this.coreAdapter = coreAdapter;
+            this.dockService = dockService;
             this.modalState = 'in';
             this.modalContentId = 'sky-modal-content-id-' + skyModalUniqueIdentifier.toString();
             this.modalHeaderId = 'sky-modal-header-id-' + skyModalUniqueIdentifier.toString();
@@ -792,7 +772,7 @@
                 if (topModal && topModal === this.hostService) {
                     if (event.which === 9) { // Tab pressed
                         var focusChanged = false;
-                        var focusElementList = this.componentAdapter.loadFocusElementList(this.elRef);
+                        var focusElementList = this.coreAdapter.getFocusableChildren(this.elRef.nativeElement);
                         if (event.shiftKey &&
                             (this.componentAdapter.isFocusInFirstItem(event, focusElementList) ||
                                 this.componentAdapter.isModalFocused(event, this.elRef))) {
@@ -818,6 +798,11 @@
             this.windowRef.nativeWindow.setTimeout(function () {
                 _this.componentAdapter.modalOpened(_this.elRef);
             });
+            this.dockService.setDockOptions({
+                location: i3$1.SkyDockLocation.ElementBottom,
+                referenceEl: this.modalContentWrapperElement.nativeElement,
+                zIndex: 5
+            });
         };
         SkyModalComponent.prototype.helpButtonClick = function () {
             this.hostService.onOpenHelp(this.helpKey);
@@ -836,68 +821,101 @@
         };
         return SkyModalComponent;
     }());
-    SkyModalComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'sky-modal',
-                    template: "<!--\n  Animations are broken in Chrome v52. Angular 2 RC5 will fix it.\n  https://github.com/angular/angular/issues/10245\n-->\n<!--<div @modalState=\"modalState\">-->\n\n<div\n  class=\"sky-modal-dialog\"\n  aria-modal=\"true\"\n  [attr.aria-describedby]=\"ariaDescribedBy\"\n  [attr.aria-labelledby]=\"ariaLabelledBy\"\n  [attr.role]=\"ariaRole\"\n  (window:resize)=\"windowResize()\"\n>\n  <div\n    class=\"sky-modal sky-shadow sky-box sky-elevation-16\"\n    tabindex=\"-1\"\n    [ngClass]=\"{\n      'sky-modal-full-page': modalFullPage,\n      'sky-modal-small' : isSmallSize,\n      'sky-modal-medium' : isMediumSize,\n      'sky-modal-large' : isLargeSize,\n      'sky-modal-tiled' : isTiledBody\n      }\"\n    [ngStyle]=\"{\n        zIndex: modalZIndex\n      }\">\n\n    <div\n      class=\"sky-modal-header\"\n      [hidden]=\"!headerContent || !headerContent.children || headerContent.children.length &lt; 1\"\n      [ngStyle]=\"{\n        'box-shadow': scrollShadow?.topShadow\n      }\"\n    >\n      <div\n        class=\"sky-modal-header-content\"\n        [attr.id]=\"modalHeaderId\"\n        [ngClass]=\"{\n          'sky-section-heading': modalFullPage\n        }\"\n        #headerContent\n      >\n        <ng-content select=\"sky-modal-header\"></ng-content>\n      </div>\n      <div class=\"sky-modal-header-buttons\">\n        <button *ngIf=\"helpKey\"\n          class=\"sky-btn sky-modal-btn-help\"\n          name=\"help-button\"\n          type=\"button\"\n          [attr.aria-label]=\"'skyux_modal_open_help' | skyLibResources\"\n          (click)=\"helpButtonClick()\"\n        >\n          <sky-icon icon=\"question-circle\"></sky-icon>\n        </button>\n\n        <button type=\"button\" class=\"sky-btn sky-modal-btn-close\" [attr.aria-label]=\"'skyux_modal_close' | skyLibResources\" (click)=\"closeButtonClick()\">\n          <sky-icon icon=\"close\"></sky-icon>\n        </button>\n      </div>\n\n    </div>\n    <div\n      class=\"sky-modal-content sky-padding-even-large\"\n      role=\"region\"\n      tabindex=\"0\"\n      [attr.aria-labelledby]=\"modalHeaderId\"\n      [attr.id]=\"modalContentId\"\n      (skyModalScrollShadow)=\"scrollShadowChange($event)\"\n    >\n      <ng-content select=\"sky-modal-content\"></ng-content>\n    </div>\n    <div\n      class=\"sky-modal-footer\"\n      [ngStyle]=\"{\n        'box-shadow': scrollShadow?.bottomShadow\n      }\"\n    >\n      <ng-content select=\"sky-modal-footer\"></ng-content>\n    </div>\n  </div>\n</div>\n",
-                    animations: [
-                        skyAnimationModalState
-                    ],
-                    providers: [
-                        SkyModalComponentAdapterService
-                    ],
-                    styles: [".sky-modal{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;position:fixed;width:auto;left:0;right:0;top:20px;margin:10px;display:flex;flex-direction:column;overflow:hidden}.sky-modal:focus{outline:none}@media (min-width: 768px){.sky-modal:not(.sky-modal-large){margin:0 auto}.sky-modal-small{width:300px}.sky-modal-small .sky-modal-content,.sky-modal-small .sky-modal-header,.sky-modal-small .sky-modal-footer{max-width:300px}.sky-modal-medium{width:600px}.sky-modal-medium .sky-modal-content,.sky-modal-medium .sky-modal-header,.sky-modal-medium .sky-modal-footer{max-width:600px}}@media (min-width: 920px){.sky-modal-large{margin:0 auto;width:900px}.sky-modal-large .sky-modal-content,.sky-modal-large .sky-modal-header,.sky-modal-large .sky-modal-footer{max-width:900px}}.sky-modal-content{background-color:#fff}.sky-modal-content:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-tiled .sky-modal-content{background-color:#eeeeef}.sky-modal-tiled .sky-modal-content ::ng-deep .sky-tile-title{font-family:\"BLKB Sans\",\"Helvetica Neue\",Arial,sans-serif;color:#686c73;font-weight:300;font-size:19px}.sky-modal-header{padding:9px 3px 9px 15px;background-color:#fff;display:flex;align-items:baseline;border-bottom:1px solid #e2e3e4}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-btn{border:none;color:#cdcfd2;cursor:pointer}.sky-modal-header-buttons .sky-btn:hover{color:#979ba2;transition:color .15s}.sky-modal-header-content{flex-grow:1}.sky-modal-header{flex-shrink:0;z-index:2}.sky-modal-content{overflow-y:auto}.sky-modal-footer{flex-shrink:0;z-index:2}.sky-modal-footer ::ng-deep sky-tabset-nav-button+sky-tabset-nav-button{margin-left:10px}.sky-modal-footer ::ng-deep sky-tabset-nav-button+.sky-btn{margin-left:10px}.sky-modal-footer ::ng-deep .sky-btn+.sky-btn{margin-left:10px}.sky-modal-footer ::ng-deep .sky-btn+.sky-btn-link{margin-left:-2px}.sky-modal-full-page{width:100%;top:0;margin:0}.sky-modal-full-page .sky-modal-header-buttons sky-icon[icon=close]{font-size:20px}.sky-modal-full-page .sky-modal-content{flex-grow:1}:host ::ng-deep .sky-sectioned-form{min-height:460px;margin:-15px}.sky-theme-modern .sky-modal-header,:host-context(.sky-theme-modern) .sky-modal-header{border:none;padding:20px 30px}.sky-theme-modern .sky-modal-btn-help,.sky-theme-modern .sky-modal-btn-close,:host-context(.sky-theme-modern) .sky-modal-btn-help,:host-context(.sky-theme-modern) .sky-modal-btn-close{display:none}.sky-theme-modern .sky-modal-content,:host-context(.sky-theme-modern) .sky-modal-content{padding:0}.sky-theme-modern .sky-modal-full-page,:host-context(.sky-theme-modern) .sky-modal-full-page{width:calc(100% - (60px));margin:30px}.sky-theme-modern.sky-theme-mode-dark .sky-modal,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal{border-color:#121212}.sky-theme-modern.sky-theme-mode-dark .sky-modal-header,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-header{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-modal-header,.sky-theme-modern.sky-theme-mode-dark .sky-modal-content,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-header,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-content{background-color:transparent}\n"]
-                },] }
-    ];
-    SkyModalComponent.ctorParameters = function () { return [
-        { type: SkyModalHostService },
-        { type: SkyModalConfiguration },
-        { type: i0.ElementRef },
-        { type: i1.SkyAppWindowRef },
-        { type: SkyModalComponentAdapterService }
-    ]; };
-    SkyModalComponent.propDecorators = {
-        ariaRole: [{ type: i0.Input }],
-        tiledBody: [{ type: i0.Input }],
-        onDocumentKeyUp: [{ type: i0.HostListener, args: ['document:keyup', ['$event'],] }],
-        onDocumentKeyDown: [{ type: i0.HostListener, args: ['document:keydown', ['$event'],] }]
-    };
+    SkyModalComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalComponent, deps: [{ token: SkyModalHostService }, { token: SkyModalConfiguration }, { token: i0__namespace.ElementRef }, { token: i3__namespace.SkyAppWindowRef }, { token: SkyModalComponentAdapterService }, { token: i3__namespace.SkyCoreAdapterService }, { token: i3__namespace.SkyDockService, host: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    SkyModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: SkyModalComponent, selector: "sky-modal", inputs: { ariaRole: "ariaRole", tiledBody: "tiledBody" }, host: { listeners: { "document:keyup": "onDocumentKeyUp($event)", "document:keydown": "onDocumentKeyDown($event)" } }, providers: [
+            SkyModalComponentAdapterService,
+            i3$1.SkyDockService
+        ], viewQueries: [{ propertyName: "modalContentWrapperElement", first: true, predicate: ["modalContentWrapper"], descendants: true, read: i0.ElementRef }], ngImport: i0__namespace, template: "<!--\n  Animations are broken in Chrome v52. Angular 2 RC5 will fix it.\n  https://github.com/angular/angular/issues/10245\n-->\n<!--<div @modalState=\"modalState\">-->\n\n<div\n  class=\"sky-modal-dialog\"\n  aria-modal=\"true\"\n  [attr.aria-describedby]=\"ariaDescribedBy\"\n  [attr.aria-labelledby]=\"ariaLabelledBy\"\n  [attr.role]=\"ariaRole\"\n  (window:resize)=\"windowResize()\"\n>\n  <div\n    class=\"sky-modal sky-shadow sky-box sky-elevation-16\"\n    tabindex=\"-1\"\n    [ngClass]=\"{\n      'sky-modal-full-page': modalFullPage,\n      'sky-modal-small' : isSmallSize,\n      'sky-modal-medium' : isMediumSize,\n      'sky-modal-large' : isLargeSize,\n      'sky-modal-tiled' : isTiledBody\n      }\"\n    [ngStyle]=\"{\n        zIndex: modalZIndex\n      }\">\n\n    <div\n      class=\"sky-modal-header\"\n      [hidden]=\"!headerContent || !headerContent.children || headerContent.children.length &lt; 1\"\n      [ngStyle]=\"{\n        'box-shadow': scrollShadow?.topShadow\n      }\"\n    >\n      <div\n        class=\"sky-modal-header-content\"\n        [attr.id]=\"modalHeaderId\"\n        [ngClass]=\"{\n          'sky-section-heading': modalFullPage\n        }\"\n        #headerContent\n      >\n        <ng-content select=\"sky-modal-header\"></ng-content>\n      </div>\n      <div class=\"sky-modal-header-buttons\">\n        <button *ngIf=\"helpKey\"\n          class=\"sky-btn sky-modal-btn-help\"\n          name=\"help-button\"\n          type=\"button\"\n          [attr.aria-label]=\"'skyux_modal_open_help' | skyLibResources\"\n          (click)=\"helpButtonClick()\"\n        >\n          <sky-icon icon=\"question-circle\"></sky-icon>\n        </button>\n\n        <button type=\"button\" class=\"sky-btn sky-modal-btn-close\" [attr.aria-label]=\"'skyux_modal_close' | skyLibResources\" (click)=\"closeButtonClick()\">\n          <sky-icon icon=\"close\"></sky-icon>\n        </button>\n      </div>\n\n    </div>\n    <div\n      class=\"sky-modal-content sky-padding-even-large\"\n      role=\"region\"\n      tabindex=\"0\"\n      [attr.aria-labelledby]=\"modalHeaderId\"\n      [attr.id]=\"modalContentId\"\n      (skyModalScrollShadow)=\"scrollShadowChange($event)\"\n      #modalContentWrapper\n    >\n      <ng-content select=\"sky-modal-content\"></ng-content>\n    </div>\n    <div\n      class=\"sky-modal-footer\"\n      [ngStyle]=\"{\n        'box-shadow': scrollShadow?.bottomShadow\n      }\"\n    >\n      <ng-content select=\"sky-modal-footer\"></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [".sky-modal{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;position:fixed;width:auto;left:0;right:0;top:20px;margin:10px;display:flex;flex-direction:column;overflow:hidden}.sky-modal:focus{outline:none}@media (min-width: 768px){.sky-modal:not(.sky-modal-large){margin:0 auto}.sky-modal-small{width:300px}.sky-modal-small .sky-modal-content,.sky-modal-small .sky-modal-header,.sky-modal-small .sky-modal-footer{max-width:300px}.sky-modal-medium{width:600px}.sky-modal-medium .sky-modal-content,.sky-modal-medium .sky-modal-header,.sky-modal-medium .sky-modal-footer{max-width:600px}}@media (min-width: 920px){.sky-modal-large{margin:0 auto;width:900px}.sky-modal-large .sky-modal-content,.sky-modal-large .sky-modal-header,.sky-modal-large .sky-modal-footer{max-width:900px}}.sky-modal-content{background-color:#fff}.sky-modal-content:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-tiled .sky-modal-content{background-color:#eeeeef}.sky-modal-tiled .sky-modal-content ::ng-deep .sky-tile-title{font-family:\"BLKB Sans\",\"Helvetica Neue\",Arial,sans-serif;color:#686c73;font-weight:300;font-size:19px}.sky-modal-header{padding:9px 3px 9px 15px;background-color:#fff;display:flex;align-items:baseline;border-bottom:1px solid #e2e3e4}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-btn{border:none;color:#cdcfd2;cursor:pointer}.sky-modal-header-buttons .sky-btn:hover{color:#979ba2;transition:color .15s}.sky-modal-header-content{flex-grow:1}.sky-modal-header{flex-shrink:0;z-index:2}.sky-modal-content{overflow-y:auto}.sky-modal-footer{flex-shrink:0;z-index:2}.sky-modal-footer ::ng-deep sky-tabset-nav-button+sky-tabset-nav-button{margin-left:10px}.sky-modal-footer ::ng-deep sky-tabset-nav-button+.sky-btn{margin-left:10px}.sky-modal-footer ::ng-deep .sky-btn+.sky-btn{margin-left:10px}.sky-modal-footer ::ng-deep .sky-btn+.sky-btn-link{margin-left:-2px}.sky-modal-full-page{width:100%;top:0;margin:0}.sky-modal-full-page .sky-modal-header-buttons sky-icon[icon=close]{font-size:20px}.sky-modal-full-page .sky-modal-content{flex-grow:1}:host ::ng-deep .sky-sectioned-form{min-height:460px;margin:-15px}.sky-modal-content>::ng-deep sky-dock{bottom:-15px;margin-left:-15px;margin-bottom:-15px;padding-top:15px;width:calc(100% + 30px)}:host-context(.sky-theme-modern) .sky-modal-header{border:none;padding:20px 30px}:host-context(.sky-theme-modern) .sky-modal-btn-help,:host-context(.sky-theme-modern) .sky-modal-btn-close{display:none}:host-context(.sky-theme-modern) .sky-modal-content{padding:0}:host-context(.sky-theme-modern) .sky-modal-full-page{width:calc(100% - (60px));margin:30px}:host-context(.sky-theme-modern) .sky-modal-content>::ng-deep sky-dock{bottom:0;margin-left:initial;margin-bottom:initial;padding-top:initial;width:100%}.sky-theme-modern .sky-modal-header{border:none;padding:20px 30px}.sky-theme-modern .sky-modal-btn-help,.sky-theme-modern .sky-modal-btn-close{display:none}.sky-theme-modern .sky-modal-content{padding:0}.sky-theme-modern .sky-modal-full-page{width:calc(100% - (60px));margin:30px}.sky-theme-modern .sky-modal-content>::ng-deep sky-dock{bottom:0;margin-left:initial;margin-bottom:initial;padding-top:initial;width:100%}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal{border-color:#121212}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-header{color:#fbfcfe}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-header,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-modal-content{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-modal{border-color:#121212}.sky-theme-modern.sky-theme-mode-dark .sky-modal-header{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-modal-header,.sky-theme-modern.sky-theme-mode-dark .sky-modal-content{background-color:transparent}\n"], components: [{ type: i5__namespace.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i6__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: SkyModalScrollShadowDirective, selector: "[skyModalScrollShadow]", outputs: ["skyModalScrollShadow"] }], pipes: { "skyLibResources": i3__namespace$1.SkyLibResourcesPipe }, animations: [
+            skyAnimationModalState
+        ] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'sky-modal',
+                        templateUrl: './modal.component.html',
+                        styleUrls: ['./modal.component.scss'],
+                        animations: [
+                            skyAnimationModalState
+                        ],
+                        providers: [
+                            SkyModalComponentAdapterService,
+                            i3$1.SkyDockService
+                        ]
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: SkyModalHostService }, { type: SkyModalConfiguration }, { type: i0__namespace.ElementRef }, { type: i3__namespace.SkyAppWindowRef }, { type: SkyModalComponentAdapterService }, { type: i3__namespace.SkyCoreAdapterService }, { type: i3__namespace.SkyDockService, decorators: [{
+                            type: i0.Host
+                        }] }];
+        }, propDecorators: { ariaRole: [{
+                    type: i0.Input
+                }], tiledBody: [{
+                    type: i0.Input
+                }], modalContentWrapperElement: [{
+                    type: i0.ViewChild,
+                    args: ['modalContentWrapper', { read: i0.ElementRef }]
+                }], onDocumentKeyUp: [{
+                    type: i0.HostListener,
+                    args: ['document:keyup', ['$event']]
+                }], onDocumentKeyDown: [{
+                    type: i0.HostListener,
+                    args: ['document:keydown', ['$event']]
+                }] } });
 
     var SkyModalModule = /** @class */ (function () {
         function SkyModalModule() {
         }
         return SkyModalModule;
     }());
-    SkyModalModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    declarations: [
-                        SkyModalComponent,
-                        SkyModalContentComponent,
-                        SkyModalFooterComponent,
-                        SkyModalHeaderComponent,
-                        SkyModalHostComponent,
-                        SkyModalScrollShadowDirective
-                    ],
-                    imports: [
-                        common.CommonModule,
-                        router.RouterModule,
-                        i18n.SkyI18nModule,
-                        indicators.SkyIconModule,
-                        SkyModalForRootCompatModule,
-                        SkyModalsResourcesModule,
-                        theme.SkyThemeModule
-                    ],
-                    exports: [
-                        SkyModalComponent,
-                        SkyModalContentComponent,
-                        SkyModalFooterComponent,
-                        SkyModalHeaderComponent
-                    ],
-                    entryComponents: [
-                        SkyModalHostComponent
-                    ]
-                },] }
-    ];
+    SkyModalModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    SkyModalModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalModule, declarations: [SkyModalComponent,
+            SkyModalContentComponent,
+            SkyModalFooterComponent,
+            SkyModalHeaderComponent,
+            SkyModalHostComponent,
+            SkyModalScrollShadowDirective], imports: [i6.CommonModule,
+            i2.RouterModule,
+            i5.SkyIconModule,
+            SkyModalsResourcesModule,
+            i1.SkyThemeModule], exports: [SkyModalComponent,
+            SkyModalContentComponent,
+            SkyModalFooterComponent,
+            SkyModalHeaderComponent] });
+    SkyModalModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalModule, imports: [[
+                i6.CommonModule,
+                i2.RouterModule,
+                i5.SkyIconModule,
+                SkyModalsResourcesModule,
+                i1.SkyThemeModule
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        declarations: [
+                            SkyModalComponent,
+                            SkyModalContentComponent,
+                            SkyModalFooterComponent,
+                            SkyModalHeaderComponent,
+                            SkyModalHostComponent,
+                            SkyModalScrollShadowDirective
+                        ],
+                        imports: [
+                            i6.CommonModule,
+                            i2.RouterModule,
+                            i5.SkyIconModule,
+                            SkyModalsResourcesModule,
+                            i1.SkyThemeModule
+                        ],
+                        exports: [
+                            SkyModalComponent,
+                            SkyModalContentComponent,
+                            SkyModalFooterComponent,
+                            SkyModalHeaderComponent
+                        ],
+                        entryComponents: [
+                            SkyModalHostComponent
+                        ]
+                    }]
+            }] });
 
     var SkyModalCloseArgs = /** @class */ (function () {
         function SkyModalCloseArgs() {
@@ -1130,44 +1148,57 @@
         };
         return SkyConfirmComponent;
     }());
-    SkyConfirmComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'sky-confirm',
-                    template: "<div class=\"sky-confirm\">\n  <sky-modal\n    ariaRole=\"alertdialog\">\n    <sky-modal-content class=\"sky-confirm-content\">\n\n      <div\n        class=\"sky-confirm-message\"\n        [ngClass]=\"{\n          'sky-confirm-preserve-white-space': preserveWhiteSpace\n        }\"\n        [skyThemeClass]=\"{\n          'sky-emphasized': 'default',\n          'sky-font-heading-1 sky-font-display-3': 'modern'\n        }\"\n      >{{ message }}</div>\n\n      <div *ngIf=\"body\"\n        class=\"sky-confirm-body\"\n        [ngClass]=\"{\n          'sky-confirm-preserve-white-space': preserveWhiteSpace\n        }\"\n      >{{ body }}</div>\n\n      <div class=\"sky-confirm-buttons\">\n        <button\n          *ngFor=\"let button of buttons\"\n          type=\"button\"\n          class=\"sky-btn\"\n          [ngClass]=\"[\n            'sky-btn-' + button.styleType\n          ]\"\n          [skyThemeClass]=\"{\n            'sky-margin-inline-sm': 'modern',\n            'sky-margin-inline-compact': 'default'\n          }\"\n          (click)=\"close(button)\"\n          [attr.autofocus]=\"button.autofocus ? 'autofocus': null\"\n        >\n          {{ button.text }}\n        </button>\n      </div>\n    </sky-modal-content>\n  </sky-modal>\n</div>\n",
-                    styles: [".sky-confirm-message{margin-top:5px}.sky-confirm-body{margin-top:10px}.sky-confirm-buttons{margin-top:20px}.sky-confirm-preserve-white-space{white-space:pre-wrap}.sky-theme-modern .sky-confirm-content,:host-context(.sky-theme-modern) .sky-confirm-content{padding:20px 30px}.sky-theme-modern .sky-confirm-message,:host-context(.sky-theme-modern) .sky-confirm-message{padding-bottom:20px}.sky-theme-modern .sky-confirm-body,:host-context(.sky-theme-modern) .sky-confirm-body{margin:0}.sky-theme-modern.sky-theme-mode-dark .sky-confirm-message,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-confirm-message{color:#fbfcfe}\n"]
-                },] }
-    ];
-    SkyConfirmComponent.ctorParameters = function () { return [
-        { type: SkyConfirmModalContext },
-        { type: SkyModalInstance },
-        { type: i18n.SkyLibResourcesService, decorators: [{ type: i0.Optional }] }
-    ]; };
+    SkyConfirmComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmComponent, deps: [{ token: SkyConfirmModalContext }, { token: SkyModalInstance }, { token: i3__namespace$1.SkyLibResourcesService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    SkyConfirmComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: SkyConfirmComponent, selector: "sky-confirm", ngImport: i0__namespace, template: "<div class=\"sky-confirm\">\n  <sky-modal\n    ariaRole=\"alertdialog\">\n    <sky-modal-content class=\"sky-confirm-content\">\n\n      <div\n        class=\"sky-confirm-message\"\n        [ngClass]=\"{\n          'sky-confirm-preserve-white-space': preserveWhiteSpace\n        }\"\n        [skyThemeClass]=\"{\n          'sky-emphasized': 'default',\n          'sky-font-heading-1 sky-font-display-3': 'modern'\n        }\"\n      >{{ message }}</div>\n\n      <div *ngIf=\"body\"\n        class=\"sky-confirm-body\"\n        [ngClass]=\"{\n          'sky-confirm-preserve-white-space': preserveWhiteSpace\n        }\"\n      >{{ body }}</div>\n\n      <div class=\"sky-confirm-buttons\">\n        <button\n          *ngFor=\"let button of buttons\"\n          type=\"button\"\n          class=\"sky-btn\"\n          [ngClass]=\"[\n            'sky-btn-' + button.styleType\n          ]\"\n          [skyThemeClass]=\"{\n            'sky-margin-inline-sm': 'modern',\n            'sky-margin-inline-compact': 'default'\n          }\"\n          (click)=\"close(button)\"\n          [attr.autofocus]=\"button.autofocus ? 'autofocus': null\"\n        >\n          {{ button.text }}\n        </button>\n      </div>\n    </sky-modal-content>\n  </sky-modal>\n</div>\n", styles: [".sky-confirm-message{margin-top:5px}.sky-confirm-body{margin-top:10px}.sky-confirm-buttons{margin-top:20px}.sky-confirm-preserve-white-space{white-space:pre-wrap}:host-context(.sky-theme-modern) .sky-confirm-content{padding:20px 30px}:host-context(.sky-theme-modern) .sky-confirm-message{padding-bottom:20px}:host-context(.sky-theme-modern) .sky-confirm-body{margin:0}.sky-theme-modern .sky-confirm-content{padding:20px 30px}.sky-theme-modern .sky-confirm-message{padding-bottom:20px}.sky-theme-modern .sky-confirm-body{margin:0}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-confirm-message{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-confirm-message{color:#fbfcfe}\n"], components: [{ type: SkyModalComponent, selector: "sky-modal", inputs: ["ariaRole", "tiledBody"] }, { type: SkyModalContentComponent, selector: "sky-modal-content" }], directives: [{ type: i6__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'sky-confirm',
+                        templateUrl: './confirm.component.html',
+                        styleUrls: ['./confirm.component.scss']
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: SkyConfirmModalContext }, { type: SkyModalInstance }, { type: i3__namespace$1.SkyLibResourcesService, decorators: [{
+                            type: i0.Optional
+                        }] }];
+        } });
 
     var SkyConfirmModule = /** @class */ (function () {
         function SkyConfirmModule() {
         }
         return SkyConfirmModule;
     }());
-    SkyConfirmModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    declarations: [
-                        SkyConfirmComponent
-                    ],
-                    imports: [
-                        common.CommonModule,
-                        i18n.SkyI18nModule,
-                        SkyModalModule,
-                        SkyModalsResourcesModule,
-                        theme.SkyThemeModule
-                    ],
-                    exports: [
-                        SkyConfirmComponent
-                    ],
-                    entryComponents: [
-                        SkyConfirmComponent
-                    ]
-                },] }
-    ];
+    SkyConfirmModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    SkyConfirmModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmModule, declarations: [SkyConfirmComponent], imports: [i6.CommonModule,
+            SkyModalModule,
+            SkyModalsResourcesModule,
+            i1.SkyThemeModule], exports: [SkyConfirmComponent] });
+    SkyConfirmModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmModule, imports: [[
+                i6.CommonModule,
+                SkyModalModule,
+                SkyModalsResourcesModule,
+                i1.SkyThemeModule
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        declarations: [
+                            SkyConfirmComponent
+                        ],
+                        imports: [
+                            i6.CommonModule,
+                            SkyModalModule,
+                            SkyModalsResourcesModule,
+                            i1.SkyThemeModule
+                        ],
+                        exports: [
+                            SkyConfirmComponent
+                        ],
+                        entryComponents: [
+                            SkyConfirmComponent
+                        ]
+                    }]
+            }] });
 
     /**
      * A service that lauches modals. For information about how to test modals in SKY UX, see
@@ -1239,18 +1270,17 @@
         };
         return SkyModalService;
     }());
-    SkyModalService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function SkyModalService_Factory() { return new SkyModalService(i0__namespace.ɵɵinject(i1__namespace.SkyDynamicComponentService)); }, token: SkyModalService, providedIn: "any" });
-    SkyModalService.decorators = [
-        { type: i0.Injectable, args: [{
-                    // Must be 'any' so that the modal component is created in the context of its module's injector.
-                    // If set to 'root', the component's dependency injections would only be derived from the root
-                    // injector and may loose context if the modal was opened from within a lazy-loaded module.
-                    providedIn: 'any'
-                },] }
-    ];
-    SkyModalService.ctorParameters = function () { return [
-        { type: i1.SkyDynamicComponentService }
-    ]; };
+    SkyModalService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalService, deps: [{ token: i3__namespace.SkyDynamicComponentService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    SkyModalService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalService, providedIn: 'any' });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyModalService, decorators: [{
+                type: i0.Injectable,
+                args: [{
+                        // Must be 'any' so that the modal component is created in the context of its module's injector.
+                        // If set to 'root', the component's dependency injections would only be derived from the root
+                        // injector and may loose context if the modal was opened from within a lazy-loaded module.
+                        providedIn: 'any'
+                    }]
+            }], ctorParameters: function () { return [{ type: i3__namespace.SkyDynamicComponentService }]; } });
 
     /**
      *  The `SkyConfirmService` provider launches the confirmation dialog.
@@ -1287,15 +1317,14 @@
         };
         return SkyConfirmService;
     }());
-    SkyConfirmService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function SkyConfirmService_Factory() { return new SkyConfirmService(i0__namespace.ɵɵinject(SkyModalService)); }, token: SkyConfirmService, providedIn: "root" });
-    SkyConfirmService.decorators = [
-        { type: i0.Injectable, args: [{
-                    providedIn: 'root'
-                },] }
-    ];
-    SkyConfirmService.ctorParameters = function () { return [
-        { type: SkyModalService }
-    ]; };
+    SkyConfirmService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmService, deps: [{ token: SkyModalService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    SkyConfirmService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmService, providedIn: 'root' });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: SkyConfirmService, decorators: [{
+                type: i0.Injectable,
+                args: [{
+                        providedIn: 'root'
+                    }]
+            }], ctorParameters: function () { return [{ type: SkyModalService }]; } });
 
     /**
      * Generated bundle index. Do not edit.
@@ -1312,19 +1341,11 @@
     exports.SkyModalInstance = SkyModalInstance;
     exports.SkyModalModule = SkyModalModule;
     exports.SkyModalService = SkyModalService;
-    exports.ɵa = SkyConfirmComponent;
-    exports.ɵb = SkyModalComponent;
-    exports.ɵc = skyAnimationModalState;
-    exports.ɵd = SkyModalComponentAdapterService;
-    exports.ɵe = SkyModalContentComponent;
-    exports.ɵf = SkyModalFooterComponent;
-    exports.ɵg = SkyModalHeaderComponent;
-    exports.ɵh = SkyModalHostComponent;
-    exports.ɵi = SkyModalAdapterService;
-    exports.ɵj = SkyModalScrollShadowDirective;
-    exports.ɵk = SkyModalForRootCompatModule;
-    exports.ɵl = SkyModalsResourcesProvider;
-    exports.ɵm = SkyModalsResourcesModule;
+    exports.λ1 = SkyConfirmComponent;
+    exports.λ2 = SkyModalContentComponent;
+    exports.λ3 = SkyModalFooterComponent;
+    exports.λ4 = SkyModalHeaderComponent;
+    exports.λ5 = SkyModalComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });