adb-shared 2.0.31 → 2.0.34

package/fesm2020/adb-shared.mjs

@@ -4,13 +4,14 @@ import * as i0 from '@angular/core';
 import { Injectable, Inject, EventEmitter, Component, Output, Input, Directive, HostListener, NgModule, HostBinding, Pipe, forwardRef } from '@angular/core';
 import * as i1$1 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
-import { Subscription, Subject } from 'rxjs';
+import { Subscription, Subject, of } from 'rxjs';
 import * as i1 from '@angular/common/http';
 import { HttpClientModule } from '@angular/common/http';
 import * as i1$2 from '@angular/router';
 import { RouterModule } from '@angular/router';
 import { isValid, parseISO, startOfDay, subYears, endOfDay, addYears, getMonth, subMonths, addMonths, isSameYear, startOfMonth, endOfMonth, eachWeekOfInterval, getISOWeek, addDays, eachDayOfInterval, getHours, getMinutes, isSameDay, isSameMonth, isWithinInterval } from 'date-fns';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { delay } from 'rxjs/operators';
 
 class EnvironmentService {
     constructor(environment) {
@@ -996,53 +997,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImpor
 class AdbToastService {
     constructor(componentFactoryResolver, rendererFactory, appRef, injector) {
         this.componentFactoryResolver = componentFactoryResolver;
+        this.rendererFactory = rendererFactory;
         this.appRef = appRef;
         this.injector = injector;
-        this.renderer = rendererFactory.createRenderer(null, null);
+        this.toasts = new Array();
+        this.toastsSubject = new Subject();
+        this.$toasts = this.toastsSubject.asObservable();
+    }
+    add(toastMessage, time = 4000) {
+        this.addContainer();
+        toastMessage.type = toastMessage.type ? toastMessage.type : ToastType.Success;
+        toastMessage.index = this.toasts.length;
+        toastMessage.delay = of(toastMessage).pipe(delay(time)).subscribe(toast => {
+            this.remove(toast);
+        });
+        this.toasts.push(toastMessage);
+        this.toastsSubject.next(this.toasts);
+    }
+    remove(toast) {
+        this.toasts = this.toasts?.filter(x => x.index !== toast.index);
+        this.toastsSubject.next(this.toasts);
     }
-    show(model) {
+    addContainer() {
         if (!this.container) {
+            this.renderer = this.rendererFactory.createRenderer(null, null);
+            //create container i top
             this.container = this.renderer.createElement('div');
-            this.container.setAttribute('adb-toast-container', '');
-            this.container.classList.add('position-absolute', 'bottom-0', 'end-0');
             this.renderer.appendChild(document.body, this.container);
+            let componentRef = this.componentFactoryResolver.resolveComponentFactory(AdbToast).create(this.injector);
+            this.appRef.attachView(componentRef.hostView);
+            const element = componentRef.hostView.rootNodes[0];
+            this.container.prepend(element);
         }
-        this.createToast(model);
-    }
-    createToast(model) {
-        if (!model.state)
-            model.state = 'info';
-        if (!model.timeInMs)
-            model.timeInMs = 4000;
-        let componentRef = this.componentFactoryResolver.resolveComponentFactory(AdbToast).create(this.injector);
-        componentRef.instance.model = model;
-        this.appRef.attachView(componentRef.hostView);
-        const element = componentRef.hostView.rootNodes[0];
-        this.container.prepend(element);
-        setTimeout(() => {
-            // element.remove();
-        }, model.timeInMs);
     }
 }
 /** @nocollapse */ AdbToastService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: AdbToastService, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.RendererFactory2 }, { token: i0.ApplicationRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
 /** @nocollapse */ AdbToastService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: AdbToastService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: AdbToastService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }, { type: i0.RendererFactory2 }, { type: i0.ApplicationRef }, { type: i0.Injector }]; } });
+        }], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }, { type: i0.RendererFactory2 }, { type: i0.ApplicationRef }, { type: i0.Injector }]; } });
+var ToastType;
+(function (ToastType) {
+    ToastType[ToastType["Info"] = 1] = "Info";
+    ToastType[ToastType["Success"] = 2] = "Success";
+    ToastType[ToastType["Warn"] = 3] = "Warn";
+})(ToastType || (ToastType = {}));
 
 class AdbToast {
-    constructor(toastRef) {
-        this.toastRef = toastRef;
+    constructor(toastService) {
+        this.toastService = toastService;
+        this.toastType = ToastType;
+        this.toastService.$toasts.subscribe(toasts => {
+            this.toasts = toasts;
+        });
+    }
+    onRemoveToast(toast) {
+        this.toastService.remove(toast);
     }
 }
 /** @nocollapse */ AdbToast.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: AdbToast, deps: [{ token: AdbToastService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ AdbToast.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: AdbToast, selector: "ng-component", inputs: { model: "model" }, ngImport: i0, template: "    <div #toast (click)=\"toast.remove()\" adb-toast class=\"text-white px-3 py-2 m-2\" [class]=\"'bg-' + model.state\">\r\n        <div *ngIf=\"model.header\" class=\"d-flex align-items-center justify-content-between pb-1\">\r\n            <div class=\"fw-bold\">{{model.header|translate}}</div>\r\n            <button class=\"btn p-0 ms-2 text-white\" (click)=\"toast.remove()\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n        <div class=\"d-flex align-items-center justify-content-between mt-1\">\r\n            <div> {{model.body|translate}}</div>\r\n            <button *ngIf=\"!model.header\" class=\"btn p-0 ms-2 text-white\" (click)=\"toast.remove()\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n    </div>", directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1$1.TranslatePipe } });
