@skyux/modals 13.14.2 → 13.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/skyux-modals-testing.mjs +45 -12
- package/fesm2022/skyux-modals-testing.mjs.map +1 -1
- package/fesm2022/skyux-modals.mjs +109 -66
- package/fesm2022/skyux-modals.mjs.map +1 -1
- package/index.d.ts +28 -3
- package/package.json +10 -10
- package/testing/index.d.ts +20 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReplaySubject, Subject, BehaviorSubject } from 'rxjs';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { NgModule, InjectionToken, ViewEncapsulation, Component, Injectable, input, inject, ChangeDetectorRef, ElementRef, HostListener, ViewChild, Input, HostBinding, Inject, EnvironmentInjector, ViewContainerRef, Directive } from '@angular/core';
|
|
3
|
+
import { NgModule, InjectionToken, ViewEncapsulation, Component, Injectable, input, booleanAttribute, inject, ChangeDetectorRef, ElementRef, HostListener, ViewChild, Input, HostBinding, Inject, EnvironmentInjector, ViewContainerRef, computed, Directive } from '@angular/core';
|
|
4
4
|
import * as i1$1 from '@angular/common';
|
|
5
5
|
import { CommonModule } from '@angular/common';
|
|
6
6
|
import * as i1 from '@skyux/core';
|
|
@@ -70,11 +70,11 @@ var SkyConfirmType;
|
|
|
70
70
|
* @internal
|
|
71
71
|
*/
|
|
72
72
|
class SkyConfirmModule {
|
|
73
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
74
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
75
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
73
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
74
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmModule }); }
|
|
75
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmModule }); }
|
|
76
76
|
}
|
|
77
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
77
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmModule, decorators: [{
|
|
78
78
|
type: NgModule,
|
|
79
79
|
args: [{}]
|
|
80
80
|
}] });
|
|
@@ -88,12 +88,12 @@ const SKY_CONFIRM_CONFIG = new InjectionToken('SkyConfirmConfig');
|
|
|
88
88
|
* Specifies content to display in the modal's body.
|
|
89
89
|
*/
|
|
90
90
|
class SkyModalContentComponent {
|
|
91
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
92
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
91
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
92
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: SkyModalContentComponent, isStandalone: true, selector: "sky-modal-content", hostDirectives: [{ directive: i1.SkyResponsiveHostDirective }], ngImport: i0, template: "<ng-content />\n", styles: [".sky-modal:not(.sky-theme-modern *){--sky-override-modal-content-padding: 0}sky-modal-content{display:block;min-height:100%;padding:var(--sky-override-modal-content-padding, var(--sky-comp-modal-content-space-inset-top) var(--sky-comp-modal-content-space-inset-right) var(--sky-comp-modal-content-space-inset-bottom) var(--sky-comp-modal-content-space-inset-left))}sky-modal-banner+sky-modal-content{padding-top:calc(var(--sky-comp-modal-header-space-inset-bottom) + var(--sky-comp-modal-content-space-inset-top))}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
93
93
|
}
|
|
94
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
94
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalContentComponent, decorators: [{
|
|
95
95
|
type: Component,
|
|
96
|
-
args: [{ hostDirectives: [SkyResponsiveHostDirective], selector: 'sky-modal-content', encapsulation: ViewEncapsulation.None, template: "<ng-content />\n", styles: [".sky-modal:not(.sky-theme-modern *){--sky-override-modal-content-padding: 0}sky-modal-content{display:block;min-height:100%;padding:var(--sky-override-modal-content-padding, var(--sky-comp-modal-content-space-inset-top) var(--sky-comp-modal-content-space-inset-right) var(--sky-comp-modal-content-space-inset-bottom) var(--sky-comp-modal-content-space-inset-left))}\n"] }]
|
|
96
|
+
args: [{ hostDirectives: [SkyResponsiveHostDirective], selector: 'sky-modal-content', encapsulation: ViewEncapsulation.None, template: "<ng-content />\n", styles: [".sky-modal:not(.sky-theme-modern *){--sky-override-modal-content-padding: 0}sky-modal-content{display:block;min-height:100%;padding:var(--sky-override-modal-content-padding, var(--sky-comp-modal-content-space-inset-top) var(--sky-comp-modal-content-space-inset-right) var(--sky-comp-modal-content-space-inset-bottom) var(--sky-comp-modal-content-space-inset-left))}sky-modal-banner+sky-modal-content{padding-top:calc(var(--sky-comp-modal-header-space-inset-bottom) + var(--sky-comp-modal-content-space-inset-top))}\n"] }]
|
|
97
97
|
}] });
|
|
98
98
|
|
|
99
99
|
/**
|
|
@@ -288,11 +288,11 @@ SkyLibResourcesService.addResources(RESOURCES);
|
|
|
288
288
|
* Import into any component library module that needs to use resource strings.
|
|
289
289
|
*/
|
|
290
290
|
class SkyModalsResourcesModule {
|
|
291
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
292
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
293
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
291
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalsResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
292
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.17", ngImport: i0, type: SkyModalsResourcesModule, exports: [SkyI18nModule] }); }
|
|
293
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalsResourcesModule, imports: [SkyI18nModule] }); }
|
|
294
294
|
}
|
|
295
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
295
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalsResourcesModule, decorators: [{
|
|
296
296
|
type: NgModule,
|
|
297
297
|
args: [{
|
|
298
298
|
exports: [SkyI18nModule],
|
|
@@ -364,10 +364,10 @@ class SkyModalComponentAdapterService {
|
|
|
364
364
|
fullPageModalEl.style.height = fullPageModalHeight;
|
|
365
365
|
fullPageModalEl.style.maxHeight = fullPageModalHeight;
|
|
366
366
|
}
|
|
367
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
368
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
367
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalComponentAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
368
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalComponentAdapterService }); }
|
|
369
369
|
}
|
|
370
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
370
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalComponentAdapterService, decorators: [{
|
|
371
371
|
type: Injectable
|
|
372
372
|
}] });
|
|
373
373
|
|
|
@@ -378,10 +378,10 @@ class SkyModalConfiguration {
|
|
|
378
378
|
constructor() {
|
|
379
379
|
this.size = 'medium';
|
|
380
380
|
}
|
|
381
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
382
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
381
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
382
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalConfiguration }); }
|
|
383
383
|
}
|
|
384
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
384
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalConfiguration, decorators: [{
|
|
385
385
|
type: Injectable
|
|
386
386
|
}], ctorParameters: () => [] });
|
|
387
387
|
|
|
@@ -396,10 +396,10 @@ class SkyModalErrorsService {
|
|
|
396
396
|
updateErrors(value) {
|
|
397
397
|
this.#formErrors.next(value);
|
|
398
398
|
}
|
|
399
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
400
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
399
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalErrorsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
400
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalErrorsService }); }
|
|
401
401
|
}
|
|
402
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
402
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalErrorsService, decorators: [{
|
|
403
403
|
type: Injectable
|
|
404
404
|
}], ctorParameters: () => [] });
|
|
405
405
|
|
|
@@ -407,10 +407,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
407
407
|
* Specifies a header for the modal.
|
|
408
408
|
*/
|
|
409
409
|
class SkyModalHeaderComponent {
|
|
410
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
411
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
410
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
411
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: SkyModalHeaderComponent, isStandalone: true, selector: "sky-modal-header", ngImport: i0, template: "<h2 class=\"sky-modal-heading\" skyTrim>\n <ng-content />\n</h2>\n<span class=\"sky-control-help-container\" skyTrim\n ><ng-content select=\".sky-control-help\"></ng-content\n></span>\n", styles: [".sky-modal-heading:not(.sky-theme-modern *){--sky-override-modal-h2-font-size: 16px;--sky-override-modal-h2-font-weight: 600;--sky-override-modal-h2-line-height: 1.2;--sky-override-modal-h2-font: inherit}h2.sky-modal-heading{display:inline;line-height:var(--sky-override-modal-h2-line-height, var(--sky-font-line_height-heading-2));font-size:var(--sky-override-modal-h2-font-size, var(--sky-font-size-heading-2));font-weight:var(--sky-override-modal-h2-font-weight, var(--sky-font-style-heading-2));font-family:var(--sky-override-modal-h2-font, var(--sky-font-family-heading-2))}\n"], dependencies: [{ kind: "ngmodule", type: SkyThemeModule }, { kind: "ngmodule", type: SkyTrimModule }, { kind: "directive", type: i1.λ4, selector: "[skyTrim]" }] }); }
|
|
412
412
|
}
|
|
413
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
413
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHeaderComponent, decorators: [{
|
|
414
414
|
type: Component,
|
|
415
415
|
args: [{ selector: 'sky-modal-header', imports: [SkyThemeModule, SkyTrimModule], template: "<h2 class=\"sky-modal-heading\" skyTrim>\n <ng-content />\n</h2>\n<span class=\"sky-control-help-container\" skyTrim\n ><ng-content select=\".sky-control-help\"></ng-content\n></span>\n", styles: [".sky-modal-heading:not(.sky-theme-modern *){--sky-override-modal-h2-font-size: 16px;--sky-override-modal-h2-font-weight: 600;--sky-override-modal-h2-line-height: 1.2;--sky-override-modal-h2-font: inherit}h2.sky-modal-heading{display:inline;line-height:var(--sky-override-modal-h2-line-height, var(--sky-font-line_height-heading-2));font-size:var(--sky-override-modal-h2-font-size, var(--sky-font-size-heading-2));font-weight:var(--sky-override-modal-h2-font-weight, var(--sky-font-style-heading-2));font-family:var(--sky-override-modal-h2-font, var(--sky-font-family-heading-2))}\n"] }]
|
|
416
416
|
}] });
|
|
@@ -496,11 +496,11 @@ class SkyModalHostService {
|
|
|
496
496
|
#notifyBackdropZIndex() {
|
|
497
497
|
backdropZIndex.next(_a.backdropZIndex);
|
|
498
498
|
}
|
|
499
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
500
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
499
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
500
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostService, providedIn: 'root' }); }
|
|
501
501
|
}
|
|
502
502
|
_a = SkyModalHostService;
|
|
503
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
503
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostService, decorators: [{
|
|
504
504
|
type: Injectable,
|
|
505
505
|
args: [{
|
|
506
506
|
providedIn: 'root',
|
|
@@ -571,6 +571,15 @@ class SkyModalComponent {
|
|
|
571
571
|
constructor() {
|
|
572
572
|
this.ariaRoleOrDefault = ARIA_ROLE_DEFAULT;
|
|
573
573
|
this.layout = input('none', ...(ngDevMode ? [{ debugName: "layout" }] : []));
|
|
574
|
+
/**
|
|
575
|
+
* Whether to hide the modal's header, including the heading from `headingText`,
|
|
576
|
+
* the help inline button if `helpKey` is provided, and the close button in the
|
|
577
|
+
* top right. Reserve this property for specific use cases where you need a
|
|
578
|
+
* banner image in place of the header.
|
|
579
|
+
*/
|
|
580
|
+
this.headingHidden = input(false, ...(ngDevMode ? [{ debugName: "headingHidden", transform: booleanAttribute }] : [{
|
|
581
|
+
transform: booleanAttribute,
|
|
582
|
+
}]));
|
|
574
583
|
this.ariaOwns = null;
|
|
575
584
|
this.modalState = 'in';
|
|
576
585
|
this.scrollShadow = {
|
|
@@ -700,14 +709,14 @@ class SkyModalComponent {
|
|
|
700
709
|
viewkeeperEnabled() {
|
|
701
710
|
return this.#componentAdapter.modalContentHasDirectChildViewkeeper(this.#elRef);
|
|
702
711
|
}
|
|
703
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
704
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
712
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
713
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: SkyModalComponent, isStandalone: true, selector: "sky-modal", inputs: { formErrors: { classPropertyName: "formErrors", publicName: "formErrors", isSignal: false, isRequired: false, transformFunction: null }, headingText: { classPropertyName: "headingText", publicName: "headingText", isSignal: false, isRequired: false, transformFunction: null }, helpKey: { classPropertyName: "helpKey", publicName: "helpKey", isSignal: false, isRequired: false, transformFunction: null }, helpPopoverContent: { classPropertyName: "helpPopoverContent", publicName: "helpPopoverContent", isSignal: false, isRequired: false, transformFunction: null }, helpPopoverTitle: { classPropertyName: "helpPopoverTitle", publicName: "helpPopoverTitle", isSignal: false, isRequired: false, transformFunction: null }, ariaRole: { classPropertyName: "ariaRole", publicName: "ariaRole", isSignal: false, isRequired: false, transformFunction: null }, tiledBody: { classPropertyName: "tiledBody", publicName: "tiledBody", isSignal: false, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: false, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: false, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, headingHidden: { classPropertyName: "headingHidden", publicName: "headingHidden", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:keyup": "onDocumentKeyUp($event)", "document:keydown": "onDocumentKeyDown($event)" }, properties: { "class": "this.wrapperClass" } }, providers: [
|
|
705
714
|
SkyModalComponentAdapterService,
|
|
706
715
|
SkyModalErrorsService,
|
|
707
716
|
SkyDockService,
|
|
708
|
-
], viewQueries: [{ propertyName: "modalContentWrapperElement", first: true, predicate: ["modalContentWrapper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n class=\"sky-modal-dialog\"\n aria-modal=\"true\"\n [attr.aria-describedby]=\"ariaDescribedBy || modalContentId.id\"\n [attr.aria-labelledby]=\"ariaLabelledBy || headerId.id\"\n [attr.aria-owns]=\"ariaOwns\"\n [attr.role]=\"ariaRoleOrDefault\"\n (window:resize)=\"windowResize()\"\n>\n <div\n class=\"sky-modal sky-shadow sky-box sky-elevation-16 sky-modal-{{ size }}\"\n tabindex=\"-1\"\n [ngClass]=\"{\n 'sky-modal-tiled': tiledBody,\n 'sky-modal-viewkeeper': viewkeeperEnabled()\n }\"\n [ngStyle]=\"{\n zIndex: modalZIndex\n }\"\n >\n <div\n class=\"sky-modal-header\"\n [ngStyle]=\"{\n 'box-shadow': scrollShadow?.topShadow\n }\"\n >\n <div #headerId=\"skyId\" class=\"sky-modal-header-content\" skyId>\n @if (headingText) {\n <sky-modal-header>\n {{ headingText }}\n @if (helpKey || helpPopoverContent) {\n <sky-help-inline\n class=\"sky-control-help\"\n [helpKey]=\"helpKey\"\n [labelText]=\"headingText\"\n [popoverContent]=\"helpPopoverContent\"\n [popoverTitle]=\"helpPopoverTitle\"\n />\n }\n </sky-modal-header>\n } @else {\n <ng-content select=\"sky-modal-header\" />\n }\n </div>\n <div class=\"sky-modal-header-buttons\">\n @if (legacyHelpKey) {\n <button\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 iconName=\"question-circle\" />\n </button>\n }\n\n <button\n type=\"button\"\n class=\"sky-btn sky-modal-btn-close\"\n [attr.aria-label]=\"'skyux_modal_close' | skyLibResources\"\n (click)=\"closeButtonClick()\"\n >\n <sky-icon iconName=\"close\" />\n </button>\n </div>\n </div>\n <div\n #modalContentId=\"skyId\"\n #modalContentWrapper\n class=\"sky-modal-content\"\n role=\"region\"\n tabindex=\"0\"\n skyId\n skyLayoutHost\n [layout]=\"layout()\"\n [attr.aria-labelledby]=\"headerId.id\"\n [skyScrollShadowEnabled]=\"scrollShadowEnabled\"\n [skyThemeClass]=\"{\n 'sky-padding-even-large': 'default'\n }\"\n (skyScrollShadow)=\"scrollShadowChange($event)\"\n >\n <ng-content select=\"sky-modal-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\" />\n </div>\n </div>\n</div>\n", styles: [".sky-modal:not(.sky-theme-modern *){--sky-override-modal-background-color: #fff;--sky-override-modal-border: 1px solid #cdcfd2;--sky-override-modal-dock-bottom: -15px;--sky-override-modal-dock-margin-left-right-bottom: -15px;--sky-override-modal-dock-padding-top: 15px;--sky-override-modal-dock-width: calc(100% + 30px) ;--sky-override-modal-full-page-margin-xs: 0;--sky-override-modal-full-page-margin: 0;--sky-override-modal-full-page-width: 100%;--sky-override-modal-header-bottom-border: 1px solid #e2e3e4;--sky-override-modal-header-padding: 9px 3px 9px 15px;--sky-override-modal-help-close-display: inline-block;--sky-override-modal-margin: 20px auto;--sky-override-modal-viewkept-toolbar-box-shadow: none;--sky-override-modal-viewkept-toolbar-padding-horizontal: 10px;--sky-override-modal-width-l: 900px;--sky-override-modal-width-m: 600px;--sky-override-modal-width-s: 300px;--sky-override-modal-xs-margin: 30px 10px 10px 10px}:host{--sky-viewport-top: 0;--sky-viewport-bottom: 0;--sky-viewport-left: 0;--sky-viewport-right: 0}.sky-modal{--sky-comp-override-list-header-background-color: initial;border:var(--sky-override-modal-border, var(--sky-border-width-container-base) solid var(--sky-color-border-container-base));position:fixed;width:auto;left:0;right:0;top:0;margin:var(--sky-override-modal-xs-margin, var(--sky-comp-modal-space-offset-xs-top) var(--sky-comp-modal-space-offset-xs-right) var(--sky-comp-modal-space-offset-xs-bottom) var(--sky-comp-modal-space-offset-xs-left));display:flex;flex-direction:column;overflow:hidden}.sky-modal:has(.sky-modal-content.sky-layout-host-fit){height:var(--sky-modal-content-max-height, 100%)}.sky-modal:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-header:has(.sky-modal-header-content:empty){display:none}.sky-modal-btn-help,.sky-modal-btn-close{display:var(--sky-override-modal-help-close-display, none)}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-right)) + var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-left)))));margin:var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-top) var(--sky-comp-modal-fullscreen-space-offset-xs-right) var(--sky-comp-modal-fullscreen-space-offset-xs-bottom) var(--sky-comp-modal-fullscreen-space-offset-xs-left))}@media (min-width: 768px){.sky-modal:not(.sky-modal-full-page){margin:var(--sky-override-modal-margin, var(--sky-comp-modal-space-offset-sm-top) auto var(--sky-comp-modal-space-offset-sm-bottom))}.sky-modal-small{width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-small .sky-modal-content,.sky-modal-small .sky-modal-header,.sky-modal-small .sky-modal-footer{max-width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-medium{width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-medium .sky-modal-content,.sky-modal-medium .sky-modal-header,.sky-modal-medium .sky-modal-footer{max-width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-left)) + var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-right)))));margin:var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-top) var(--sky-comp-modal-fullscreen-space-offset-sm-right) var(--sky-comp-modal-fullscreen-space-offset-sm-bottom) var(--sky-comp-modal-fullscreen-space-offset-sm-left))}}@media (min-width: 920px){.sky-modal-large{width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}.sky-modal-large .sky-modal-content,.sky-modal-large .sky-modal-header,.sky-modal-large .sky-modal-footer{max-width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}}.sky-modal-content{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) )}.sky-modal-content:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-content.sky-layout-host-fit{flex-grow:1;position:relative}.sky-modal-tiled .sky-modal-content{background-color:#eeeeef;--sky-background-color-page-default: $sky-background-color-neutral-light}.sky-modal-tiled .sky-modal-content ::ng-deep .sky-tile-title{font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:300;font-size:19px}.sky-modal-header{padding:var(--sky-override-modal-header-padding, var(--sky-comp-modal-header-space-inset-top) var(--sky-comp-modal-header-space-inset-right) var(--sky-comp-modal-header-space-inset-bottom) var(--sky-comp-modal-header-space-inset-left));background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));border-bottom:var(--sky-override-modal-header-bottom-border);display:flex;align-items:baseline}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-btn{border:none;color:#686c73;cursor:pointer}.sky-modal-header-buttons .sky-btn:hover{color:#383a3d;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-full-page .sky-modal-content{flex-grow:1}.sky-modal-content>::ng-deep sky-dock{bottom:var(--sky-override-modal-dock-bottom, 0);margin-left:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-right:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-bottom:var(--sky-override-modal-dock-margin-left-right-bottom, initial);padding-top:var(--sky-override-modal-dock-padding-top, initial);width:var(--sky-override-modal-dock-width, 100%)}.sky-modal-viewkeeper .sky-modal-header{box-shadow:none!important}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed{box-shadow:var(--sky-override-modal-viewkept-toolbar-box-shadow, var(--sky-elevation-overflow))}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed>sky-toolbar .sky-toolbar-container{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) );padding-left:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-left));padding-right:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-right))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "component", type: i2.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["iconName", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: SkyLayoutHostDirective, selector: "[skyLayoutHost]", inputs: ["layout"] }, { kind: "component", type: SkyModalHeaderComponent, selector: "sky-modal-header" }, { kind: "ngmodule", type: SkyModalsResourcesModule }, { kind: "directive", type: SkyScrollShadowDirective, selector: "[skyScrollShadow]", inputs: ["skyScrollShadowEnabled"], outputs: ["skyScrollShadow"] }, { kind: "ngmodule", type: SkyThemeModule }, { kind: "directive", type: i5.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i6.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
717
|
+
], viewQueries: [{ propertyName: "modalContentWrapperElement", first: true, predicate: ["modalContentWrapper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n class=\"sky-modal-dialog\"\n aria-modal=\"true\"\n [attr.aria-describedby]=\"ariaDescribedBy || modalContentId.id\"\n [attr.aria-labelledby]=\"ariaLabelledBy || headerId.id\"\n [attr.aria-owns]=\"ariaOwns\"\n [attr.role]=\"ariaRoleOrDefault\"\n (window:resize)=\"windowResize()\"\n>\n <div\n class=\"sky-modal sky-shadow sky-box sky-elevation-16 sky-modal-{{ size }}\"\n tabindex=\"-1\"\n [ngClass]=\"{\n 'sky-modal-tiled': tiledBody,\n 'sky-modal-viewkeeper': viewkeeperEnabled()\n }\"\n [ngStyle]=\"{\n zIndex: modalZIndex\n }\"\n >\n <div\n class=\"sky-modal-header\"\n [hidden]=\"headingHidden()\"\n [ngStyle]=\"{\n 'box-shadow': scrollShadow?.topShadow\n }\"\n >\n <div #headerId=\"skyId\" class=\"sky-modal-header-content\" skyId>\n @if (headingText) {\n <sky-modal-header>\n {{ headingText }}\n @if (helpKey || helpPopoverContent) {\n <sky-help-inline\n class=\"sky-control-help\"\n [helpKey]=\"helpKey\"\n [labelText]=\"headingText\"\n [popoverContent]=\"helpPopoverContent\"\n [popoverTitle]=\"helpPopoverTitle\"\n />\n }\n </sky-modal-header>\n } @else {\n <ng-content select=\"sky-modal-header\" />\n }\n </div>\n <div class=\"sky-modal-header-buttons\">\n @if (legacyHelpKey) {\n <button\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 iconName=\"question-circle\" />\n </button>\n }\n\n <button\n type=\"button\"\n class=\"sky-btn sky-modal-btn-close\"\n [attr.aria-label]=\"'skyux_modal_close' | skyLibResources\"\n (click)=\"closeButtonClick()\"\n >\n <sky-icon iconName=\"close\" />\n </button>\n </div>\n </div>\n <div\n #modalContentId=\"skyId\"\n #modalContentWrapper\n class=\"sky-modal-content\"\n role=\"region\"\n tabindex=\"0\"\n skyId\n skyLayoutHost\n [layout]=\"layout()\"\n [attr.aria-labelledby]=\"headerId.id\"\n [skyScrollShadowEnabled]=\"scrollShadowEnabled\"\n [skyThemeClass]=\"{\n 'sky-padding-even-large': 'default'\n }\"\n (skyScrollShadow)=\"scrollShadowChange($event)\"\n >\n <ng-content select=\"sky-modal-banner\" />\n <ng-content select=\"sky-modal-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\" />\n </div>\n </div>\n</div>\n", styles: [".sky-modal:not(.sky-theme-modern *){--sky-override-modal-background-color: #fff;--sky-override-modal-border: 1px solid #cdcfd2;--sky-override-modal-dock-bottom: -15px;--sky-override-modal-dock-margin-left-right-bottom: -15px;--sky-override-modal-dock-padding-top: 15px;--sky-override-modal-dock-width: calc(100% + 30px) ;--sky-override-modal-full-page-margin-xs: 0;--sky-override-modal-full-page-margin: 0;--sky-override-modal-full-page-width: 100%;--sky-override-modal-header-bottom-border: 1px solid #e2e3e4;--sky-override-modal-header-padding: 9px 3px 9px 15px;--sky-override-modal-help-close-display: inline-block;--sky-override-modal-margin: 20px auto;--sky-override-modal-viewkept-toolbar-box-shadow: none;--sky-override-modal-viewkept-toolbar-padding-horizontal: 10px;--sky-override-modal-width-l: 900px;--sky-override-modal-width-m: 600px;--sky-override-modal-width-s: 300px;--sky-override-modal-xs-margin: 30px 10px 10px 10px}:host{--sky-viewport-top: 0;--sky-viewport-bottom: 0;--sky-viewport-left: 0;--sky-viewport-right: 0}.sky-modal{--sky-comp-override-list-header-background-color: initial;border:var(--sky-override-modal-border, var(--sky-border-width-container-base) solid var(--sky-color-border-container-base));position:fixed;width:auto;left:0;right:0;top:0;margin:var(--sky-override-modal-xs-margin, var(--sky-comp-modal-space-offset-xs-top) var(--sky-comp-modal-space-offset-xs-right) var(--sky-comp-modal-space-offset-xs-bottom) var(--sky-comp-modal-space-offset-xs-left));display:flex;flex-direction:column;overflow:hidden}.sky-modal:has(.sky-modal-content.sky-layout-host-fit){height:var(--sky-modal-content-max-height, 100%)}.sky-modal:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-header:has(.sky-modal-header-content:empty){display:none}.sky-modal-btn-help,.sky-modal-btn-close{display:var(--sky-override-modal-help-close-display, none)}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-right)) + var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-left)))));margin:var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-top) var(--sky-comp-modal-fullscreen-space-offset-xs-right) var(--sky-comp-modal-fullscreen-space-offset-xs-bottom) var(--sky-comp-modal-fullscreen-space-offset-xs-left))}@media (min-width: 768px){.sky-modal:not(.sky-modal-full-page){margin:var(--sky-override-modal-margin, var(--sky-comp-modal-space-offset-sm-top) auto var(--sky-comp-modal-space-offset-sm-bottom))}.sky-modal-small{width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-small .sky-modal-content,.sky-modal-small .sky-modal-header,.sky-modal-small .sky-modal-footer{max-width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-medium{width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-medium .sky-modal-content,.sky-modal-medium .sky-modal-header,.sky-modal-medium .sky-modal-footer{max-width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-left)) + var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-right)))));margin:var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-top) var(--sky-comp-modal-fullscreen-space-offset-sm-right) var(--sky-comp-modal-fullscreen-space-offset-sm-bottom) var(--sky-comp-modal-fullscreen-space-offset-sm-left))}}@media (min-width: 920px){.sky-modal-large{width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}.sky-modal-large .sky-modal-content,.sky-modal-large .sky-modal-header,.sky-modal-large .sky-modal-footer{max-width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}}.sky-modal-content{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) )}.sky-modal-content:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-content.sky-layout-host-fit{flex-grow:1;position:relative}.sky-modal-tiled .sky-modal-content{background-color:#eeeeef;--sky-background-color-page-default: $sky-background-color-neutral-light}.sky-modal-tiled .sky-modal-content ::ng-deep .sky-tile-title{font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:300;font-size:19px}.sky-modal-header{padding:var(--sky-override-modal-header-padding, var(--sky-comp-modal-header-space-inset-top) var(--sky-comp-modal-header-space-inset-right) var(--sky-comp-modal-header-space-inset-bottom) var(--sky-comp-modal-header-space-inset-left));background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));border-bottom:var(--sky-override-modal-header-bottom-border);display:flex;align-items:baseline}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-btn{border:none;color:#686c73;cursor:pointer}.sky-modal-header-buttons .sky-btn:hover{color:#383a3d;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-full-page .sky-modal-content{flex-grow:1}.sky-modal-content>::ng-deep sky-dock{bottom:var(--sky-override-modal-dock-bottom, 0);margin-left:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-right:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-bottom:var(--sky-override-modal-dock-margin-left-right-bottom, initial);padding-top:var(--sky-override-modal-dock-padding-top, initial);width:var(--sky-override-modal-dock-width, 100%)}.sky-modal-viewkeeper .sky-modal-header{box-shadow:none!important}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed{box-shadow:var(--sky-override-modal-viewkept-toolbar-box-shadow, var(--sky-elevation-overflow))}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed>sky-toolbar .sky-toolbar-container{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) );padding-left:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-left));padding-right:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-right))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "component", type: i2.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["iconName", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: SkyLayoutHostDirective, selector: "[skyLayoutHost]", inputs: ["layout"] }, { kind: "component", type: SkyModalHeaderComponent, selector: "sky-modal-header" }, { kind: "ngmodule", type: SkyModalsResourcesModule }, { kind: "directive", type: SkyScrollShadowDirective, selector: "[skyScrollShadow]", inputs: ["skyScrollShadowEnabled"], outputs: ["skyScrollShadow"] }, { kind: "ngmodule", type: SkyThemeModule }, { kind: "directive", type: i5.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i6.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
709
718
|
}
|
|
710
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
719
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalComponent, decorators: [{
|
|
711
720
|
type: Component,
|
|
712
721
|
args: [{ selector: 'sky-modal', providers: [
|
|
713
722
|
SkyModalComponentAdapterService,
|
|
@@ -723,7 +732,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
723
732
|
SkyModalsResourcesModule,
|
|
724
733
|
SkyScrollShadowDirective,
|
|
725
734
|
SkyThemeModule,
|
|
726
|
-
], template: "<div\n class=\"sky-modal-dialog\"\n aria-modal=\"true\"\n [attr.aria-describedby]=\"ariaDescribedBy || modalContentId.id\"\n [attr.aria-labelledby]=\"ariaLabelledBy || headerId.id\"\n [attr.aria-owns]=\"ariaOwns\"\n [attr.role]=\"ariaRoleOrDefault\"\n (window:resize)=\"windowResize()\"\n>\n <div\n class=\"sky-modal sky-shadow sky-box sky-elevation-16 sky-modal-{{ size }}\"\n tabindex=\"-1\"\n [ngClass]=\"{\n 'sky-modal-tiled': tiledBody,\n 'sky-modal-viewkeeper': viewkeeperEnabled()\n }\"\n [ngStyle]=\"{\n zIndex: modalZIndex\n }\"\n >\n <div\n class=\"sky-modal-header\"\n [ngStyle]=\"{\n 'box-shadow': scrollShadow?.topShadow\n }\"\n >\n <div #headerId=\"skyId\" class=\"sky-modal-header-content\" skyId>\n @if (headingText) {\n <sky-modal-header>\n {{ headingText }}\n @if (helpKey || helpPopoverContent) {\n <sky-help-inline\n class=\"sky-control-help\"\n [helpKey]=\"helpKey\"\n [labelText]=\"headingText\"\n [popoverContent]=\"helpPopoverContent\"\n [popoverTitle]=\"helpPopoverTitle\"\n />\n }\n </sky-modal-header>\n } @else {\n <ng-content select=\"sky-modal-header\" />\n }\n </div>\n <div class=\"sky-modal-header-buttons\">\n @if (legacyHelpKey) {\n <button\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 iconName=\"question-circle\" />\n </button>\n }\n\n <button\n type=\"button\"\n class=\"sky-btn sky-modal-btn-close\"\n [attr.aria-label]=\"'skyux_modal_close' | skyLibResources\"\n (click)=\"closeButtonClick()\"\n >\n <sky-icon iconName=\"close\" />\n </button>\n </div>\n </div>\n <div\n #modalContentId=\"skyId\"\n #modalContentWrapper\n class=\"sky-modal-content\"\n role=\"region\"\n tabindex=\"0\"\n skyId\n skyLayoutHost\n [layout]=\"layout()\"\n [attr.aria-labelledby]=\"headerId.id\"\n [skyScrollShadowEnabled]=\"scrollShadowEnabled\"\n [skyThemeClass]=\"{\n 'sky-padding-even-large': 'default'\n }\"\n (skyScrollShadow)=\"scrollShadowChange($event)\"\n >\n <ng-content select=\"sky-modal-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\" />\n </div>\n </div>\n</div>\n", styles: [".sky-modal:not(.sky-theme-modern *){--sky-override-modal-background-color: #fff;--sky-override-modal-border: 1px solid #cdcfd2;--sky-override-modal-dock-bottom: -15px;--sky-override-modal-dock-margin-left-right-bottom: -15px;--sky-override-modal-dock-padding-top: 15px;--sky-override-modal-dock-width: calc(100% + 30px) ;--sky-override-modal-full-page-margin-xs: 0;--sky-override-modal-full-page-margin: 0;--sky-override-modal-full-page-width: 100%;--sky-override-modal-header-bottom-border: 1px solid #e2e3e4;--sky-override-modal-header-padding: 9px 3px 9px 15px;--sky-override-modal-help-close-display: inline-block;--sky-override-modal-margin: 20px auto;--sky-override-modal-viewkept-toolbar-box-shadow: none;--sky-override-modal-viewkept-toolbar-padding-horizontal: 10px;--sky-override-modal-width-l: 900px;--sky-override-modal-width-m: 600px;--sky-override-modal-width-s: 300px;--sky-override-modal-xs-margin: 30px 10px 10px 10px}:host{--sky-viewport-top: 0;--sky-viewport-bottom: 0;--sky-viewport-left: 0;--sky-viewport-right: 0}.sky-modal{--sky-comp-override-list-header-background-color: initial;border:var(--sky-override-modal-border, var(--sky-border-width-container-base) solid var(--sky-color-border-container-base));position:fixed;width:auto;left:0;right:0;top:0;margin:var(--sky-override-modal-xs-margin, var(--sky-comp-modal-space-offset-xs-top) var(--sky-comp-modal-space-offset-xs-right) var(--sky-comp-modal-space-offset-xs-bottom) var(--sky-comp-modal-space-offset-xs-left));display:flex;flex-direction:column;overflow:hidden}.sky-modal:has(.sky-modal-content.sky-layout-host-fit){height:var(--sky-modal-content-max-height, 100%)}.sky-modal:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-header:has(.sky-modal-header-content:empty){display:none}.sky-modal-btn-help,.sky-modal-btn-close{display:var(--sky-override-modal-help-close-display, none)}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-right)) + var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-left)))));margin:var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-top) var(--sky-comp-modal-fullscreen-space-offset-xs-right) var(--sky-comp-modal-fullscreen-space-offset-xs-bottom) var(--sky-comp-modal-fullscreen-space-offset-xs-left))}@media (min-width: 768px){.sky-modal:not(.sky-modal-full-page){margin:var(--sky-override-modal-margin, var(--sky-comp-modal-space-offset-sm-top) auto var(--sky-comp-modal-space-offset-sm-bottom))}.sky-modal-small{width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-small .sky-modal-content,.sky-modal-small .sky-modal-header,.sky-modal-small .sky-modal-footer{max-width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-medium{width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-medium .sky-modal-content,.sky-modal-medium .sky-modal-header,.sky-modal-medium .sky-modal-footer{max-width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-left)) + var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-right)))));margin:var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-top) var(--sky-comp-modal-fullscreen-space-offset-sm-right) var(--sky-comp-modal-fullscreen-space-offset-sm-bottom) var(--sky-comp-modal-fullscreen-space-offset-sm-left))}}@media (min-width: 920px){.sky-modal-large{width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}.sky-modal-large .sky-modal-content,.sky-modal-large .sky-modal-header,.sky-modal-large .sky-modal-footer{max-width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}}.sky-modal-content{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) )}.sky-modal-content:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-content.sky-layout-host-fit{flex-grow:1;position:relative}.sky-modal-tiled .sky-modal-content{background-color:#eeeeef;--sky-background-color-page-default: $sky-background-color-neutral-light}.sky-modal-tiled .sky-modal-content ::ng-deep .sky-tile-title{font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:300;font-size:19px}.sky-modal-header{padding:var(--sky-override-modal-header-padding, var(--sky-comp-modal-header-space-inset-top) var(--sky-comp-modal-header-space-inset-right) var(--sky-comp-modal-header-space-inset-bottom) var(--sky-comp-modal-header-space-inset-left));background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));border-bottom:var(--sky-override-modal-header-bottom-border);display:flex;align-items:baseline}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-btn{border:none;color:#686c73;cursor:pointer}.sky-modal-header-buttons .sky-btn:hover{color:#383a3d;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-full-page .sky-modal-content{flex-grow:1}.sky-modal-content>::ng-deep sky-dock{bottom:var(--sky-override-modal-dock-bottom, 0);margin-left:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-right:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-bottom:var(--sky-override-modal-dock-margin-left-right-bottom, initial);padding-top:var(--sky-override-modal-dock-padding-top, initial);width:var(--sky-override-modal-dock-width, 100%)}.sky-modal-viewkeeper .sky-modal-header{box-shadow:none!important}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed{box-shadow:var(--sky-override-modal-viewkept-toolbar-box-shadow, var(--sky-elevation-overflow))}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed>sky-toolbar .sky-toolbar-container{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) );padding-left:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-left));padding-right:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-right))}\n"] }]
|
|
735
|
+
], template: "<div\n class=\"sky-modal-dialog\"\n aria-modal=\"true\"\n [attr.aria-describedby]=\"ariaDescribedBy || modalContentId.id\"\n [attr.aria-labelledby]=\"ariaLabelledBy || headerId.id\"\n [attr.aria-owns]=\"ariaOwns\"\n [attr.role]=\"ariaRoleOrDefault\"\n (window:resize)=\"windowResize()\"\n>\n <div\n class=\"sky-modal sky-shadow sky-box sky-elevation-16 sky-modal-{{ size }}\"\n tabindex=\"-1\"\n [ngClass]=\"{\n 'sky-modal-tiled': tiledBody,\n 'sky-modal-viewkeeper': viewkeeperEnabled()\n }\"\n [ngStyle]=\"{\n zIndex: modalZIndex\n }\"\n >\n <div\n class=\"sky-modal-header\"\n [hidden]=\"headingHidden()\"\n [ngStyle]=\"{\n 'box-shadow': scrollShadow?.topShadow\n }\"\n >\n <div #headerId=\"skyId\" class=\"sky-modal-header-content\" skyId>\n @if (headingText) {\n <sky-modal-header>\n {{ headingText }}\n @if (helpKey || helpPopoverContent) {\n <sky-help-inline\n class=\"sky-control-help\"\n [helpKey]=\"helpKey\"\n [labelText]=\"headingText\"\n [popoverContent]=\"helpPopoverContent\"\n [popoverTitle]=\"helpPopoverTitle\"\n />\n }\n </sky-modal-header>\n } @else {\n <ng-content select=\"sky-modal-header\" />\n }\n </div>\n <div class=\"sky-modal-header-buttons\">\n @if (legacyHelpKey) {\n <button\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 iconName=\"question-circle\" />\n </button>\n }\n\n <button\n type=\"button\"\n class=\"sky-btn sky-modal-btn-close\"\n [attr.aria-label]=\"'skyux_modal_close' | skyLibResources\"\n (click)=\"closeButtonClick()\"\n >\n <sky-icon iconName=\"close\" />\n </button>\n </div>\n </div>\n <div\n #modalContentId=\"skyId\"\n #modalContentWrapper\n class=\"sky-modal-content\"\n role=\"region\"\n tabindex=\"0\"\n skyId\n skyLayoutHost\n [layout]=\"layout()\"\n [attr.aria-labelledby]=\"headerId.id\"\n [skyScrollShadowEnabled]=\"scrollShadowEnabled\"\n [skyThemeClass]=\"{\n 'sky-padding-even-large': 'default'\n }\"\n (skyScrollShadow)=\"scrollShadowChange($event)\"\n >\n <ng-content select=\"sky-modal-banner\" />\n <ng-content select=\"sky-modal-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\" />\n </div>\n </div>\n</div>\n", styles: [".sky-modal:not(.sky-theme-modern *){--sky-override-modal-background-color: #fff;--sky-override-modal-border: 1px solid #cdcfd2;--sky-override-modal-dock-bottom: -15px;--sky-override-modal-dock-margin-left-right-bottom: -15px;--sky-override-modal-dock-padding-top: 15px;--sky-override-modal-dock-width: calc(100% + 30px) ;--sky-override-modal-full-page-margin-xs: 0;--sky-override-modal-full-page-margin: 0;--sky-override-modal-full-page-width: 100%;--sky-override-modal-header-bottom-border: 1px solid #e2e3e4;--sky-override-modal-header-padding: 9px 3px 9px 15px;--sky-override-modal-help-close-display: inline-block;--sky-override-modal-margin: 20px auto;--sky-override-modal-viewkept-toolbar-box-shadow: none;--sky-override-modal-viewkept-toolbar-padding-horizontal: 10px;--sky-override-modal-width-l: 900px;--sky-override-modal-width-m: 600px;--sky-override-modal-width-s: 300px;--sky-override-modal-xs-margin: 30px 10px 10px 10px}:host{--sky-viewport-top: 0;--sky-viewport-bottom: 0;--sky-viewport-left: 0;--sky-viewport-right: 0}.sky-modal{--sky-comp-override-list-header-background-color: initial;border:var(--sky-override-modal-border, var(--sky-border-width-container-base) solid var(--sky-color-border-container-base));position:fixed;width:auto;left:0;right:0;top:0;margin:var(--sky-override-modal-xs-margin, var(--sky-comp-modal-space-offset-xs-top) var(--sky-comp-modal-space-offset-xs-right) var(--sky-comp-modal-space-offset-xs-bottom) var(--sky-comp-modal-space-offset-xs-left));display:flex;flex-direction:column;overflow:hidden}.sky-modal:has(.sky-modal-content.sky-layout-host-fit){height:var(--sky-modal-content-max-height, 100%)}.sky-modal:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-header:has(.sky-modal-header-content:empty){display:none}.sky-modal-btn-help,.sky-modal-btn-close{display:var(--sky-override-modal-help-close-display, none)}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-right)) + var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-left)))));margin:var(--sky-override-modal-full-page-margin-xs, var(--sky-comp-modal-fullscreen-space-offset-xs-top) var(--sky-comp-modal-fullscreen-space-offset-xs-right) var(--sky-comp-modal-fullscreen-space-offset-xs-bottom) var(--sky-comp-modal-fullscreen-space-offset-xs-left))}@media (min-width: 768px){.sky-modal:not(.sky-modal-full-page){margin:var(--sky-override-modal-margin, var(--sky-comp-modal-space-offset-sm-top) auto var(--sky-comp-modal-space-offset-sm-bottom))}.sky-modal-small{width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-small .sky-modal-content,.sky-modal-small .sky-modal-header,.sky-modal-small .sky-modal-footer{max-width:var(--sky-override-modal-width-s, var(--sky-size-width-modal-s))}.sky-modal-medium{width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-medium .sky-modal-content,.sky-modal-medium .sky-modal-header,.sky-modal-medium .sky-modal-footer{max-width:var(--sky-override-modal-width-m, var(--sky-size-width-modal-m))}.sky-modal-full-page{width:var(--sky-override-modal-full-page-width, calc(100% - (var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-left)) + var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-right)))));margin:var(--sky-override-modal-full-page-margin, var(--sky-comp-modal-fullscreen-space-offset-sm-top) var(--sky-comp-modal-fullscreen-space-offset-sm-right) var(--sky-comp-modal-fullscreen-space-offset-sm-bottom) var(--sky-comp-modal-fullscreen-space-offset-sm-left))}}@media (min-width: 920px){.sky-modal-large{width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}.sky-modal-large .sky-modal-content,.sky-modal-large .sky-modal-header,.sky-modal-large .sky-modal-footer{max-width:var(--sky-override-modal-width-l, var(--sky-size-width-modal-l))}}.sky-modal-content{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) )}.sky-modal-content:focus{outline-style:dotted;outline-width:thin;outline-offset:-1px}.sky-modal-content.sky-layout-host-fit{flex-grow:1;position:relative}.sky-modal-tiled .sky-modal-content{background-color:#eeeeef;--sky-background-color-page-default: $sky-background-color-neutral-light}.sky-modal-tiled .sky-modal-content ::ng-deep .sky-tile-title{font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:300;font-size:19px}.sky-modal-header{padding:var(--sky-override-modal-header-padding, var(--sky-comp-modal-header-space-inset-top) var(--sky-comp-modal-header-space-inset-right) var(--sky-comp-modal-header-space-inset-bottom) var(--sky-comp-modal-header-space-inset-left));background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));border-bottom:var(--sky-override-modal-header-bottom-border);display:flex;align-items:baseline}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-btn{border:none;color:#686c73;cursor:pointer}.sky-modal-header-buttons .sky-btn:hover{color:#383a3d;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-full-page .sky-modal-content{flex-grow:1}.sky-modal-content>::ng-deep sky-dock{bottom:var(--sky-override-modal-dock-bottom, 0);margin-left:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-right:var(--sky-override-modal-dock-margin-left-right-bottom, initial);margin-bottom:var(--sky-override-modal-dock-margin-left-right-bottom, initial);padding-top:var(--sky-override-modal-dock-padding-top, initial);width:var(--sky-override-modal-dock-width, 100%)}.sky-modal-viewkeeper .sky-modal-header{box-shadow:none!important}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed{box-shadow:var(--sky-override-modal-viewkept-toolbar-box-shadow, var(--sky-elevation-overflow))}.sky-modal-viewkeeper .sky-modal-content ::ng-deep sky-modal-content>.sky-viewkeeper-fixed>sky-toolbar .sky-toolbar-container{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));--sky-background-color-page-default: var( --sky-override-modal-background-color, var(--sky-color-background-container-base) );padding-left:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-left));padding-right:var(--sky-override-modal-viewkept-toolbar-padding-horizontal, var(--sky-comp-modal-header-space-inset-right))}\n"] }]
|
|
727
736
|
}], ctorParameters: () => [], propDecorators: { wrapperClass: [{
|
|
728
737
|
type: HostBinding,
|
|
729
738
|
args: ['class']
|
|
@@ -745,7 +754,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
745
754
|
type: Input
|
|
746
755
|
}], ariaLabelledBy: [{
|
|
747
756
|
type: Input
|
|
748
|
-
}], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], modalContentWrapperElement: [{
|
|
757
|
+
}], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], headingHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingHidden", required: false }] }], modalContentWrapperElement: [{
|
|
749
758
|
type: ViewChild,
|
|
750
759
|
args: ['modalContentWrapper', { read: ElementRef }]
|
|
751
760
|
}], onDocumentKeyUp: [{
|
|
@@ -874,10 +883,10 @@ class SkyConfirmComponent {
|
|
|
874
883
|
autofocus: config.autofocus || false,
|
|
875
884
|
}));
|
|
876
885
|
}
|
|
877
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
878
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
886
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
887
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: SkyConfirmComponent, isStandalone: true, selector: "sky-confirm", ngImport: i0, template: "<div class=\"sky-confirm\" [ngClass]=\"{ 'sky-confirm-type-ok': isOkType }\">\n <sky-modal\n ariaRole=\"alertdialog\"\n [ariaLabelledBy]=\"confirmMessage.id\"\n [ariaDescribedBy]=\"body ? bodyId : undefined\"\n >\n <sky-modal-content class=\"sky-confirm-content\">\n <!--\n The following \"magic comment\" keeps Prettier from adding line breaks\n inside the div and causing leading and trailing whitespace when\n `preserveWhiteSpace` is `true`.\n https://prettier.io/blog/2018/11/07/1.15.0.html#whitespace-sensitive-formatting\n -->\n <!-- display: inline -->\n <div\n #confirmMessage=\"skyId\"\n class=\"sky-confirm-message\"\n skyId\n [ngClass]=\"{\n 'sky-confirm-preserve-white-space': preserveWhiteSpace\n }\"\n [skyThemeClass]=\"{\n 'sky-font-display-4': 'default'\n }\"\n >{{ message }}</div\n >\n\n @if (body) {\n <!--\n The following \"magic comment\" keeps Prettier from adding line breaks\n inside the div and causing leading and trailing whitespace when\n `preserveWhiteSpace` is `true`.\n https://prettier.io/blog/2018/11/07/1.15.0.html#whitespace-sensitive-formatting\n -->\n <!-- display: inline -->\n <div\n class=\"sky-confirm-body\"\n [id]=\"bodyId\"\n [ngClass]=\"{\n 'sky-confirm-preserve-white-space': preserveWhiteSpace\n }\"\n >{{ body }}</div\n >\n }\n\n <div class=\"sky-confirm-buttons\">\n @for (button of buttons; track button.text) {\n <button\n type=\"button\"\n class=\"sky-btn\"\n [ngClass]=\"'sky-btn-' + button.styleType\"\n [attr.autofocus]=\"button.autofocus ? 'autofocus' : null\"\n (click)=\"close(button)\"\n >\n {{ button.text }}\n </button>\n }\n </div>\n </sky-modal-content>\n </sky-modal>\n</div>\n", styles: [".sky-confirm:not(.sky-theme-modern *){--sky-override-confirm-body-padding: 8px 0 0;--sky-override-confirm-btn-spacing: 5px;--sky-override-confirm-footer-padding: 20px 0 0;--sky-override-confirm-header-font-size: 16px;--sky-override-confirm-message-padding: 5px 0 0}.sky-confirm-content{padding:0}.sky-confirm-message{padding:var(--sky-override-confirm-message-padding, var(--sky-comp-modal-header-space-inset-top) var(--sky-comp-modal-header-space-inset-right) var(--sky-comp-modal-header-space-inset-bottom) var(--sky-comp-modal-header-space-inset-left));color:var(--sky-color-text-heading);font-size:var(--sky-override-confirm-header-font-size, var(--sky-font-size-heading-2))}.sky-confirm-body{padding:var(--sky-override-confirm-body-padding, var(--sky-comp-modal-content-space-inset-top) var(--sky-comp-modal-content-space-inset-right) var(--sky-comp-modal-content-space-inset-bottom) var(--sky-comp-modal-content-space-inset-left))}.sky-confirm-buttons{padding:var(--sky-override-confirm-footer-padding, var(--sky-comp-modal-footer-space-inset-top) var(--sky-comp-modal-footer-space-inset-right) var(--sky-comp-modal-footer-space-inset-bottom) var(--sky-comp-modal-footer-space-inset-left))}.sky-confirm-preserve-white-space{white-space:pre-wrap}.sky-confirm .sky-btn{margin-right:var(--sky-override-confirm-btn-spacing, var(--sky-space-gap-action_group-m))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: SkyModalComponent, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout", "headingHidden"] }, { kind: "component", type: SkyModalContentComponent, selector: "sky-modal-content" }, { kind: "ngmodule", type: SkyModalsResourcesModule }, { kind: "ngmodule", type: SkyThemeModule }, { kind: "directive", type: i5.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }] }); }
|
|
879
888
|
}
|
|
880
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
889
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmComponent, decorators: [{
|
|
881
890
|
type: Component,
|
|
882
891
|
args: [{ selector: 'sky-confirm', imports: [
|
|
883
892
|
CommonModule,
|
|
@@ -898,10 +907,10 @@ class SkyModalHostContext {
|
|
|
898
907
|
constructor(args) {
|
|
899
908
|
this.args = args;
|
|
900
909
|
}
|
|
901
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
902
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
910
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostContext, deps: [{ token: 'SkyModalHostContextArgs' }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
911
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostContext }); }
|
|
903
912
|
}
|
|
904
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
913
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostContext, decorators: [{
|
|
905
914
|
type: Injectable
|
|
906
915
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
907
916
|
type: Inject,
|
|
@@ -1019,10 +1028,10 @@ class SkyModalAdapterService {
|
|
|
1019
1028
|
topModal.nativeElement.previousElementSibling.removeAttribute('aria-hidden');
|
|
1020
1029
|
}
|
|
1021
1030
|
}
|
|
1022
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1023
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1031
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalAdapterService, deps: [{ token: i1.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1032
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalAdapterService }); }
|
|
1024
1033
|
}
|
|
1025
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1034
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalAdapterService, decorators: [{
|
|
1026
1035
|
type: Injectable
|
|
1027
1036
|
}], ctorParameters: () => [{ type: i1.SkyAppWindowRef }] });
|
|
1028
1037
|
|
|
@@ -1160,10 +1169,10 @@ class SkyModalHostComponent {
|
|
|
1160
1169
|
instance.close();
|
|
1161
1170
|
}
|
|
1162
1171
|
}
|
|
1163
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1164
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
1172
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1173
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: SkyModalHostComponent, isStandalone: true, selector: "sky-modal-host", viewQueries: [{ propertyName: "target", first: true, predicate: ["target"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<div\n class=\"sky-modal-host-backdrop\"\n [hidden]=\"modalCount() === 0\"\n [ngStyle]=\"{\n zIndex: backdropZIndex()\n }\"\n></div>\n<div #target></div>\n", styles: [".sky-modal-host-backdrop:not(.sky-theme-modern *){--sky-override-modal-host-backdrop-color: rgba(0, 0, 0, .5)}.sky-modal-host-backdrop{background-color:var(--sky-override-modal-host-backdrop-color, var(--sky-color-background-scrim));position:fixed;inset:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: SkyModalsResourcesModule }], viewProviders: [SkyModalAdapterService] }); }
|
|
1165
1174
|
}
|
|
1166
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1175
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalHostComponent, decorators: [{
|
|
1167
1176
|
type: Component,
|
|
1168
1177
|
args: [{ selector: 'sky-modal-host', viewProviders: [SkyModalAdapterService], imports: [CommonModule, RouterModule, SkyModalsResourcesModule], template: "<div\n class=\"sky-modal-host-backdrop\"\n [hidden]=\"modalCount() === 0\"\n [ngStyle]=\"{\n zIndex: backdropZIndex()\n }\"\n></div>\n<div #target></div>\n", styles: [".sky-modal-host-backdrop:not(.sky-theme-modern *){--sky-override-modal-host-backdrop-color: rgba(0, 0, 0, .5)}.sky-modal-host-backdrop{background-color:var(--sky-override-modal-host-backdrop-color, var(--sky-color-background-scrim));position:fixed;inset:0}\n"] }]
|
|
1169
1178
|
}], propDecorators: { target: [{
|
|
@@ -1254,10 +1263,10 @@ class SkyModalService {
|
|
|
1254
1263
|
});
|
|
1255
1264
|
return componentRef;
|
|
1256
1265
|
}
|
|
1257
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1258
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1266
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalService, deps: [{ token: i1.SkyDynamicComponentService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1267
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalService, providedIn: 'root' }); }
|
|
1259
1268
|
}
|
|
1260
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1269
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalService, decorators: [{
|
|
1261
1270
|
type: Injectable,
|
|
1262
1271
|
args: [{
|
|
1263
1272
|
providedIn: 'root',
|
|
@@ -1273,10 +1282,10 @@ class SkyModalLegacyService extends SkyModalService {
|
|
|
1273
1282
|
constructor(dynamicComponentSvc) {
|
|
1274
1283
|
super(dynamicComponentSvc);
|
|
1275
1284
|
}
|
|
1276
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1277
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1285
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalLegacyService, deps: [{ token: i1.SkyDynamicComponentLegacyService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1286
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalLegacyService, providedIn: 'any' }); }
|
|
1278
1287
|
}
|
|
1279
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1288
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalLegacyService, decorators: [{
|
|
1280
1289
|
type: Injectable,
|
|
1281
1290
|
args: [{
|
|
1282
1291
|
// Must be 'any' so that the modal component is created in the context of its module's injector.
|
|
@@ -1314,16 +1323,46 @@ class SkyConfirmService {
|
|
|
1314
1323
|
});
|
|
1315
1324
|
return confirmInstance;
|
|
1316
1325
|
}
|
|
1317
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1318
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1326
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmService, deps: [{ token: SkyModalService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1327
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmService, providedIn: 'root' }); }
|
|
1319
1328
|
}
|
|
1320
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyConfirmService, decorators: [{
|
|
1321
1330
|
type: Injectable,
|
|
1322
1331
|
args: [{
|
|
1323
1332
|
providedIn: 'root',
|
|
1324
1333
|
}]
|
|
1325
1334
|
}], ctorParameters: () => [{ type: SkyModalService }] });
|
|
1326
1335
|
|
|
1336
|
+
/**
|
|
1337
|
+
* Specifies content to display at the top of the modal. The content extends
|
|
1338
|
+
* the full width of the modal without any padding or margin. In general, only
|
|
1339
|
+
* use a banner when the modal's `headingHidden` input is set to `true`.
|
|
1340
|
+
*/
|
|
1341
|
+
class SkyModalBannerComponent {
|
|
1342
|
+
constructor() {
|
|
1343
|
+
/**
|
|
1344
|
+
* The banner image to display at the top of the modal. To fit the allotted
|
|
1345
|
+
* space, the image must have a 5:3 aspect ratio. If it is wider, extra space
|
|
1346
|
+
* appears under the image. If it is narrower, the bottom of the image is
|
|
1347
|
+
* cropped.
|
|
1348
|
+
*/
|
|
1349
|
+
this.imageSrc = input('', ...(ngDevMode ? [{ debugName: "imageSrc" }] : []));
|
|
1350
|
+
this.backgroundImage = computed(() => {
|
|
1351
|
+
const imageSrc = this.imageSrc();
|
|
1352
|
+
return imageSrc ? `url("${imageSrc.replaceAll('"', '\\"')}")` : null;
|
|
1353
|
+
}, ...(ngDevMode ? [{ debugName: "backgroundImage" }] : []));
|
|
1354
|
+
}
|
|
1355
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1356
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.17", type: SkyModalBannerComponent, isStandalone: true, selector: "sky-modal-banner", inputs: { imageSrc: { classPropertyName: "imageSrc", publicName: "imageSrc", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.sky-modal-banner-with-image": "backgroundImage()", "style.background-image": "backgroundImage()" } }, ngImport: i0, template: "<ng-content />\n", styles: [":host{display:block}:host.sky-modal-banner-with-image{aspect-ratio:5/3;background-size:cover;background-repeat:no-repeat}\n"] }); }
|
|
1357
|
+
}
|
|
1358
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalBannerComponent, decorators: [{
|
|
1359
|
+
type: Component,
|
|
1360
|
+
args: [{ selector: 'sky-modal-banner', host: {
|
|
1361
|
+
'[class.sky-modal-banner-with-image]': 'backgroundImage()',
|
|
1362
|
+
'[style.background-image]': 'backgroundImage()',
|
|
1363
|
+
}, template: "<ng-content />\n", styles: [":host{display:block}:host.sky-modal-banner-with-image{aspect-ratio:5/3;background-size:cover;background-repeat:no-repeat}\n"] }]
|
|
1364
|
+
}], propDecorators: { imageSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageSrc", required: false }] }] } });
|
|
1365
|
+
|
|
1327
1366
|
/**
|
|
1328
1367
|
* Specifies content to display in the modal's footer.
|
|
1329
1368
|
*/
|
|
@@ -1331,10 +1370,10 @@ class SkyModalFooterComponent {
|
|
|
1331
1370
|
constructor() {
|
|
1332
1371
|
this.errorsSvc = inject(SkyModalErrorsService);
|
|
1333
1372
|
}
|
|
1334
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1335
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
1373
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1374
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: SkyModalFooterComponent, isStandalone: true, selector: "sky-modal-footer", hostDirectives: [{ directive: i1.SkyResponsiveHostDirective }], ngImport: i0, template: "<div class=\"sky-modal-footer-container\">\n <div aria-live=\"polite\">\n @if (errorsSvc.formErrors | async; as formErrors) {\n @if (formErrors.length > 0) {\n <div\n class=\"sky-modal-footer-errors sky-margin-stacked-lg sky-errors-overflow\"\n tabindex=\"0\"\n >\n @for (formError of formErrors; track formError.message) {\n <sky-status-indicator\n descriptionType=\"error\"\n indicatorType=\"danger\"\n [ngClass]=\"{\n 'sky-margin-stacked-sm':\n formErrors.indexOf(formError) < formErrors.length - 1,\n 'footer-error': true\n }\"\n >\n {{ formError.message }}\n </sky-status-indicator>\n }\n </div>\n }\n }\n </div>\n <ng-content />\n</div>\n", styles: [".sky-modal-footer-container:not(.sky-theme-modern *){--sky-override-modal-footer-border-top: 1px solid #e2e3e4;--sky-override-modal-footer-btn-btn-link-margin: -2px;--sky-override-modal-footer-btn-btn-margin: 10px;--sky-override-modal-footer-padding: 15px}sky-modal-footer{display:block}.sky-modal-footer-container{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));border-top:var(--sky-override-modal-footer-border-top, none);padding:var(--sky-override-modal-footer-padding, var(--sky-comp-modal-footer-space-inset-top) var(--sky-comp-modal-footer-space-inset-right) var(--sky-comp-modal-footer-space-inset-bottom) var(--sky-comp-modal-footer-space-inset-left))}.sky-modal-footer-container .sky-btn+.sky-btn{margin-left:var(--sky-override-modal-footer-btn-btn-margin, var(--sky-space-gap-action_group-m))}.sky-modal-footer-container .sky-btn+.sky-btn-link{margin-left:var(--sky-override-modal-footer-btn-btn-link-margin, var(--sky-space-gap-action_group-m))}.sky-modal-footer-container .sky-modal-footer-errors .footer-error{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SkyStatusIndicatorModule }, { kind: "component", type: i3$1.λ10, selector: "sky-status-indicator", inputs: ["indicatorType", "descriptionType", "customDescription", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1336
1375
|
}
|
|
1337
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1376
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalFooterComponent, decorators: [{
|
|
1338
1377
|
type: Component,
|
|
1339
1378
|
args: [{ hostDirectives: [SkyResponsiveHostDirective], selector: 'sky-modal-footer', encapsulation: ViewEncapsulation.None, imports: [CommonModule, SkyStatusIndicatorModule], template: "<div class=\"sky-modal-footer-container\">\n <div aria-live=\"polite\">\n @if (errorsSvc.formErrors | async; as formErrors) {\n @if (formErrors.length > 0) {\n <div\n class=\"sky-modal-footer-errors sky-margin-stacked-lg sky-errors-overflow\"\n tabindex=\"0\"\n >\n @for (formError of formErrors; track formError.message) {\n <sky-status-indicator\n descriptionType=\"error\"\n indicatorType=\"danger\"\n [ngClass]=\"{\n 'sky-margin-stacked-sm':\n formErrors.indexOf(formError) < formErrors.length - 1,\n 'footer-error': true\n }\"\n >\n {{ formError.message }}\n </sky-status-indicator>\n }\n </div>\n }\n }\n </div>\n <ng-content />\n</div>\n", styles: [".sky-modal-footer-container:not(.sky-theme-modern *){--sky-override-modal-footer-border-top: 1px solid #e2e3e4;--sky-override-modal-footer-btn-btn-link-margin: -2px;--sky-override-modal-footer-btn-btn-margin: 10px;--sky-override-modal-footer-padding: 15px}sky-modal-footer{display:block}.sky-modal-footer-container{background-color:var(--sky-override-modal-background-color, var(--sky-color-background-container-base));border-top:var(--sky-override-modal-footer-border-top, none);padding:var(--sky-override-modal-footer-padding, var(--sky-comp-modal-footer-space-inset-top) var(--sky-comp-modal-footer-space-inset-right) var(--sky-comp-modal-footer-space-inset-bottom) var(--sky-comp-modal-footer-space-inset-left))}.sky-modal-footer-container .sky-btn+.sky-btn{margin-left:var(--sky-override-modal-footer-btn-btn-margin, var(--sky-space-gap-action_group-m))}.sky-modal-footer-container .sky-btn+.sky-btn-link{margin-left:var(--sky-override-modal-footer-btn-btn-link-margin, var(--sky-space-gap-action_group-m))}.sky-modal-footer-container .sky-modal-footer-errors .footer-error{display:block}\n"] }]
|
|
1340
1379
|
}] });
|
|
@@ -1409,10 +1448,10 @@ class SkyModalIsDirtyDirective {
|
|
|
1409
1448
|
handler.closeModal();
|
|
1410
1449
|
}
|
|
1411
1450
|
}
|
|
1412
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1413
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
1451
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalIsDirtyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1452
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.17", type: SkyModalIsDirtyDirective, isStandalone: true, selector: "sky-modal[isDirty]", inputs: { isDirty: "isDirty" }, host: { properties: { "attr.data-sky-modal-is-dirty": "this.isDirty" } }, ngImport: i0 }); }
|
|
1414
1453
|
}
|
|
1415
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1454
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalIsDirtyDirective, decorators: [{
|
|
1416
1455
|
type: Directive,
|
|
1417
1456
|
args: [{
|
|
1418
1457
|
// Since this is limited to sky-modal, it should be safe to
|
|
@@ -1428,25 +1467,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
1428
1467
|
}] } });
|
|
1429
1468
|
|
|
1430
1469
|
class SkyModalModule {
|
|
1431
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1432
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
1470
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1471
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.17", ngImport: i0, type: SkyModalModule, imports: [SkyModalComponent,
|
|
1472
|
+
SkyModalBannerComponent,
|
|
1433
1473
|
SkyModalContentComponent,
|
|
1434
1474
|
SkyModalFooterComponent,
|
|
1435
1475
|
SkyModalHeaderComponent,
|
|
1436
1476
|
SkyModalIsDirtyDirective], exports: [SkyModalComponent,
|
|
1477
|
+
SkyModalBannerComponent,
|
|
1437
1478
|
SkyModalContentComponent,
|
|
1438
1479
|
SkyModalFooterComponent,
|
|
1439
1480
|
SkyModalHeaderComponent,
|
|
1440
1481
|
SkyModalIsDirtyDirective] }); }
|
|
1441
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
1482
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalModule, imports: [SkyModalComponent,
|
|
1442
1483
|
SkyModalFooterComponent,
|
|
1443
1484
|
SkyModalHeaderComponent] }); }
|
|
1444
1485
|
}
|
|
1445
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1486
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SkyModalModule, decorators: [{
|
|
1446
1487
|
type: NgModule,
|
|
1447
1488
|
args: [{
|
|
1448
1489
|
imports: [
|
|
1449
1490
|
SkyModalComponent,
|
|
1491
|
+
SkyModalBannerComponent,
|
|
1450
1492
|
SkyModalContentComponent,
|
|
1451
1493
|
SkyModalFooterComponent,
|
|
1452
1494
|
SkyModalHeaderComponent,
|
|
@@ -1454,6 +1496,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
1454
1496
|
],
|
|
1455
1497
|
exports: [
|
|
1456
1498
|
SkyModalComponent,
|
|
1499
|
+
SkyModalBannerComponent,
|
|
1457
1500
|
SkyModalContentComponent,
|
|
1458
1501
|
SkyModalFooterComponent,
|
|
1459
1502
|
SkyModalHeaderComponent,
|
|
@@ -1466,5 +1509,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
1466
1509
|
* Generated bundle index. Do not edit.
|
|
1467
1510
|
*/
|
|
1468
1511
|
|
|
1469
|
-
export { SkyConfirmInstance, SkyConfirmModule, SkyConfirmService, SkyConfirmType, SkyModalBeforeCloseHandler, SkyModalCloseArgs, SkyModalConfiguration, SkyModalErrorsService, SkyModalHostService, SkyModalInstance, SkyModalLegacyService, SkyModalModule, SkyModalService, SkyConfirmComponent as λ1, SkyModalContentComponent as λ2, SkyModalFooterComponent as λ3, SkyModalHeaderComponent as λ4, SkyModalComponent as λ5, SkyModalIsDirtyDirective as λ6 };
|
|
1512
|
+
export { SkyConfirmInstance, SkyConfirmModule, SkyConfirmService, SkyConfirmType, SkyModalBeforeCloseHandler, SkyModalCloseArgs, SkyModalConfiguration, SkyModalErrorsService, SkyModalHostService, SkyModalInstance, SkyModalLegacyService, SkyModalModule, SkyModalService, SkyConfirmComponent as λ1, SkyModalContentComponent as λ2, SkyModalFooterComponent as λ3, SkyModalHeaderComponent as λ4, SkyModalComponent as λ5, SkyModalIsDirtyDirective as λ6, SkyModalBannerComponent as λ7 };
|
|
1470
1513
|
//# sourceMappingURL=skyux-modals.mjs.map
|