@ruc-lib/multi-file-upload 2.0.8 → 3.1.0

package/fesm2020/ruc-lib-multi-file-upload.mjs

@@ -1,181 +0,0 @@
-import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
-import * as i2 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i1 from '@angular/common/http';
-import { HttpEventType, HttpResponse, HttpClientModule } from '@angular/common/http';
-import * as i3 from '@angular/material/progress-bar';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-import * as i4 from '@angular/material/card';
-import { MatCardModule } from '@angular/material/card';
-import * as i5 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i6 from '@angular/material/button';
-import { MatButtonModule } from '@angular/material/button';
-import * as i7 from '@angular/material/form-field';
-import { MatFormFieldModule } from '@angular/material/form-field';
-
-class RuclibMultiFileUploadService {
-    constructor(http) {
-        this.http = http;
-    }
-    uploadFile(formData, api) {
-        return this.http.post(api, formData, {
-            reportProgress: true,
-            observe: 'events',
-        });
-    }
-    deleteFile(id, deleteApi) {
-        return this.http.delete(deleteApi + '/' + id);
-    }
-}
-RuclibMultiFileUploadService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
-RuclibMultiFileUploadService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i1.HttpClient }]; } });
-
-class RuclibMultiFileUploadComponent {
-    constructor(service) {
-        this.service = service;
-        this.rucEvent = new EventEmitter();
-        this.selectedFileData = [];
-        this.files = [];
-    }
-    ngOnInit() {
-        this.progress = 0; //initial value for the progress bar
-    }
-    /**
-     * To get the url
-     * of the thumbnail
-     * for png file type
-     */
-    getUrlFromFile(file) {
-        return new Promise((resolve, reject) => {
-            const reader = new FileReader();
-            reader.readAsDataURL(file);
-            reader.onerror = (error) => {
-                reject(error);
-            };
-            reader.onloadend = () => {
-                try {
-                    file['url'] = reader.result;
-                    resolve(file);
-                }
-                catch (err) {
-                    reject(err);
-                }
-            };
-        });
-    }
-    /**
-     * To choose the file
-     * and get the thumbnail
-     */
-    async chooseFile(event) {
-        const filePromises = Array.from(event.target.files).map((file) => {
-            const selectedFile = file;
-            selectedFile['disableUploadFile'] = false;
-            if (selectedFile.type !== 'image/png') {
-                return selectedFile;
-            }
-            return this.getUrlFromFile(selectedFile);
-        });
-        const fileInfos = await Promise.all(filePromises);
-        if (fileInfos[0]) {
-            this.selectedFileData.push(fileInfos[0]);
-        }
-        this.rucEvent.emit({
-            eventName: 'onFileSelection',
-            eventOutput: fileInfos,
-        });
-    }
-    /**
-     * To delete the selected file
-     */
-    removeSelectedFile(index, selected) {
-        if (this.rucInputData.deleteUrl) {
-            this.service.deleteFile(index, this.rucInputData.deleteUrl).subscribe();
-            this.selectedFileData.splice(index, 1);
-        }
-        else {
-            this.selectedFileData.splice(index, 1);
-        }
-        this.rucEvent.emit({ eventName: 'onDeleting', eventOutput: selected });
-    }
-    /**
-     * To upload the file
-     * and see progress bar
-     */
-    uploadSelectedFile(fileOne) {
-        this.rucEvent.emit({ eventName: 'onUploading', eventOutput: fileOne });
-        fileOne['disableUploadFile'] = true;
-        const formData = new FormData();
-        this.service
-            .uploadFile(formData, this.rucInputData.uploadUrl)
-            .subscribe((event) => {
-            if (event.type === HttpEventType.UploadProgress) {
-                this.progress = Math.round(((event.loaded || 1) / (event.total || 1)) * 100);
-            }
-            else if (event instanceof HttpResponse) {
-                this.progress = 0;
-            }
-        });
-    }
-}
-RuclibMultiFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadComponent, deps: [{ token: RuclibMultiFileUploadService }], target: i0.ɵɵFactoryTarget.Component });
-RuclibMultiFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: RuclibMultiFileUploadComponent, selector: "uxp-ruclib-multi-file-upload", inputs: { rucInputData: "rucInputData", customTheme: "customTheme" }, outputs: { rucEvent: "rucEvent" }, ngImport: i0, template: "<div class=\"{{ customTheme }}\">\r\n  <div class=\"colorcustomoverride\">\r\n    <mat-card class=\"container\" *ngIf=\"rucInputData\">\r\n      <!--Label For Selecting File Starts-->\r\n      <mat-card-title>\r\n        <div>\r\n          <mat-card class=\"matCard\">\r\n            <input\r\n              #attachments\r\n              type=\"file\"\r\n              (change)=\"chooseFile($event)\"\r\n              #fileInput\r\n              [multiple]=\"rucInputData.multifileSelection\"\r\n              name=\"files\"\r\n              id=\"img\"\r\n              class=\"isDisplay\"\r\n            />\r\n            <label for=\"img\" class=\"containerlabel\"\r\n              >{{ rucInputData.label }}\r\n              <mat-icon class=\"attachfile\">attach_file</mat-icon></label\r\n            >\r\n          </mat-card>\r\n        </div>\r\n      </mat-card-title>\r\n      <!--Label For Selecting File Starts-->\r\n      <mat-card-content class=\"marCardTable\">\r\n        <div\r\n          *ngFor=\"let selected of selectedFileData; let index = index\"\r\n          class=\"row\"\r\n          class=\"selectedFileList\"\r\n        >\r\n          <!--Thumbnail previewing of Image Starts-->\r\n          <div\r\n            *ngIf=\"selected.type === 'image/png'\"\r\n            [ngClass]=\"rucInputData.displayThumbnail ? '' : 'isDisplay'\"\r\n          >\r\n            <img [src]=\"selected.url\" width=\"50px\" />\r\n          </div>\r\n          <!--Thumbnail previewing of Image Ends-->\r\n          <!--Name of Selected File Starts-->\r\n          <mat-label class=\"selectedFileName\">{{ selected.name }}</mat-label>\r\n          <!--Name of Selected File Ends-->\r\n          <!--Button Starts-->\r\n          <div class=\"floatRight\">\r\n            <mat-icon\r\n              (click)=\"removeSelectedFile(index, selected)\"\r\n              class=\"deletebutton\"\r\n              color=\"warn\"\r\n              >delete_outline</mat-icon\r\n            >\r\n          </div>\r\n          <div class=\"floatRightSubmit\">\r\n            <button\r\n              mat-raised-button\r\n              color=\"primary\"\r\n              class=\"uploadButton\"\r\n              type=\"submit\"\r\n              (click)=\"uploadSelectedFile(selected)\"\r\n              [disabled]=\"selected.disableUploadFile\"\r\n            >\r\n              Submit\r\n            </button>\r\n          </div>\r\n          <!--Button Ends-->\r\n          <!--Progress Bar with Label Starts-->\r\n          <div *ngIf=\"selected.disableUploadFile\" class=\"progressbar\">\r\n            <mat-label class=\"fileSize\"\r\n              >{{ (selected.size / 1000).toFixed(2) }} KB</mat-label\r\n            >\r\n            <mat-label class=\"filePercentage\"> {{ progress }}% </mat-label>\r\n            <mat-progress-bar\r\n              mode=\"determinate\"\r\n              [value]=\"progress\"\r\n              class=\"displayInline\"\r\n            ></mat-progress-bar>\r\n          </div>\r\n          <!--Progress Bar with Label Ends-->\r\n        </div>\r\n      </mat-card-content>\r\n    </mat-card>\r\n  </div>\r\n</div>\r\n", styles: [".isDisplay{display:none}.colorcustomoverride mat-mdc-card{background-color:#fff!important;color:#000!important}.colorcustomoverride mat-mdc-card-content{padding-bottom:33px}.container{width:90%;padding:33px}.floatRight{float:right}.displayInline{display:inline-block}.uploadButton{margin-right:26px;display:inline-block}.matCard{border:2px solid #3f51b5}.marCardTable{max-height:300px;overflow:auto}.attachfile{float:right;cursor:pointer}.selectedFileList{padding-top:56px}.progressbar{width:76%}.fileSize{float:left;padding:10px}.filePercentage{float:right;padding:10px}.deletebutton{margin-top:4px;display:inline-block;cursor:pointer}.floatRightSubmit{float:right}.selectedFileName{display:inline-block;line-break:auto}@media (max-width: 800px){.fileSize{margin-top:31px;float:left}.filePercentage{padding:0;margin-top:41px}.floatRightSubmit{margin-right:-6px;float:right}.deletebutton{margin-right:-22px;cursor:pointer}.progressbar{width:100%}.attachfile{float:right;cursor:pointer;margin-top:-4px}.containerlabel{font-size:18px}.container{height:auto;overflow:scroll}.selectedFileName{margin-bottom:14px;line-break:auto;width:85px;margin-left:-17px}}@media only screen and (max-width: 740px) and (min-width: 360px){.floatRightSubmit{margin-right:-12px}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'uxp-ruclib-multi-file-upload', template: "<div class=\"{{ customTheme }}\">\r\n  <div class=\"colorcustomoverride\">\r\n    <mat-card class=\"container\" *ngIf=\"rucInputData\">\r\n      <!--Label For Selecting File Starts-->\r\n      <mat-card-title>\r\n        <div>\r\n          <mat-card class=\"matCard\">\r\n            <input\r\n              #attachments\r\n              type=\"file\"\r\n              (change)=\"chooseFile($event)\"\r\n              #fileInput\r\n              [multiple]=\"rucInputData.multifileSelection\"\r\n              name=\"files\"\r\n              id=\"img\"\r\n              class=\"isDisplay\"\r\n            />\r\n            <label for=\"img\" class=\"containerlabel\"\r\n              >{{ rucInputData.label }}\r\n              <mat-icon class=\"attachfile\">attach_file</mat-icon></label\r\n            >\r\n          </mat-card>\r\n        </div>\r\n      </mat-card-title>\r\n      <!--Label For Selecting File Starts-->\r\n      <mat-card-content class=\"marCardTable\">\r\n        <div\r\n          *ngFor=\"let selected of selectedFileData; let index = index\"\r\n          class=\"row\"\r\n          class=\"selectedFileList\"\r\n        >\r\n          <!--Thumbnail previewing of Image Starts-->\r\n          <div\r\n            *ngIf=\"selected.type === 'image/png'\"\r\n            [ngClass]=\"rucInputData.displayThumbnail ? '' : 'isDisplay'\"\r\n          >\r\n            <img [src]=\"selected.url\" width=\"50px\" />\r\n          </div>\r\n          <!--Thumbnail previewing of Image Ends-->\r\n          <!--Name of Selected File Starts-->\r\n          <mat-label class=\"selectedFileName\">{{ selected.name }}</mat-label>\r\n          <!--Name of Selected File Ends-->\r\n          <!--Button Starts-->\r\n          <div class=\"floatRight\">\r\n            <mat-icon\r\n              (click)=\"removeSelectedFile(index, selected)\"\r\n              class=\"deletebutton\"\r\n              color=\"warn\"\r\n              >delete_outline</mat-icon\r\n            >\r\n          </div>\r\n          <div class=\"floatRightSubmit\">\r\n            <button\r\n              mat-raised-button\r\n              color=\"primary\"\r\n              class=\"uploadButton\"\r\n              type=\"submit\"\r\n              (click)=\"uploadSelectedFile(selected)\"\r\n              [disabled]=\"selected.disableUploadFile\"\r\n            >\r\n              Submit\r\n            </button>\r\n          </div>\r\n          <!--Button Ends-->\r\n          <!--Progress Bar with Label Starts-->\r\n          <div *ngIf=\"selected.disableUploadFile\" class=\"progressbar\">\r\n            <mat-label class=\"fileSize\"\r\n              >{{ (selected.size / 1000).toFixed(2) }} KB</mat-label\r\n            >\r\n            <mat-label class=\"filePercentage\"> {{ progress }}% </mat-label>\r\n            <mat-progress-bar\r\n              mode=\"determinate\"\r\n              [value]=\"progress\"\r\n              class=\"displayInline\"\r\n            ></mat-progress-bar>\r\n          </div>\r\n          <!--Progress Bar with Label Ends-->\r\n        </div>\r\n      </mat-card-content>\r\n    </mat-card>\r\n  </div>\r\n</div>\r\n", styles: [".isDisplay{display:none}.colorcustomoverride mat-mdc-card{background-color:#fff!important;color:#000!important}.colorcustomoverride mat-mdc-card-content{padding-bottom:33px}.container{width:90%;padding:33px}.floatRight{float:right}.displayInline{display:inline-block}.uploadButton{margin-right:26px;display:inline-block}.matCard{border:2px solid #3f51b5}.marCardTable{max-height:300px;overflow:auto}.attachfile{float:right;cursor:pointer}.selectedFileList{padding-top:56px}.progressbar{width:76%}.fileSize{float:left;padding:10px}.filePercentage{float:right;padding:10px}.deletebutton{margin-top:4px;display:inline-block;cursor:pointer}.floatRightSubmit{float:right}.selectedFileName{display:inline-block;line-break:auto}@media (max-width: 800px){.fileSize{margin-top:31px;float:left}.filePercentage{padding:0;margin-top:41px}.floatRightSubmit{margin-right:-6px;float:right}.deletebutton{margin-right:-22px;cursor:pointer}.progressbar{width:100%}.attachfile{float:right;cursor:pointer;margin-top:-4px}.containerlabel{font-size:18px}.container{height:auto;overflow:scroll}.selectedFileName{margin-bottom:14px;line-break:auto;width:85px;margin-left:-17px}}@media only screen and (max-width: 740px) and (min-width: 360px){.floatRightSubmit{margin-right:-12px}}\n"] }]
-        }], ctorParameters: function () { return [{ type: RuclibMultiFileUploadService }]; }, propDecorators: { rucInputData: [{
-                type: Input
-            }], customTheme: [{
-                type: Input
-            }], rucEvent: [{
-                type: Output
-            }] } });
-
-class RuclibMultiFileUploadModule {
-}
-RuclibMultiFileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-RuclibMultiFileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadModule, declarations: [RuclibMultiFileUploadComponent], imports: [CommonModule,
-        HttpClientModule,
-        MatProgressBarModule,
-        MatCardModule,
-        MatIconModule,
-        MatButtonModule,
-        MatFormFieldModule], exports: [RuclibMultiFileUploadComponent] });
-RuclibMultiFileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadModule, providers: [RuclibMultiFileUploadService], imports: [CommonModule,
-        HttpClientModule,
-        MatProgressBarModule,
-        MatCardModule,
-        MatIconModule,
-        MatButtonModule,
-        MatFormFieldModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibMultiFileUploadModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        HttpClientModule,
-                        MatProgressBarModule,
-                        MatCardModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        MatFormFieldModule
-                    ],
-                    declarations: [
-                        RuclibMultiFileUploadComponent
-                    ],
-                    providers: [RuclibMultiFileUploadService],
-                    exports: [RuclibMultiFileUploadComponent],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { RuclibMultiFileUploadComponent, RuclibMultiFileUploadModule, RuclibMultiFileUploadService };
-//# sourceMappingURL=ruc-lib-multi-file-upload.mjs.map