+/** @nocollapse */ AdbToast.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: AdbToast, selector: "ng-component", ngImport: i0, template: "<div class=\"position-fixed bottom-0 end-0\" style=\"z-index: 50000;min-width: 15rem;\">\r\n    <div class=\"text-white px-3 pb-3 pt-2 mb-2\" *ngFor=\"let toast of toasts\"\r\n        [class.bg-success]=\"toast.type===toastType.Success\" [class.bg-info]=\"toast.type===toastType.Info\" [class.bg-danger]=\"toast.type===toastType.Warn\">\r\n        <div class=\"d-flex align-items-center justify-content-between pb-1\" *ngIf=\"toast.header\">\r\n            <div class=\"fw-bold pb-1\">{{toast.header|translate}}</div>\r\n            <button class=\"btn top-0 end-0 btn p-0 ms-2 text-white\" (click)=\"onRemoveToast(toast)\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n        <div class=\"d-flex align-items-center justify-content-between mt-1\">\r\n            <div>{{toast.message|translate}}</div>\r\n            <button  *ngIf=\"!toast.header\" class=\"btn p-0 ms-2 text-white\" (click)=\"onRemoveToast(toast)\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n    </div>\r\n</div>", directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1$1.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: AdbToast, decorators: [{
             type: Component,
-            args: [{ template: "    <div #toast (click)=\"toast.remove()\" adb-toast class=\"text-white px-3 py-2 m-2\" [class]=\"'bg-' + model.state\">\r\n        <div *ngIf=\"model.header\" class=\"d-flex align-items-center justify-content-between pb-1\">\r\n            <div class=\"fw-bold\">{{model.header|translate}}</div>\r\n            <button class=\"btn p-0 ms-2 text-white\" (click)=\"toast.remove()\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n        <div class=\"d-flex align-items-center justify-content-between mt-1\">\r\n            <div> {{model.body|translate}}</div>\r\n            <button *ngIf=\"!model.header\" class=\"btn p-0 ms-2 text-white\" (click)=\"toast.remove()\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n    </div>" }]
-        }], ctorParameters: function () { return [{ type: AdbToastService }]; }, propDecorators: { model: [{
-                type: Input
-            }] } });
+            args: [{ template: "<div class=\"position-fixed bottom-0 end-0\" style=\"z-index: 50000;min-width: 15rem;\">\r\n    <div class=\"text-white px-3 pb-3 pt-2 mb-2\" *ngFor=\"let toast of toasts\"\r\n        [class.bg-success]=\"toast.type===toastType.Success\" [class.bg-info]=\"toast.type===toastType.Info\" [class.bg-danger]=\"toast.type===toastType.Warn\">\r\n        <div class=\"d-flex align-items-center justify-content-between pb-1\" *ngIf=\"toast.header\">\r\n            <div class=\"fw-bold pb-1\">{{toast.header|translate}}</div>\r\n            <button class=\"btn top-0 end-0 btn p-0 ms-2 text-white\" (click)=\"onRemoveToast(toast)\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n        <div class=\"d-flex align-items-center justify-content-between mt-1\">\r\n            <div>{{toast.message|translate}}</div>\r\n            <button  *ngIf=\"!toast.header\" class=\"btn p-0 ms-2 text-white\" (click)=\"onRemoveToast(toast)\"><i class=\"fas fa-times\"></i></button>\r\n        </div>\r\n    </div>\r\n</div>" }]
+        }], ctorParameters: function () { return [{ type: AdbToastService }]; } });
 
 class AdbToastModule {
 }
@@ -1067,5 +1085,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ADBHeaderComponent, ADBHeaderModule, AdbConfirmModal, AdbDatePickerComponent, AdbDatePickerDirective, AdbDatePickerModule, AdbDirectivesModule, AdbDropdownDirective, AdbDropdownModule, AdbModalModule, AdbModalService, AdbPagersModule, AdbPipesModule, AdbToast, AdbToastModule, AdbToastService, ClickOutsideDirective, FileUploadDirective, FocusDirective, HighlightPipe, InfiniteScrollComponent, LocaleDatePipe, NumberSpacingPipe, PagerComponent };
+export { ADBHeaderComponent, ADBHeaderModule, AdbConfirmModal, AdbDatePickerComponent, AdbDatePickerDirective, AdbDatePickerModule, AdbDirectivesModule, AdbDropdownDirective, AdbDropdownModule, AdbModalModule, AdbModalService, AdbPagersModule, AdbPipesModule, AdbToast, AdbToastModule, AdbToastService, ClickOutsideDirective, FileUploadDirective, FocusDirective, HighlightPipe, InfiniteScrollComponent, LocaleDatePipe, NumberSpacingPipe, PagerComponent, ToastType };
 //# sourceMappingURL=adb-shared.mjs.map