bmx-toast-2
Version:
The bmx-toast-2 library is a powerful and lightweight Angular library that provides an easy-to-use and customizable notification system for web applications. It allows developers to display attractive and interactive toast notifications to provide feedbac
461 lines (452 loc) • 59.7 kB
JavaScript
import * as i0 from '@angular/core';
import { Injectable, Input, Component, EventEmitter, Output, ViewEncapsulation, NgModule } from '@angular/core';
import { Subject } from 'rxjs';
import { trigger, transition, style, animate } from '@angular/animations';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
class BmxToastService {
constructor() {
// debugger
this.toastData = new Subject();
this.defaultData = {};
this.toastrId = 0;
}
generate(data) {
this.defaultData = {
closing: data.autoClose ? data.autoClose : false,
toasterId: this.toastrId += 1,
type: data.type ? data.type : 'success',
toastHeading: data.toastHeading ? data.toastHeading : 'Heading',
toastText: data.toastText ? data.toastText : 'This is paragraph. This is placeholder',
timeout: data.timeout ? data.timeout : 3000,
position: data.position ? data.position : 'top-left',
closeIcon: data.closeIcon ? data.closeIcon : false,
autoClose: data.autoClose ? true : false,
border: data.border ? data.border : 'none',
progressbar: data.progressbar ? data.progressbar : false,
preventDuplicate: data.preventDuplicate ? data.preventDuplicate : false,
background: data.background ? data.background : '',
color: data.color ? data.color : '',
};
// debugger
this.fire(this.defaultData);
}
fire(data) {
// debugger
this.toastData.next(data);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: BmxToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: BmxToastService, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: BmxToastService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root'
}]
}], ctorParameters: () => [] });
class ProgressbarComponent {
constructor() {
this.dataProgressBar = {};
}
ngOnInit() {
// console.log(this.dataProgressBar)
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ProgressbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.2", type: ProgressbarComponent, isStandalone: false, selector: "lib-progressbar", inputs: { dataProgressBar: "dataProgressBar" }, ngImport: i0, template: "<div class=\"progress_bar_cont\" >\n <div class=\"bar_rail\">\n <div class=\"bar\"\n style=\"animation-duration: {{(dataProgressBar.timeout!/1000)}}s!important\"\n ></div>\n </div>\n</div>\n", styles: [".progress_bar_cont{width:100%;height:auto;background:#000;position:absolute;left:0;bottom:0}.bar_rail{width:100%;height:auto;background-color:#ccc}.bar{width:100%;height:2px;background-color:#a1a1a1;animation:progressbar 1s linear forwards}@keyframes progressbar{0%{width:0%}to{width:100%}}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ProgressbarComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-progressbar', standalone: false, template: "<div class=\"progress_bar_cont\" >\n <div class=\"bar_rail\">\n <div class=\"bar\"\n style=\"animation-duration: {{(dataProgressBar.timeout!/1000)}}s!important\"\n ></div>\n </div>\n</div>\n", styles: [".progress_bar_cont{width:100%;height:auto;background:#000;position:absolute;left:0;bottom:0}.bar_rail{width:100%;height:auto;background-color:#ccc}.bar{width:100%;height:2px;background-color:#a1a1a1;animation:progressbar 1s linear forwards}@keyframes progressbar{0%{width:0%}to{width:100%}}\n"] }]
}], propDecorators: { dataProgressBar: [{
type: Input
}] } });
// import { Component } from '@angular/core';
class ToasterTextComponent {
constructor() {
this.toasterText = {};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ToasterTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.2", type: ToasterTextComponent, isStandalone: false, selector: "lib-toaster-text", inputs: { toasterText: "toasterText" }, ngImport: i0, template: "<div class=\"toastr_text\">\n <!-- {{toasterText.toasterId}} -->\n <h3 [style.color]=\"toasterText.color\">{{toasterText.toastHeading}}</h3>\n <p [style.color]=\"toasterText.color\">{{toasterText.toastText}}\n <!-- <span >close</span> -->\n </p>\n </div>\n", styles: [""] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ToasterTextComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-toaster-text', standalone: false, template: "<div class=\"toastr_text\">\n <!-- {{toasterText.toasterId}} -->\n <h3 [style.color]=\"toasterText.color\">{{toasterText.toastHeading}}</h3>\n <p [style.color]=\"toasterText.color\">{{toasterText.toastText}}\n <!-- <span >close</span> -->\n </p>\n </div>\n" }]
}], propDecorators: { toasterText: [{
type: Input
}] } });
class InfoComponent {
constructor() {
this.dataInfo = {};
this.closeSucToaster = new EventEmitter();
this.addClasstoggle = false;
this.closeToastFalse = true;
}
close() {
this.closeSucToaster.emit();
this.closeToastFalse = false;
}
ngOnInit() {
if (this.dataInfo.autoClose) {
setTimeout(() => {
this.closeToastFalse = false;
}, this.dataInfo.timeout);
}
setTimeout(() => {
this.addClasstoggle = true;
}, 0);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: InfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.2", type: InfoComponent, isStandalone: false, selector: "lib-info", inputs: { dataInfo: "dataInfo" }, outputs: { closeSucToaster: "closeSucToaster" }, ngImport: i0, template: "<!-- <p>info works!</p> -->\n@if (closeToastFalse) {\n <div class=\"toastr_wrapper for_info border_{{dataInfo.border}}\" [@slideInOut]\n dataInfo [style.background-color]=\"dataInfo.background\">\n <!-- <div class=\"ui-error\"> -->\n <svg xmlns=\"http://www.w3.org/2000/svg\" style=\"transform: rotate(180deg);\" viewBox=\"0 0 64 64\"\n class=\"warning {{addClasstoggle?'toggle':''}}\">\n <circle class=\"solid\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\"\n r=\"30\" />\n <circle class=\"animation\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\"\n r=\"30\" />\n <path fill=\"none\" stroke=\"#000\" stroke-width=\"6\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" d=\"M32 15v20\" />\n <line fill=\"none\" stroke=\"#000\" stroke-width=\"8\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" x1=\"32\" y1=\"46\"\n x2=\"32\" y2=\"46\" />\n </svg>\n <!-- </div> -->\n <lib-toaster-text [toasterText]=\"dataInfo\" class=\"toaster_outer\"></lib-toaster-text>\n @if (dataInfo.closeIcon) {\n <span class=\"close_toastr\" >\n <span class=\"material-symbols-outlined\" (click)=\"close()\">\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataInfo.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataInfo\"></lib-progressbar>\n }\n</div>\n}\n", styles: ["svg.warning circle.solid{stroke:var(--state-inactive)}svg.warning circle.animation{transition:stroke-dashoffset .2s linear .26s,stroke-dasharray .2s linear .26s;stroke:var(--state_info);stroke-dasharray:1,200;stroke-dashoffset:2}svg.warning.toggle circle.animation{transition:stroke-dashoffset .2s linear 0ms,stroke-dasharray .2s linear 0ms;stroke-dasharray:200,0;stroke-dashoffset:0}svg.warning path,svg.warning line{stroke:var(--state_info)}svg.warning path{transition:stroke-dashoffset .18s linear 0ms;stroke-dashoffset:-50px;stroke-dasharray:50px}svg.warning line{transition:stroke-width 30ms linear .2s;stroke-width:0}svg.warning.toggle path{transition:stroke-dashoffset .18s linear .28s;stroke-dashoffset:0}svg.warning.toggle line{transition:stroke-width 30ms linear .26s;stroke-width:8}\n"], dependencies: [{ kind: "component", type: ProgressbarComponent, selector: "lib-progressbar", inputs: ["dataProgressBar"] }, { kind: "component", type: ToasterTextComponent, selector: "lib-toaster-text", inputs: ["toasterText"] }], animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: InfoComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-info', animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
], standalone: false, template: "<!-- <p>info works!</p> -->\n@if (closeToastFalse) {\n <div class=\"toastr_wrapper for_info border_{{dataInfo.border}}\" [@slideInOut]\n dataInfo [style.background-color]=\"dataInfo.background\">\n <!-- <div class=\"ui-error\"> -->\n <svg xmlns=\"http://www.w3.org/2000/svg\" style=\"transform: rotate(180deg);\" viewBox=\"0 0 64 64\"\n class=\"warning {{addClasstoggle?'toggle':''}}\">\n <circle class=\"solid\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\"\n r=\"30\" />\n <circle class=\"animation\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\"\n r=\"30\" />\n <path fill=\"none\" stroke=\"#000\" stroke-width=\"6\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" d=\"M32 15v20\" />\n <line fill=\"none\" stroke=\"#000\" stroke-width=\"8\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" x1=\"32\" y1=\"46\"\n x2=\"32\" y2=\"46\" />\n </svg>\n <!-- </div> -->\n <lib-toaster-text [toasterText]=\"dataInfo\" class=\"toaster_outer\"></lib-toaster-text>\n @if (dataInfo.closeIcon) {\n <span class=\"close_toastr\" >\n <span class=\"material-symbols-outlined\" (click)=\"close()\">\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataInfo.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataInfo\"></lib-progressbar>\n }\n</div>\n}\n", styles: ["svg.warning circle.solid{stroke:var(--state-inactive)}svg.warning circle.animation{transition:stroke-dashoffset .2s linear .26s,stroke-dasharray .2s linear .26s;stroke:var(--state_info);stroke-dasharray:1,200;stroke-dashoffset:2}svg.warning.toggle circle.animation{transition:stroke-dashoffset .2s linear 0ms,stroke-dasharray .2s linear 0ms;stroke-dasharray:200,0;stroke-dashoffset:0}svg.warning path,svg.warning line{stroke:var(--state_info)}svg.warning path{transition:stroke-dashoffset .18s linear 0ms;stroke-dashoffset:-50px;stroke-dasharray:50px}svg.warning line{transition:stroke-width 30ms linear .2s;stroke-width:0}svg.warning.toggle path{transition:stroke-dashoffset .18s linear .28s;stroke-dashoffset:0}svg.warning.toggle line{transition:stroke-width 30ms linear .26s;stroke-width:8}\n"] }]
}], propDecorators: { dataInfo: [{
type: Input
}], closeSucToaster: [{
type: Output
}] } });
class WarningComponent {
constructor() {
this.dataWarning = {};
this.closeSucToaster = new EventEmitter();
this.addClasstoggle = false;
this.closeToastFalse = true;
}
close() {
// debugger
this.closeSucToaster.emit();
this.closeToastFalse = false;
}
ngOnInit() {
if (this.dataWarning.autoClose) {
setTimeout(() => {
this.closeToastFalse = false;
}, this.dataWarning.timeout);
}
setTimeout(() => {
this.addClasstoggle = true;
}, 0);
}
closeToaster() {
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: WarningComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.2", type: WarningComponent, isStandalone: false, selector: "lib-warning", inputs: { dataWarning: "dataWarning" }, outputs: { closeSucToaster: "closeSucToaster" }, ngImport: i0, template: "<!-- <p>warning works!</p> -->\n@if (closeToastFalse) {\n <div class=\"toastr_wrapper for_warning {{closeToastFalse?'closing_false':'closing_true'}} border_{{dataWarning.border}}\" [@slideInOut] [ngStyle]=\"{'background': dataWarning.background+''}\">\n <!-- <div class=\"ui-error\"> -->\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\" class=\"warning {{addClasstoggle?'toggle':''}}\">\n <circle class=\"solid\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\" r=\"30\"/>\n <circle class=\"animation\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\" r=\"30\"/>\n <path fill=\"none\" stroke=\"#000\" stroke-width=\"6\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" d=\"M32 15v20\"/>\n <line fill=\"none\" stroke=\"#000\" stroke-width=\"8\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" x1=\"32\" y1=\"46\" x2=\"32\" y2=\"46\"/>\n </svg>\n <!-- </div> -->\n <lib-toaster-text [toasterText]=\"dataWarning\" class=\"toaster_outer\"></lib-toaster-text>\n @if (dataWarning.closeIcon) {\n <span class=\"close_toastr\" (click)=\"close()\">\n <span class=\"material-symbols-outlined\" >\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataWarning.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataWarning\"></lib-progressbar>\n }\n</div>\n}\n", styles: ["svg.warning circle.solid{stroke:var(--state-inactive)}svg.warning circle.animation{transition:stroke-dashoffset .2s linear .26s,stroke-dasharray .2s linear .26s;stroke:var(--state-warning);stroke-dasharray:1,200;stroke-dashoffset:2}svg.warning.toggle circle.animation{transition:stroke-dashoffset .2s linear 0ms,stroke-dasharray .2s linear 0ms;stroke-dasharray:200,0;stroke-dashoffset:0}svg.warning path,svg.warning line{stroke:var(--state-warning)}svg.warning path{transition:stroke-dashoffset .18s linear 0ms;stroke-dashoffset:-50px;stroke-dasharray:50px}svg.warning line{transition:stroke-width 30ms linear .2s;stroke-width:0}svg.warning.toggle path{transition:stroke-dashoffset .18s linear .28s;stroke-dashoffset:0}svg.warning.toggle line{transition:stroke-width 30ms linear .26s;stroke-width:8}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ProgressbarComponent, selector: "lib-progressbar", inputs: ["dataProgressBar"] }, { kind: "component", type: ToasterTextComponent, selector: "lib-toaster-text", inputs: ["toasterText"] }], animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: WarningComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-warning', animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
], standalone: false, template: "<!-- <p>warning works!</p> -->\n@if (closeToastFalse) {\n <div class=\"toastr_wrapper for_warning {{closeToastFalse?'closing_false':'closing_true'}} border_{{dataWarning.border}}\" [@slideInOut] [ngStyle]=\"{'background': dataWarning.background+''}\">\n <!-- <div class=\"ui-error\"> -->\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\" class=\"warning {{addClasstoggle?'toggle':''}}\">\n <circle class=\"solid\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\" r=\"30\"/>\n <circle class=\"animation\" fill=\"none\" stroke-linecap=\"round\" stroke-width=\"4\" stroke-miterlimit=\"10\" cx=\"32\" cy=\"32\" r=\"30\"/>\n <path fill=\"none\" stroke=\"#000\" stroke-width=\"6\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" d=\"M32 15v20\"/>\n <line fill=\"none\" stroke=\"#000\" stroke-width=\"8\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" x1=\"32\" y1=\"46\" x2=\"32\" y2=\"46\"/>\n </svg>\n <!-- </div> -->\n <lib-toaster-text [toasterText]=\"dataWarning\" class=\"toaster_outer\"></lib-toaster-text>\n @if (dataWarning.closeIcon) {\n <span class=\"close_toastr\" (click)=\"close()\">\n <span class=\"material-symbols-outlined\" >\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataWarning.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataWarning\"></lib-progressbar>\n }\n</div>\n}\n", styles: ["svg.warning circle.solid{stroke:var(--state-inactive)}svg.warning circle.animation{transition:stroke-dashoffset .2s linear .26s,stroke-dasharray .2s linear .26s;stroke:var(--state-warning);stroke-dasharray:1,200;stroke-dashoffset:2}svg.warning.toggle circle.animation{transition:stroke-dashoffset .2s linear 0ms,stroke-dasharray .2s linear 0ms;stroke-dasharray:200,0;stroke-dashoffset:0}svg.warning path,svg.warning line{stroke:var(--state-warning)}svg.warning path{transition:stroke-dashoffset .18s linear 0ms;stroke-dashoffset:-50px;stroke-dasharray:50px}svg.warning line{transition:stroke-width 30ms linear .2s;stroke-width:0}svg.warning.toggle path{transition:stroke-dashoffset .18s linear .28s;stroke-dashoffset:0}svg.warning.toggle line{transition:stroke-width 30ms linear .26s;stroke-width:8}\n"] }]
}], propDecorators: { dataWarning: [{
type: Input
}], closeSucToaster: [{
type: Output
}] } });
// import { Component } from '@angular/core';
class ErrorComponent {
constructor() {
this.dataError = {};
this.closeSucToaster = new EventEmitter();
this.closeToastFalse = true;
}
close() {
this.closeToastFalse = false;
this.closeSucToaster.emit();
}
ngOnInit() {
// console.log(this.dataError)
if (this.dataError.autoClose) {
setTimeout(() => {
this.closeToastFalse = false;
}, this.dataError.timeout);
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.2", type: ErrorComponent, isStandalone: false, selector: "lib-error", inputs: { dataError: "dataError" }, outputs: { closeSucToaster: "closeSucToaster" }, ngImport: i0, template: "<!-- <div class=\"toastr_wrapper for_error border_{{dataError.border}}\" *ngIf=\"closeToastFalse\"\n[@slideInOut]=\"dataError.position=='top-left'?true:false\"\n[@slideInOutRight]=\"dataError.position=='top-right'?true:false\"\n\n> -->\n@if (closeToastFalse) {\n <div class=\"toastr_wrapper for_error border_{{dataError.border}}\"\n [@slideInOut]\n [style.background-color]=\"dataError.background\"\n >\n <!-- <div class=\"ui-error\"> -->\n <svg viewBox=\"0 0 87 87\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <g id=\"Page-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <g id=\"Group-2\" transform=\"translate(2.000000, 2.000000)\">\n <circle id=\"Oval-2\" stroke=\"rgba(252, 191, 191, .5)\" stroke-width=\"4\" cx=\"41.5\" cy=\"41.5\" r=\"41.5\"></circle>\n <circle class=\"ui-error-circle\" stroke=\"#F74444\" stroke-width=\"4\" cx=\"41.5\" cy=\"41.5\" r=\"41.5\"></circle>\n <path class=\"ui-error-line1\" d=\"M22.244224,22 L60.4279902,60.1837662\" id=\"Line\" stroke=\"#F74444\"\n stroke-width=\"3\" stroke-linecap=\"square\"></path>\n <path class=\"ui-error-line2\" d=\"M60.755776,21 L23.244224,59.8443492\" id=\"Line\" stroke=\"#F74444\" stroke-width=\"3\"\n stroke-linecap=\"square\"></path>\n </g>\n </g>\n </svg>\n <!-- </div> -->\n <lib-toaster-text [toasterText]=\"dataError\" class=\"toaster_outer\"></lib-toaster-text>\n @if (dataError.closeIcon) {\n <span class=\"close_toastr\">\n <span class=\"material-symbols-outlined\" (click)=\"close()\">\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataError.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataError\"></lib-progressbar>\n }\n</div>\n}\n", styles: [".ui-error{width:100px;height:100px;margin:40px}.ui-error-circle{stroke-dasharray:260.75219025px,260.75219025px;stroke-dashoffset:260.75219025px;animation:ani-error-circle 1.2s linear}.ui-error-line1{stroke-dasharray:54px 55px;stroke-dashoffset:55px;stroke-linecap:round;animation:ani-error-line .15s 1.2s linear both}.ui-error-line2{stroke-dasharray:54px 55px;stroke-dashoffset:55px;stroke-linecap:round;animation:ani-error-line .2s .9s linear both}@keyframes ani-error-line{to{stroke-dashoffset:0}}@keyframes ani-error-circle{0%{stroke-dasharray:0,260.75219025px;stroke-dashoffset:0}35%{stroke-dasharray:120px,120px;stroke-dashoffset:-120px}70%{stroke-dasharray:0,260.75219025px;stroke-dashoffset:-260.75219025px}to{stroke-dasharray:260.75219025px,0;stroke-dashoffset:-260.75219025px}}\n"], dependencies: [{ kind: "component", type: ProgressbarComponent, selector: "lib-progressbar", inputs: ["dataProgressBar"] }, { kind: "component", type: ToasterTextComponent, selector: "lib-toaster-text", inputs: ["toasterText"] }], animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
// trigger('slideInOutRight', [
// transition(':enter', [
// style({transform: 'translateX(100%)'}),
// animate('200ms ease-in', style({transform: 'translateX(0%)'}))
// ]),
// transition(':leave', [
// animate('200ms ease-in', style({transform: 'translatex(100%)'}))
// ])
// ])
] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ErrorComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-error', animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
// trigger('slideInOutRight', [
// transition(':enter', [
// style({transform: 'translateX(100%)'}),
// animate('200ms ease-in', style({transform: 'translateX(0%)'}))
// ]),
// transition(':leave', [
// animate('200ms ease-in', style({transform: 'translatex(100%)'}))
// ])
// ])
], standalone: false, template: "<!-- <div class=\"toastr_wrapper for_error border_{{dataError.border}}\" *ngIf=\"closeToastFalse\"\n[@slideInOut]=\"dataError.position=='top-left'?true:false\"\n[@slideInOutRight]=\"dataError.position=='top-right'?true:false\"\n\n> -->\n@if (closeToastFalse) {\n <div class=\"toastr_wrapper for_error border_{{dataError.border}}\"\n [@slideInOut]\n [style.background-color]=\"dataError.background\"\n >\n <!-- <div class=\"ui-error\"> -->\n <svg viewBox=\"0 0 87 87\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <g id=\"Page-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <g id=\"Group-2\" transform=\"translate(2.000000, 2.000000)\">\n <circle id=\"Oval-2\" stroke=\"rgba(252, 191, 191, .5)\" stroke-width=\"4\" cx=\"41.5\" cy=\"41.5\" r=\"41.5\"></circle>\n <circle class=\"ui-error-circle\" stroke=\"#F74444\" stroke-width=\"4\" cx=\"41.5\" cy=\"41.5\" r=\"41.5\"></circle>\n <path class=\"ui-error-line1\" d=\"M22.244224,22 L60.4279902,60.1837662\" id=\"Line\" stroke=\"#F74444\"\n stroke-width=\"3\" stroke-linecap=\"square\"></path>\n <path class=\"ui-error-line2\" d=\"M60.755776,21 L23.244224,59.8443492\" id=\"Line\" stroke=\"#F74444\" stroke-width=\"3\"\n stroke-linecap=\"square\"></path>\n </g>\n </g>\n </svg>\n <!-- </div> -->\n <lib-toaster-text [toasterText]=\"dataError\" class=\"toaster_outer\"></lib-toaster-text>\n @if (dataError.closeIcon) {\n <span class=\"close_toastr\">\n <span class=\"material-symbols-outlined\" (click)=\"close()\">\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataError.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataError\"></lib-progressbar>\n }\n</div>\n}\n", styles: [".ui-error{width:100px;height:100px;margin:40px}.ui-error-circle{stroke-dasharray:260.75219025px,260.75219025px;stroke-dashoffset:260.75219025px;animation:ani-error-circle 1.2s linear}.ui-error-line1{stroke-dasharray:54px 55px;stroke-dashoffset:55px;stroke-linecap:round;animation:ani-error-line .15s 1.2s linear both}.ui-error-line2{stroke-dasharray:54px 55px;stroke-dashoffset:55px;stroke-linecap:round;animation:ani-error-line .2s .9s linear both}@keyframes ani-error-line{to{stroke-dashoffset:0}}@keyframes ani-error-circle{0%{stroke-dasharray:0,260.75219025px;stroke-dashoffset:0}35%{stroke-dasharray:120px,120px;stroke-dashoffset:-120px}70%{stroke-dasharray:0,260.75219025px;stroke-dashoffset:-260.75219025px}to{stroke-dasharray:260.75219025px,0;stroke-dashoffset:-260.75219025px}}\n"] }]
}], propDecorators: { dataError: [{
type: Input
}], closeSucToaster: [{
type: Output
}] } });
class SuccessComponent {
constructor() {
this.dataSuccess = {};
this.closeSucToaster = new EventEmitter();
this.closeToastFalse = true;
}
close() {
// debugger
this.closeSucToaster.emit();
this.closeToastFalse = false;
}
// showToast = true;
ngOnInit() {
if (this.dataSuccess.autoClose) {
setTimeout(() => {
this.closeToastFalse = false;
}, this.dataSuccess.timeout);
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: SuccessComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.2", type: SuccessComponent, isStandalone: false, selector: "lib-success", inputs: { dataSuccess: "dataSuccess" }, outputs: { closeSucToaster: "closeSucToaster" }, ngImport: i0, template: "<!-- <p>success works!</p> -->\n@if (closeToastFalse) {\n <div [@slideInOut] class=\"toastr_wrapper for_success border_{{dataSuccess.border}} {{closeToastFalse?'':'close_anim'}}\" [ngStyle]=\"{'background': dataSuccess.background+''}\">\n <svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\"\n y=\"0px\" viewBox=\"0 0 98.5 98.5\" enable-background=\"new 0 0 98.5 98.5\" xml:space=\"preserve\">\n <path class=\"checkmark\" fill=\"none\" stroke-width=\"8\" stroke-miterlimit=\"10\"\n d=\"M81.7,17.8C73.5,9.3,62,4,49.2,4C24.3,4,4,24.3,4,49.2s20.3,45.2,45.2,45.2s45.2-20.3,45.2-45.2c0-8.6-2.4-16.6-6.5-23.4l0,0L45.6,68.2L24.7,47.3\" />\n </svg>\n <lib-toaster-text [toasterText]=\"dataSuccess\" class=\"toaster_outer\"></lib-toaster-text>\n <!-- <p>{{dataSuccess.closeIcon}}</p> -->\n @if (dataSuccess.closeIcon == true) {\n <span class=\"close_toastr\" (click)=\"close()\">\n <span class=\"material-symbols-outlined\" >\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataSuccess.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataSuccess\" ></lib-progressbar>\n }\n </div>\n}\n", styles: [".checkmark{stroke:var(--theme_pimary);stroke-dashoffset:745.74853515625;stroke-dasharray:745.74853515625;animation:dash 2s ease-out forwards}@keyframes dash{0%{stroke-dashoffset:745.74853515625}to{stroke-dashoffset:0}}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ProgressbarComponent, selector: "lib-progressbar", inputs: ["dataProgressBar"] }, { kind: "component", type: ToasterTextComponent, selector: "lib-toaster-text", inputs: ["toasterText"] }], animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: SuccessComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-success', animations: [
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: '0' }),
animate('300ms ease-in', style({ opacity: '1' }))
]),
transition(':leave', [
animate('300ms ease-in', style({ opacity: '0' }))
])
]),
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(-100%)', opacity: '0', scale: '.7' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)', opacity: '1', scale: '1' }))
]),
transition(':leave', [
animate('200ms ease-in', style({ transform: 'translateY(-100%)', opacity: '0', scale: '.9' }))
])
]),
], standalone: false, template: "<!-- <p>success works!</p> -->\n@if (closeToastFalse) {\n <div [@slideInOut] class=\"toastr_wrapper for_success border_{{dataSuccess.border}} {{closeToastFalse?'':'close_anim'}}\" [ngStyle]=\"{'background': dataSuccess.background+''}\">\n <svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\"\n y=\"0px\" viewBox=\"0 0 98.5 98.5\" enable-background=\"new 0 0 98.5 98.5\" xml:space=\"preserve\">\n <path class=\"checkmark\" fill=\"none\" stroke-width=\"8\" stroke-miterlimit=\"10\"\n d=\"M81.7,17.8C73.5,9.3,62,4,49.2,4C24.3,4,4,24.3,4,49.2s20.3,45.2,45.2,45.2s45.2-20.3,45.2-45.2c0-8.6-2.4-16.6-6.5-23.4l0,0L45.6,68.2L24.7,47.3\" />\n </svg>\n <lib-toaster-text [toasterText]=\"dataSuccess\" class=\"toaster_outer\"></lib-toaster-text>\n <!-- <p>{{dataSuccess.closeIcon}}</p> -->\n @if (dataSuccess.closeIcon == true) {\n <span class=\"close_toastr\" (click)=\"close()\">\n <span class=\"material-symbols-outlined\" >\n <!-- <lib-close-button-icon></lib-close-button-icon> -->\n close\n </span>\n </span>\n }\n @if (dataSuccess.progressbar) {\n <lib-progressbar [dataProgressBar]=\"dataSuccess\" ></lib-progressbar>\n }\n </div>\n}\n", styles: [".checkmark{stroke:var(--theme_pimary);stroke-dashoffset:745.74853515625;stroke-dasharray:745.74853515625;animation:dash 2s ease-out forwards}@keyframes dash{0%{stroke-dashoffset:745.74853515625}to{stroke-dashoffset:0}}\n"] }]
}], propDecorators: { dataSuccess: [{
type: Input
}], closeSucToaster: [{
type: Output
}] } });
class ToastComponent {
constructor(_toastService) {
this._toastService = _toastService;
this.toastList = [];
this.toastListTopRight = [];
this.toastListTopLeft = [];
this.toastListTopCenter = [];
this.toastListBottomCenter = [];
}
// delay: number = 0;
deleteToaster(positionArray, toastObj, delay) {
}
deleteIndivudalToaster(i, obj, toasterArr) {
// debugger
// setTimeout(()=>{
// toasterArr.splice(i, 1);
// },1000)
}
sorting(arr) {
// this.toastListBottomCenter.sort((n1:Toast,n2:Toast) => n2.toasterId! - n1.toasterId! );
return arr.sort((n1, n2) => n2.toasterId - n1.toasterId);
}
ngOnInit() {
// this._toastService.test()
// console.log(this._toastService.defaultData)
this._toastService.toastData.subscribe((data) => {
// debugger
// console.log("sub hit")
this.toastList.push({ ...data });
if (data.position == 'top-right') {
if (!data.preventDuplicate) {
this.toastListTopRight.push({ ...data });
return;
}
this.toastListTopRight[0] = data;
// this.toastListTopRight.sort((n1: Toast, n2: Toast) => n2.toasterId! - n1.toasterId!);
}
else if (data.position == 'top-left') {
if (!data.preventDuplicate) {
this.toastListTopLeft.push({ ...data });
return;
}
this.toastListTopLeft[0] = data;
// this.toastListTopLeft.sort((n1: Toast, n2: Toast) => n2.toasterId! - n1.toasterId!);
}
else if (data.position == 'top-center') {
// this.toastListTopCenter.push({ ...data });
if (!data.preventDuplicate) {
this.toastListTopCenter.push({ ...data });
this.toastListTopCenter.sort((n1, n2) => n2.toasterId - n1.toasterId);
return;
}
this.toastListTopCenter[0] = data;
}
else if (data.position == 'bottom-center') {
// this.toastListBottomCenter.push({ ...data });
if (!data.preventDuplicate) {
// debugger
this.toastListBottomCenter.push({ ...data });
this.toastListBottomCenter.sort((n1, n2) => n2.toasterId - n1.toasterId);
return;
}
this.toastListBottomCenter[0] = data;
}
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ToastComponent, deps: [{ token: BmxToastService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.2", type: ToastComponent, isStandalone: false, selector: "lib-toast", ngImport: i0, template: "\n<div class=\"bmx_toast\">\n <!-- <p>toast works!</p> -->\n <!-- delete previous method start -->\n <!-- <div class=\"toaster_container top_right\">\n <ng-container *ngFor=\"let item of toastListTopRight; let i = index\">\n <lib-success *ngIf=\"item.type == 'success'\" [dataSuccess]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-success>\n <lib-error *ngIf=\"item.type == 'error'\" [dataError]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-error>\n <lib-warning *ngIf=\"item.type == 'warning'\" [dataWarning]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-warning>\n <lib-info *ngIf=\"item.type == 'info'\" [dataInfo]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-info>\n </ng-container>\n</div>\n-->\n<!-- delete previous method end -->\n<div class=\"toaster_container top_right\">\n @for (item of toastListTopRight; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-info [dataInfo]=\"item\"></lib-info>\n }\n }\n</div>\n\n<div class=\"toaster_container top_left\">\n @for (item of toastListTopLeft; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n }\n</div>\n\n\n<div class=\"toaster_container top_center\">\n @for (item of toastListTopCenter; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n }\n</div>\n\n<div class=\"toaster_container bottom_center\">\n @for (item of toastListBottomCenter; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: InfoComponent, selector: "lib-info", inputs: ["dataInfo"], outputs: ["closeSucToaster"] }, { kind: "component", type: WarningComponent, selector: "lib-warning", inputs: ["dataWarning"], outputs: ["closeSucToaster"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["dataError"], outputs: ["closeSucToaster"] }, { kind: "component", type: SuccessComponent, selector: "lib-success", inputs: ["dataSuccess"], outputs: ["closeSucToaster"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: ToastComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-toast', standalone: false, template: "\n<div class=\"bmx_toast\">\n <!-- <p>toast works!</p> -->\n <!-- delete previous method start -->\n <!-- <div class=\"toaster_container top_right\">\n <ng-container *ngFor=\"let item of toastListTopRight; let i = index\">\n <lib-success *ngIf=\"item.type == 'success'\" [dataSuccess]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-success>\n <lib-error *ngIf=\"item.type == 'error'\" [dataError]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-error>\n <lib-warning *ngIf=\"item.type == 'warning'\" [dataWarning]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-warning>\n <lib-info *ngIf=\"item.type == 'info'\" [dataInfo]=\"item\"\n (closeSucToaster)=\"deleteIndivudalToaster(i, item ,toastListTopRight)\"></lib-info>\n </ng-container>\n</div>\n-->\n<!-- delete previous method end -->\n<div class=\"toaster_container top_right\">\n @for (item of toastListTopRight; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-info [dataInfo]=\"item\"></lib-info>\n }\n }\n</div>\n\n<div class=\"toaster_container top_left\">\n @for (item of toastListTopLeft; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n }\n</div>\n\n\n<div class=\"toaster_container top_center\">\n @for (item of toastListTopCenter; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n }\n</div>\n\n<div class=\"toaster_container bottom_center\">\n @for (item of toastListBottomCenter; track item; let i = $index) {\n @if (item.type == 'success') {\n <lib-success [dataSuccess]=\"item\"></lib-success>\n }\n @if (item.type == 'error') {\n <lib-error [dataError]=\"item\"></lib-error>\n }\n @if (item.type == 'warning') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n @if (item.type == 'info') {\n <lib-warning [dataWarning]=\"item\"></lib-warning>\n }\n }\n</div>\n" }]
}], ctorParameters: () => [{ type: BmxToastService }] });
class BmxToastComponent {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: BmxToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.2", type: BmxToastComponent, isStandalone: false, selector: "lib-bmx-toast", ngImport: i0, template: `
<!-- <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" /> -->
<lib-toast></lib-toast>
`, isInline: true, styles: ["", "@import\"https://fonts.googleapis.com/css2?family=Kanit:wght@200;400&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\";:root{--theme_pimary: #9162e7;--state-warning: #FFBA00;--state_info: #007FFF}body *{box-sizing:border-box;font-family:Kanit,sans-serif}.bmx_toast .close_toastr span svg{width:83%;height:auto;fill:#fff;margin-top:4px;margin-left:2px}.toaster_container{position:fixed;width:312px;z-index:999999}.toaster_container.top_right{top:5px;right:8px}.toaster_container.top_left{top:0;left:8px}.toaster_container.bottom_center{bottom:0;left:calc(50% - 156px)}.toaster_container.top_cen