package/fesm2020/ruc-lib-multi-file-upload.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ruc-lib-multi-file-upload.mjs","sources":["../../src/lib/services/ruclib-multi-file-upload.service.ts","../../src/lib/ruclib-multi-file-upload/ruclib-multi-file-upload.component.ts","../../src/lib/ruclib-multi-file-upload/ruclib-multi-file-upload.component.html","../../src/lib/ruclib-multi-file-upload.module.ts","../../src/ruc-lib-multi-file-upload.ts"],"sourcesContent":["import { HttpClient } from '@angular/common/http';\r\nimport { Injectable } from '@angular/core';\r\n\r\n@Injectable()\r\nexport class RuclibMultiFileUploadService {\r\n  progress: any;\r\n\r\n  constructor(private http: HttpClient) {}\r\n\r\n  uploadFile(formData: any, api: string) {\r\n    return this.http.post(api, formData, {\r\n      reportProgress: true,\r\n      observe: 'events',\r\n    });\r\n  }\r\n  deleteFile(id: number, deleteApi: string) {\r\n    return this.http.delete(deleteApi + '/' + id);\r\n  }\r\n}\r\n","import { HttpClient, HttpEventType, HttpResponse } from '@angular/common/http';\r\nimport { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\r\nimport { MultifiledefaultConfig } from '../interfaces/multiFileUploadDefault';\r\nimport { RuclibMultiFileUploadService } from '../services/ruclib-multi-file-upload.service';\r\n\r\n@Component({\r\n  selector: 'uxp-ruclib-multi-file-upload',\r\n  templateUrl: './ruclib-multi-file-upload.component.html',\r\n  styleUrls: ['./ruclib-multi-file-upload.component.scss'],\r\n})\r\nexport class RuclibMultiFileUploadComponent implements OnInit {\r\n  @Input() rucInputData!: MultifiledefaultConfig; // Input Json\r\n  @Input() customTheme!: string;\r\n  @Output() rucEvent = new EventEmitter<any>();\r\n\r\n  index: any;\r\n  result!: string; //used for url purpose\r\n  selectedFileData: any[] = [];\r\n  progress!: number; //initial value for the progress bar\r\n  files: Array<{ name: string; url: string }> = [];\r\n  uploadUrl!: string;\r\n\r\n  constructor(private service: RuclibMultiFileUploadService) {}\r\n\r\n  ngOnInit() {\r\n    this.progress = 0; //initial value for the progress bar\r\n  }\r\n\r\n  /**\r\n   * To get the url\r\n   * of the thumbnail\r\n   * for png file type\r\n   */\r\n  getUrlFromFile(file: any): Promise<any> {\r\n    return new Promise<any>((resolve, reject) => {\r\n      const reader = new FileReader();\r\n      reader.readAsDataURL(file);\r\n\r\n      reader.onerror = (error) => {\r\n        reject(error);\r\n      };\r\n\r\n      reader.onloadend = () => {\r\n        try {\r\n          file['url'] = reader.result;\r\n          resolve(file);\r\n        } catch (err) {\r\n          reject(err);\r\n        }\r\n      };\r\n    });\r\n  }\r\n\r\n  /**\r\n   * To choose the file\r\n   * and get the thumbnail\r\n   */\r\n  async chooseFile(event: any) {\r\n    const filePromises = Array.from(event.target.files).map((file: any) => {\r\n      const selectedFile = file;\r\n      selectedFile['disableUploadFile'] = false;\r\n\r\n      if (selectedFile.type !== 'image/png') {\r\n        return selectedFile;\r\n      }\r\n\r\n      return this.getUrlFromFile(selectedFile);\r\n    });\r\n    const fileInfos = await Promise.all(filePromises);\r\n    if (fileInfos[0]) {\r\n      this.selectedFileData.push(fileInfos[0]);\r\n    }\r\n    this.rucEvent.emit({\r\n      eventName: 'onFileSelection',\r\n      eventOutput: fileInfos,\r\n    });\r\n  }\r\n\r\n  /**\r\n   * To delete the selected file\r\n   */\r\n  removeSelectedFile(index: number, selected: any) {\r\n    if (this.rucInputData.deleteUrl) {\r\n      this.service.deleteFile(index, this.rucInputData.deleteUrl).subscribe();\r\n      this.selectedFileData.splice(index, 1);\r\n    } else {\r\n      this.selectedFileData.splice(index, 1);\r\n    }\r\n    this.rucEvent.emit({ eventName: 'onDeleting', eventOutput: selected });\r\n  }\r\n\r\n  /**\r\n   * To upload the file\r\n   * and see progress bar\r\n   */\r\n  uploadSelectedFile(fileOne: any) {\r\n    this.rucEvent.emit({ eventName: 'onUploading', eventOutput: fileOne });\r\n    fileOne['disableUploadFile'] = true;\r\n    const formData = new FormData();\r\n    this.service\r\n      .uploadFile(formData, this.rucInputData.uploadUrl)\r\n      .subscribe((event) => {\r\n        if (event.type === HttpEventType.UploadProgress) {\r\n          this.progress = Math.round(\r\n            ((event.loaded || 1) / (event.total || 1)) * 100\r\n          );\r\n        } else if (event instanceof HttpResponse) {\r\n          this.progress = 0;\r\n        }\r\n      });\r\n  }\r\n}\r\n","<div class=\"{{ customTheme }}\">\r\n  <div class=\"colorcustomoverride\">\r\n    <mat-card class=\"container\" *ngIf=\"rucInputData\">\r\n      <!--Label For Selecting File Starts-->\r\n      <mat-card-title>\r\n        <div>\r\n          <mat-card class=\"matCard\">\r\n            <input\r\n              #attachments\r\n              type=\"file\"\r\n              (change)=\"chooseFile($event)\"\r\n              #fileInput\r\n              [multiple]=\"rucInputData.multifileSelection\"\r\n              name=\"files\"\r\n              id=\"img\"\r\n              class=\"isDisplay\"\r\n            />\r\n            <label for=\"img\" class=\"containerlabel\"\r\n              >{{ rucInputData.label }}\r\n              <mat-icon class=\"attachfile\">attach_file</mat-icon></label\r\n            >\r\n          </mat-card>\r\n        </div>\r\n      </mat-card-title>\r\n      <!--Label For Selecting File Starts-->\r\n      <mat-card-content class=\"marCardTable\">\r\n        <div\r\n          *ngFor=\"let selected of selectedFileData; let index = index\"\r\n          class=\"row\"\r\n          class=\"selectedFileList\"\r\n        >\r\n          <!--Thumbnail previewing of Image Starts-->\r\n          <div\r\n            *ngIf=\"selected.type === 'image/png'\"\r\n            [ngClass]=\"rucInputData.displayThumbnail ? '' : 'isDisplay'\"\r\n          >\r\n            <img [src]=\"selected.url\" width=\"50px\" />\r\n          </div>\r\n          <!--Thumbnail previewing of Image Ends-->\r\n          <!--Name of Selected File Starts-->\r\n          <mat-label class=\"selectedFileName\">{{ selected.name }}</mat-label>\r\n          <!--Name of Selected File Ends-->\r\n          <!--Button Starts-->\r\n          <div class=\"floatRight\">\r\n            <mat-icon\r\n              (click)=\"removeSelectedFile(index, selected)\"\r\n              class=\"deletebutton\"\r\n              color=\"warn\"\r\n              >delete_outline</mat-icon\r\n            >\r\n          </div>\r\n          <div class=\"floatRightSubmit\">\r\n            <button\r\n              mat-raised-button\r\n              color=\"primary\"\r\n              class=\"uploadButton\"\r\n              type=\"submit\"\r\n              (click)=\"uploadSelectedFile(selected)\"\r\n              [disabled]=\"selected.disableUploadFile\"\r\n            >\r\n              Submit\r\n            </button>\r\n          </div>\r\n          <!--Button Ends-->\r\n          <!--Progress Bar with Label Starts-->\r\n          <div *ngIf=\"selected.disableUploadFile\" class=\"progressbar\">\r\n            <mat-label class=\"fileSize\"\r\n              >{{ (selected.size / 1000).toFixed(2) }} KB</mat-label\r\n            >\r\n            <mat-label class=\"filePercentage\"> {{ progress }}% </mat-label>\r\n            <mat-progress-bar\r\n              mode=\"determinate\"\r\n              [value]=\"progress\"\r\n              class=\"displayInline\"\r\n            ></mat-progress-bar>\r\n          </div>\r\n          <!--Progress Bar with Label Ends-->\r\n        </div>\r\n      </mat-card-content>\r\n    </mat-card>\r\n  </div>\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { RuclibMultiFileUploadComponent } from './ruclib-multi-file-upload/ruclib-multi-file-upload.component';\r\nimport { MatProgressBarModule } from '@angular/material/progress-bar';\r\nimport { MatCardModule } from '@angular/material/card';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { HttpClientModule } from '@angular/common/http';\r\nimport { RuclibMultiFileUploadService } from './services/ruclib-multi-file-upload.service';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    HttpClientModule,\r\n    MatProgressBarModule,\r\n    MatCardModule,\r\n    MatIconModule,\r\n    MatButtonModule,\r\n    MatFormFieldModule\r\n  ],\r\n  declarations: [\r\n    RuclibMultiFileUploadComponent\r\n  ],\r\n  providers: [RuclibMultiFileUploadService],\r\n\r\n  exports: [RuclibMultiFileUploadComponent],\r\n})\r\nexport class RuclibMultiFileUploadModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.RuclibMultiFileUploadService"],"mappings":";;;;;;;;;;;;;;;;;MAIa,4BAA4B,CAAA;AAGvC,IAAA,WAAA,CAAoB,IAAgB,EAAA;QAAhB,IAAI,CAAA,IAAA,GAAJ,IAAI,CAAY;KAAI;IAExC,UAAU,CAAC,QAAa,EAAE,GAAW,EAAA;QACnC,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,QAAQ,EAAE;AACnC,YAAA,cAAc,EAAE,IAAI;AACpB,YAAA,OAAO,EAAE,QAAQ;AAClB,SAAA,CAAC,CAAC;KACJ;IACD,UAAU,CAAC,EAAU,EAAE,SAAiB,EAAA;AACtC,QAAA,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,GAAG,GAAG,EAAE,CAAC,CAAC;KAC/C;;0HAbU,4BAA4B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;8HAA5B,4BAA4B,EAAA,CAAA,CAAA;4FAA5B,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBADxC,UAAU;;;MCOE,8BAA8B,CAAA;AAYzC,IAAA,WAAA,CAAoB,OAAqC,EAAA;QAArC,IAAO,CAAA,OAAA,GAAP,OAAO,CAA8B;AAT/C,QAAA,IAAA,CAAA,QAAQ,GAAG,IAAI,YAAY,EAAO,CAAC;QAI7C,IAAgB,CAAA,gBAAA,GAAU,EAAE,CAAC;QAE7B,IAAK,CAAA,KAAA,GAAyC,EAAE,CAAC;KAGY;IAE7D,QAAQ,GAAA;AACN,QAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;KACnB;AAED;;;;AAIG;AACH,IAAA,cAAc,CAAC,IAAS,EAAA;QACtB,OAAO,IAAI,OAAO,CAAM,CAAC,OAAO,EAAE,MAAM,KAAI;AAC1C,YAAA,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;AAChC,YAAA,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;AAE3B,YAAA,MAAM,CAAC,OAAO,GAAG,CAAC,KAAK,KAAI;gBACzB,MAAM,CAAC,KAAK,CAAC,CAAC;AAChB,aAAC,CAAC;AAEF,YAAA,MAAM,CAAC,SAAS,GAAG,MAAK;gBACtB,IAAI;AACF,oBAAA,IAAI,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC;oBAC5B,OAAO,CAAC,IAAI,CAAC,CAAC;AACf,iBAAA;AAAC,gBAAA,OAAO,GAAG,EAAE;oBACZ,MAAM,CAAC,GAAG,CAAC,CAAC;AACb,iBAAA;AACH,aAAC,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;AAED;;;AAGG;IACH,MAAM,UAAU,CAAC,KAAU,EAAA;AACzB,QAAA,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAS,KAAI;YACpE,MAAM,YAAY,GAAG,IAAI,CAAC;AAC1B,YAAA,YAAY,CAAC,mBAAmB,CAAC,GAAG,KAAK,CAAC;AAE1C,YAAA,IAAI,YAAY,CAAC,IAAI,KAAK,WAAW,EAAE;AACrC,gBAAA,OAAO,YAAY,CAAC;AACrB,aAAA;AAED,YAAA,OAAO,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;AAC3C,SAAC,CAAC,CAAC;QACH,MAAM,SAAS,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;AAClD,QAAA,IAAI,SAAS,CAAC,CAAC,CAAC,EAAE;YAChB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;AAC1C,SAAA;AACD,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;AACjB,YAAA,SAAS,EAAE,iBAAiB;AAC5B,YAAA,WAAW,EAAE,SAAS;AACvB,SAAA,CAAC,CAAC;KACJ;AAED;;AAEG;IACH,kBAAkB,CAAC,KAAa,EAAE,QAAa,EAAA;AAC7C,QAAA,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE;AAC/B,YAAA,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,SAAS,EAAE,CAAC;YACxE,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;AACxC,SAAA;AAAM,aAAA;YACL,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;AACxC,SAAA;AACD,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,QAAQ,EAAE,CAAC,CAAC;KACxE;AAED;;;AAGG;AACH,IAAA,kBAAkB,CAAC,OAAY,EAAA;AAC7B,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC,CAAC;AACvE,QAAA,OAAO,CAAC,mBAAmB,CAAC,GAAG,IAAI,CAAC;AACpC,QAAA,MAAM,QAAQ,GAAG,IAAI,QAAQ,EAAE,CAAC;AAChC,QAAA,IAAI,CAAC,OAAO;aACT,UAAU,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;AACjD,aAAA,SAAS,CAAC,CAAC,KAAK,KAAI;AACnB,YAAA,IAAI,KAAK,CAAC,IAAI,KAAK,aAAa,CAAC,cAAc,EAAE;gBAC/C,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CACxB,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,KAAK,KAAK,CAAC,KAAK,IAAI,CAAC,CAAC,IAAI,GAAG,CACjD,CAAC;AACH,aAAA;iBAAM,IAAI,KAAK,YAAY,YAAY,EAAE;AACxC,gBAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;AACnB,aAAA;AACH,SAAC,CAAC,CAAC;KACN;;4HApGU,8BAA8B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAAA,4BAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAA9B,8BAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,8BAA8B,6KCV3C,mkGAkFA,EAAA,MAAA,EAAA,CAAA,6uCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,aAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,cAAA,CAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,kDAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,6GAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,eAAA,EAAA,OAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA,CAAA;4FDxEa,8BAA8B,EAAA,UAAA,EAAA,CAAA;kBAL1C,SAAS;+BACE,8BAA8B,EAAA,QAAA,EAAA,mkGAAA,EAAA,MAAA,EAAA,CAAA,6uCAAA,CAAA,EAAA,CAAA;gHAK/B,YAAY,EAAA,CAAA;sBAApB,KAAK;gBACG,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBACI,QAAQ,EAAA,CAAA;sBAAjB,MAAM;;;MEeI,2BAA2B,CAAA;;yHAA3B,2BAA2B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;0HAA3B,2BAA2B,EAAA,YAAA,EAAA,CANpC,8BAA8B,CAAA,EAAA,OAAA,EAAA,CAT9B,YAAY;QACZ,gBAAgB;QAChB,oBAAoB;QACpB,aAAa;QACb,aAAa;QACb,eAAe;AACf,QAAA,kBAAkB,aAOV,8BAA8B,CAAA,EAAA,CAAA,CAAA;AAE7B,2BAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,2BAA2B,EAJ3B,SAAA,EAAA,CAAC,4BAA4B,CAAC,YAXvC,YAAY;QACZ,gBAAgB;QAChB,oBAAoB;QACpB,aAAa;QACb,aAAa;QACb,eAAe;QACf,kBAAkB,CAAA,EAAA,CAAA,CAAA;4FAST,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAjBvC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,gBAAgB;wBAChB,oBAAoB;wBACpB,aAAa;wBACb,aAAa;wBACb,eAAe;wBACf,kBAAkB;AACnB,qBAAA;AACD,oBAAA,YAAY,EAAE;wBACZ,8BAA8B;AAC/B,qBAAA;oBACD,SAAS,EAAE,CAAC,4BAA4B,CAAC;oBAEzC,OAAO,EAAE,CAAC,8BAA8B,CAAC;AAC1C,iBAAA,CAAA;;;AC3BD;;AAEG;;;;"}

package/lib/interfaces/multiFileUploadDefault.d.ts

@@ -1,27 +0,0 @@
-export interface MultifiledefaultConfig {
-    /**
-     * Mandatory
-     * Values:true,false
-     */
-    multifileSelection: boolean;
-    /**
-     * Mandatory,
-     * Values:true,false
-     */
-    displayThumbnail: boolean;
-    /**
-     * Mandatory,
-     * Values:string
-     */
-    label: string;
-    /**
-     * Mandatory,
-     * Values:string
-     */
-    uploadUrl: string;
-    /**
-     * Optional
-     * Values:string
-     */
-    deleteUrl?: string;
-}

package/lib/ruclib-multi-file-upload/ruclib-multi-file-upload.component.d.ts

@@ -1,43 +0,0 @@
-import { EventEmitter, OnInit } from '@angular/core';
-import { MultifiledefaultConfig } from '../interfaces/multiFileUploadDefault';
-import { RuclibMultiFileUploadService } from '../services/ruclib-multi-file-upload.service';
-import * as i0 from "@angular/core";
-export declare class RuclibMultiFileUploadComponent implements OnInit {
-    private service;
-    rucInputData: MultifiledefaultConfig;
-    customTheme: string;
-    rucEvent: EventEmitter<any>;
-    index: any;
-    result: string;
-    selectedFileData: any[];
-    progress: number;
-    files: Array<{
-        name: string;
-        url: string;
-    }>;
-    uploadUrl: string;
-    constructor(service: RuclibMultiFileUploadService);
-    ngOnInit(): void;
-    /**
-     * To get the url
-     * of the thumbnail
-     * for png file type
-     */
-    getUrlFromFile(file: any): Promise<any>;
-    /**
-     * To choose the file
-     * and get the thumbnail
-     */
-    chooseFile(event: any): Promise<void>;
-    /**
-     * To delete the selected file
-     */
-    removeSelectedFile(index: number, selected: any): void;
-    /**
-     * To upload the file
-     * and see progress bar
-     */
-    uploadSelectedFile(fileOne: any): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RuclibMultiFileUploadComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RuclibMultiFileUploadComponent, "uxp-ruclib-multi-file-upload", never, { "rucInputData": "rucInputData"; "customTheme": "customTheme"; }, { "rucEvent": "rucEvent"; }, never, never, false, never>;
-}

package/lib/ruclib-multi-file-upload.module.d.ts

@@ -1,14 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./ruclib-multi-file-upload/ruclib-multi-file-upload.component";
-import * as i2 from "@angular/common";
-import * as i3 from "@angular/common/http";
-import * as i4 from "@angular/material/progress-bar";
-import * as i5 from "@angular/material/card";
-import * as i6 from "@angular/material/icon";
-import * as i7 from "@angular/material/button";
-import * as i8 from "@angular/material/form-field";
-export declare class RuclibMultiFileUploadModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<RuclibMultiFileUploadModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<RuclibMultiFileUploadModule, [typeof i1.RuclibMultiFileUploadComponent], [typeof i2.CommonModule, typeof i3.HttpClientModule, typeof i4.MatProgressBarModule, typeof i5.MatCardModule, typeof i6.MatIconModule, typeof i7.MatButtonModule, typeof i8.MatFormFieldModule], [typeof i1.RuclibMultiFileUploadComponent]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<RuclibMultiFileUploadModule>;
-}

package/lib/services/ruclib-multi-file-upload.service.d.ts

@@ -1,11 +0,0 @@
-import { HttpClient } from '@angular/common/http';
-import * as i0 from "@angular/core";
-export declare class RuclibMultiFileUploadService {
-    private http;
-    progress: any;
-    constructor(http: HttpClient);
-    uploadFile(formData: any, api: string): import("rxjs").Observable<import("@angular/common/http").HttpEvent<Object>>;
-    deleteFile(id: number, deleteApi: string): import("rxjs").Observable<Object>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RuclibMultiFileUploadService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<RuclibMultiFileUploadService>;
-}