ets-fe-ng-sdk 18.0.49 → 18.0.51
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/esm2022/lib/Shared/components/info-dialog/info-dialog.component.mjs +3 -3
- package/esm2022/lib/Shared/components/notifications/toast-notifications/toast-notifications.component.mjs +10 -3
- package/fesm2022/ets-fe-ng-sdk.mjs +9 -2
- package/fesm2022/ets-fe-ng-sdk.mjs.map +1 -1
- package/lib/Shared/components/notifications/toast-notifications/toast-notifications.component.d.ts +3 -0
- package/package.json +1 -1
|
@@ -39,13 +39,13 @@ export class InfoDialogComponent {
|
|
|
39
39
|
this.dialogRef.close(false);
|
|
40
40
|
}
|
|
41
41
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: InfoDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
42
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: InfoDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\"
|
|
42
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: InfoDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\">\n <i class=\"material-icons\">close</i>\n </button>\n</div>\n\n<div class=\"info-body\" [innerHTML]=\"data?.text | appTranslate | async\"></div>\n\n@if (data?.btns?.length) {\n <div class=\"info-buttons\">\n <div class=\"row justify-content-center\">\n @for (item of data?.btns; track item) {\n <div class=\"col-md-auto my-1\">\n <app-btn\n [type]=\"item.type || 'secondary'\"\n text=\"{{ item.value || item.label }}\"\n [icon]=\"item.icon\"\n (mclick)=\"item.action($event); yes(item)\"></app-btn>\n </div>\n }\n </div>\n </div>\n}\n<div class=\"bg-{{ cls() }} mt-2 rounded bar\"></div>\n", styles: [":host{text-align:center}:host .bar{height:5px}:host .info-body{overflow-wrap:anywhere;white-space:pre-line;padding:1rem}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: SDKTranslatePipe, name: "appTranslate" }] }); }
|
|
43
43
|
}
|
|
44
44
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: InfoDialogComponent, decorators: [{
|
|
45
45
|
type: Component,
|
|
46
|
-
args: [{ standalone: true, imports: [MatButtonModule, NgFor, BtnComponent, AsyncPipe, SDKTranslatePipe], template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\"
|
|
46
|
+
args: [{ standalone: true, imports: [MatButtonModule, NgFor, BtnComponent, AsyncPipe, SDKTranslatePipe], template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\">\n <i class=\"material-icons\">close</i>\n </button>\n</div>\n\n<div class=\"info-body\" [innerHTML]=\"data?.text | appTranslate | async\"></div>\n\n@if (data?.btns?.length) {\n <div class=\"info-buttons\">\n <div class=\"row justify-content-center\">\n @for (item of data?.btns; track item) {\n <div class=\"col-md-auto my-1\">\n <app-btn\n [type]=\"item.type || 'secondary'\"\n text=\"{{ item.value || item.label }}\"\n [icon]=\"item.icon\"\n (mclick)=\"item.action($event); yes(item)\"></app-btn>\n </div>\n }\n </div>\n </div>\n}\n<div class=\"bg-{{ cls() }} mt-2 rounded bar\"></div>\n", styles: [":host{text-align:center}:host .bar{height:5px}:host .info-body{overflow-wrap:anywhere;white-space:pre-line;padding:1rem}\n"] }]
|
|
47
47
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
48
48
|
type: Inject,
|
|
49
49
|
args: [MAT_DIALOG_DATA]
|
|
50
50
|
}] }, { type: i1.MatDialogRef }] });
|
|
51
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
51
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5mby1kaWFsb2cuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZXRzLWZlLW5nLXNkay9zcmMvbGliL1NoYXJlZC9jb21wb25lbnRzL2luZm8tZGlhbG9nL2luZm8tZGlhbG9nLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2V0cy1mZS1uZy1zZGsvc3JjL2xpYi9TaGFyZWQvY29tcG9uZW50cy9pbmZvLWRpYWxvZy9pbmZvLWRpYWxvZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBVSxNQUFNLGVBQWUsQ0FBQztBQUMxRCxPQUFPLEVBQ0wsZUFBZSxJQUFJLGVBQWUsR0FFbkMsTUFBTSwwQkFBMEIsQ0FBQztBQUVsQyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUM5RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDcEQsT0FBTyxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7Ozs7QUFTM0QsTUFBTSxPQUFPLG1CQUFtQjtJQUM5QixZQUVTLElBS04sRUFDTSxTQUE0QztRQU41QyxTQUFJLEdBQUosSUFBSSxDQUtWO1FBQ00sY0FBUyxHQUFULFNBQVMsQ0FBbUM7UUFZckQsaUJBQVksR0FBRyxDQUFDLEtBQW1CLEVBQUUsSUFBb0IsRUFBRSxFQUFFO1lBQzNELElBQUksRUFBRSxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDcEIsSUFBSSxJQUFJLEVBQUUsZUFBZTtnQkFBRSxJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQ3BELENBQUMsQ0FBQztRQUNGLFFBQUcsR0FBRyxDQUFDLFNBQW9CLElBQUksQ0FBQyxJQUFJLENBQUMsTUFBYSxFQUFFLEVBQUU7WUFDcEQsUUFBUSxNQUFNLEVBQUUsQ0FBQztnQkFDZixLQUFLLENBQUM7b0JBQ0osT0FBTyxTQUFTLENBQUM7Z0JBQ25CLEtBQUssQ0FBQztvQkFDSixPQUFPLE1BQU0sQ0FBQztnQkFDaEIsS0FBSyxDQUFDO29CQUNKLE9BQU8sUUFBUSxDQUFDO2dCQUNsQjtvQkFDRSxPQUFPLEVBQUUsQ0FBQztZQUNkLENBQUM7UUFDSCxDQUFDLENBQUM7SUExQkMsQ0FBQztJQUVKLFFBQVEsS0FBSSxDQUFDO0lBQ2IsR0FBRyxDQUFDLEdBQW9CO1FBQ3RCLElBQUksR0FBRyxJQUFJLEdBQUcsQ0FBQyxlQUFlLEtBQUssS0FBSztZQUFFLE9BQU87UUFDakQsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDN0IsQ0FBQztJQUNELEVBQUU7UUFDQSxJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM5QixDQUFDOzhHQW5CVSxtQkFBbUIsa0JBRXBCLGVBQWU7a0dBRmQsbUJBQW1CLHdFQ2xCaEMsNGhDQTRCQSxtTERaWSxlQUFlLDRJQUFTLFlBQVksOGZBQUUsU0FBUyx5Q0FBRSxnQkFBZ0I7OzJGQUVoRSxtQkFBbUI7a0JBTi9CLFNBQVM7aUNBR0ksSUFBSSxXQUNQLENBQUMsZUFBZSxFQUFFLEtBQUssRUFBRSxZQUFZLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixDQUFDOzswQkFJekUsTUFBTTsyQkFBQyxlQUFlIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbmplY3QsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtcbiAgTUFUX0RJQUxPR19EQVRBIGFzIE1BVF9ESUFMT0dfREFUQSxcbiAgTWF0RGlhbG9nUmVmIGFzIE1hdERpYWxvZ1JlZixcbn0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGlhbG9nJztcblxuaW1wb3J0IHsgU0RLVHJhbnNsYXRlUGlwZSB9IGZyb20gJy4uLy4uL3BpcGVzL3RyYW5zbGF0ZS5waXBlJztcbmltcG9ydCB7IEJ0bkNvbXBvbmVudCB9IGZyb20gJy4uL2J0bi9idG4uY29tcG9uZW50JztcbmltcG9ydCB7IE5nRm9yLCBBc3luY1BpcGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgTWF0QnV0dG9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvYnV0dG9uJztcbmltcG9ydCB7IElCdG4gfSBmcm9tICcuLi9idG4vYnRuLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHRlbXBsYXRlVXJsOiAnLi9pbmZvLWRpYWxvZy5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9pbmZvLWRpYWxvZy5jb21wb25lbnQuc2NzcycsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtNYXRCdXR0b25Nb2R1bGUsIE5nRm9yLCBCdG5Db21wb25lbnQsIEFzeW5jUGlwZSwgU0RLVHJhbnNsYXRlUGlwZV0sXG59KVxuZXhwb3J0IGNsYXNzIEluZm9EaWFsb2dDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBjb25zdHJ1Y3RvcihcbiAgICBASW5qZWN0KE1BVF9ESUFMT0dfREFUQSlcbiAgICBwdWJsaWMgZGF0YToge1xuICAgICAgdGV4dDogc3RyaW5nO1xuICAgICAgaGVhZGluZzogc3RyaW5nO1xuICAgICAgc3RhdHVzOiBudW1iZXI7XG4gICAgICBidG5zOiBJSW5mb0RpYWxvZ0J0bltdO1xuICAgIH0sXG4gICAgcHVibGljIGRpYWxvZ1JlZjogTWF0RGlhbG9nUmVmPEluZm9EaWFsb2dDb21wb25lbnQ+LFxuICApIHt9XG5cbiAgbmdPbkluaXQoKSB7fVxuICB5ZXMoYnRuPzogSUluZm9EaWFsb2dCdG4pIHtcbiAgICBpZiAoYnRuICYmIGJ0bi5jbG9zZUJveE9uQ2xpY2sgPT09IGZhbHNlKSByZXR1cm47XG4gICAgdGhpcy5kaWFsb2dSZWYuY2xvc2UodHJ1ZSk7XG4gIH1cbiAgbm8oKSB7XG4gICAgdGhpcy5kaWFsb2dSZWYuY2xvc2UoZmFsc2UpO1xuICB9XG5cbiAgaGFuZGxlQWN0aW9uID0gKGV2ZW50OiBQb2ludGVyRXZlbnQsIGl0ZW06IElJbmZvRGlhbG9nQnRuKSA9PiB7XG4gICAgaXRlbT8uYWN0aW9uKGV2ZW50KTtcbiAgICBpZiAoaXRlbT8uY2xvc2VCb3hPbkNsaWNrKSB0aGlzLmRpYWxvZ1JlZi5jbG9zZSgpO1xuICB9O1xuICBjbHMgPSAoc3RhdHVzOiAwIHwgMSB8IDIgPSB0aGlzLmRhdGEuc3RhdHVzIGFzIGFueSkgPT4ge1xuICAgIHN3aXRjaCAoc3RhdHVzKSB7XG4gICAgICBjYXNlIDE6XG4gICAgICAgIHJldHVybiAnc3VjY2Vzcyc7XG4gICAgICBjYXNlIDI6XG4gICAgICAgIHJldHVybiAnaW5mbyc7XG4gICAgICBjYXNlIDA6XG4gICAgICAgIHJldHVybiAnZGFuZ2VyJztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIHJldHVybiAnJztcbiAgICB9XG4gIH07XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgSUluZm9EaWFsb2dCdG4gZXh0ZW5kcyBJQnRuIHtcbiAgLyoqXG4gICAqIERldGVybWluZSB3aGV0aGVyIHRvIGNsb3NlIHRoZSBpbmZvIG9uIGNsaWNraW5nIHRoZSBidXR0b25cbiAgICovXG4gIGNsb3NlQm94T25DbGljaz86IGJvb2xlYW47XG59XG4iLCI8ZGl2IGNsYXNzPVwiZC1mbGV4IGp1c3RpZnktY29udGVudC1iZXR3ZWVuIGFsaWduLWl0ZW1zLWNlbnRlclwiPlxuICA8ZGl2IGNsYXNzPVwidGV4dC17eyBjbHMoKSB9fSBtcy0zIGZvbnQtd2VpZ2h0LWJvbGQgdGV4dC11cHBlcmNhc2VcIj5cbiAgICA8aSBjbGFzcz1cImZhIGZhLXt7IGRhdGE/LnN0YXR1cyA/ICdjaGVjay1jaXJjbGUnIDogJ2V4Y2xhbWF0aW9uLWNpcmNsZScgfX1cIj48L2k+XG4gICAge3sgZGF0YT8uaGVhZGluZyB8fCAnTm90aWNlJyB8IGFwcFRyYW5zbGF0ZSB8IGFzeW5jIH19XG4gIDwvZGl2PlxuICA8YnV0dG9uIG1hdC1pY29uLWJ1dHRvbiAoY2xpY2spPVwieWVzKClcIiBjbGFzcz1cImJ0bi1vdXRsaW5lLWRhbmdlclwiPlxuICAgIDxpIGNsYXNzPVwibWF0ZXJpYWwtaWNvbnNcIj5jbG9zZTwvaT5cbiAgPC9idXR0b24+XG48L2Rpdj5cblxuPGRpdiBjbGFzcz1cImluZm8tYm9keVwiIFtpbm5lckhUTUxdPVwiZGF0YT8udGV4dCB8IGFwcFRyYW5zbGF0ZSB8IGFzeW5jXCI+PC9kaXY+XG5cbkBpZiAoZGF0YT8uYnRucz8ubGVuZ3RoKSB7XG4gIDxkaXYgY2xhc3M9XCJpbmZvLWJ1dHRvbnNcIj5cbiAgICA8ZGl2IGNsYXNzPVwicm93IGp1c3RpZnktY29udGVudC1jZW50ZXJcIj5cbiAgICAgIEBmb3IgKGl0ZW0gb2YgZGF0YT8uYnRuczsgdHJhY2sgaXRlbSkge1xuICAgICAgICA8ZGl2IGNsYXNzPVwiY29sLW1kLWF1dG8gbXktMVwiPlxuICAgICAgICAgIDxhcHAtYnRuXG4gICAgICAgICAgICBbdHlwZV09XCJpdGVtLnR5cGUgfHwgJ3NlY29uZGFyeSdcIlxuICAgICAgICAgICAgdGV4dD1cInt7IGl0ZW0udmFsdWUgfHwgaXRlbS5sYWJlbCB9fVwiXG4gICAgICAgICAgICBbaWNvbl09XCJpdGVtLmljb25cIlxuICAgICAgICAgICAgKG1jbGljayk9XCJpdGVtLmFjdGlvbigkZXZlbnQpOyB5ZXMoaXRlbSlcIj48L2FwcC1idG4+XG4gICAgICAgIDwvZGl2PlxuICAgICAgfVxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbn1cbjxkaXYgY2xhc3M9XCJiZy17eyBjbHMoKSB9fSBtdC0yIHJvdW5kZWQgYmFyXCI+PC9kaXY+XG4iXX0=
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { CommonModule } from '@angular/common';
|
|
2
|
-
import { ChangeDetectionStrategy, Component, computed, inject } from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, computed, effect, inject, } from '@angular/core';
|
|
3
3
|
import { NotificationsService } from '../notifications.service';
|
|
4
|
-
import { BtnComponent } from
|
|
4
|
+
import { BtnComponent } from '../../btn/btn.component';
|
|
5
5
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
6
6
|
import * as i0 from "@angular/core";
|
|
7
7
|
import * as i1 from "@angular/common";
|
|
@@ -9,7 +9,14 @@ import * as i2 from "@angular/material/progress-spinner";
|
|
|
9
9
|
export class ToastNotificationsComponent {
|
|
10
10
|
constructor() {
|
|
11
11
|
this.service = inject(NotificationsService);
|
|
12
|
+
this.cdr = inject(ChangeDetectorRef);
|
|
12
13
|
this.notifications = computed(() => this.service.toastNotifications());
|
|
14
|
+
this.notificationsEffect = effect(() => {
|
|
15
|
+
this.notifications();
|
|
16
|
+
this.cdr.markForCheck();
|
|
17
|
+
setTimeout(() => this.cdr.markForCheck(), 500);
|
|
18
|
+
setTimeout(() => this.cdr.markForCheck(), 1000);
|
|
19
|
+
});
|
|
13
20
|
}
|
|
14
21
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: ToastNotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15
22
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: ToastNotificationsComponent, isStandalone: true, selector: "lib-toast-notifications", ngImport: i0, template: "<div class=\"toast-list\">\n @for (item of notifications(); track item.id) {\n <div class=\"toast-item\">\n <div class=\"toast-item-content\" [style.width]=\"'calc(100% - ' + side.offsetWidth + 'px )'\">\n <div\n class=\"toast-item-header\"\n [ngClass]=\"{ compact: !item.expanded }\"\n (click)=\"service.toggleToastNotification(item.id)\"\n [innerHTML]=\"item.header\"></div>\n <hr [hidden]=\"!item.expanded\" class=\"toast-item-divider\" />\n <div [hidden]=\"!item.expanded\" class=\"toast-item-body\" [innerHTML]=\"item.body\"></div>\n </div>\n <div class=\"d-flex align-items-center\" #side>\n @if (item.loading) {\n <div class=\"toast-item-loader\">\n <mat-spinner mode=\"indeterminate\" [diameter]=\"20\" />\n </div>\n }\n <div class=\"toast-item-action\">\n <app-btn\n [iconBtn]=\"true\"\n icon=\"close\"\n type=\"clear\"\n mclass=\"btnColor\"\n (mclick)=\"service.closeToastNotification(item.id)\" />\n </div>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:block;position:fixed;z-index:200000;bottom:0;left:0;width:min(100%,300px);padding:0 10px}::ng-deep .toast-list{--toast-color: #fff;--toast-loader-color: var(--toast-color);--mdc-circular-progress-active-indicator-color: var(--toast-loader-color);--toast-background-color: rgba(0, 0, 0, .5);max-height:90vh;overflow-y:auto}::ng-deep .toast-list .toast-item{--toast-item-radius: 10px;--item-margin: 5px;display:flex;align-items:center;color:var(--toast-color);background-color:var(--toast-background-color);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);border-radius:var(--toast-item-radius);margin-top:calc(var(--item-margin) * 2);margin-bottom:var(--item-margin)}::ng-deep .toast-list .toast-item .toast-item-content{padding:var(--item-margin) calc(var(--item-margin) * 2)}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-header{cursor:pointer;font-size:14px}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-header.compact{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;word-wrap:break-word}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-body{font-size:13px;word-wrap:break-word;opacity:.8;white-space:break-spaces}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-divider{opacity:.3;border:1px solid var(--toast-color);margin-top:1px;margin-bottom:0;width:30%}::ng-deep .toast-list .toast-item .toast-item-action{color:var(--toast-color);padding-right:2px;cursor:pointer}::ng-deep .toast-list .toast-item .toast-item-action .btnColor{color:var(--toast-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
@@ -18,4 +25,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
18
25
|
type: Component,
|
|
19
26
|
args: [{ selector: 'lib-toast-notifications', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, BtnComponent, MatProgressSpinnerModule], template: "<div class=\"toast-list\">\n @for (item of notifications(); track item.id) {\n <div class=\"toast-item\">\n <div class=\"toast-item-content\" [style.width]=\"'calc(100% - ' + side.offsetWidth + 'px )'\">\n <div\n class=\"toast-item-header\"\n [ngClass]=\"{ compact: !item.expanded }\"\n (click)=\"service.toggleToastNotification(item.id)\"\n [innerHTML]=\"item.header\"></div>\n <hr [hidden]=\"!item.expanded\" class=\"toast-item-divider\" />\n <div [hidden]=\"!item.expanded\" class=\"toast-item-body\" [innerHTML]=\"item.body\"></div>\n </div>\n <div class=\"d-flex align-items-center\" #side>\n @if (item.loading) {\n <div class=\"toast-item-loader\">\n <mat-spinner mode=\"indeterminate\" [diameter]=\"20\" />\n </div>\n }\n <div class=\"toast-item-action\">\n <app-btn\n [iconBtn]=\"true\"\n icon=\"close\"\n type=\"clear\"\n mclass=\"btnColor\"\n (mclick)=\"service.closeToastNotification(item.id)\" />\n </div>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:block;position:fixed;z-index:200000;bottom:0;left:0;width:min(100%,300px);padding:0 10px}::ng-deep .toast-list{--toast-color: #fff;--toast-loader-color: var(--toast-color);--mdc-circular-progress-active-indicator-color: var(--toast-loader-color);--toast-background-color: rgba(0, 0, 0, .5);max-height:90vh;overflow-y:auto}::ng-deep .toast-list .toast-item{--toast-item-radius: 10px;--item-margin: 5px;display:flex;align-items:center;color:var(--toast-color);background-color:var(--toast-background-color);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);border-radius:var(--toast-item-radius);margin-top:calc(var(--item-margin) * 2);margin-bottom:var(--item-margin)}::ng-deep .toast-list .toast-item .toast-item-content{padding:var(--item-margin) calc(var(--item-margin) * 2)}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-header{cursor:pointer;font-size:14px}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-header.compact{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;word-wrap:break-word}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-body{font-size:13px;word-wrap:break-word;opacity:.8;white-space:break-spaces}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-divider{opacity:.3;border:1px solid var(--toast-color);margin-top:1px;margin-bottom:0;width:30%}::ng-deep .toast-list .toast-item .toast-item-action{color:var(--toast-color);padding-right:2px;cursor:pointer}::ng-deep .toast-list .toast-item .toast-item-action .btnColor{color:var(--toast-color)}\n"] }]
|
|
20
27
|
}] });
|
|
21
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
28
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3Qtbm90aWZpY2F0aW9ucy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9ldHMtZmUtbmctc2RrL3NyYy9saWIvU2hhcmVkL2NvbXBvbmVudHMvbm90aWZpY2F0aW9ucy90b2FzdC1ub3RpZmljYXRpb25zL3RvYXN0LW5vdGlmaWNhdGlvbnMuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZXRzLWZlLW5nLXNkay9zcmMvbGliL1NoYXJlZC9jb21wb25lbnRzL25vdGlmaWNhdGlvbnMvdG9hc3Qtbm90aWZpY2F0aW9ucy90b2FzdC1ub3RpZmljYXRpb25zLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLGlCQUFpQixFQUNqQixTQUFTLEVBQ1QsUUFBUSxFQUNSLE1BQU0sRUFDTixNQUFNLEdBQ1AsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDaEUsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLG9DQUFvQyxDQUFDOzs7O0FBVTlFLE1BQU0sT0FBTywyQkFBMkI7SUFSeEM7UUFTVyxZQUFPLEdBQUcsTUFBTSxDQUFDLG9CQUFvQixDQUFDLENBQUM7UUFDdkMsUUFBRyxHQUFHLE1BQU0sQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBRWhDLGtCQUFhLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsa0JBQWtCLEVBQUUsQ0FBQyxDQUFDO1FBRWxFLHdCQUFtQixHQUFHLE1BQU0sQ0FBQyxHQUFHLEVBQUU7WUFDekMsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1lBQ3JCLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLENBQUM7WUFDeEIsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLEVBQUUsR0FBRyxDQUFDLENBQUM7WUFDL0MsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLEVBQUUsSUFBSSxDQUFDLENBQUM7UUFDbEQsQ0FBQyxDQUFDLENBQUM7S0FDSjs4R0FaWSwyQkFBMkI7a0dBQTNCLDJCQUEyQixtRkNyQnhDLHFvQ0E4QkEsMmxERFhZLFlBQVksNkhBQUUsWUFBWSxrZ0JBQUUsd0JBQXdCOzsyRkFFbkQsMkJBQTJCO2tCQVJ2QyxTQUFTOytCQUNFLHlCQUF5QixjQUN2QixJQUFJLG1CQUdDLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxZQUFZLEVBQUUsWUFBWSxFQUFFLHdCQUF3QixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDaGFuZ2VEZXRlY3RvclJlZixcbiAgQ29tcG9uZW50LFxuICBjb21wdXRlZCxcbiAgZWZmZWN0LFxuICBpbmplY3QsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTm90aWZpY2F0aW9uc1NlcnZpY2UgfSBmcm9tICcuLi9ub3RpZmljYXRpb25zLnNlcnZpY2UnO1xuaW1wb3J0IHsgQnRuQ29tcG9uZW50IH0gZnJvbSAnLi4vLi4vYnRuL2J0bi5jb21wb25lbnQnO1xuaW1wb3J0IHsgTWF0UHJvZ3Jlc3NTcGlubmVyTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvcHJvZ3Jlc3Mtc3Bpbm5lcic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2xpYi10b2FzdC1ub3RpZmljYXRpb25zJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6ICcuL3RvYXN0LW5vdGlmaWNhdGlvbnMuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vdG9hc3Qtbm90aWZpY2F0aW9ucy5jb21wb25lbnQuc2NzcycsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBCdG5Db21wb25lbnQsIE1hdFByb2dyZXNzU3Bpbm5lck1vZHVsZV0sXG59KVxuZXhwb3J0IGNsYXNzIFRvYXN0Tm90aWZpY2F0aW9uc0NvbXBvbmVudCB7XG4gIHJlYWRvbmx5IHNlcnZpY2UgPSBpbmplY3QoTm90aWZpY2F0aW9uc1NlcnZpY2UpO1xuICByZWFkb25seSBjZHIgPSBpbmplY3QoQ2hhbmdlRGV0ZWN0b3JSZWYpO1xuXG4gIHJlYWRvbmx5IG5vdGlmaWNhdGlvbnMgPSBjb21wdXRlZCgoKSA9PiB0aGlzLnNlcnZpY2UudG9hc3ROb3RpZmljYXRpb25zKCkpO1xuXG4gIHJlYWRvbmx5IG5vdGlmaWNhdGlvbnNFZmZlY3QgPSBlZmZlY3QoKCkgPT4ge1xuICAgIHRoaXMubm90aWZpY2F0aW9ucygpO1xuICAgIHRoaXMuY2RyLm1hcmtGb3JDaGVjaygpO1xuICAgIHNldFRpbWVvdXQoKCkgPT4gdGhpcy5jZHIubWFya0ZvckNoZWNrKCksIDUwMCk7XG4gICAgc2V0VGltZW91dCgoKSA9PiB0aGlzLmNkci5tYXJrRm9yQ2hlY2soKSwgMTAwMCk7XG4gIH0pO1xufVxuIiwiPGRpdiBjbGFzcz1cInRvYXN0LWxpc3RcIj5cbiAgQGZvciAoaXRlbSBvZiBub3RpZmljYXRpb25zKCk7IHRyYWNrIGl0ZW0uaWQpIHtcbiAgICA8ZGl2IGNsYXNzPVwidG9hc3QtaXRlbVwiPlxuICAgICAgPGRpdiBjbGFzcz1cInRvYXN0LWl0ZW0tY29udGVudFwiIFtzdHlsZS53aWR0aF09XCInY2FsYygxMDAlIC0gJyArIHNpZGUub2Zmc2V0V2lkdGggKyAncHggKSdcIj5cbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNsYXNzPVwidG9hc3QtaXRlbS1oZWFkZXJcIlxuICAgICAgICAgIFtuZ0NsYXNzXT1cInsgY29tcGFjdDogIWl0ZW0uZXhwYW5kZWQgfVwiXG4gICAgICAgICAgKGNsaWNrKT1cInNlcnZpY2UudG9nZ2xlVG9hc3ROb3RpZmljYXRpb24oaXRlbS5pZClcIlxuICAgICAgICAgIFtpbm5lckhUTUxdPVwiaXRlbS5oZWFkZXJcIj48L2Rpdj5cbiAgICAgICAgPGhyIFtoaWRkZW5dPVwiIWl0ZW0uZXhwYW5kZWRcIiBjbGFzcz1cInRvYXN0LWl0ZW0tZGl2aWRlclwiIC8+XG4gICAgICAgIDxkaXYgW2hpZGRlbl09XCIhaXRlbS5leHBhbmRlZFwiIGNsYXNzPVwidG9hc3QtaXRlbS1ib2R5XCIgW2lubmVySFRNTF09XCJpdGVtLmJvZHlcIj48L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjbGFzcz1cImQtZmxleCBhbGlnbi1pdGVtcy1jZW50ZXJcIiAjc2lkZT5cbiAgICAgICAgQGlmIChpdGVtLmxvYWRpbmcpIHtcbiAgICAgICAgICA8ZGl2IGNsYXNzPVwidG9hc3QtaXRlbS1sb2FkZXJcIj5cbiAgICAgICAgICAgIDxtYXQtc3Bpbm5lciBtb2RlPVwiaW5kZXRlcm1pbmF0ZVwiIFtkaWFtZXRlcl09XCIyMFwiIC8+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIH1cbiAgICAgICAgPGRpdiBjbGFzcz1cInRvYXN0LWl0ZW0tYWN0aW9uXCI+XG4gICAgICAgICAgPGFwcC1idG5cbiAgICAgICAgICAgIFtpY29uQnRuXT1cInRydWVcIlxuICAgICAgICAgICAgaWNvbj1cImNsb3NlXCJcbiAgICAgICAgICAgIHR5cGU9XCJjbGVhclwiXG4gICAgICAgICAgICBtY2xhc3M9XCJidG5Db2xvclwiXG4gICAgICAgICAgICAobWNsaWNrKT1cInNlcnZpY2UuY2xvc2VUb2FzdE5vdGlmaWNhdGlvbihpdGVtLmlkKVwiIC8+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIH1cbjwvZGl2PlxuIl19
|
|
@@ -13117,11 +13117,11 @@ class InfoDialogComponent {
|
|
|
13117
13117
|
this.dialogRef.close(false);
|
|
13118
13118
|
}
|
|
13119
13119
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: InfoDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13120
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: InfoDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\"
|
|
13120
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: InfoDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\">\n <i class=\"material-icons\">close</i>\n </button>\n</div>\n\n<div class=\"info-body\" [innerHTML]=\"data?.text | appTranslate | async\"></div>\n\n@if (data?.btns?.length) {\n <div class=\"info-buttons\">\n <div class=\"row justify-content-center\">\n @for (item of data?.btns; track item) {\n <div class=\"col-md-auto my-1\">\n <app-btn\n [type]=\"item.type || 'secondary'\"\n text=\"{{ item.value || item.label }}\"\n [icon]=\"item.icon\"\n (mclick)=\"item.action($event); yes(item)\"></app-btn>\n </div>\n }\n </div>\n </div>\n}\n<div class=\"bg-{{ cls() }} mt-2 rounded bar\"></div>\n", styles: [":host{text-align:center}:host .bar{height:5px}:host .info-body{overflow-wrap:anywhere;white-space:pre-line;padding:1rem}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: SDKTranslatePipe, name: "appTranslate" }] }); }
|
|
13121
13121
|
}
|
|
13122
13122
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: InfoDialogComponent, decorators: [{
|
|
13123
13123
|
type: Component,
|
|
13124
|
-
args: [{ standalone: true, imports: [MatButtonModule, NgFor, BtnComponent, AsyncPipe, SDKTranslatePipe], template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\"
|
|
13124
|
+
args: [{ standalone: true, imports: [MatButtonModule, NgFor, BtnComponent, AsyncPipe, SDKTranslatePipe], template: "<div class=\"d-flex justify-content-between align-items-center\">\n <div class=\"text-{{ cls() }} ms-3 font-weight-bold text-uppercase\">\n <i class=\"fa fa-{{ data?.status ? 'check-circle' : 'exclamation-circle' }}\"></i>\n {{ data?.heading || 'Notice' | appTranslate | async }}\n </div>\n <button mat-icon-button (click)=\"yes()\" class=\"btn-outline-danger\">\n <i class=\"material-icons\">close</i>\n </button>\n</div>\n\n<div class=\"info-body\" [innerHTML]=\"data?.text | appTranslate | async\"></div>\n\n@if (data?.btns?.length) {\n <div class=\"info-buttons\">\n <div class=\"row justify-content-center\">\n @for (item of data?.btns; track item) {\n <div class=\"col-md-auto my-1\">\n <app-btn\n [type]=\"item.type || 'secondary'\"\n text=\"{{ item.value || item.label }}\"\n [icon]=\"item.icon\"\n (mclick)=\"item.action($event); yes(item)\"></app-btn>\n </div>\n }\n </div>\n </div>\n}\n<div class=\"bg-{{ cls() }} mt-2 rounded bar\"></div>\n", styles: [":host{text-align:center}:host .bar{height:5px}:host .info-body{overflow-wrap:anywhere;white-space:pre-line;padding:1rem}\n"] }]
|
|
13125
13125
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
13126
13126
|
type: Inject,
|
|
13127
13127
|
args: [MAT_DIALOG_DATA]
|
|
@@ -14118,7 +14118,14 @@ var notifications_component = /*#__PURE__*/Object.freeze({
|
|
|
14118
14118
|
class ToastNotificationsComponent {
|
|
14119
14119
|
constructor() {
|
|
14120
14120
|
this.service = inject(NotificationsService);
|
|
14121
|
+
this.cdr = inject(ChangeDetectorRef);
|
|
14121
14122
|
this.notifications = computed(() => this.service.toastNotifications());
|
|
14123
|
+
this.notificationsEffect = effect(() => {
|
|
14124
|
+
this.notifications();
|
|
14125
|
+
this.cdr.markForCheck();
|
|
14126
|
+
setTimeout(() => this.cdr.markForCheck(), 500);
|
|
14127
|
+
setTimeout(() => this.cdr.markForCheck(), 1000);
|
|
14128
|
+
});
|
|
14122
14129
|
}
|
|
14123
14130
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: ToastNotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14124
14131
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: ToastNotificationsComponent, isStandalone: true, selector: "lib-toast-notifications", ngImport: i0, template: "<div class=\"toast-list\">\n @for (item of notifications(); track item.id) {\n <div class=\"toast-item\">\n <div class=\"toast-item-content\" [style.width]=\"'calc(100% - ' + side.offsetWidth + 'px )'\">\n <div\n class=\"toast-item-header\"\n [ngClass]=\"{ compact: !item.expanded }\"\n (click)=\"service.toggleToastNotification(item.id)\"\n [innerHTML]=\"item.header\"></div>\n <hr [hidden]=\"!item.expanded\" class=\"toast-item-divider\" />\n <div [hidden]=\"!item.expanded\" class=\"toast-item-body\" [innerHTML]=\"item.body\"></div>\n </div>\n <div class=\"d-flex align-items-center\" #side>\n @if (item.loading) {\n <div class=\"toast-item-loader\">\n <mat-spinner mode=\"indeterminate\" [diameter]=\"20\" />\n </div>\n }\n <div class=\"toast-item-action\">\n <app-btn\n [iconBtn]=\"true\"\n icon=\"close\"\n type=\"clear\"\n mclass=\"btnColor\"\n (mclick)=\"service.closeToastNotification(item.id)\" />\n </div>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:block;position:fixed;z-index:200000;bottom:0;left:0;width:min(100%,300px);padding:0 10px}::ng-deep .toast-list{--toast-color: #fff;--toast-loader-color: var(--toast-color);--mdc-circular-progress-active-indicator-color: var(--toast-loader-color);--toast-background-color: rgba(0, 0, 0, .5);max-height:90vh;overflow-y:auto}::ng-deep .toast-list .toast-item{--toast-item-radius: 10px;--item-margin: 5px;display:flex;align-items:center;color:var(--toast-color);background-color:var(--toast-background-color);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);border-radius:var(--toast-item-radius);margin-top:calc(var(--item-margin) * 2);margin-bottom:var(--item-margin)}::ng-deep .toast-list .toast-item .toast-item-content{padding:var(--item-margin) calc(var(--item-margin) * 2)}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-header{cursor:pointer;font-size:14px}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-header.compact{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;word-wrap:break-word}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-body{font-size:13px;word-wrap:break-word;opacity:.8;white-space:break-spaces}::ng-deep .toast-list .toast-item .toast-item-content .toast-item-divider{opacity:.3;border:1px solid var(--toast-color);margin-top:1px;margin-bottom:0;width:30%}::ng-deep .toast-list .toast-item .toast-item-action{color:var(--toast-color);padding-right:2px;cursor:pointer}::ng-deep .toast-list .toast-item .toast-item-action .btnColor{color:var(--toast-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|