refactor(file name): change vendor to bar

projects/lib/src/lib/bar.module.ts

@@ -1,11 +1,11 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { NgxProgressComponent } from './ngx-progress.component';
-import { VendorComponent } from './vendor-component/vendor.component';
+import { BarComponent } from './bar/bar.component';
 
 @NgModule({
   imports: [CommonModule],
   exports: [NgxProgressComponent],
-  declarations: [NgxProgressComponent, VendorComponent],
+  declarations: [NgxProgressComponent, BarComponent],
 })
 export class BarModule {}

projects/lib/src/lib/vendor-component/vendor.component.html → projects/lib/src/lib/bar/bar.component.html

@@ -1,4 +1,4 @@
-<ng-container *ngIf="(value ? value : loader.progress$|async) as progress">
+<ng-container *ngIf="(value ? value : loader.progress$ | async) as progress">
   <div id="loading-bar-spinner" *ngIf="includeSpinner" [style.color]="color" style="padding-left: 5px;" [style.margin-top]="barHeight">
     <div [style.width]="diameter" [style.height]="diameter" class="spinner-icon" [style.animation-duration]="1000/spinnerSpeed+'ms'"></div>
   </div>

projects/lib/src/lib/vendor-component/vendor.component.ts → projects/lib/src/lib/bar/bar.component.ts

@@ -1,12 +1,12 @@
 import { Component, Input } from '@angular/core';
-import { VendorService } from './vendor.service';
+import { BarService } from './bar.service';
 
 @Component({
   selector: 'ngx-vendor-bar',
-  templateUrl: './vendor.component.html',
-  styleUrls: ['./vendor.component.scss'],
+  templateUrl: './bar.component.html',
+  styleUrls: ['./bar.component.scss'],
 })
-export class VendorComponent {
+export class BarComponent {
   @Input() includeSpinner: boolean;
   @Input() includeBar: boolean;
   @Input() color: string;
@@ -15,5 +15,5 @@ export class VendorComponent {
   @Input() value: number = undefined;
   @Input() spinnerSpeed: number;
 
-  constructor(public loader: VendorService) {}
+  constructor(public loader: BarService) {}
 }

projects/lib/src/lib/vendor-component/vendor.service.ts → projects/lib/src/lib/bar/bar.service.ts

@@ -9,7 +9,7 @@ interface IState {
 }
 
 @Injectable({ providedIn: 'root' })
-export class VendorService {
+export class BarService {
   private readonly state$ = new BehaviorSubject<IState>({
     requests: 0,
     value: undefined,

projects/lib/src/lib/ngx-progress.component.scss

@@ -3,6 +3,8 @@
     position: absolute;
     width: 100%;
     height: 100%;
+    top: 0;
+    left: 0;
     background-color: rgba(
       255,
       255,

projects/lib/src/lib/ngx-progress.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { Subject } from 'rxjs';
-import { VendorService } from './vendor-component/vendor.service';
+import { BarService } from './bar/bar.service';
 
 @Injectable({ providedIn: 'root' })
 export class NgxProgressService {
@@ -20,7 +20,7 @@ export class NgxProgressService {
   isStarted: boolean;
   progressCount = 0;
 
-  constructor(private readonly vendorBarService: VendorService) {}
+  constructor(private readonly vendorBarService: BarService) {}
 
   /**
    * Starts progress bar.