@spicainternational/ngx-sds-components 5.10.1 → 5.10.2
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/esm2020/src/lib/modal/dialog/dialog.component.mjs +40 -4
- package/esm2020/src/lib/modal/modal.component.mjs +15 -5
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-modal.mjs +54 -6
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-modal.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs +52 -6
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs.map +1 -1
- package/package.json +1 -1
- package/src/lib/modal/dialog/dialog.component.d.ts +8 -1
- package/src/lib/modal/modal.component.d.ts +4 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
|
|
1
|
+
import { Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
import * as i1 from "../modal.component";
|
|
4
4
|
import * as i2 from "@angular/common";
|
|
@@ -13,23 +13,31 @@ export class SdsDialogComponent {
|
|
|
13
13
|
this.secondaryButtonText = 'Cancel';
|
|
14
14
|
this.secondaryButtonClass = 'btn-secondary';
|
|
15
15
|
this.secondaryButtonType = 'button';
|
|
16
|
+
this.closeOnEscape = true;
|
|
16
17
|
this.showHeader = true;
|
|
17
18
|
this.showCloseButton = true;
|
|
18
19
|
this.showPrimaryButton = true;
|
|
19
20
|
this.showSecondaryButton = true;
|
|
21
|
+
this.autofocusElement = this.showPrimaryButton ? 'primary' :
|
|
22
|
+
this.showSecondaryButton ? 'secondary' :
|
|
23
|
+
this.showCloseButton ? 'close' :
|
|
24
|
+
'content';
|
|
20
25
|
this.dialogOpen = new EventEmitter();
|
|
21
26
|
this.dialogClose = new EventEmitter();
|
|
27
|
+
this.isOpen = false;
|
|
22
28
|
}
|
|
23
29
|
ngOnInit() { }
|
|
24
30
|
open(callback, data) {
|
|
25
31
|
this._callback = callback;
|
|
26
32
|
this._callbackData = data;
|
|
27
33
|
if (this._modal != undefined) {
|
|
34
|
+
this.isOpen = true;
|
|
28
35
|
this._modal.open();
|
|
29
36
|
}
|
|
30
37
|
}
|
|
31
38
|
close() {
|
|
32
39
|
if (this._modal != undefined) {
|
|
40
|
+
this.isOpen = false;
|
|
33
41
|
this._modal.close();
|
|
34
42
|
}
|
|
35
43
|
}
|
|
@@ -55,13 +63,26 @@ export class SdsDialogComponent {
|
|
|
55
63
|
}
|
|
56
64
|
onModalOpen() {
|
|
57
65
|
this.dialogOpen.emit();
|
|
66
|
+
switch (this.autofocusElement) {
|
|
67
|
+
case 'primary':
|
|
68
|
+
this._primaryButton?.nativeElement.focus();
|
|
69
|
+
break;
|
|
70
|
+
case 'secondary':
|
|
71
|
+
this._secondaryButton?.nativeElement.focus();
|
|
72
|
+
break;
|
|
73
|
+
case 'content':
|
|
74
|
+
this._content?.nativeElement.focus();
|
|
75
|
+
break;
|
|
76
|
+
default:
|
|
77
|
+
break;
|
|
78
|
+
}
|
|
58
79
|
}
|
|
59
80
|
}
|
|
60
81
|
SdsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
61
|
-
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n
|
|
82
|
+
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", closeOnEscape: "closeOnEscape", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton", autofocusElement: "autofocusElement", modalDialogId: "modalDialogId" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true, read: ElementRef, static: true }, { propertyName: "_primaryButton", first: true, predicate: ["primaryButton"], descendants: true, read: ElementRef }, { propertyName: "_secondaryButton", first: true, predicate: ["secondaryButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""], components: [{ type: i1.SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "autoFocusCloseButton", "translations", "isScrollable", "closeOnEscape"], outputs: ["modalOpen", "modalClose", "closeClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
62
83
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, decorators: [{
|
|
63
84
|
type: Component,
|
|
64
|
-
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n
|
|
85
|
+
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""] }]
|
|
65
86
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
66
87
|
type: Input
|
|
67
88
|
}], closeText: [{
|
|
@@ -80,6 +101,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
80
101
|
type: Input
|
|
81
102
|
}], secondaryButtonType: [{
|
|
82
103
|
type: Input
|
|
104
|
+
}], closeOnEscape: [{
|
|
105
|
+
type: Input
|
|
83
106
|
}], showHeader: [{
|
|
84
107
|
type: Input
|
|
85
108
|
}], showCloseButton: [{
|
|
@@ -88,6 +111,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
88
111
|
type: Input
|
|
89
112
|
}], showSecondaryButton: [{
|
|
90
113
|
type: Input
|
|
114
|
+
}], autofocusElement: [{
|
|
115
|
+
type: Input
|
|
116
|
+
}], modalDialogId: [{
|
|
117
|
+
type: Input
|
|
91
118
|
}], dialogOpen: [{
|
|
92
119
|
type: Output
|
|
93
120
|
}], dialogClose: [{
|
|
@@ -95,5 +122,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
95
122
|
}], _modal: [{
|
|
96
123
|
type: ViewChild,
|
|
97
124
|
args: ['modal', { static: true }]
|
|
125
|
+
}], _content: [{
|
|
126
|
+
type: ViewChild,
|
|
127
|
+
args: ['content', { read: ElementRef, static: true }]
|
|
128
|
+
}], _primaryButton: [{
|
|
129
|
+
type: ViewChild,
|
|
130
|
+
args: ['primaryButton', { read: ElementRef, static: false }]
|
|
131
|
+
}], _secondaryButton: [{
|
|
132
|
+
type: ViewChild,
|
|
133
|
+
args: ['secondaryButton', { read: ElementRef, static: false }]
|
|
98
134
|
}] } });
|
|
99
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlhbG9nLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL21vZGFsL2RpYWxvZy9kaWFsb2cuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvbW9kYWwvZGlhbG9nL2RpYWxvZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQXFCLE1BQU0sRUFBaUIsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBV3BILE1BQU0sT0FBTyxrQkFBa0I7SUEwQjNCO1FBekJnQixVQUFLLEdBQVcsRUFBRSxDQUFDO1FBQ25CLGNBQVMsR0FBWSxPQUFPLENBQUM7UUFDN0IsU0FBSSxHQUE4QixJQUFJLENBQUM7UUFFdkMsc0JBQWlCLEdBQVcsSUFBSSxDQUFDO1FBQ2pDLHVCQUFrQixHQUFXLGFBQWEsQ0FBQztRQUMzQyxzQkFBaUIsR0FBZSxRQUFRLENBQUM7UUFFekMsd0JBQW1CLEdBQVcsUUFBUSxDQUFDO1FBQ3ZDLHlCQUFvQixHQUFXLGVBQWUsQ0FBQztRQUMvQyx3QkFBbUIsR0FBZSxRQUFRLENBQUM7UUFFM0MsZUFBVSxHQUFZLElBQUksQ0FBQztRQUMzQixvQkFBZSxHQUFZLElBQUksQ0FBQztRQUNoQyxzQkFBaUIsR0FBWSxJQUFJLENBQUM7UUFDbEMsd0JBQW1CLEdBQVksSUFBSSxDQUFDO1FBRW5DLGVBQVUsR0FBdUIsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUMxRCxnQkFBVyxHQUF1QixJQUFJLFlBQVksRUFBUSxDQUFDO0lBTzdELENBQUM7SUFFaEIsUUFBUSxLQUFVLENBQUM7SUFFWixJQUFJLENBQUMsUUFBbUQsRUFBRSxJQUFVO1FBQ3ZFLElBQUksQ0FBQyxTQUFTLEdBQUcsUUFBUSxDQUFDO1FBQzFCLElBQUksQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDO1FBRTFCLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxTQUFTLEVBQUU7WUFDMUIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsQ0FBQztTQUN0QjtJQUNMLENBQUM7SUFFTyxLQUFLO1FBQ1QsSUFBSSxJQUFJLENBQUMsTUFBTSxJQUFJLFNBQVMsRUFBRTtZQUMxQixJQUFJLENBQUMsTUFBTSxDQUFDLEtBQUssRUFBRSxDQUFDO1NBQ3ZCO0lBQ0wsQ0FBQztJQUVNLGdCQUFnQjtRQUNuQixJQUFJLElBQUksQ0FBQyxTQUFTLEVBQUU7WUFDaEIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxXQUFXLEVBQUUsSUFBSSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1NBQ25EO1FBQ0QsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO0lBQ2pCLENBQUM7SUFFTSxjQUFjO1FBQ2pCLElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUNoQixJQUFJLENBQUMsU0FBUyxDQUFDLFNBQVMsRUFBRSxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7U0FDakQ7UUFDRCxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7SUFDakIsQ0FBQztJQUVNLFlBQVk7UUFDZixJQUFJLElBQUksQ0FBQyxTQUFTLEVBQUU7WUFDaEIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1NBQy9DO0lBQ0wsQ0FBQztJQUVNLFlBQVk7UUFDZixJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQzVCLENBQUM7SUFFTSxXQUFXO1FBQ2QsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUMzQixDQUFDOzsrR0F2RVEsa0JBQWtCO21HQUFsQixrQkFBa0Isd3JCQ1gvQiwrNkJBOEJBOzJGRG5CYSxrQkFBa0I7a0JBTDlCLFNBQVM7K0JBQ0ksWUFBWTswRUFLTixLQUFLO3NCQUFwQixLQUFLO2dCQUNVLFNBQVM7c0JBQXhCLEtBQUs7Z0JBQ1UsSUFBSTtzQkFBbkIsS0FBSztnQkFFVSxpQkFBaUI7c0JBQWhDLEtBQUs7Z0JBQ1Usa0JBQWtCO3NCQUFqQyxLQUFLO2dCQUNVLGlCQUFpQjtzQkFBaEMsS0FBSztnQkFFVSxtQkFBbUI7c0JBQWxDLEtBQUs7Z0JBQ1Usb0JBQW9CO3NCQUFuQyxLQUFLO2dCQUNVLG1CQUFtQjtzQkFBbEMsS0FBSztnQkFFVSxVQUFVO3NCQUF6QixLQUFLO2dCQUNVLGVBQWU7c0JBQTlCLEtBQUs7Z0JBQ1UsaUJBQWlCO3NCQUFoQyxLQUFLO2dCQUNVLG1CQUFtQjtzQkFBbEMsS0FBSztnQkFFVyxVQUFVO3NCQUExQixNQUFNO2dCQUNVLFdBQVc7c0JBQTNCLE1BQU07Z0JBRXVDLE1BQU07c0JBQW5ELFNBQVM7dUJBQUMsT0FBTyxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25DaGFuZ2VzLCBPbkluaXQsIE91dHB1dCwgU2ltcGxlQ2hhbmdlcywgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFNkc01vZGFsQ29tcG9uZW50IH0gZnJvbSAnLi4vbW9kYWwuY29tcG9uZW50JztcclxuaW1wb3J0IHsgQnV0dG9uVHlwZSB9IGZyb20gJy4vZGlhbG9nLnR5cGVzJztcclxuXHJcbnR5cGUgbW9kYWxCdXR0b24gPSAncHJpbWFyeScgfCAnc2Vjb25kYXJ5JyB8ICdjbG9zZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnc2RzLWRpYWxvZycsXHJcbiAgICB0ZW1wbGF0ZVVybDogJy4vZGlhbG9nLmNvbXBvbmVudC5odG1sJyxcclxuICAgIHN0eWxlVXJsczogWycuL2RpYWxvZy5jb21wb25lbnQuc2NzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgU2RzRGlhbG9nQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICAgIEBJbnB1dCgpIHB1YmxpYyB0aXRsZTogc3RyaW5nID0gJyc7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgY2xvc2VUZXh0Pzogc3RyaW5nID0gJ2Nsb3NlJztcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBzaXplOiAnc20nIHwgJ21kJyB8ICdsZycgfCAneGwnID0gJ21kJztcclxuXHJcbiAgICBASW5wdXQoKSBwdWJsaWMgcHJpbWFyeUJ1dHRvblRleHQ6IHN0cmluZyA9ICdPayc7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgcHJpbWFyeUJ1dHRvbkNsYXNzOiBzdHJpbmcgPSAnYnRuLXByaW1hcnknO1xyXG4gICAgQElucHV0KCkgcHVibGljIHByaW1hcnlCdXR0b25UeXBlOiBCdXR0b25UeXBlID0gJ2J1dHRvbic7XHJcbiAgICBcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBzZWNvbmRhcnlCdXR0b25UZXh0OiBzdHJpbmcgPSAnQ2FuY2VsJztcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBzZWNvbmRhcnlCdXR0b25DbGFzczogc3RyaW5nID0gJ2J0bi1zZWNvbmRhcnknO1xyXG4gICAgQElucHV0KCkgcHVibGljIHNlY29uZGFyeUJ1dHRvblR5cGU6IEJ1dHRvblR5cGUgPSAnYnV0dG9uJztcclxuXHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2hvd0hlYWRlcjogYm9vbGVhbiA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2hvd0Nsb3NlQnV0dG9uOiBib29sZWFuID0gdHJ1ZTtcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBzaG93UHJpbWFyeUJ1dHRvbjogYm9vbGVhbiA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2hvd1NlY29uZGFyeUJ1dHRvbjogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gICAgQE91dHB1dCgpIHB1YmxpYyBkaWFsb2dPcGVuOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XHJcbiAgICBAT3V0cHV0KCkgcHVibGljIGRpYWxvZ0Nsb3NlOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XHJcblxyXG4gICAgQFZpZXdDaGlsZCgnbW9kYWwnLCB7IHN0YXRpYzogdHJ1ZSB9KSBwcml2YXRlIF9tb2RhbDogU2RzTW9kYWxDb21wb25lbnQgfCB1bmRlZmluZWQ7XHJcblxyXG4gICAgcHJpdmF0ZSBfY2FsbGJhY2s/OiBGdW5jdGlvbjtcclxuICAgIHByaXZhdGUgX2NhbGxiYWNrRGF0YTogYW55O1xyXG5cclxuICAgIGNvbnN0cnVjdG9yKCkge31cclxuXHJcbiAgICBuZ09uSW5pdCgpOiB2b2lkIHt9XHJcblxyXG4gICAgcHVibGljIG9wZW4oY2FsbGJhY2s/OiAoYnV0dG9uOiBtb2RhbEJ1dHRvbiwgZGF0YTogYW55KSA9PiB2b2lkLCBkYXRhPzogYW55KTogdm9pZHtcclxuICAgICAgICB0aGlzLl9jYWxsYmFjayA9IGNhbGxiYWNrO1xyXG4gICAgICAgIHRoaXMuX2NhbGxiYWNrRGF0YSA9IGRhdGE7XHJcblxyXG4gICAgICAgIGlmICh0aGlzLl9tb2RhbCAhPSB1bmRlZmluZWQpIHtcclxuICAgICAgICAgICAgdGhpcy5fbW9kYWwub3BlbigpO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICBwcml2YXRlIGNsb3NlKCk6IHZvaWQge1xyXG4gICAgICAgIGlmICh0aGlzLl9tb2RhbCAhPSB1bmRlZmluZWQpIHtcclxuICAgICAgICAgICAgdGhpcy5fbW9kYWwuY2xvc2UoKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIG9uU2Vjb25kYXJ5Q2xpY2soKTogdm9pZCB7XHJcbiAgICAgICAgaWYgKHRoaXMuX2NhbGxiYWNrKSB7XHJcbiAgICAgICAgICAgIHRoaXMuX2NhbGxiYWNrKCdzZWNvbmRhcnknLCB0aGlzLl9jYWxsYmFja0RhdGEpO1xyXG4gICAgICAgIH1cclxuICAgICAgICB0aGlzLmNsb3NlKCk7XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIG9uUHJpbWFyeUNsaWNrKCk6IHZvaWQge1xyXG4gICAgICAgIGlmICh0aGlzLl9jYWxsYmFjaykge1xyXG4gICAgICAgICAgICB0aGlzLl9jYWxsYmFjaygncHJpbWFyeScsIHRoaXMuX2NhbGxiYWNrRGF0YSk7XHJcbiAgICAgICAgfVxyXG4gICAgICAgIHRoaXMuY2xvc2UoKTtcclxuICAgIH1cclxuXHJcbiAgICBwdWJsaWMgb25DbG9zZUNsaWNrKCk6IHZvaWQge1xyXG4gICAgICAgIGlmICh0aGlzLl9jYWxsYmFjaykge1xyXG4gICAgICAgICAgICB0aGlzLl9jYWxsYmFjaygnY2xvc2UnLCB0aGlzLl9jYWxsYmFja0RhdGEpO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICBwdWJsaWMgb25Nb2RhbENsb3NlKCk6IHZvaWQge1xyXG4gICAgICAgIHRoaXMuZGlhbG9nQ2xvc2UuZW1pdCgpO1xyXG4gICAgfVxyXG5cclxuICAgIHB1YmxpYyBvbk1vZGFsT3BlbigpOiB2b2lkIHtcclxuICAgICAgICB0aGlzLmRpYWxvZ09wZW4uZW1pdCgpO1xyXG4gICAgfSAgICBcclxuXHJcbn1cclxuXHJcblxyXG5cclxuIiwiPHNkcy1tb2RhbFxyXG4gICAgI21vZGFsXHJcbiAgICBbbW9kYWxUaXRsZV09XCJ0aXRsZVwiXHJcbiAgICBbc2l6ZV09XCJzaXplXCJcclxuICAgIFtzaG93Q2xvc2VCdXR0b25dPVwic2hvd0Nsb3NlQnV0dG9uXCJcclxuICAgIFtzaG93SGVhZGVyXT1cInNob3dIZWFkZXJcIlxyXG4gICAgW3RyYW5zbGF0aW9uc109XCJ7IGNsb3NlOiBjbG9zZVRleHR9XCJcclxuICAgIChjbG9zZUNsaWNrKT1cIm9uQ2xvc2VDbGljaygpXCJcclxuICAgIChtb2RhbENsb3NlKT1cIm9uTW9kYWxDbG9zZSgpXCJcclxuICAgIChtb2RhbE9wZW4pPVwib25Nb2RhbE9wZW4oKVwiXHJcbj5cclxuICAgIDxkaXY+XHJcbiAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxyXG4gICAgPC9kaXY+XHJcblxyXG4gICAgPG5nLWNvbnRhaW5lciAjZm9vdGVyIG5nUHJvamVjdEFzPSdmb290ZXInPlxyXG4gICAgICAgIDxidXR0b25cclxuICAgICAgICAgICAgKm5nSWY9XCJzaG93U2Vjb25kYXJ5QnV0dG9uXCJcclxuICAgICAgICAgICAgY2xhc3M9XCJidG5cIlxyXG4gICAgICAgICAgICBbY2xhc3NdPVwic2Vjb25kYXJ5QnV0dG9uQ2xhc3NcIlxyXG4gICAgICAgICAgICAoY2xpY2spPVwib25TZWNvbmRhcnlDbGljaygpXCJcclxuICAgICAgICA+e3tzZWNvbmRhcnlCdXR0b25UZXh0fX08L2J1dHRvbj5cclxuICAgICAgICA8YnV0dG9uXHJcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd1ByaW1hcnlCdXR0b25cIlxyXG4gICAgICAgICAgICBjbGFzcz1cImJ0blwiXHJcbiAgICAgICAgICAgIFtjbGFzc109XCJwcmltYXJ5QnV0dG9uQ2xhc3NcIlxyXG4gICAgICAgICAgICAoY2xpY2spPVwib25QcmltYXJ5Q2xpY2soKVwiXHJcbiAgICAgICAgPnt7cHJpbWFyeUJ1dHRvblRleHR9fTwvYnV0dG9uPlxyXG4gICAgPC9uZy1jb250YWluZXI+XHJcbjwvc2RzLW1vZGFsPlxyXG4iXX0=
|
|
135
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlhbG9nLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL21vZGFsL2RpYWxvZy9kaWFsb2cuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvbW9kYWwvZGlhbG9nL2RpYWxvZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFxQixNQUFNLEVBQWlCLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQVdoSSxNQUFNLE9BQU8sa0JBQWtCO0lBd0MzQjtRQXZDZ0IsVUFBSyxHQUFXLEVBQUUsQ0FBQztRQUNuQixjQUFTLEdBQVksT0FBTyxDQUFDO1FBQzdCLFNBQUksR0FBOEIsSUFBSSxDQUFDO1FBRXZDLHNCQUFpQixHQUFXLElBQUksQ0FBQztRQUNqQyx1QkFBa0IsR0FBVyxhQUFhLENBQUM7UUFDM0Msc0JBQWlCLEdBQWUsUUFBUSxDQUFDO1FBRXpDLHdCQUFtQixHQUFXLFFBQVEsQ0FBQztRQUN2Qyx5QkFBb0IsR0FBVyxlQUFlLENBQUM7UUFDL0Msd0JBQW1CLEdBQWUsUUFBUSxDQUFDO1FBRTNDLGtCQUFhLEdBQVksSUFBSSxDQUFDO1FBQzlCLGVBQVUsR0FBWSxJQUFJLENBQUM7UUFDM0Isb0JBQWUsR0FBWSxJQUFJLENBQUM7UUFDaEMsc0JBQWlCLEdBQVksSUFBSSxDQUFDO1FBQ2xDLHdCQUFtQixHQUFZLElBQUksQ0FBQztRQUNwQyxxQkFBZ0IsR0FDNUIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQztZQUNwQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsQ0FBQyxDQUFDLFdBQVcsQ0FB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QkFDVSxlQUFlO3NCQUE5QixLQUFLO2dCQUNVLGlCQUFpQjtzQkFBaEMsS0FBSztnQkFDVSxtQkFBbUI7c0JBQWxDLEtBQUs7Z0JBQ1UsZ0JBQWdCO3NCQUEvQixLQUFLO2dCQU1VLGFBQWE7c0JBQTVCLEtBQUs7Z0JBR1csVUFBVTtzQkFBMUIsTUFBTTtnQkFDVSxXQUFXO3NCQUEzQixNQUFNO2dCQUV1QyxNQUFNO3NCQUFuRCxTQUFTO3VCQUFDLE9BQU8sRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7Z0JBQzhCLFFBQVE7c0JBQXpFLFNBQVM7dUJBQUMsU0FBUyxFQUFFLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFO2dCQUNpQixjQUFjO3NCQUF0RixTQUFTO3VCQUFDLGVBQWUsRUFBRSxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRTtnQkFDWSxnQkFBZ0I7c0JBQTFGLFNBQVM7dUJBQUMsaUJBQWlCLEVBQUUsRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uQ2hhbmdlcywgT25Jbml0LCBPdXRwdXQsIFNpbXBsZUNoYW5nZXMsIFZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBTZHNNb2RhbENvbXBvbmVudCB9IGZyb20gJy4uL21vZGFsLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IEJ1dHRvblR5cGUgfSBmcm9tICcuL2RpYWxvZy50eXBlcyc7XHJcblxyXG50eXBlIG1vZGFsQnV0dG9uID0gJ3ByaW1hcnknIHwgJ3NlY29uZGFyeScgfCAnY2xvc2UnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ3Nkcy1kaWFsb2cnLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL2RpYWxvZy5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9kaWFsb2cuY29tcG9uZW50LnNjc3MnXSxcclxufSlcclxuZXhwb3J0IGNsYXNzIFNkc0RpYWxvZ0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgdGl0bGU6IHN0cmluZyA9ICcnO1xyXG4gICAgQElucHV0KCkgcHVibGljIGNsb3NlVGV4dD86IHN0cmluZyA9ICdjbG9zZSc7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2l6ZTogJ3NtJyB8ICdtZCcgfCAnbGcnIHwgJ3hsJyA9ICdtZCc7XHJcblxyXG4gICAgQElucHV0KCkgcHVibGljIHByaW1hcnlCdXR0b25UZXh0OiBzdHJpbmcgPSAnT2snO1xyXG4gICAgQElucHV0KCkgcHVibGljIHByaW1hcnlCdXR0b25DbGFzczogc3RyaW5nID0gJ2J0bi1wcmltYXJ5JztcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBwcmltYXJ5QnV0dG9uVHlwZTogQnV0dG9uVHlwZSA9ICdidXR0b24nO1xyXG4gICAgXHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2Vjb25kYXJ5QnV0dG9uVGV4dDogc3RyaW5nID0gJ0NhbmNlbCc7ICAgICBcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBzZWNvbmRhcnlCdXR0b25DbGFzczogc3RyaW5nID0gJ2J0bi1zZWNvbmRhcnknO1xyXG4gICAgQElucHV0KCkgcHVibGljIHNlY29uZGFyeUJ1dHRvblR5cGU6IEJ1dHRvblR5cGUgPSAnYnV0dG9uJztcclxuXHJcbiAgICBASW5wdXQoKSBwdWJsaWMgY2xvc2VPbkVzY2FwZTogYm9vbGVhbiA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2hvd0hlYWRlcjogYm9vbGVhbiA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2hvd0Nsb3NlQnV0dG9uOiBib29sZWFuID0gdHJ1ZTtcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBzaG93UHJpbWFyeUJ1dHRvbjogYm9vbGVhbiA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2hvd1NlY29uZGFyeUJ1dHRvbjogYm9vbGVhbiA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgYXV0b2ZvY3VzRWxlbWVudDogICdwcmltYXJ5JyB8ICdzZWNvbmRhcnknIHwgJ2Nsb3NlJyB8ICdjb250ZW50JyA9IFxyXG4gICAgICAgIHRoaXMuc2hvd1ByaW1hcnlCdXR0b24gPyAncHJpbWFyeScgOlxyXG4gICAgICAgIHRoaXMuc2hvd1NlY29uZGFyeUJ1dHRvbiA/ICdzZWNvbmRhcnknIDpcclxuICAgICAgICB0aGlzLnNob3dDbG9zZUJ1dHRvbiA/ICdjbG9zZScgOlxyXG4gICAgICAgICdjb250ZW50JztcclxuXHJcbiAgICBASW5wdXQoKSBwdWJsaWMgbW9kYWxEaWFsb2dJZD86IHN0cmluZztcclxuXHJcblxyXG4gICAgQE91dHB1dCgpIHB1YmxpYyBkaWFsb2dPcGVuOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XHJcbiAgICBAT3V0cHV0KCkgcHVibGljIGRpYWxvZ0Nsb3NlOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XHJcblxyXG4gICAgQFZpZXdDaGlsZCgnbW9kYWwnLCB7IHN0YXRpYzogdHJ1ZSB9KSBwcml2YXRlIF9tb2RhbDogU2RzTW9kYWxDb21wb25lbnQgfCB1bmRlZmluZWQ7XHJcbiAgICBAVmlld0NoaWxkKCdjb250ZW50JywgeyByZWFkOiBFbGVtZW50UmVmLCBzdGF0aWM6IHRydWUgfSkgcHJpdmF0ZSBfY29udGVudD86IEVsZW1lbnRSZWY7XHJcbiAgICBAVmlld0NoaWxkKCdwcmltYXJ5QnV0dG9uJywgeyByZWFkOiBFbGVtZW50UmVmLCBzdGF0aWM6IGZhbHNlIH0pIHByaXZhdGUgX3ByaW1hcnlCdXR0b24/OiBFbGVtZW50UmVmO1xyXG4gICAgQFZpZXdDaGlsZCgnc2Vjb25kYXJ5QnV0dG9uJywgeyByZWFkOiBFbGVtZW50UmVmLCBzdGF0aWM6IGZhbHNlIH0pIHByaXZhdGUgX3NlY29uZGFyeUJ1dHRvbj86IEVsZW1lbnRSZWY7XHJcblxyXG4gICAgcHJpdmF0ZSBfY2FsbGJhY2s/OiBGdW5jdGlvbjtcclxuICAgIHByaXZhdGUgX2NhbGxiYWNrRGF0YTogYW55O1xyXG5cclxuICAgIHB1YmxpYyBpc09wZW46IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgICBjb25zdHJ1Y3RvcigpIHt9XHJcblxyXG4gICAgbmdPbkluaXQoKTogdm9pZCB7fVxyXG5cclxuICAgIHB1YmxpYyBvcGVuKGNhbGxiYWNrPzogKGJ1dHRvbjogbW9kYWxCdXR0b24sIGRhdGE6IGFueSkgPT4gdm9pZCwgZGF0YT86IGFueSk6IHZvaWR7XHJcbiAgICAgICAgdGhpcy5fY2FsbGJhY2sgPSBjYWxsYmFjaztcclxuICAgICAgICB0aGlzLl9jYWxsYmFja0RhdGEgPSBkYXRhO1xyXG5cclxuICAgICAgICBpZiAodGhpcy5fbW9kYWwgIT0gdW5kZWZpbmVkKSB7XHJcbiAgICAgICAgICAgIHRoaXMuaXNPcGVuID0gdHJ1ZTtcclxuICAgICAgICAgICAgdGhpcy5fbW9kYWwub3BlbigpO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICBwcml2YXRlIGNsb3NlKCk6IHZvaWQge1xyXG4gICAgICAgIGlmICh0aGlzLl9tb2RhbCAhPSB1bmRlZmluZWQpIHtcclxuICAgICAgICAgICAgdGhpcy5pc09wZW4gPSBmYWxzZTtcclxuICAgICAgICAgICAgdGhpcy5fbW9kYWwuY2xvc2UoKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIG9uU2Vjb25kYXJ5Q2xpY2soKTogdm9pZCB7XHJcbiAgICAgICAgaWYgKHRoaXMuX2NhbGxiYWNrKSB7XHJcbiAgICAgICAgICAgIHRoaXMuX2NhbGxiYWNrKCdzZWNvbmRhcnknLCB0aGlzLl9jYWxsYmFja0RhdGEpO1xyXG4gICAgICAgIH1cclxuICAgICAgICB0aGlzLmNsb3NlKCk7XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIG9uUHJpbWFyeUNsaWNrKCk6IHZvaWQge1xyXG4gICAgICAgIGlmICh0aGlzLl9jYWxsYmFjaykge1xyXG4gICAgICAgICAgICB0aGlzLl9jYWxsYmFjaygncHJpbWFyeScsIHRoaXMuX2NhbGxiYWNrRGF0YSk7XHJcbiAgICAgICAgfVxyXG4gICAgICAgIHRoaXMuY2xvc2UoKTtcclxuICAgIH1cclxuXHJcbiAgICBwdWJsaWMgb25DbG9zZUNsaWNrKCk6IHZvaWQge1xyXG4gICAgICAgIGlmICh0aGlzLl9jYWxsYmFjaykge1xyXG4gICAgICAgICAgICB0aGlzLl9jYWxsYmFjaygnY2xvc2UnLCB0aGlzLl9jYWxsYmFja0RhdGEpO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICBwdWJsaWMgb25Nb2RhbENsb3NlKCk6IHZvaWQge1xyXG4gICAgICAgIHRoaXMuZGlhbG9nQ2xvc2UuZW1pdCgpO1xyXG4gICAgfVxyXG5cclxuICAgIHB1YmxpYyBvbk1vZGFsT3BlbigpOiB2b2lkIHtcclxuICAgICAgICB0aGlzLmRpYWxvZ09wZW4uZW1pdCgpO1xyXG4gICAgICAgIHN3aXRjaCAodGhpcy5hdXRvZm9jdXNFbGVtZW50KSB7XHJcbiAgICAgICAgICAgIGNhc2UgJ3ByaW1hcnknOlxyXG4gICAgICAgICAgICAgICAgdGhpcy5fcHJpbWFyeUJ1dHRvbj8ubmF0aXZlRWxlbWVudC5mb2N1cygpO1xyXG4gICAgICAgICAgICAgICAgYnJlYWs7XHJcbiAgICAgICAgICAgIGNhc2UgJ3NlY29uZGFyeSc6XHJcbiAgICAgICAgICAgICAgICB0aGlzLl9zZWNvbmRhcnlCdXR0b24/Lm5hdGl2ZUVsZW1lbnQuZm9jdXMoKTtcclxuICAgICAgICAgICAgICAgIGJyZWFrO1xyXG4gICAgICAgICAgICBjYXNlICdjb250ZW50JzpcclxuICAgICAgICAgICAgICAgIHRoaXMuX2NvbnRlbnQ/Lm5hdGl2ZUVsZW1lbnQuZm9jdXMoKTtcclxuICAgICAgICAgICAgICAgIGJyZWFrO1xyXG4gICAgICAgICAgICBkZWZhdWx0OlxyXG4gICAgICAgICAgICAgICAgYnJlYWs7XHJcbiAgICAgICAgfVxyXG4gICAgfSAgICBcclxuXHJcbn1cclxuXHJcblxyXG5cclxuIiwiPHNkcy1tb2RhbFxyXG4gICAgI21vZGFsXHJcbiAgICBbbW9kYWxUaXRsZV09XCJ0aXRsZVwiXHJcbiAgICBbc2l6ZV09XCJzaXplXCJcclxuICAgIFttb2RhbERpYWxvZ0lkXT1cIm1vZGFsRGlhbG9nSWRcIlxyXG4gICAgW3Nob3dDbG9zZUJ1dHRvbl09XCJzaG93Q2xvc2VCdXR0b25cIlxyXG4gICAgW3Nob3dIZWFkZXJdPVwic2hvd0hlYWRlclwiXHJcbiAgICBbdHJhbnNsYXRpb25zXT1cInsgY2xvc2U6IGNsb3NlVGV4dH1cIlxyXG4gICAgW2F1dG9Gb2N1c0Nsb3NlQnV0dG9uXT1cImF1dG9mb2N1c0VsZW1lbnQgPT09ICdjbG9zZSdcIlxyXG4gICAgW2Nsb3NlT25Fc2NhcGVdPVwiY2xvc2VPbkVzY2FwZVwiXHJcbiAgICAoY2xvc2VDbGljayk9XCJvbkNsb3NlQ2xpY2soKVwiXHJcbiAgICAobW9kYWxDbG9zZSk9XCJvbk1vZGFsQ2xvc2UoKVwiXHJcbiAgICAobW9kYWxPcGVuKT1cIm9uTW9kYWxPcGVuKClcIlxyXG4+XHJcblxyXG4gICAgPGRpdiAjY29udGVudCBbYXR0ci50YWJpbmRleF09XCJhdXRvZm9jdXNFbGVtZW50ID09PSAnY29udGVudCcgPyAwIDogdW5kZWZpbmVkXCIgPlxyXG4gICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cclxuICAgIDwvZGl2PlxyXG4gICAgPG5nLWNvbnRhaW5lciAjZm9vdGVyIG5nUHJvamVjdEFzPSdmb290ZXInPlxyXG4gICAgICAgIDxidXR0b25cclxuICAgICAgICAgICAgI3NlY29uZGFyeUJ1dHRvblxyXG4gICAgICAgICAgICAqbmdJZj1cInNob3dTZWNvbmRhcnlCdXR0b25cIlxyXG4gICAgICAgICAgICBjbGFzcz1cImJ0blwiXHJcbiAgICAgICAgICAgIFtjbGFzc109XCJzZWNvbmRhcnlCdXR0b25DbGFzc1wiXHJcbiAgICAgICAgICAgIChjbGljayk9XCJvblNlY29uZGFyeUNsaWNrKClcIlxyXG4gICAgICAgID57e3NlY29uZGFyeUJ1dHRvblRleHR9fTwvYnV0dG9uPlxyXG4gICAgICAgIDxidXR0b25cclxuICAgICAgICAgICAgI3ByaW1hcnlCdXR0b25cclxuICAgICAgICAgICAgKm5nSWY9XCJzaG93UHJpbWFyeUJ1dHRvblwiXHJcbiAgICAgICAgICAgIGNsYXNzPVwiYnRuXCJcclxuICAgICAgICAgICAgW2NsYXNzXT1cInByaW1hcnlCdXR0b25DbGFzc1wiXHJcbiAgICAgICAgICAgIChjbGljayk9XCJvblByaW1hcnlDbGljaygpXCJcclxuICAgICAgICA+e3twcmltYXJ5QnV0dG9uVGV4dH19PC9idXR0b24+XHJcbiAgICA8L25nLWNvbnRhaW5lcj5cclxuPC9zZHMtbW9kYWw+XHJcbiJdfQ==
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component, Input, Output, ViewChild, EventEmitter, ContentChild
|
|
1
|
+
import { Component, Input, Output, ViewChild, EventEmitter, ContentChild } from '@angular/core';
|
|
2
2
|
import { faXmark } from '@fortawesome/pro-regular-svg-icons';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
import * as i1 from "@angular/cdk/a11y";
|
|
@@ -10,12 +10,14 @@ export class SdsModalComponent {
|
|
|
10
10
|
this.showFooter = true;
|
|
11
11
|
this.size = 'md';
|
|
12
12
|
this.showCloseButton = true;
|
|
13
|
+
this.autoFocusCloseButton = false;
|
|
13
14
|
this.isScrollable = true;
|
|
14
15
|
this.closeOnEscape = false;
|
|
15
16
|
this.modalOpen = new EventEmitter();
|
|
16
17
|
this.modalClose = new EventEmitter();
|
|
17
18
|
this.closeClick = new EventEmitter();
|
|
18
19
|
this.closeIcon = faXmark;
|
|
20
|
+
this.isOpen = false;
|
|
19
21
|
this.translations = {
|
|
20
22
|
close: undefined
|
|
21
23
|
};
|
|
@@ -24,13 +26,16 @@ export class SdsModalComponent {
|
|
|
24
26
|
open() {
|
|
25
27
|
if (this._modal != undefined) {
|
|
26
28
|
this._modal.nativeElement.style.display = 'block';
|
|
27
|
-
this.
|
|
29
|
+
this.isOpen = true;
|
|
30
|
+
if (this.autoFocusCloseButton)
|
|
31
|
+
this._closeButton?.nativeElement.focus();
|
|
28
32
|
this.modalOpen.emit();
|
|
29
33
|
}
|
|
30
34
|
}
|
|
31
35
|
close() {
|
|
32
36
|
if (this._modal != undefined) {
|
|
33
37
|
this._modal.nativeElement.style.display = 'none';
|
|
38
|
+
this.isOpen = false;
|
|
34
39
|
this.modalClose.emit();
|
|
35
40
|
}
|
|
36
41
|
}
|
|
@@ -49,10 +54,10 @@ export class SdsModalComponent {
|
|
|
49
54
|
}
|
|
50
55
|
}
|
|
51
56
|
SdsModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
52
|
-
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"], directives: [{ type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
57
|
+
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", autoFocusCloseButton: "autoFocusCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }, { propertyName: "_closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"], directives: [{ type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
53
58
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, decorators: [{
|
|
54
59
|
type: Component,
|
|
55
|
-
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
|
|
60
|
+
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
|
|
56
61
|
}], ctorParameters: function () { return []; }, propDecorators: { headerContent: [{
|
|
57
62
|
type: ContentChild,
|
|
58
63
|
args: ['header']
|
|
@@ -68,6 +73,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
68
73
|
type: Input
|
|
69
74
|
}], showCloseButton: [{
|
|
70
75
|
type: Input
|
|
76
|
+
}], autoFocusCloseButton: [{
|
|
77
|
+
type: Input
|
|
71
78
|
}], translations: [{
|
|
72
79
|
type: Input
|
|
73
80
|
}], isScrollable: [{
|
|
@@ -83,5 +90,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
83
90
|
}], _modal: [{
|
|
84
91
|
type: ViewChild,
|
|
85
92
|
args: ['modal', { static: false }]
|
|
93
|
+
}], _closeButton: [{
|
|
94
|
+
type: ViewChild,
|
|
95
|
+
args: ['closeButton', { static: false }]
|
|
86
96
|
}] } });
|
|
87
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
97
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kYWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvbW9kYWwvbW9kYWwuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvbW9kYWwvbW9kYWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILFNBQVMsRUFFVCxLQUFLLEVBRUwsTUFBTSxFQUNOLFNBQVMsRUFDVCxZQUFZLEVBQ1osWUFBWSxFQUNmLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQzs7OztBQVE3RCxNQUFNLE9BQU8saUJBQWlCO0lBNEIxQjtRQTNCd0Isa0JBQWEsR0FBZSxFQUFFLGFBQWEsRUFBRSxTQUFTLEVBQUUsQ0FBQztRQUdqRSxlQUFVLEdBQVksSUFBSSxDQUFDO1FBQzNCLGVBQVUsR0FBWSxJQUFJLENBQUM7UUFDM0IsU0FBSSxHQUE4QixJQUFJLENBQUM7UUFFdkMsb0JBQWUsR0FBWSxJQUFJLENBQUM7UUFDaEMseUJBQW9CLEdBQVksS0FBSyxDQUFDO1FBR3RDLGlCQUFZLEdBQUcsSUFBSSxDQUFDO1FBQ3BCLGtCQUFhLEdBQUcsS0FBSyxDQUFDO1FBRXJCLGNBQVMsR0FBdUIsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUN6RCxlQUFVLEdBQXVCLElBQUksWUFBWSxFQUFRLENBQUM7UUFFMUQsZUFBVSxHQUF1QixJQUFJLFlBQVksRUFBUSxDQUFDO1FBRXBFLGNBQVMsR0FBRyxPQUFPLENBQUM7UUFFcEIsV0FBTSxHQUFZLEtBQUssQ0FBQztRQU8zQixJQUFJLENBQUMsWUFBWSxHQUFHO1lBQ2hCLEtBQUssRUFBRSxTQUFTO1NBQ25CLENBQUE7SUFDTCxDQUFDO0lBRUQsUUFBUSxLQUFVLENBQUM7SUFFWixJQUFJO1FBQ1AsSUFBSSxJQUFJLENBQUMsTUFBTSxJQUFJLFNBQVMsRUFBRTtZQUMxQixJQUFJLENBQUMsTUFBTSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsT0FBTyxHQUFHLE9BQU8sQ0FBQztZQUNsRCxJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQztZQUNuQixJQUFHLElBQUksQ0FBQyxvQkFBb0I7Z0JBQ3hCLElBQUksQ0FBQyxZQUFZLEVBQUUsYUFBYSxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQzdDLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxFQUFFLENBQUM7U0FDekI7SUFDTCxDQUFDO0lBRU0sS0FBSztRQUNSLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxTQUFTLEVBQUU7WUFDMUIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxNQUFNLENBQUM7WUFDakQsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7WUFDcEIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztTQUMxQjtJQUNMLENBQUM7SUFFTSxrQkFBa0I7UUFDckIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUN2QixJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7SUFDakIsQ0FBQztJQUVELFNBQVMsQ0FBQyxLQUFvQjtRQUMxQixJQUNJLEtBQUssQ0FBQyxJQUFJLEtBQUssUUFBUTtZQUN2QixJQUFJLENBQUMsYUFBYTtZQUNsQixJQUFJLENBQUMsTUFBTSxJQUFJLFNBQVM7WUFDeEIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLE9BQU8sS0FBSyxPQUFPLEVBQUM7WUFDaEQsb0VBQW9FO1lBQ3BFLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztTQUNwQjtJQUNMLENBQUM7OzhHQXBFUSxpQkFBaUI7a0dBQWpCLGlCQUFpQixvdUJDbEI5Qiw2NUNBbUNNOzJGRGpCTyxpQkFBaUI7a0JBTDdCLFNBQVM7K0JBQ0ksV0FBVzswRUFLRyxhQUFhO3NCQUFwQyxZQUFZO3VCQUFDLFFBQVE7Z0JBRU4sVUFBVTtzQkFBekIsS0FBSztnQkFDVSxVQUFVO3NCQUF6QixLQUFLO2dCQUNVLFVBQVU7c0JBQXpCLEtBQUs7Z0JBQ1UsSUFBSTtzQkFBbkIsS0FBSztnQkFDVSxhQUFhO3NCQUE1QixLQUFLO2dCQUNVLGVBQWU7c0JBQTlCLEtBQUs7Z0JBQ1Usb0JBQW9CO3NCQUFuQyxLQUFLO2dCQUVVLFlBQVk7c0JBQTNCLEtBQUs7Z0JBQ1UsWUFBWTtzQkFBM0IsS0FBSztnQkFDVSxhQUFhO3NCQUE1QixLQUFLO2dCQUVXLFNBQVM7c0JBQXpCLE1BQU07Z0JBQ1UsVUFBVTtzQkFBMUIsTUFBTTtnQkFFVSxVQUFVO3NCQUExQixNQUFNO2dCQU13QyxNQUFNO3NCQUFwRCxTQUFTO3VCQUFDLE9BQU8sRUFBRSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUU7Z0JBQ2dCLFlBQVk7c0JBQWhFLFNBQVM7dUJBQUMsYUFBYSxFQUFFLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XHJcbiAgICBDb21wb25lbnQsXHJcbiAgICBFbGVtZW50UmVmLFxyXG4gICAgSW5wdXQsXHJcbiAgICBPbkluaXQsXHJcbiAgICBPdXRwdXQsXHJcbiAgICBWaWV3Q2hpbGQsXHJcbiAgICBFdmVudEVtaXR0ZXIsXHJcbiAgICBDb250ZW50Q2hpbGRcclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgZmFYbWFyayB9IGZyb20gJ0Bmb3J0YXdlc29tZS9wcm8tcmVndWxhci1zdmctaWNvbnMnO1xyXG5pbXBvcnQgeyBNb2RhbFRyYW5zbGF0aW9ucyB9IGZyb20gJy4vbW9kYWwubW9kZWwnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ3Nkcy1tb2RhbCcsXHJcbiAgICB0ZW1wbGF0ZVVybDogJy4vbW9kYWwuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJy4vbW9kYWwuY29tcG9uZW50LnNjc3MnXSxcclxufSlcclxuZXhwb3J0IGNsYXNzIFNkc01vZGFsQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICAgIEBDb250ZW50Q2hpbGQoJ2hlYWRlcicpIGhlYWRlckNvbnRlbnQ6IEVsZW1lbnRSZWYgPSB7IG5hdGl2ZUVsZW1lbnQ6IHVuZGVmaW5lZCB9O1xyXG5cclxuICAgIEBJbnB1dCgpIHB1YmxpYyBtb2RhbFRpdGxlPzogc3RyaW5nO1xyXG4gICAgQElucHV0KCkgcHVibGljIHNob3dIZWFkZXI6IGJvb2xlYW4gPSB0cnVlO1xyXG4gICAgQElucHV0KCkgcHVibGljIHNob3dGb290ZXI6IGJvb2xlYW4gPSB0cnVlO1xyXG4gICAgQElucHV0KCkgcHVibGljIHNpemU6ICdzbScgfCAnbWQnIHwgJ2xnJyB8ICd4bCcgPSAnbWQnO1xyXG4gICAgQElucHV0KCkgcHVibGljIG1vZGFsRGlhbG9nSWQ/OiBzdHJpbmc7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgc2hvd0Nsb3NlQnV0dG9uOiBib29sZWFuID0gdHJ1ZTtcclxuICAgIEBJbnB1dCgpIHB1YmxpYyBhdXRvRm9jdXNDbG9zZUJ1dHRvbjogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICAgIEBJbnB1dCgpIHB1YmxpYyB0cmFuc2xhdGlvbnM6IE1vZGFsVHJhbnNsYXRpb25zO1xyXG4gICAgQElucHV0KCkgcHVibGljIGlzU2Nyb2xsYWJsZSA9IHRydWU7XHJcbiAgICBASW5wdXQoKSBwdWJsaWMgY2xvc2VPbkVzY2FwZSA9IGZhbHNlO1xyXG5cclxuICAgIEBPdXRwdXQoKSBwdWJsaWMgbW9kYWxPcGVuOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XHJcbiAgICBAT3V0cHV0KCkgcHVibGljIG1vZGFsQ2xvc2U6IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcclxuXHJcbiAgICBAT3V0cHV0KCkgcHVibGljIGNsb3NlQ2xpY2s6IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcclxuXHJcbiAgICBwdWJsaWMgY2xvc2VJY29uID0gZmFYbWFyaztcclxuXHJcbiAgICBwdWJsaWMgaXNPcGVuOiBib29sZWFuID0gZmFsc2U7XHJcblxyXG4gICAgQFZpZXdDaGlsZCgnbW9kYWwnLCB7IHN0YXRpYzogZmFsc2UgfSkgcHJpdmF0ZSBfbW9kYWw6IEVsZW1lbnRSZWYgfCB1bmRlZmluZWQ7XHJcbiAgICBAVmlld0NoaWxkKCdjbG9zZUJ1dHRvbicsIHsgc3RhdGljOiBmYWxzZSB9KSBwcml2YXRlIF9jbG9zZUJ1dHRvbjogRWxlbWVudFJlZiB8IHVuZGVmaW5lZDtcclxuICAgIFxyXG5cclxuICAgIGNvbnN0cnVjdG9yKCkge1xyXG4gICAgICAgIHRoaXMudHJhbnNsYXRpb25zID0ge1xyXG4gICAgICAgICAgICBjbG9zZTogdW5kZWZpbmVkXHJcbiAgICAgICAgfVxyXG4gICAgfVxyXG5cclxuICAgIG5nT25Jbml0KCk6IHZvaWQge31cclxuXHJcbiAgICBwdWJsaWMgb3BlbigpOiB2b2lkIHtcclxuICAgICAgICBpZiAodGhpcy5fbW9kYWwgIT0gdW5kZWZpbmVkKSB7XHJcbiAgICAgICAgICAgIHRoaXMuX21vZGFsLm5hdGl2ZUVsZW1lbnQuc3R5bGUuZGlzcGxheSA9ICdibG9jayc7XHJcbiAgICAgICAgICAgIHRoaXMuaXNPcGVuID0gdHJ1ZTtcclxuICAgICAgICAgICAgaWYodGhpcy5hdXRvRm9jdXNDbG9zZUJ1dHRvbilcclxuICAgICAgICAgICAgICAgIHRoaXMuX2Nsb3NlQnV0dG9uPy5uYXRpdmVFbGVtZW50LmZvY3VzKCk7XHJcbiAgICAgICAgICAgIHRoaXMubW9kYWxPcGVuLmVtaXQoKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIGNsb3NlKCk6IHZvaWQge1xyXG4gICAgICAgIGlmICh0aGlzLl9tb2RhbCAhPSB1bmRlZmluZWQpIHtcclxuICAgICAgICAgICAgdGhpcy5fbW9kYWwubmF0aXZlRWxlbWVudC5zdHlsZS5kaXNwbGF5ID0gJ25vbmUnO1xyXG4gICAgICAgICAgICB0aGlzLmlzT3BlbiA9IGZhbHNlO1xyXG4gICAgICAgICAgICB0aGlzLm1vZGFsQ2xvc2UuZW1pdCgpO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICBwdWJsaWMgb25DbG9zZUJ1dHRvbkNsaWNrKCl7XHJcbiAgICAgICAgdGhpcy5jbG9zZUNsaWNrLmVtaXQoKTtcclxuICAgICAgICB0aGlzLmNsb3NlKCk7XHJcbiAgICB9XHJcblxyXG4gICAgb25LZXlkb3duKGV2ZW50OiBLZXlib2FyZEV2ZW50KXtcclxuICAgICAgICBpZiAoXHJcbiAgICAgICAgICAgIGV2ZW50LmNvZGUgPT09ICdFc2NhcGUnICYmXHJcbiAgICAgICAgICAgIHRoaXMuY2xvc2VPbkVzY2FwZSAmJiBcclxuICAgICAgICAgICAgdGhpcy5fbW9kYWwgIT0gdW5kZWZpbmVkICYmIFxyXG4gICAgICAgICAgICB0aGlzLl9tb2RhbC5uYXRpdmVFbGVtZW50LnN0eWxlLmRpc3BsYXkgPT09ICdibG9jaycpe1xyXG4gICAgICAgICAgICAgICAgLy8gY29uc29sZS5sb2coYCR7dGhpcy5jb25zdHJ1Y3Rvci5uYW1lfSBnb3QgZXZlbnQ6ICR7ZXZlbnQuY29kZX1gKTtcclxuICAgICAgICAgICAgICAgIHRoaXMuY2xvc2UoKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcbn1cclxuIiwiPGRpdiAjbW9kYWwgY2xhc3M9XCJtb2RhbFwiIChrZXlkb3duKT1cIm9uS2V5ZG93bigkZXZlbnQpXCIgW2Nka1RyYXBGb2N1c109XCJpc09wZW5cIiBbY2RrVHJhcEZvY3VzQXV0b0NhcHR1cmVdPVwidHJ1ZVwiID5cclxuICAgIDxkaXZcclxuICAgICAgICBjbGFzcz1cIm1vZGFsLWRpYWxvZyBtb2RhbC1kaWFsb2ctY2VudGVyZWRcIlxyXG4gICAgICAgIFtjbGFzcy5tb2RhbC1kaWFsb2ctc2Nyb2xsYWJsZV0gPSBcImlzU2Nyb2xsYWJsZVwiXHJcbiAgICAgICAgW2F0dHIuaWRdPVwibW9kYWxEaWFsb2dJZFwiXHJcbiAgICAgICAgW25nQ2xhc3NdPVwiJ21vZGFsLScgKyBzaXplXCJcclxuICAgICAgICByb2xlPVwiZG9jdW1lbnRcIlxyXG4gICAgICAgID5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwibW9kYWwtY29udGVudFwiPlxyXG5cclxuICAgICAgICAgICAgPGRpdiAqbmdJZj1cInNob3dIZWFkZXIgJiYgaGVhZGVyQ29udGVudFwiIGNsYXNzPVwibW9kYWwtaGVhZGVyXCI+XHJcbiAgICAgICAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9J2hlYWRlcic+PC9uZy1jb250ZW50PlxyXG4gICAgICAgICAgICA8L2Rpdj4gICAgICAgICAgICAgXHJcblxyXG4gICAgICAgICAgICA8ZGl2ICpuZ0lmPVwic2hvd0hlYWRlciAmJiAhaGVhZGVyQ29udGVudFwiIGNsYXNzPVwibW9kYWwtaGVhZGVyXCI+XHJcbiAgICAgICAgICAgICAgICA8aDUgY2xhc3M9XCJtb2RhbC10aXRsZVwiPnt7bW9kYWxUaXRsZX19PC9oNT5cclxuICAgICAgICAgICAgICAgIDxidXR0b24gXHJcbiAgICAgICAgICAgICAgICAgICAgI2Nsb3NlQnV0dG9uXHJcbiAgICAgICAgICAgICAgICAgICAgKm5nSWY9XCJzaG93Q2xvc2VCdXR0b25cIlxyXG4gICAgICAgICAgICAgICAgICAgIHR5cGU9XCJidXR0b25cIiBcclxuICAgICAgICAgICAgICAgICAgICBjbGFzcz1cImJ0bi1jbG9zZVwiIFxyXG4gICAgICAgICAgICAgICAgICAgIFt0aXRsZV09XCJ0cmFuc2xhdGlvbnMuY2xvc2UgPz8gJydcIlxyXG4gICAgICAgICAgICAgICAgICAgIChjbGljayk9XCJvbkNsb3NlQnV0dG9uQ2xpY2soKVwiPlxyXG4gICAgICAgICAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG5cclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cIm1vZGFsLWJvZHlcIj5cclxuICAgICAgICAgICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cclxuICAgICAgICAgICAgPC9kaXY+XHJcblxyXG4gICAgICAgICAgICA8ZGl2ICpuZ0lmPVwic2hvd0Zvb3RlclwiIGNsYXNzPVwibW9kYWwtZm9vdGVyXCI+XHJcbiAgICAgICAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJmb290ZXJcIj48L25nLWNvbnRlbnQ+XHJcbiAgICAgICAgICAgIDwvZGl2PiAgICAgICAgICAgIFxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PiJdfQ==
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component, ContentChild, Input, Output, ViewChild, NgModule } from '@angular/core';
|
|
2
|
+
import { EventEmitter, Component, ContentChild, Input, Output, ViewChild, ElementRef, NgModule } from '@angular/core';
|
|
3
3
|
import * as i2 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { faXmark } from '@fortawesome/pro-regular-svg-icons';
|
|
@@ -14,27 +14,33 @@ class SdsModalComponent {
|
|
|
14
14
|
this.showFooter = true;
|
|
15
15
|
this.size = 'md';
|
|
16
16
|
this.showCloseButton = true;
|
|
17
|
+
this.autoFocusCloseButton = false;
|
|
17
18
|
this.isScrollable = true;
|
|
18
19
|
this.closeOnEscape = false;
|
|
19
20
|
this.modalOpen = new EventEmitter();
|
|
20
21
|
this.modalClose = new EventEmitter();
|
|
21
22
|
this.closeClick = new EventEmitter();
|
|
22
23
|
this.closeIcon = faXmark;
|
|
24
|
+
this.isOpen = false;
|
|
23
25
|
this.translations = {
|
|
24
26
|
close: undefined
|
|
25
27
|
};
|
|
26
28
|
}
|
|
27
29
|
ngOnInit() { }
|
|
28
30
|
open() {
|
|
31
|
+
var _a;
|
|
29
32
|
if (this._modal != undefined) {
|
|
30
33
|
this._modal.nativeElement.style.display = 'block';
|
|
31
|
-
this.
|
|
34
|
+
this.isOpen = true;
|
|
35
|
+
if (this.autoFocusCloseButton)
|
|
36
|
+
(_a = this._closeButton) === null || _a === void 0 ? void 0 : _a.nativeElement.focus();
|
|
32
37
|
this.modalOpen.emit();
|
|
33
38
|
}
|
|
34
39
|
}
|
|
35
40
|
close() {
|
|
36
41
|
if (this._modal != undefined) {
|
|
37
42
|
this._modal.nativeElement.style.display = 'none';
|
|
43
|
+
this.isOpen = false;
|
|
38
44
|
this.modalClose.emit();
|
|
39
45
|
}
|
|
40
46
|
}
|
|
@@ -53,10 +59,10 @@ class SdsModalComponent {
|
|
|
53
59
|
}
|
|
54
60
|
}
|
|
55
61
|
SdsModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
56
|
-
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"], directives: [{ type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
62
|
+
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", autoFocusCloseButton: "autoFocusCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }, { propertyName: "_closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"], directives: [{ type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
57
63
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, decorators: [{
|
|
58
64
|
type: Component,
|
|
59
|
-
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
|
|
65
|
+
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
|
|
60
66
|
}], ctorParameters: function () { return []; }, propDecorators: { headerContent: [{
|
|
61
67
|
type: ContentChild,
|
|
62
68
|
args: ['header']
|
|
@@ -72,6 +78,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
72
78
|
type: Input
|
|
73
79
|
}], showCloseButton: [{
|
|
74
80
|
type: Input
|
|
81
|
+
}], autoFocusCloseButton: [{
|
|
82
|
+
type: Input
|
|
75
83
|
}], translations: [{
|
|
76
84
|
type: Input
|
|
77
85
|
}], isScrollable: [{
|
|
@@ -87,6 +95,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
87
95
|
}], _modal: [{
|
|
88
96
|
type: ViewChild,
|
|
89
97
|
args: ['modal', { static: false }]
|
|
98
|
+
}], _closeButton: [{
|
|
99
|
+
type: ViewChild,
|
|
100
|
+
args: ['closeButton', { static: false }]
|
|
90
101
|
}] } });
|
|
91
102
|
|
|
92
103
|
class SdsDialogComponent {
|
|
@@ -100,23 +111,31 @@ class SdsDialogComponent {
|
|
|
100
111
|
this.secondaryButtonText = 'Cancel';
|
|
101
112
|
this.secondaryButtonClass = 'btn-secondary';
|
|
102
113
|
this.secondaryButtonType = 'button';
|
|
114
|
+
this.closeOnEscape = true;
|
|
103
115
|
this.showHeader = true;
|
|
104
116
|
this.showCloseButton = true;
|
|
105
117
|
this.showPrimaryButton = true;
|
|
106
118
|
this.showSecondaryButton = true;
|
|
119
|
+
this.autofocusElement = this.showPrimaryButton ? 'primary' :
|
|
120
|
+
this.showSecondaryButton ? 'secondary' :
|
|
121
|
+
this.showCloseButton ? 'close' :
|
|
122
|
+
'content';
|
|
107
123
|
this.dialogOpen = new EventEmitter();
|
|
108
124
|
this.dialogClose = new EventEmitter();
|
|
125
|
+
this.isOpen = false;
|
|
109
126
|
}
|
|
110
127
|
ngOnInit() { }
|
|
111
128
|
open(callback, data) {
|
|
112
129
|
this._callback = callback;
|
|
113
130
|
this._callbackData = data;
|
|
114
131
|
if (this._modal != undefined) {
|
|
132
|
+
this.isOpen = true;
|
|
115
133
|
this._modal.open();
|
|
116
134
|
}
|
|
117
135
|
}
|
|
118
136
|
close() {
|
|
119
137
|
if (this._modal != undefined) {
|
|
138
|
+
this.isOpen = false;
|
|
120
139
|
this._modal.close();
|
|
121
140
|
}
|
|
122
141
|
}
|
|
@@ -141,14 +160,28 @@ class SdsDialogComponent {
|
|
|
141
160
|
this.dialogClose.emit();
|
|
142
161
|
}
|
|
143
162
|
onModalOpen() {
|
|
163
|
+
var _a, _b, _c;
|
|
144
164
|
this.dialogOpen.emit();
|
|
165
|
+
switch (this.autofocusElement) {
|
|
166
|
+
case 'primary':
|
|
167
|
+
(_a = this._primaryButton) === null || _a === void 0 ? void 0 : _a.nativeElement.focus();
|
|
168
|
+
break;
|
|
169
|
+
case 'secondary':
|
|
170
|
+
(_b = this._secondaryButton) === null || _b === void 0 ? void 0 : _b.nativeElement.focus();
|
|
171
|
+
break;
|
|
172
|
+
case 'content':
|
|
173
|
+
(_c = this._content) === null || _c === void 0 ? void 0 : _c.nativeElement.focus();
|
|
174
|
+
break;
|
|
175
|
+
default:
|
|
176
|
+
break;
|
|
177
|
+
}
|
|
145
178
|
}
|
|
146
179
|
}
|
|
147
180
|
SdsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
148
|
-
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n
|
|
181
|
+
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", closeOnEscape: "closeOnEscape", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton", autofocusElement: "autofocusElement", modalDialogId: "modalDialogId" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true, read: ElementRef, static: true }, { propertyName: "_primaryButton", first: true, predicate: ["primaryButton"], descendants: true, read: ElementRef }, { propertyName: "_secondaryButton", first: true, predicate: ["secondaryButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "autoFocusCloseButton", "translations", "isScrollable", "closeOnEscape"], outputs: ["modalOpen", "modalClose", "closeClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
149
182
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, decorators: [{
|
|
150
183
|
type: Component,
|
|
151
|
-
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n
|
|
184
|
+
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""] }]
|
|
152
185
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
153
186
|
type: Input
|
|
154
187
|
}], closeText: [{
|
|
@@ -167,6 +200,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
167
200
|
type: Input
|
|
168
201
|
}], secondaryButtonType: [{
|
|
169
202
|
type: Input
|
|
203
|
+
}], closeOnEscape: [{
|
|
204
|
+
type: Input
|
|
170
205
|
}], showHeader: [{
|
|
171
206
|
type: Input
|
|
172
207
|
}], showCloseButton: [{
|
|
@@ -175,6 +210,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
175
210
|
type: Input
|
|
176
211
|
}], showSecondaryButton: [{
|
|
177
212
|
type: Input
|
|
213
|
+
}], autofocusElement: [{
|
|
214
|
+
type: Input
|
|
215
|
+
}], modalDialogId: [{
|
|
216
|
+
type: Input
|
|
178
217
|
}], dialogOpen: [{
|
|
179
218
|
type: Output
|
|
180
219
|
}], dialogClose: [{
|
|
@@ -182,6 +221,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
182
221
|
}], _modal: [{
|
|
183
222
|
type: ViewChild,
|
|
184
223
|
args: ['modal', { static: true }]
|
|
224
|
+
}], _content: [{
|
|
225
|
+
type: ViewChild,
|
|
226
|
+
args: ['content', { read: ElementRef, static: true }]
|
|
227
|
+
}], _primaryButton: [{
|
|
228
|
+
type: ViewChild,
|
|
229
|
+
args: ['primaryButton', { read: ElementRef, static: false }]
|
|
230
|
+
}], _secondaryButton: [{
|
|
231
|
+
type: ViewChild,
|
|
232
|
+
args: ['secondaryButton', { read: ElementRef, static: false }]
|
|
185
233
|
}] } });
|
|
186
234
|
|
|
187
235
|
const components = [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-modal.mjs","sources":["../../../projects/ngx-sds-components/src/lib/modal/modal.component.ts","../../../projects/ngx-sds-components/src/lib/modal/modal.component.html","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.ts","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.html","../../../projects/ngx-sds-components/src/lib/modal/modal.module.ts","../../../projects/ngx-sds-components/src/lib/modal/spicainternational-ngx-sds-components-src-lib-modal.ts"],"sourcesContent":["import {\r\n Component,\r\n ElementRef,\r\n Input,\r\n OnInit,\r\n Output,\r\n ViewChild,\r\n EventEmitter,\r\n ContentChild,\r\n HostListener,\r\n} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\r\nimport { ModalTranslations } from './modal.model';\r\n\r\n@Component({\r\n selector: 'sds-modal',\r\n templateUrl: './modal.component.html',\r\n styleUrls: ['./modal.component.scss'],\r\n})\r\nexport class SdsModalComponent implements OnInit {\r\n @ContentChild('header') headerContent: ElementRef = { nativeElement: undefined };\r\n\r\n @Input() public modalTitle?: string;\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showFooter: boolean = true;\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n @Input() public modalDialogId?: string;\r\n @Input() public showCloseButton: boolean = true;\r\n\r\n @Input() public translations: ModalTranslations;\r\n @Input() public isScrollable = true;\r\n @Input() public closeOnEscape = false;\r\n\r\n @Output() public modalOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public modalClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @Output() public closeClick: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n public closeIcon = faXmark;\r\n\r\n @ViewChild('modal', { static: false }) private _modal: ElementRef | undefined;\r\n \r\n\r\n constructor() {\r\n this.translations = {\r\n close: undefined\r\n }\r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'block';\r\n this._modal.nativeElement.focus();\r\n this.modalOpen.emit();\r\n }\r\n }\r\n\r\n public close(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'none';\r\n this.modalClose.emit();\r\n }\r\n }\r\n\r\n public onCloseButtonClick(){\r\n this.closeClick.emit();\r\n this.close();\r\n }\r\n\r\n onKeydown(event: KeyboardEvent){\r\n if (\r\n event.code === 'Escape' &&\r\n this. closeOnEscape && \r\n this._modal != undefined && \r\n this._modal.nativeElement.style.display === 'block'){\r\n // console.log(`${this.constructor.name} got event: ${event.code}`);\r\n this.close();\r\n }\r\n }\r\n}\r\n","<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>","import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { SdsModalComponent } from '../modal.component';\r\nimport { ButtonType } from './dialog.types';\r\n\r\ntype modalButton = 'primary' | 'secondary' | 'close';\r\n\r\n@Component({\r\n selector: 'sds-dialog',\r\n templateUrl: './dialog.component.html',\r\n styleUrls: ['./dialog.component.scss'],\r\n})\r\nexport class SdsDialogComponent implements OnInit {\r\n @Input() public title: string = '';\r\n @Input() public closeText?: string = 'close';\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n\r\n @Input() public primaryButtonText: string = 'Ok';\r\n @Input() public primaryButtonClass: string = 'btn-primary';\r\n @Input() public primaryButtonType: ButtonType = 'button';\r\n \r\n @Input() public secondaryButtonText: string = 'Cancel';\r\n @Input() public secondaryButtonClass: string = 'btn-secondary';\r\n @Input() public secondaryButtonType: ButtonType = 'button';\r\n\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showCloseButton: boolean = true;\r\n @Input() public showPrimaryButton: boolean = true;\r\n @Input() public showSecondaryButton: boolean = true;\r\n\r\n @Output() public dialogOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public dialogClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\r\n\r\n private _callback?: Function;\r\n private _callbackData: any;\r\n\r\n constructor() {}\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(callback?: (button: modalButton, data: any) => void, data?: any): void{\r\n this._callback = callback;\r\n this._callbackData = data;\r\n\r\n if (this._modal != undefined) {\r\n this._modal.open();\r\n }\r\n }\r\n\r\n private close(): void {\r\n if (this._modal != undefined) {\r\n this._modal.close();\r\n }\r\n }\r\n\r\n public onSecondaryClick(): void {\r\n if (this._callback) {\r\n this._callback('secondary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onPrimaryClick(): void {\r\n if (this._callback) {\r\n this._callback('primary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onCloseClick(): void {\r\n if (this._callback) {\r\n this._callback('close', this._callbackData);\r\n }\r\n }\r\n\r\n public onModalClose(): void {\r\n this.dialogClose.emit();\r\n }\r\n\r\n public onModalOpen(): void {\r\n this.dialogOpen.emit();\r\n } \r\n\r\n}\r\n\r\n\r\n\r\n","<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsModalComponent } from './modal.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { SdsDialogComponent } from './dialog/dialog.component';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\n\r\n\r\nconst components = [\r\n SdsModalComponent,\r\n SdsDialogComponent\r\n];\r\n\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n A11yModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsModalModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsModalComponent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-modal.mjs","sources":["../../../projects/ngx-sds-components/src/lib/modal/modal.component.ts","../../../projects/ngx-sds-components/src/lib/modal/modal.component.html","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.ts","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.html","../../../projects/ngx-sds-components/src/lib/modal/modal.module.ts","../../../projects/ngx-sds-components/src/lib/modal/spicainternational-ngx-sds-components-src-lib-modal.ts"],"sourcesContent":["import {\r\n Component,\r\n ElementRef,\r\n Input,\r\n OnInit,\r\n Output,\r\n ViewChild,\r\n EventEmitter,\r\n ContentChild\r\n} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\r\nimport { ModalTranslations } from './modal.model';\r\n\r\n@Component({\r\n selector: 'sds-modal',\r\n templateUrl: './modal.component.html',\r\n styleUrls: ['./modal.component.scss'],\r\n})\r\nexport class SdsModalComponent implements OnInit {\r\n @ContentChild('header') headerContent: ElementRef = { nativeElement: undefined };\r\n\r\n @Input() public modalTitle?: string;\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showFooter: boolean = true;\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n @Input() public modalDialogId?: string;\r\n @Input() public showCloseButton: boolean = true;\r\n @Input() public autoFocusCloseButton: boolean = false;\r\n\r\n @Input() public translations: ModalTranslations;\r\n @Input() public isScrollable = true;\r\n @Input() public closeOnEscape = false;\r\n\r\n @Output() public modalOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public modalClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @Output() public closeClick: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n public closeIcon = faXmark;\r\n\r\n public isOpen: boolean = false;\r\n\r\n @ViewChild('modal', { static: false }) private _modal: ElementRef | undefined;\r\n @ViewChild('closeButton', { static: false }) private _closeButton: ElementRef | undefined;\r\n \r\n\r\n constructor() {\r\n this.translations = {\r\n close: undefined\r\n }\r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'block';\r\n this.isOpen = true;\r\n if(this.autoFocusCloseButton)\r\n this._closeButton?.nativeElement.focus();\r\n this.modalOpen.emit();\r\n }\r\n }\r\n\r\n public close(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'none';\r\n this.isOpen = false;\r\n this.modalClose.emit();\r\n }\r\n }\r\n\r\n public onCloseButtonClick(){\r\n this.closeClick.emit();\r\n this.close();\r\n }\r\n\r\n onKeydown(event: KeyboardEvent){\r\n if (\r\n event.code === 'Escape' &&\r\n this.closeOnEscape && \r\n this._modal != undefined && \r\n this._modal.nativeElement.style.display === 'block'){\r\n // console.log(`${this.constructor.name} got event: ${event.code}`);\r\n this.close();\r\n }\r\n }\r\n}\r\n","<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>","import { Component, ElementRef, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { SdsModalComponent } from '../modal.component';\r\nimport { ButtonType } from './dialog.types';\r\n\r\ntype modalButton = 'primary' | 'secondary' | 'close';\r\n\r\n@Component({\r\n selector: 'sds-dialog',\r\n templateUrl: './dialog.component.html',\r\n styleUrls: ['./dialog.component.scss'],\r\n})\r\nexport class SdsDialogComponent implements OnInit {\r\n @Input() public title: string = '';\r\n @Input() public closeText?: string = 'close';\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n\r\n @Input() public primaryButtonText: string = 'Ok';\r\n @Input() public primaryButtonClass: string = 'btn-primary';\r\n @Input() public primaryButtonType: ButtonType = 'button';\r\n \r\n @Input() public secondaryButtonText: string = 'Cancel'; \r\n @Input() public secondaryButtonClass: string = 'btn-secondary';\r\n @Input() public secondaryButtonType: ButtonType = 'button';\r\n\r\n @Input() public closeOnEscape: boolean = true;\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showCloseButton: boolean = true;\r\n @Input() public showPrimaryButton: boolean = true;\r\n @Input() public showSecondaryButton: boolean = true;\r\n @Input() public autofocusElement: 'primary' | 'secondary' | 'close' | 'content' = \r\n this.showPrimaryButton ? 'primary' :\r\n this.showSecondaryButton ? 'secondary' :\r\n this.showCloseButton ? 'close' :\r\n 'content';\r\n\r\n @Input() public modalDialogId?: string;\r\n\r\n\r\n @Output() public dialogOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public dialogClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\r\n @ViewChild('content', { read: ElementRef, static: true }) private _content?: ElementRef;\r\n @ViewChild('primaryButton', { read: ElementRef, static: false }) private _primaryButton?: ElementRef;\r\n @ViewChild('secondaryButton', { read: ElementRef, static: false }) private _secondaryButton?: ElementRef;\r\n\r\n private _callback?: Function;\r\n private _callbackData: any;\r\n\r\n public isOpen: boolean = false;\r\n\r\n constructor() {}\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(callback?: (button: modalButton, data: any) => void, data?: any): void{\r\n this._callback = callback;\r\n this._callbackData = data;\r\n\r\n if (this._modal != undefined) {\r\n this.isOpen = true;\r\n this._modal.open();\r\n }\r\n }\r\n\r\n private close(): void {\r\n if (this._modal != undefined) {\r\n this.isOpen = false;\r\n this._modal.close();\r\n }\r\n }\r\n\r\n public onSecondaryClick(): void {\r\n if (this._callback) {\r\n this._callback('secondary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onPrimaryClick(): void {\r\n if (this._callback) {\r\n this._callback('primary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onCloseClick(): void {\r\n if (this._callback) {\r\n this._callback('close', this._callbackData);\r\n }\r\n }\r\n\r\n public onModalClose(): void {\r\n this.dialogClose.emit();\r\n }\r\n\r\n public onModalOpen(): void {\r\n this.dialogOpen.emit();\r\n switch (this.autofocusElement) {\r\n case 'primary':\r\n this._primaryButton?.nativeElement.focus();\r\n break;\r\n case 'secondary':\r\n this._secondaryButton?.nativeElement.focus();\r\n break;\r\n case 'content':\r\n this._content?.nativeElement.focus();\r\n break;\r\n default:\r\n break;\r\n }\r\n } \r\n\r\n}\r\n\r\n\r\n\r\n","<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsModalComponent } from './modal.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { SdsDialogComponent } from './dialog/dialog.component';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\n\r\n\r\nconst components = [\r\n SdsModalComponent,\r\n SdsDialogComponent\r\n];\r\n\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n A11yModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsModalModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsModalComponent"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component, ContentChild, Input, Output, ViewChild, NgModule } from '@angular/core';
|
|
2
|
+
import { EventEmitter, Component, ContentChild, Input, Output, ViewChild, ElementRef, NgModule } from '@angular/core';
|
|
3
3
|
import * as i2 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { faXmark } from '@fortawesome/pro-regular-svg-icons';
|
|
@@ -14,12 +14,14 @@ class SdsModalComponent {
|
|
|
14
14
|
this.showFooter = true;
|
|
15
15
|
this.size = 'md';
|
|
16
16
|
this.showCloseButton = true;
|
|
17
|
+
this.autoFocusCloseButton = false;
|
|
17
18
|
this.isScrollable = true;
|
|
18
19
|
this.closeOnEscape = false;
|
|
19
20
|
this.modalOpen = new EventEmitter();
|
|
20
21
|
this.modalClose = new EventEmitter();
|
|
21
22
|
this.closeClick = new EventEmitter();
|
|
22
23
|
this.closeIcon = faXmark;
|
|
24
|
+
this.isOpen = false;
|
|
23
25
|
this.translations = {
|
|
24
26
|
close: undefined
|
|
25
27
|
};
|
|
@@ -28,13 +30,16 @@ class SdsModalComponent {
|
|
|
28
30
|
open() {
|
|
29
31
|
if (this._modal != undefined) {
|
|
30
32
|
this._modal.nativeElement.style.display = 'block';
|
|
31
|
-
this.
|
|
33
|
+
this.isOpen = true;
|
|
34
|
+
if (this.autoFocusCloseButton)
|
|
35
|
+
this._closeButton?.nativeElement.focus();
|
|
32
36
|
this.modalOpen.emit();
|
|
33
37
|
}
|
|
34
38
|
}
|
|
35
39
|
close() {
|
|
36
40
|
if (this._modal != undefined) {
|
|
37
41
|
this._modal.nativeElement.style.display = 'none';
|
|
42
|
+
this.isOpen = false;
|
|
38
43
|
this.modalClose.emit();
|
|
39
44
|
}
|
|
40
45
|
}
|
|
@@ -53,10 +58,10 @@ class SdsModalComponent {
|
|
|
53
58
|
}
|
|
54
59
|
}
|
|
55
60
|
SdsModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
56
|
-
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"], directives: [{ type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
61
|
+
SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", autoFocusCloseButton: "autoFocusCloseButton", translations: "translations", isScrollable: "isScrollable", closeOnEscape: "closeOnEscape" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }, { propertyName: "_closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"], directives: [{ type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
57
62
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, decorators: [{
|
|
58
63
|
type: Component,
|
|
59
|
-
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
|
|
64
|
+
args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal .modal-header button.btn-close:hover{background-color:#e9ecef}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
|
|
60
65
|
}], ctorParameters: function () { return []; }, propDecorators: { headerContent: [{
|
|
61
66
|
type: ContentChild,
|
|
62
67
|
args: ['header']
|
|
@@ -72,6 +77,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
72
77
|
type: Input
|
|
73
78
|
}], showCloseButton: [{
|
|
74
79
|
type: Input
|
|
80
|
+
}], autoFocusCloseButton: [{
|
|
81
|
+
type: Input
|
|
75
82
|
}], translations: [{
|
|
76
83
|
type: Input
|
|
77
84
|
}], isScrollable: [{
|
|
@@ -87,6 +94,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
87
94
|
}], _modal: [{
|
|
88
95
|
type: ViewChild,
|
|
89
96
|
args: ['modal', { static: false }]
|
|
97
|
+
}], _closeButton: [{
|
|
98
|
+
type: ViewChild,
|
|
99
|
+
args: ['closeButton', { static: false }]
|
|
90
100
|
}] } });
|
|
91
101
|
|
|
92
102
|
class SdsDialogComponent {
|
|
@@ -100,23 +110,31 @@ class SdsDialogComponent {
|
|
|
100
110
|
this.secondaryButtonText = 'Cancel';
|
|
101
111
|
this.secondaryButtonClass = 'btn-secondary';
|
|
102
112
|
this.secondaryButtonType = 'button';
|
|
113
|
+
this.closeOnEscape = true;
|
|
103
114
|
this.showHeader = true;
|
|
104
115
|
this.showCloseButton = true;
|
|
105
116
|
this.showPrimaryButton = true;
|
|
106
117
|
this.showSecondaryButton = true;
|
|
118
|
+
this.autofocusElement = this.showPrimaryButton ? 'primary' :
|
|
119
|
+
this.showSecondaryButton ? 'secondary' :
|
|
120
|
+
this.showCloseButton ? 'close' :
|
|
121
|
+
'content';
|
|
107
122
|
this.dialogOpen = new EventEmitter();
|
|
108
123
|
this.dialogClose = new EventEmitter();
|
|
124
|
+
this.isOpen = false;
|
|
109
125
|
}
|
|
110
126
|
ngOnInit() { }
|
|
111
127
|
open(callback, data) {
|
|
112
128
|
this._callback = callback;
|
|
113
129
|
this._callbackData = data;
|
|
114
130
|
if (this._modal != undefined) {
|
|
131
|
+
this.isOpen = true;
|
|
115
132
|
this._modal.open();
|
|
116
133
|
}
|
|
117
134
|
}
|
|
118
135
|
close() {
|
|
119
136
|
if (this._modal != undefined) {
|
|
137
|
+
this.isOpen = false;
|
|
120
138
|
this._modal.close();
|
|
121
139
|
}
|
|
122
140
|
}
|
|
@@ -142,13 +160,26 @@ class SdsDialogComponent {
|
|
|
142
160
|
}
|
|
143
161
|
onModalOpen() {
|
|
144
162
|
this.dialogOpen.emit();
|
|
163
|
+
switch (this.autofocusElement) {
|
|
164
|
+
case 'primary':
|
|
165
|
+
this._primaryButton?.nativeElement.focus();
|
|
166
|
+
break;
|
|
167
|
+
case 'secondary':
|
|
168
|
+
this._secondaryButton?.nativeElement.focus();
|
|
169
|
+
break;
|
|
170
|
+
case 'content':
|
|
171
|
+
this._content?.nativeElement.focus();
|
|
172
|
+
break;
|
|
173
|
+
default:
|
|
174
|
+
break;
|
|
175
|
+
}
|
|
145
176
|
}
|
|
146
177
|
}
|
|
147
178
|
SdsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
148
|
-
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n
|
|
179
|
+
SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", closeOnEscape: "closeOnEscape", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton", autofocusElement: "autofocusElement", modalDialogId: "modalDialogId" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true, read: ElementRef, static: true }, { propertyName: "_primaryButton", first: true, predicate: ["primaryButton"], descendants: true, read: ElementRef }, { propertyName: "_secondaryButton", first: true, predicate: ["secondaryButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "autoFocusCloseButton", "translations", "isScrollable", "closeOnEscape"], outputs: ["modalOpen", "modalClose", "closeClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
149
180
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, decorators: [{
|
|
150
181
|
type: Component,
|
|
151
|
-
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n
|
|
182
|
+
args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n", styles: [""] }]
|
|
152
183
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
153
184
|
type: Input
|
|
154
185
|
}], closeText: [{
|
|
@@ -167,6 +198,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
167
198
|
type: Input
|
|
168
199
|
}], secondaryButtonType: [{
|
|
169
200
|
type: Input
|
|
201
|
+
}], closeOnEscape: [{
|
|
202
|
+
type: Input
|
|
170
203
|
}], showHeader: [{
|
|
171
204
|
type: Input
|
|
172
205
|
}], showCloseButton: [{
|
|
@@ -175,6 +208,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
175
208
|
type: Input
|
|
176
209
|
}], showSecondaryButton: [{
|
|
177
210
|
type: Input
|
|
211
|
+
}], autofocusElement: [{
|
|
212
|
+
type: Input
|
|
213
|
+
}], modalDialogId: [{
|
|
214
|
+
type: Input
|
|
178
215
|
}], dialogOpen: [{
|
|
179
216
|
type: Output
|
|
180
217
|
}], dialogClose: [{
|
|
@@ -182,6 +219,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
182
219
|
}], _modal: [{
|
|
183
220
|
type: ViewChild,
|
|
184
221
|
args: ['modal', { static: true }]
|
|
222
|
+
}], _content: [{
|
|
223
|
+
type: ViewChild,
|
|
224
|
+
args: ['content', { read: ElementRef, static: true }]
|
|
225
|
+
}], _primaryButton: [{
|
|
226
|
+
type: ViewChild,
|
|
227
|
+
args: ['primaryButton', { read: ElementRef, static: false }]
|
|
228
|
+
}], _secondaryButton: [{
|
|
229
|
+
type: ViewChild,
|
|
230
|
+
args: ['secondaryButton', { read: ElementRef, static: false }]
|
|
185
231
|
}] } });
|
|
186
232
|
|
|
187
233
|
const components = [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-modal.mjs","sources":["../../../projects/ngx-sds-components/src/lib/modal/modal.component.ts","../../../projects/ngx-sds-components/src/lib/modal/modal.component.html","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.ts","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.html","../../../projects/ngx-sds-components/src/lib/modal/modal.module.ts","../../../projects/ngx-sds-components/src/lib/modal/spicainternational-ngx-sds-components-src-lib-modal.ts"],"sourcesContent":["import {\r\n Component,\r\n ElementRef,\r\n Input,\r\n OnInit,\r\n Output,\r\n ViewChild,\r\n EventEmitter,\r\n ContentChild,\r\n HostListener,\r\n} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\r\nimport { ModalTranslations } from './modal.model';\r\n\r\n@Component({\r\n selector: 'sds-modal',\r\n templateUrl: './modal.component.html',\r\n styleUrls: ['./modal.component.scss'],\r\n})\r\nexport class SdsModalComponent implements OnInit {\r\n @ContentChild('header') headerContent: ElementRef = { nativeElement: undefined };\r\n\r\n @Input() public modalTitle?: string;\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showFooter: boolean = true;\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n @Input() public modalDialogId?: string;\r\n @Input() public showCloseButton: boolean = true;\r\n\r\n @Input() public translations: ModalTranslations;\r\n @Input() public isScrollable = true;\r\n @Input() public closeOnEscape = false;\r\n\r\n @Output() public modalOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public modalClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @Output() public closeClick: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n public closeIcon = faXmark;\r\n\r\n @ViewChild('modal', { static: false }) private _modal: ElementRef | undefined;\r\n \r\n\r\n constructor() {\r\n this.translations = {\r\n close: undefined\r\n }\r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'block';\r\n this._modal.nativeElement.focus();\r\n this.modalOpen.emit();\r\n }\r\n }\r\n\r\n public close(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'none';\r\n this.modalClose.emit();\r\n }\r\n }\r\n\r\n public onCloseButtonClick(){\r\n this.closeClick.emit();\r\n this.close();\r\n }\r\n\r\n onKeydown(event: KeyboardEvent){\r\n if (\r\n event.code === 'Escape' &&\r\n this. closeOnEscape && \r\n this._modal != undefined && \r\n this._modal.nativeElement.style.display === 'block'){\r\n // console.log(`${this.constructor.name} got event: ${event.code}`);\r\n this.close();\r\n }\r\n }\r\n}\r\n","<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>","import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { SdsModalComponent } from '../modal.component';\r\nimport { ButtonType } from './dialog.types';\r\n\r\ntype modalButton = 'primary' | 'secondary' | 'close';\r\n\r\n@Component({\r\n selector: 'sds-dialog',\r\n templateUrl: './dialog.component.html',\r\n styleUrls: ['./dialog.component.scss'],\r\n})\r\nexport class SdsDialogComponent implements OnInit {\r\n @Input() public title: string = '';\r\n @Input() public closeText?: string = 'close';\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n\r\n @Input() public primaryButtonText: string = 'Ok';\r\n @Input() public primaryButtonClass: string = 'btn-primary';\r\n @Input() public primaryButtonType: ButtonType = 'button';\r\n \r\n @Input() public secondaryButtonText: string = 'Cancel';\r\n @Input() public secondaryButtonClass: string = 'btn-secondary';\r\n @Input() public secondaryButtonType: ButtonType = 'button';\r\n\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showCloseButton: boolean = true;\r\n @Input() public showPrimaryButton: boolean = true;\r\n @Input() public showSecondaryButton: boolean = true;\r\n\r\n @Output() public dialogOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public dialogClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\r\n\r\n private _callback?: Function;\r\n private _callbackData: any;\r\n\r\n constructor() {}\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(callback?: (button: modalButton, data: any) => void, data?: any): void{\r\n this._callback = callback;\r\n this._callbackData = data;\r\n\r\n if (this._modal != undefined) {\r\n this._modal.open();\r\n }\r\n }\r\n\r\n private close(): void {\r\n if (this._modal != undefined) {\r\n this._modal.close();\r\n }\r\n }\r\n\r\n public onSecondaryClick(): void {\r\n if (this._callback) {\r\n this._callback('secondary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onPrimaryClick(): void {\r\n if (this._callback) {\r\n this._callback('primary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onCloseClick(): void {\r\n if (this._callback) {\r\n this._callback('close', this._callbackData);\r\n }\r\n }\r\n\r\n public onModalClose(): void {\r\n this.dialogClose.emit();\r\n }\r\n\r\n public onModalOpen(): void {\r\n this.dialogOpen.emit();\r\n } \r\n\r\n}\r\n\r\n\r\n\r\n","<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsModalComponent } from './modal.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { SdsDialogComponent } from './dialog/dialog.component';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\n\r\n\r\nconst components = [\r\n SdsModalComponent,\r\n SdsDialogComponent\r\n];\r\n\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n A11yModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsModalModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsModalComponent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-modal.mjs","sources":["../../../projects/ngx-sds-components/src/lib/modal/modal.component.ts","../../../projects/ngx-sds-components/src/lib/modal/modal.component.html","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.ts","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.html","../../../projects/ngx-sds-components/src/lib/modal/modal.module.ts","../../../projects/ngx-sds-components/src/lib/modal/spicainternational-ngx-sds-components-src-lib-modal.ts"],"sourcesContent":["import {\r\n Component,\r\n ElementRef,\r\n Input,\r\n OnInit,\r\n Output,\r\n ViewChild,\r\n EventEmitter,\r\n ContentChild\r\n} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\r\nimport { ModalTranslations } from './modal.model';\r\n\r\n@Component({\r\n selector: 'sds-modal',\r\n templateUrl: './modal.component.html',\r\n styleUrls: ['./modal.component.scss'],\r\n})\r\nexport class SdsModalComponent implements OnInit {\r\n @ContentChild('header') headerContent: ElementRef = { nativeElement: undefined };\r\n\r\n @Input() public modalTitle?: string;\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showFooter: boolean = true;\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n @Input() public modalDialogId?: string;\r\n @Input() public showCloseButton: boolean = true;\r\n @Input() public autoFocusCloseButton: boolean = false;\r\n\r\n @Input() public translations: ModalTranslations;\r\n @Input() public isScrollable = true;\r\n @Input() public closeOnEscape = false;\r\n\r\n @Output() public modalOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public modalClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @Output() public closeClick: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n public closeIcon = faXmark;\r\n\r\n public isOpen: boolean = false;\r\n\r\n @ViewChild('modal', { static: false }) private _modal: ElementRef | undefined;\r\n @ViewChild('closeButton', { static: false }) private _closeButton: ElementRef | undefined;\r\n \r\n\r\n constructor() {\r\n this.translations = {\r\n close: undefined\r\n }\r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'block';\r\n this.isOpen = true;\r\n if(this.autoFocusCloseButton)\r\n this._closeButton?.nativeElement.focus();\r\n this.modalOpen.emit();\r\n }\r\n }\r\n\r\n public close(): void {\r\n if (this._modal != undefined) {\r\n this._modal.nativeElement.style.display = 'none';\r\n this.isOpen = false;\r\n this.modalClose.emit();\r\n }\r\n }\r\n\r\n public onCloseButtonClick(){\r\n this.closeClick.emit();\r\n this.close();\r\n }\r\n\r\n onKeydown(event: KeyboardEvent){\r\n if (\r\n event.code === 'Escape' &&\r\n this.closeOnEscape && \r\n this._modal != undefined && \r\n this._modal.nativeElement.style.display === 'block'){\r\n // console.log(`${this.constructor.name} got event: ${event.code}`);\r\n this.close();\r\n }\r\n }\r\n}\r\n","<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" [cdkTrapFocus]=\"isOpen\" [cdkTrapFocusAutoCapture]=\"true\" >\r\n <div\r\n class=\"modal-dialog modal-dialog-centered\"\r\n [class.modal-dialog-scrollable] = \"isScrollable\"\r\n [attr.id]=\"modalDialogId\"\r\n [ngClass]=\"'modal-' + size\"\r\n role=\"document\"\r\n >\r\n <div class=\"modal-content\">\r\n\r\n <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n <ng-content select='header'></ng-content>\r\n </div> \r\n\r\n <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n <button \r\n #closeButton\r\n *ngIf=\"showCloseButton\"\r\n type=\"button\" \r\n class=\"btn-close\" \r\n [title]=\"translations.close ?? ''\"\r\n (click)=\"onCloseButtonClick()\">\r\n </button>\r\n </div>\r\n\r\n <div class=\"modal-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n <ng-content select=\"footer\"></ng-content>\r\n </div> \r\n </div>\r\n </div>\r\n</div>","import { Component, ElementRef, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { SdsModalComponent } from '../modal.component';\r\nimport { ButtonType } from './dialog.types';\r\n\r\ntype modalButton = 'primary' | 'secondary' | 'close';\r\n\r\n@Component({\r\n selector: 'sds-dialog',\r\n templateUrl: './dialog.component.html',\r\n styleUrls: ['./dialog.component.scss'],\r\n})\r\nexport class SdsDialogComponent implements OnInit {\r\n @Input() public title: string = '';\r\n @Input() public closeText?: string = 'close';\r\n @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n\r\n @Input() public primaryButtonText: string = 'Ok';\r\n @Input() public primaryButtonClass: string = 'btn-primary';\r\n @Input() public primaryButtonType: ButtonType = 'button';\r\n \r\n @Input() public secondaryButtonText: string = 'Cancel'; \r\n @Input() public secondaryButtonClass: string = 'btn-secondary';\r\n @Input() public secondaryButtonType: ButtonType = 'button';\r\n\r\n @Input() public closeOnEscape: boolean = true;\r\n @Input() public showHeader: boolean = true;\r\n @Input() public showCloseButton: boolean = true;\r\n @Input() public showPrimaryButton: boolean = true;\r\n @Input() public showSecondaryButton: boolean = true;\r\n @Input() public autofocusElement: 'primary' | 'secondary' | 'close' | 'content' = \r\n this.showPrimaryButton ? 'primary' :\r\n this.showSecondaryButton ? 'secondary' :\r\n this.showCloseButton ? 'close' :\r\n 'content';\r\n\r\n @Input() public modalDialogId?: string;\r\n\r\n\r\n @Output() public dialogOpen: EventEmitter<void> = new EventEmitter<void>();\r\n @Output() public dialogClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\r\n @ViewChild('content', { read: ElementRef, static: true }) private _content?: ElementRef;\r\n @ViewChild('primaryButton', { read: ElementRef, static: false }) private _primaryButton?: ElementRef;\r\n @ViewChild('secondaryButton', { read: ElementRef, static: false }) private _secondaryButton?: ElementRef;\r\n\r\n private _callback?: Function;\r\n private _callbackData: any;\r\n\r\n public isOpen: boolean = false;\r\n\r\n constructor() {}\r\n\r\n ngOnInit(): void {}\r\n\r\n public open(callback?: (button: modalButton, data: any) => void, data?: any): void{\r\n this._callback = callback;\r\n this._callbackData = data;\r\n\r\n if (this._modal != undefined) {\r\n this.isOpen = true;\r\n this._modal.open();\r\n }\r\n }\r\n\r\n private close(): void {\r\n if (this._modal != undefined) {\r\n this.isOpen = false;\r\n this._modal.close();\r\n }\r\n }\r\n\r\n public onSecondaryClick(): void {\r\n if (this._callback) {\r\n this._callback('secondary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onPrimaryClick(): void {\r\n if (this._callback) {\r\n this._callback('primary', this._callbackData);\r\n }\r\n this.close();\r\n }\r\n\r\n public onCloseClick(): void {\r\n if (this._callback) {\r\n this._callback('close', this._callbackData);\r\n }\r\n }\r\n\r\n public onModalClose(): void {\r\n this.dialogClose.emit();\r\n }\r\n\r\n public onModalOpen(): void {\r\n this.dialogOpen.emit();\r\n switch (this.autofocusElement) {\r\n case 'primary':\r\n this._primaryButton?.nativeElement.focus();\r\n break;\r\n case 'secondary':\r\n this._secondaryButton?.nativeElement.focus();\r\n break;\r\n case 'content':\r\n this._content?.nativeElement.focus();\r\n break;\r\n default:\r\n break;\r\n }\r\n } \r\n\r\n}\r\n\r\n\r\n\r\n","<sds-modal\r\n #modal\r\n [modalTitle]=\"title\"\r\n [size]=\"size\"\r\n [modalDialogId]=\"modalDialogId\"\r\n [showCloseButton]=\"showCloseButton\"\r\n [showHeader]=\"showHeader\"\r\n [translations]=\"{ close: closeText}\"\r\n [autoFocusCloseButton]=\"autofocusElement === 'close'\"\r\n [closeOnEscape]=\"closeOnEscape\"\r\n (closeClick)=\"onCloseClick()\"\r\n (modalClose)=\"onModalClose()\"\r\n (modalOpen)=\"onModalOpen()\"\r\n>\r\n\r\n <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\r\n <ng-content></ng-content>\r\n </div>\r\n <ng-container #footer ngProjectAs='footer'>\r\n <button\r\n #secondaryButton\r\n *ngIf=\"showSecondaryButton\"\r\n class=\"btn\"\r\n [class]=\"secondaryButtonClass\"\r\n (click)=\"onSecondaryClick()\"\r\n >{{secondaryButtonText}}</button>\r\n <button\r\n #primaryButton\r\n *ngIf=\"showPrimaryButton\"\r\n class=\"btn\"\r\n [class]=\"primaryButtonClass\"\r\n (click)=\"onPrimaryClick()\"\r\n >{{primaryButtonText}}</button>\r\n </ng-container>\r\n</sds-modal>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsModalComponent } from './modal.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { SdsDialogComponent } from './dialog/dialog.component';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\n\r\n\r\nconst components = [\r\n SdsModalComponent,\r\n SdsDialogComponent\r\n];\r\n\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n A11yModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsModalModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsModalComponent"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -12,15 +12,22 @@ export declare class SdsDialogComponent implements OnInit {
|
|
|
12
12
|
secondaryButtonText: string;
|
|
13
13
|
secondaryButtonClass: string;
|
|
14
14
|
secondaryButtonType: ButtonType;
|
|
15
|
+
closeOnEscape: boolean;
|
|
15
16
|
showHeader: boolean;
|
|
16
17
|
showCloseButton: boolean;
|
|
17
18
|
showPrimaryButton: boolean;
|
|
18
19
|
showSecondaryButton: boolean;
|
|
20
|
+
autofocusElement: 'primary' | 'secondary' | 'close' | 'content';
|
|
21
|
+
modalDialogId?: string;
|
|
19
22
|
dialogOpen: EventEmitter<void>;
|
|
20
23
|
dialogClose: EventEmitter<void>;
|
|
21
24
|
private _modal;
|
|
25
|
+
private _content?;
|
|
26
|
+
private _primaryButton?;
|
|
27
|
+
private _secondaryButton?;
|
|
22
28
|
private _callback?;
|
|
23
29
|
private _callbackData;
|
|
30
|
+
isOpen: boolean;
|
|
24
31
|
constructor();
|
|
25
32
|
ngOnInit(): void;
|
|
26
33
|
open(callback?: (button: modalButton, data: any) => void, data?: any): void;
|
|
@@ -31,6 +38,6 @@ export declare class SdsDialogComponent implements OnInit {
|
|
|
31
38
|
onModalClose(): void;
|
|
32
39
|
onModalOpen(): void;
|
|
33
40
|
static ɵfac: i0.ɵɵFactoryDeclaration<SdsDialogComponent, never>;
|
|
34
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SdsDialogComponent, "sds-dialog", never, { "title": "title"; "closeText": "closeText"; "size": "size"; "primaryButtonText": "primaryButtonText"; "primaryButtonClass": "primaryButtonClass"; "primaryButtonType": "primaryButtonType"; "secondaryButtonText": "secondaryButtonText"; "secondaryButtonClass": "secondaryButtonClass"; "secondaryButtonType": "secondaryButtonType"; "showHeader": "showHeader"; "showCloseButton": "showCloseButton"; "showPrimaryButton": "showPrimaryButton"; "showSecondaryButton": "showSecondaryButton"; }, { "dialogOpen": "dialogOpen"; "dialogClose": "dialogClose"; }, never, ["*"]>;
|
|
41
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SdsDialogComponent, "sds-dialog", never, { "title": "title"; "closeText": "closeText"; "size": "size"; "primaryButtonText": "primaryButtonText"; "primaryButtonClass": "primaryButtonClass"; "primaryButtonType": "primaryButtonType"; "secondaryButtonText": "secondaryButtonText"; "secondaryButtonClass": "secondaryButtonClass"; "secondaryButtonType": "secondaryButtonType"; "closeOnEscape": "closeOnEscape"; "showHeader": "showHeader"; "showCloseButton": "showCloseButton"; "showPrimaryButton": "showPrimaryButton"; "showSecondaryButton": "showSecondaryButton"; "autofocusElement": "autofocusElement"; "modalDialogId": "modalDialogId"; }, { "dialogOpen": "dialogOpen"; "dialogClose": "dialogClose"; }, never, ["*"]>;
|
|
35
42
|
}
|
|
36
43
|
export {};
|
|
@@ -9,6 +9,7 @@ export declare class SdsModalComponent implements OnInit {
|
|
|
9
9
|
size: 'sm' | 'md' | 'lg' | 'xl';
|
|
10
10
|
modalDialogId?: string;
|
|
11
11
|
showCloseButton: boolean;
|
|
12
|
+
autoFocusCloseButton: boolean;
|
|
12
13
|
translations: ModalTranslations;
|
|
13
14
|
isScrollable: boolean;
|
|
14
15
|
closeOnEscape: boolean;
|
|
@@ -16,7 +17,9 @@ export declare class SdsModalComponent implements OnInit {
|
|
|
16
17
|
modalClose: EventEmitter<void>;
|
|
17
18
|
closeClick: EventEmitter<void>;
|
|
18
19
|
closeIcon: import("@fortawesome/fontawesome-common-types").IconDefinition;
|
|
20
|
+
isOpen: boolean;
|
|
19
21
|
private _modal;
|
|
22
|
+
private _closeButton;
|
|
20
23
|
constructor();
|
|
21
24
|
ngOnInit(): void;
|
|
22
25
|
open(): void;
|
|
@@ -24,5 +27,5 @@ export declare class SdsModalComponent implements OnInit {
|
|
|
24
27
|
onCloseButtonClick(): void;
|
|
25
28
|
onKeydown(event: KeyboardEvent): void;
|
|
26
29
|
static ɵfac: i0.ɵɵFactoryDeclaration<SdsModalComponent, never>;
|
|
27
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SdsModalComponent, "sds-modal", never, { "modalTitle": "modalTitle"; "showHeader": "showHeader"; "showFooter": "showFooter"; "size": "size"; "modalDialogId": "modalDialogId"; "showCloseButton": "showCloseButton"; "translations": "translations"; "isScrollable": "isScrollable"; "closeOnEscape": "closeOnEscape"; }, { "modalOpen": "modalOpen"; "modalClose": "modalClose"; "closeClick": "closeClick"; }, ["headerContent"], ["header", "*", "footer"]>;
|
|
30
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SdsModalComponent, "sds-modal", never, { "modalTitle": "modalTitle"; "showHeader": "showHeader"; "showFooter": "showFooter"; "size": "size"; "modalDialogId": "modalDialogId"; "showCloseButton": "showCloseButton"; "autoFocusCloseButton": "autoFocusCloseButton"; "translations": "translations"; "isScrollable": "isScrollable"; "closeOnEscape": "closeOnEscape"; }, { "modalOpen": "modalOpen"; "modalClose": "modalClose"; "closeClick": "closeClick"; }, ["headerContent"], ["header", "*", "footer"]>;
|
|
28
31
|
}
|