diff --git a/src/lib/toastr/toast.component.ts b/src/lib/toastr/toast.component.ts index abe094d6..30b801c0 100644 --- a/src/lib/toastr/toast.component.ts +++ b/src/lib/toastr/toast.component.ts @@ -42,19 +42,13 @@ import { ToastrService } from './toastr.service'; state('inactive', style({ opacity: 0 })), state('active', style({ opacity: 1 })), state('removed', style({ opacity: 0 })), - transition( - 'inactive => active', - animate('{{ easeTime }}ms {{ easing }}'), - ), - transition( - 'active => removed', - animate('{{ easeTime }}ms {{ easing }}'), - ), + transition('inactive => active', animate('{{ easeTime }}ms {{ easing }}')), + transition('active => removed', animate('{{ easeTime }}ms {{ easing }}')), ]), ], preserveWhitespaces: false, standalone: true, - imports: [ NgIf ], + imports: [NgIf], }) export class Toast implements OnDestroy { message?: string | null; @@ -67,13 +61,9 @@ export class Toast implements OnDestroy { /** a combination of toast type and options.toastClass */ @HostBinding('class') toastClasses = ''; /** controls animation */ - @HostBinding('@flyInOut') - state = { - value: 'inactive', - params: { - easeTime: this.toastPackage.config.easeTime, - easing: 'ease-in' - } + @HostBinding('@flyInOut') state!: { + value: 'inactive' | 'active' | 'removed'; + params: { easeTime: number | string; easing: string }; }; /** hides component when waiting to be displayed */ @@ -97,15 +87,13 @@ export class Toast implements OnDestroy { constructor( protected toastrService: ToastrService, public toastPackage: ToastPackage, - protected ngZone?: NgZone + protected ngZone?: NgZone, ) { this.message = toastPackage.message; this.title = toastPackage.title; this.options = toastPackage.config; this.originalTimeout = toastPackage.config.timeOut; - this.toastClasses = `${toastPackage.toastType} ${ - toastPackage.config.toastClass - }`; + this.toastClasses = `${toastPackage.toastType} ${toastPackage.config.toastClass}`; this.sub = toastPackage.toastRef.afterActivate().subscribe(() => { this.activateToast(); }); @@ -118,6 +106,13 @@ export class Toast implements OnDestroy { this.sub3 = toastPackage.toastRef.countDuplicate().subscribe(count => { this.duplicatesCount = count; }); + this.state = { + value: 'inactive', + params: { + easeTime: this.toastPackage.config.easeTime, + easing: 'ease-in', + }, + }; } ngOnDestroy() { this.sub.unsubscribe(); @@ -132,7 +127,10 @@ export class Toast implements OnDestroy { */ activateToast() { this.state = { ...this.state, value: 'active' }; - if (!(this.options.disableTimeOut === true || this.options.disableTimeOut === 'timeOut') && this.options.timeOut) { + if ( + !(this.options.disableTimeOut === true || this.options.disableTimeOut === 'timeOut') && + this.options.timeOut + ) { this.outsideTimeout(() => this.remove(), this.options.timeOut); this.hideTime = new Date().getTime() + this.options.timeOut; if (this.options.progressBar) {