@skyux/modals 14.3.12 → 15.0.0-alpha.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 +11 -11
- package/fesm2022/skyux-modals.mjs +91 -84
- package/fesm2022/skyux-modals.mjs.map +1 -1
- package/package.json +11 -11
|
@@ -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,
|
|
3
|
+
import { NgModule, InjectionToken, ViewEncapsulation, ChangeDetectionStrategy, Component, Injectable, input, booleanAttribute, inject, ChangeDetectorRef, ElementRef, HostListener, ViewChild, Input, HostBinding, Inject, EnvironmentInjector, ViewContainerRef, computed, Directive } from '@angular/core';
|
|
4
4
|
import * as i1$2 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: "
|
|
74
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
75
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
73
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
74
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmModule }); }
|
|
75
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmModule }); }
|
|
76
76
|
}
|
|
77
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
77
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", 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: "
|
|
92
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
91
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
92
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", 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"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
93
93
|
}
|
|
94
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
94
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", 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))}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"] }]
|
|
96
|
+
args: [{ hostDirectives: [SkyResponsiveHostDirective], selector: 'sky-modal-content', changeDetection: ChangeDetectionStrategy.Eager, 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: "
|
|
292
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
293
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
291
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalsResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
292
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.1", ngImport: i0, type: SkyModalsResourcesModule, exports: [SkyI18nModule] }); }
|
|
293
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalsResourcesModule, imports: [SkyI18nModule] }); }
|
|
294
294
|
}
|
|
295
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
295
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", 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: "
|
|
368
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
367
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalComponentAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
368
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalComponentAdapterService }); }
|
|
369
369
|
}
|
|
370
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
370
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", 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: "
|
|
382
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
381
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalConfiguration, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
382
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalConfiguration }); }
|
|
383
383
|
}
|
|
384
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
384
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", 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: "
|
|
400
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
399
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalErrorsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
400
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalErrorsService }); }
|
|
401
401
|
}
|
|
402
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
402
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalErrorsService, decorators: [{
|
|
403
403
|
type: Injectable
|
|
404
404
|
}], ctorParameters: () => [] });
|
|
405
405
|
|
|
@@ -408,15 +408,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
408
408
|
*/
|
|
409
409
|
class SkyModalHeaderInternalComponent {
|
|
410
410
|
constructor() {
|
|
411
|
-
this.headingText = input.required(
|
|
412
|
-
|
|
413
|
-
this.
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
411
|
+
this.headingText = input.required(/* @ts-ignore */
|
|
412
|
+
...(ngDevMode ? [{ debugName: "headingText" }] : /* istanbul ignore next */ []));
|
|
413
|
+
this.helpKey = input(/* @ts-ignore */
|
|
414
|
+
...(ngDevMode ? [undefined, { debugName: "helpKey" }] : /* istanbul ignore next */ []));
|
|
415
|
+
this.helpPopoverContent = input(/* @ts-ignore */
|
|
416
|
+
...(ngDevMode ? [undefined, { debugName: "helpPopoverContent" }] : /* istanbul ignore next */ []));
|
|
417
|
+
this.helpPopoverTitle = input(/* @ts-ignore */
|
|
418
|
+
...(ngDevMode ? [undefined, { debugName: "helpPopoverTitle" }] : /* istanbul ignore next */ []));
|
|
419
|
+
}
|
|
420
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHeaderInternalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
421
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: SkyModalHeaderInternalComponent, isStandalone: true, selector: "sky-modal-header-internal", inputs: { headingText: { classPropertyName: "headingText", publicName: "headingText", isSignal: true, isRequired: true, transformFunction: null }, helpKey: { classPropertyName: "helpKey", publicName: "helpKey", isSignal: true, isRequired: false, transformFunction: null }, helpPopoverContent: { classPropertyName: "helpPopoverContent", publicName: "helpPopoverContent", isSignal: true, isRequired: false, transformFunction: null }, helpPopoverTitle: { classPropertyName: "helpPopoverTitle", publicName: "helpPopoverTitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<h2 class=\"sky-modal-heading\">{{ headingText() }}</h2>\n@if (helpKey() || helpPopoverContent()) {\n <span class=\"sky-control-help-container\"\n ><sky-help-inline\n [helpKey]=\"helpKey()\"\n [labelText]=\"headingText()\"\n [popoverContent]=\"helpPopoverContent()\"\n [popoverTitle]=\"helpPopoverTitle()\"\n /></span>\n}\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: SkyHelpInlineModule }, { kind: "component", type: i1$1.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
418
422
|
}
|
|
419
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
423
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHeaderInternalComponent, decorators: [{
|
|
420
424
|
type: Component,
|
|
421
425
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, imports: [SkyHelpInlineModule], selector: 'sky-modal-header-internal', template: "<h2 class=\"sky-modal-heading\">{{ headingText() }}</h2>\n@if (helpKey() || helpPopoverContent()) {\n <span class=\"sky-control-help-container\"\n ><sky-help-inline\n [helpKey]=\"helpKey()\"\n [labelText]=\"headingText()\"\n [popoverContent]=\"helpPopoverContent()\"\n [popoverTitle]=\"helpPopoverTitle()\"\n /></span>\n}\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"] }]
|
|
422
426
|
}], propDecorators: { headingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingText", required: true }] }], helpKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "helpKey", required: false }] }], helpPopoverContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "helpPopoverContent", required: false }] }], helpPopoverTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "helpPopoverTitle", required: false }] }] } });
|
|
@@ -502,11 +506,11 @@ class SkyModalHostService {
|
|
|
502
506
|
#notifyBackdropZIndex() {
|
|
503
507
|
backdropZIndex.next(_a.backdropZIndex);
|
|
504
508
|
}
|
|
505
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
506
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
509
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
510
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostService, providedIn: 'root' }); }
|
|
507
511
|
}
|
|
508
512
|
_a = SkyModalHostService;
|
|
509
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
513
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostService, decorators: [{
|
|
510
514
|
type: Injectable,
|
|
511
515
|
args: [{
|
|
512
516
|
providedIn: 'root',
|
|
@@ -576,14 +580,15 @@ class SkyModalComponent {
|
|
|
576
580
|
#themeSvc;
|
|
577
581
|
constructor() {
|
|
578
582
|
this.ariaRoleOrDefault = ARIA_ROLE_DEFAULT;
|
|
579
|
-
this.layout = input('none',
|
|
583
|
+
this.layout = input('none', /* @ts-ignore */
|
|
584
|
+
...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
|
|
580
585
|
/**
|
|
581
586
|
* Whether to hide the modal's header, including the heading from `headingText`,
|
|
582
587
|
* the help inline button if `helpKey` is provided, and the close button in the
|
|
583
588
|
* top right. Reserve this property for specific use cases where you need a
|
|
584
589
|
* banner image in place of the header.
|
|
585
590
|
*/
|
|
586
|
-
this.headingHidden = input(false, { ...(ngDevMode ? { debugName: "headingHidden" } : {}), transform: booleanAttribute });
|
|
591
|
+
this.headingHidden = input(false, { ...(ngDevMode ? { debugName: "headingHidden" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
587
592
|
this.ariaOwns = null;
|
|
588
593
|
this.modalState = 'in';
|
|
589
594
|
this.scrollShadow = {
|
|
@@ -713,20 +718,20 @@ class SkyModalComponent {
|
|
|
713
718
|
viewkeeperEnabled() {
|
|
714
719
|
return this.#componentAdapter.modalContentHasDirectChildViewkeeper(this.#elRef);
|
|
715
720
|
}
|
|
716
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
717
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
721
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
722
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", 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: [
|
|
718
723
|
SkyModalComponentAdapterService,
|
|
719
724
|
SkyModalErrorsService,
|
|
720
725
|
SkyDockService,
|
|
721
|
-
], 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-internal\n [headingText]=\"headingText\"\n [helpKey]=\"helpKey\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [helpPopoverTitle]=\"helpPopoverTitle\"\n />\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-btn-borderless 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 [skyThemeClass]=\"{\n 'sky-btn-borderless': 'default',\n 'sky-btn-icon-borderless': 'modern'\n }\"\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-theme-padding-inset-balanced-m': '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-align-items: baseline;--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{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:var(--sky-override-modal-header-align-items, center)}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-modal-btn-close{margin-left:var(--sky-space-gap-text_action-l)}.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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i2.λ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: SkyModalHeaderInternalComponent, selector: "sky-modal-header-internal", inputs: ["headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle"] }, { kind: "ngmodule", type: SkyModalsResourcesModule }, { kind: "directive", type: SkyScrollShadowDirective, selector: "[skyScrollShadow]", inputs: ["skyScrollShadowEnabled"], outputs: ["skyScrollShadow"] }, { kind: "ngmodule", type: SkyThemeModule }, { kind: "directive", type: i4.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i5.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
726
|
+
], 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-internal\n [headingText]=\"headingText\"\n [helpKey]=\"helpKey\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [helpPopoverTitle]=\"helpPopoverTitle\"\n />\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-btn-borderless 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 [skyThemeClass]=\"{\n 'sky-btn-borderless': 'default',\n 'sky-btn-icon-borderless': 'modern'\n }\"\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-theme-padding-inset-balanced-m': '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-align-items: baseline;--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{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:var(--sky-override-modal-header-align-items, center)}.sky-modal-header-buttons{flex-shrink:.0001}.sky-modal-header-buttons .sky-modal-btn-close{margin-left:var(--sky-space-gap-text_action-l)}.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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i2.λ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: SkyModalHeaderInternalComponent, selector: "sky-modal-header-internal", inputs: ["headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle"] }, { kind: "ngmodule", type: SkyModalsResourcesModule }, { kind: "directive", type: SkyScrollShadowDirective, selector: "[skyScrollShadow]", inputs: ["skyScrollShadowEnabled"], outputs: ["skyScrollShadow"] }, { kind: "ngmodule", type: SkyThemeModule }, { kind: "directive", type: i4.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i5.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
722
727
|
}
|
|
723
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
728
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalComponent, decorators: [{
|
|
724
729
|
type: Component,
|
|
725
730
|
args: [{ selector: 'sky-modal', providers: [
|
|
726
731
|
SkyModalComponentAdapterService,
|
|
727
732
|
SkyModalErrorsService,
|
|
728
733
|
SkyDockService,
|
|
729
|
-
], imports: [
|
|
734
|
+
], changeDetection: ChangeDetectionStrategy.Eager, imports: [
|
|
730
735
|
CommonModule,
|
|
731
736
|
SkyHelpInlineModule,
|
|
732
737
|
SkyIconModule,
|
|
@@ -887,12 +892,12 @@ class SkyConfirmComponent {
|
|
|
887
892
|
autofocus: config.autofocus || false,
|
|
888
893
|
}));
|
|
889
894
|
}
|
|
890
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
891
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
895
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
896
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", 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$2.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: i4.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
892
897
|
}
|
|
893
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
898
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmComponent, decorators: [{
|
|
894
899
|
type: Component,
|
|
895
|
-
args: [{ selector: 'sky-confirm', imports: [
|
|
900
|
+
args: [{ selector: 'sky-confirm', changeDetection: ChangeDetectionStrategy.Eager, imports: [
|
|
896
901
|
CommonModule,
|
|
897
902
|
SkyIdModule,
|
|
898
903
|
SkyModalComponent,
|
|
@@ -911,10 +916,10 @@ class SkyModalHostContext {
|
|
|
911
916
|
constructor(args) {
|
|
912
917
|
this.args = args;
|
|
913
918
|
}
|
|
914
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
915
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
919
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostContext, deps: [{ token: 'SkyModalHostContextArgs' }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
920
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostContext }); }
|
|
916
921
|
}
|
|
917
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
922
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostContext, decorators: [{
|
|
918
923
|
type: Injectable
|
|
919
924
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
920
925
|
type: Inject,
|
|
@@ -1032,10 +1037,10 @@ class SkyModalAdapterService {
|
|
|
1032
1037
|
topModal.nativeElement.previousElementSibling.removeAttribute('aria-hidden');
|
|
1033
1038
|
}
|
|
1034
1039
|
}
|
|
1035
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1036
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1040
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalAdapterService, deps: [{ token: i1.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1041
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalAdapterService }); }
|
|
1037
1042
|
}
|
|
1038
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1043
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalAdapterService, decorators: [{
|
|
1039
1044
|
type: Injectable
|
|
1040
1045
|
}], ctorParameters: () => [{ type: i1.SkyAppWindowRef }] });
|
|
1041
1046
|
|
|
@@ -1173,12 +1178,12 @@ class SkyModalHostComponent {
|
|
|
1173
1178
|
instance.close();
|
|
1174
1179
|
}
|
|
1175
1180
|
}
|
|
1176
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1177
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1181
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1182
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", 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$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: SkyModalsResourcesModule }], viewProviders: [SkyModalAdapterService], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
1178
1183
|
}
|
|
1179
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1184
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHostComponent, decorators: [{
|
|
1180
1185
|
type: Component,
|
|
1181
|
-
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"] }]
|
|
1186
|
+
args: [{ selector: 'sky-modal-host', viewProviders: [SkyModalAdapterService], changeDetection: ChangeDetectionStrategy.Eager, 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"] }]
|
|
1182
1187
|
}], propDecorators: { target: [{
|
|
1183
1188
|
type: ViewChild,
|
|
1184
1189
|
args: ['target', {
|
|
@@ -1267,10 +1272,10 @@ class SkyModalService {
|
|
|
1267
1272
|
});
|
|
1268
1273
|
return componentRef;
|
|
1269
1274
|
}
|
|
1270
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1271
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1275
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalService, deps: [{ token: i1.SkyDynamicComponentService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1276
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalService, providedIn: 'root' }); }
|
|
1272
1277
|
}
|
|
1273
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalService, decorators: [{
|
|
1274
1279
|
type: Injectable,
|
|
1275
1280
|
args: [{
|
|
1276
1281
|
providedIn: 'root',
|
|
@@ -1286,10 +1291,10 @@ class SkyModalLegacyService extends SkyModalService {
|
|
|
1286
1291
|
constructor(dynamicComponentSvc) {
|
|
1287
1292
|
super(dynamicComponentSvc);
|
|
1288
1293
|
}
|
|
1289
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1290
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1294
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalLegacyService, deps: [{ token: i1.SkyDynamicComponentLegacyService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1295
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalLegacyService, providedIn: 'any' }); }
|
|
1291
1296
|
}
|
|
1292
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1297
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalLegacyService, decorators: [{
|
|
1293
1298
|
type: Injectable,
|
|
1294
1299
|
args: [{
|
|
1295
1300
|
// Must be 'any' so that the modal component is created in the context of its module's injector.
|
|
@@ -1327,10 +1332,10 @@ class SkyConfirmService {
|
|
|
1327
1332
|
});
|
|
1328
1333
|
return confirmInstance;
|
|
1329
1334
|
}
|
|
1330
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1331
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1335
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmService, deps: [{ token: SkyModalService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1336
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmService, providedIn: 'root' }); }
|
|
1332
1337
|
}
|
|
1333
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1338
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyConfirmService, decorators: [{
|
|
1334
1339
|
type: Injectable,
|
|
1335
1340
|
args: [{
|
|
1336
1341
|
providedIn: 'root',
|
|
@@ -1350,21 +1355,23 @@ class SkyModalBannerComponent {
|
|
|
1350
1355
|
* appears under the image. If it is narrower, the bottom of the image is
|
|
1351
1356
|
* cropped.
|
|
1352
1357
|
*/
|
|
1353
|
-
this.imageSrc = input('',
|
|
1358
|
+
this.imageSrc = input('', /* @ts-ignore */
|
|
1359
|
+
...(ngDevMode ? [{ debugName: "imageSrc" }] : /* istanbul ignore next */ []));
|
|
1354
1360
|
this.backgroundImage = computed(() => {
|
|
1355
1361
|
const imageSrc = this.imageSrc();
|
|
1356
1362
|
return imageSrc ? `url("${imageSrc.replaceAll('"', '\\"')}")` : null;
|
|
1357
|
-
},
|
|
1363
|
+
}, /* @ts-ignore */
|
|
1364
|
+
...(ngDevMode ? [{ debugName: "backgroundImage" }] : /* istanbul ignore next */ []));
|
|
1358
1365
|
}
|
|
1359
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1360
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
1366
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1367
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", 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"], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
1361
1368
|
}
|
|
1362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1369
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalBannerComponent, decorators: [{
|
|
1363
1370
|
type: Component,
|
|
1364
1371
|
args: [{ selector: 'sky-modal-banner', host: {
|
|
1365
1372
|
'[class.sky-modal-banner-with-image]': 'backgroundImage()',
|
|
1366
1373
|
'[style.background-image]': 'backgroundImage()',
|
|
1367
|
-
}, 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"] }]
|
|
1374
|
+
}, changeDetection: ChangeDetectionStrategy.Eager, 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"] }]
|
|
1368
1375
|
}], propDecorators: { imageSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageSrc", required: false }] }] } });
|
|
1369
1376
|
|
|
1370
1377
|
/**
|
|
@@ -1374,12 +1381,12 @@ class SkyModalFooterComponent {
|
|
|
1374
1381
|
constructor() {
|
|
1375
1382
|
this.errorsSvc = inject(SkyModalErrorsService);
|
|
1376
1383
|
}
|
|
1377
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1378
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1384
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1385
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", 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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SkyStatusIndicatorModule }, { kind: "component", type: i3.λ10, selector: "sky-status-indicator", inputs: ["indicatorType", "descriptionType", "customDescription", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1379
1386
|
}
|
|
1380
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1387
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalFooterComponent, decorators: [{
|
|
1381
1388
|
type: Component,
|
|
1382
|
-
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"] }]
|
|
1389
|
+
args: [{ hostDirectives: [SkyResponsiveHostDirective], selector: 'sky-modal-footer', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, 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"] }]
|
|
1383
1390
|
}] });
|
|
1384
1391
|
|
|
1385
1392
|
/**
|
|
@@ -1388,12 +1395,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
1388
1395
|
* For inline help, use the `helpKey` or `helpPopoverContent` inputs on the `sky-modal` component.
|
|
1389
1396
|
*/
|
|
1390
1397
|
class SkyModalHeaderComponent {
|
|
1391
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1392
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1398
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1399
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", 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]" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
1393
1400
|
}
|
|
1394
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1401
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalHeaderComponent, decorators: [{
|
|
1395
1402
|
type: Component,
|
|
1396
|
-
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"] }]
|
|
1403
|
+
args: [{ selector: 'sky-modal-header', changeDetection: ChangeDetectionStrategy.Eager, 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"] }]
|
|
1397
1404
|
}] });
|
|
1398
1405
|
|
|
1399
1406
|
/**
|
|
@@ -1466,10 +1473,10 @@ class SkyModalIsDirtyDirective {
|
|
|
1466
1473
|
handler.closeModal();
|
|
1467
1474
|
}
|
|
1468
1475
|
}
|
|
1469
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1470
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1476
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalIsDirtyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1477
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.1", type: SkyModalIsDirtyDirective, isStandalone: true, selector: "sky-modal[isDirty]", inputs: { isDirty: "isDirty" }, host: { properties: { "attr.data-sky-modal-is-dirty": "this.isDirty" } }, ngImport: i0 }); }
|
|
1471
1478
|
}
|
|
1472
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1479
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalIsDirtyDirective, decorators: [{
|
|
1473
1480
|
type: Directive,
|
|
1474
1481
|
args: [{
|
|
1475
1482
|
// Since this is limited to sky-modal, it should be safe to
|
|
@@ -1485,8 +1492,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
1485
1492
|
}] } });
|
|
1486
1493
|
|
|
1487
1494
|
class SkyModalModule {
|
|
1488
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1489
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1495
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1496
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.1", ngImport: i0, type: SkyModalModule, imports: [SkyModalComponent,
|
|
1490
1497
|
SkyModalBannerComponent,
|
|
1491
1498
|
SkyModalContentComponent,
|
|
1492
1499
|
SkyModalFooterComponent,
|
|
@@ -1497,11 +1504,11 @@ class SkyModalModule {
|
|
|
1497
1504
|
SkyModalFooterComponent,
|
|
1498
1505
|
SkyModalHeaderComponent,
|
|
1499
1506
|
SkyModalIsDirtyDirective] }); }
|
|
1500
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1507
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalModule, imports: [SkyModalComponent,
|
|
1501
1508
|
SkyModalFooterComponent,
|
|
1502
1509
|
SkyModalHeaderComponent] }); }
|
|
1503
1510
|
}
|
|
1504
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1511
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SkyModalModule, decorators: [{
|
|
1505
1512
|
type: NgModule,
|
|
1506
1513
|
args: [{
|
|
1507
1514
|
imports: [
|