fix: Move easeTime to the constructor

fixes #996
scttcper · May 15, 2023 · e3e4b74 · e3e4b74
1 parent fb2720e
commit e3e4b74
Showing 1 changed file with 19 additions and 21 deletions.
diff --git 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<ConfigPayload = any> implements OnDestroy {
   message?: string | null;
@@ -67,13 +61,9 @@ export class Toast<ConfigPayload = any> 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<ConfigPayload = any> 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<ConfigPayload = any> 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<ConfigPayload = any> 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) {