@ruc-lib/multi-file-upload 2.0.1

package/README.md

@@ -0,0 +1,70 @@
+# ruclib-multi-file-upload
+
+RUC Multifile Upload Component basically allows you to select multiple files at a time. The selected file/files will be visible below with 2 features of submit and delete option.
+
+# Features
+- When you submit the file you will get a progressbar view which represents the size of the file and the percentage of the file getting submitted so for this individually each file can be submitted to the api given via the input of the selectors.
+
+Then second option is delete in which if :
+- If there is a delete api, then it will delete file from there and if there is no any delete api then it will delete the file from the list.
+
+# Installation guide
+
+# Install complete library
+
+`npm install @uxpractice/ruc-lib`
+
+# Install individual component
+
+If users only need the multi file upload component, they can install it separately
+`npm install @ruc-lib/multi-file-upload`
+
+# Usage
+
+# import required modules
+
+for library
+`import { RuclibMultiFileUploadModule } from '@uxpractice/ruc-lib/multi-file-upload'`
+
+for seperate package
+`import { RuclibMultiFileUploadModule } from '@ruc-lib/multi-file-upload'`
+
+# use component selector
+
+```
+<uxp-ruclib-multi-file-upload [rucInputData]="inputObjectDataMultiFileUpload" 
+[customTheme]="customTheme" (rucEvent)="passEvent($event)"></uxp-ruclib-multi-file-upload>
+```
+
+# Input and Output
+
+# Inputs
+rucInputData -> It is the configuration to be passed in the multi-file upload component.
+
+customTheme -> It is the name of the theme.
+
+# Output
+
+rucEvent -> is the event which will be fired when file is uploaded or deleted.
+
+# rucInputData (sample object)
+
+# Detail definition of the each property can be found in type definition file.
+
+```
+inputObjectDataMultiFileUpload = {
+  multifileSelection: true,
+  displayThumbnail: true,
+  label: 'Choose File',
+  uploadUrl: '/api/upload',
+  deleteUrl: '/api/delete',
+};
+```
+
+
+# Contribution
+Contributions are welcome! Feel free to open issues or pull requests for any enhancements or fixes.
+
+# Acknowledgements
+Thank you for choosing the Multi file upload Component Library. If you have any feedback or suggestions, please let us know!
+

package/esm2020/index.mjs

@@ -0,0 +1,4 @@
+export * from './lib/ruclib-multi-file-upload.module';
+export * from './lib/ruclib-multi-file-upload/ruclib-multi-file-upload.component';
+export * from './lib/services/ruclib-multi-file-upload.service';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyx1Q0FBdUMsQ0FBQztBQUN0RCxjQUFjLG1FQUFtRSxDQUFDO0FBQ2xGLGNBQWMsaURBQWlELENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2xpYi9ydWNsaWItbXVsdGktZmlsZS11cGxvYWQubW9kdWxlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvcnVjbGliLW11bHRpLWZpbGUtdXBsb2FkL3J1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9zZXJ2aWNlcy9ydWNsaWItbXVsdGktZmlsZS11cGxvYWQuc2VydmljZSc7Il19

package/esm2020/lib/interfaces/multiFileUploadDefault.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibXVsdGlGaWxlVXBsb2FkRGVmYXVsdC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvaW50ZXJmYWNlcy9tdWx0aUZpbGVVcGxvYWREZWZhdWx0LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgaW50ZXJmYWNlIE11bHRpZmlsZWRlZmF1bHRDb25maWcge1xyXG4gICAgLyoqXHJcbiAgICAgKiBNYW5kYXRvcnlcclxuICAgICAqIFZhbHVlczp0cnVlLGZhbHNlXHJcbiAgICAgKi9cclxuICAgIG11bHRpZmlsZVNlbGVjdGlvbjogYm9vbGVhbjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1hbmRhdG9yeSwgXHJcbiAgICAgKiBWYWx1ZXM6dHJ1ZSxmYWxzZVxyXG4gICAgICovXHJcbiAgICBkaXNwbGF5VGh1bWJuYWlsOiBib29sZWFuO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTWFuZGF0b3J5LCBcclxuICAgICAqIFZhbHVlczpzdHJpbmdcclxuICAgICAqL1xyXG4gICAgbGFiZWw6IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1hbmRhdG9yeSwgXHJcbiAgICAgKiBWYWx1ZXM6c3RyaW5nXHJcbiAgICAgKi9cclxuICAgIHVwbG9hZFVybDogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogT3B0aW9uYWwgXHJcbiAgICAgKiBWYWx1ZXM6c3RyaW5nXHJcbiAgICAgKi9cclxuICAgIGRlbGV0ZVVybD86IHN0cmluZztcclxuXHJcbn1cclxuIl19

package/esm2020/lib/ruclib-multi-file-upload/ruclib-multi-file-upload.component.mjs

@@ -0,0 +1,112 @@
+import { HttpEventType, HttpResponse } from '@angular/common/http';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { RuclibMultiFileUploadService } from '../services/ruclib-multi-file-upload.service';
+import * as i0 from "@angular/core";
+import * as i1 from "../services/ruclib-multi-file-upload.service";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/material/progress-bar";
+import * as i4 from "@angular/material/card";
+import * as i5 from "@angular/material/icon";
+import * as i6 from "@angular/material/button";
+import * as i7 from "@angular/material/form-field";
+export 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: i1.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: i1.RuclibMultiFileUploadService }]; }, propDecorators: { rucInputData: [{
+                type: Input
+            }], customTheme: [{
+                type: Input
+            }], rucEvent: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicnVjbGliLW11bHRpLWZpbGUtdXBsb2FkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvcnVjbGliLW11bHRpLWZpbGUtdXBsb2FkL3J1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9zcmMvbGliL3J1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZC9ydWNsaWItbXVsdGktZmlsZS11cGxvYWQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFjLGFBQWEsRUFBRSxZQUFZLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUMvRSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQVUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBRS9FLE9BQU8sRUFBRSw0QkFBNEIsRUFBRSxNQUFNLDhDQUE4QyxDQUFDOzs7Ozs7Ozs7QUFPNUYsTUFBTSxPQUFPLDhCQUE4QjtJQVl6QyxZQUFvQixPQUFxQztRQUFyQyxZQUFPLEdBQVAsT0FBTyxDQUE4QjtRQVQvQyxhQUFRLEdBQUcsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUk3QyxxQkFBZ0IsR0FBVSxFQUFFLENBQUM7UUFFN0IsVUFBSyxHQUF5QyxFQUFFLENBQUM7SUFHVyxDQUFDO0lBRTdELFFBQVE7UUFDTixJQUFJLENBQUMsUUFBUSxHQUFHLENBQUMsQ0FBQyxDQUFDLG9DQUFvQztJQUN6RCxDQUFDO0lBRUQ7Ozs7T0FJRztJQUNILGNBQWMsQ0FBQyxJQUFTO1FBQ3RCLE9BQU8sSUFBSSxPQUFPLENBQU0sQ0FBQyxPQUFPLEVBQUUsTUFBTSxFQUFFLEVBQUU7WUFDMUMsTUFBTSxNQUFNLEdBQUcsSUFBSSxVQUFVLEVBQUUsQ0FBQztZQUNoQyxNQUFNLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxDQUFDO1lBRTNCLE1BQU0sQ0FBQyxPQUFPLEdBQUcsQ0FBQyxL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LElBQUksQ0FBQyxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsS0FBSyxJQUFJLENBQUMsQ0FBQyxDQUFDLEdBQUcsR0FBRyxDQUNqRCxDQUFDO2FBQ0g7aUJBQU0sSUFBSSxLQUFLLFlBQVksWUFBWSxFQUFFO2dCQUN4QyxJQUFJLENBQUMsUUFBUSxHQUFHLENBQUMsQ0FBQzthQUNuQjtRQUNILENBQUMsQ0FBQyxDQUFDO0lBQ1AsQ0FBQzs7NEhBcEdVLDhCQUE4QjtnSEFBOUIsOEJBQThCLDZLQ1YzQyxta0dBa0ZBOzRGRHhFYSw4QkFBOEI7a0JBTDFDLFNBQVM7K0JBQ0UsOEJBQThCO21IQUsvQixZQUFZO3NCQUFwQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0ksUUFBUTtzQkFBakIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEh0dHBDbGllbnQsIEh0dHBFdmVudFR5cGUsIEh0dHBSZXNwb25zZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbi9odHRwJztcclxuaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBNdWx0aWZpbGVkZWZhdWx0Q29uZmlnIH0gZnJvbSAnLi4vaW50ZXJmYWNlcy9tdWx0aUZpbGVVcGxvYWREZWZhdWx0JztcclxuaW1wb3J0IHsgUnVjbGliTXVsdGlGaWxlVXBsb2FkU2VydmljZSB9IGZyb20gJy4uL3NlcnZpY2VzL3J1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZC5zZXJ2aWNlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAndXhwLXJ1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3J1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZC5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vcnVjbGliLW11bHRpLWZpbGUtdXBsb2FkLmNvbXBvbmVudC5zY3NzJ10sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBSdWNsaWJNdWx0aUZpbGVVcGxvYWRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIHJ1Y0lucHV0RGF0YSE6IE11bHRpZmlsZWRlZmF1bHRDb25maWc7IC8vIElucHV0IEpzb25cclxuICBASW5wdXQoKSBjdXN0b21UaGVtZSE6IHN0cmluZztcclxuICBAT3V0cHV0KCkgcnVjRXZlbnQgPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcclxuXHJcbiAgaW5kZXg6IGFueTtcclxuICByZXN1bHQhOiBzdHJpbmc7IC8vdXNlZCBmb3IgdXJsIHB1cnBvc2VcclxuICBzZWxlY3RlZEZpbGVEYXRhOiBhbnlbXSA9IFtdO1xyXG4gIHByb2dyZXNzITogbnVtYmVyOyAvL2luaXRpYWwgdmFsdWUgZm9yIHRoZSBwcm9ncmVzcyBiYXJcclxuICBmaWxlczogQXJyYXk8eyBuYW1lOiBzdHJpbmc7IHVybDogc3RyaW5nIH0+ID0gW107XHJcbiAgdXBsb2FkVXJsITogc3RyaW5nO1xyXG5cclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHNlcnZpY2U6IFJ1Y2xpYk11bHRpRmlsZVVwbG9hZFNlcnZpY2UpIHt9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gICAgdGhpcy5wcm9ncmVzcyA9IDA7IC8vaW5pdGlhbCB2YWx1ZSBmb3IgdGhlIHByb2dyZXNzIGJhclxyXG4gIH1cclxuXHJcbiAgLyoqXHJcbiAgICogVG8gZ2V0IHRoZSB1cmxcclxuICAgKiBvZiB0aGUgdGh1bWJuYWlsXHJcbiAgICogZm9yIHBuZyBmaWxlIHR5cGVcclxuICAgKi9cclxuICBnZXRVcmxGcm9tRmlsZShmaWxlOiBhbnkpOiBQcm9taXNlPGFueT4ge1xyXG4gICAgcmV0dXJuIG5ldyBQcm9taXNlPGFueT4oKHJlc29sdmUsIHJlamVjdCkgPT4ge1xyXG4gICAgICBjb25zdCByZWFkZXIgPSBuZXcgRmlsZVJlYWRlcigpO1xyXG4gICAgICByZWFkZXIucmVhZEFzRGF0YVVSTChmaWxlKTtcclxuXHJcbiAgICAgIHJlYWRlci5vbmVycm9yID0gKGVycm9yKSA9PiB7XHJcbiAgICAgICAgcmVqZWN0KGVycm9yKTtcclxuICAgICAgfTtcclxuXHJcbiAgICAgIHJlYWRlci5vbmxvYWRlbmQgPSAoKSA9PiB7XHJcbiAgICAgICAgdHJ5IHtcclxuICAgICAgICAgIGZpbGVbJ3VybCddID0gcmVhZGVyLnJlc3VsdDtcclxuICAgICAgICAgIHJlc29sdmUoZmlsZSk7XHJcbiAgICAgICAgfSBjYXRjaCAoZXJyKSB7XHJcbiAgICAgICAgICByZWplY3QoZXJyKTtcclxuICAgICAgICB9XHJcbiAgICAgIH07XHJcbiAgICB9KTtcclxuICB9XHJcblxyXG4gIC8qKlxyXG4gICAqIFRvIGNob29zZSB0aGUgZmlsZVxyXG4gICAqIGFuZCBnZXQgdGhlIHRodW1ibmFpbFxyXG4gICAqL1xyXG4gIGFzeW5jIGNob29zZUZpbGUoZXZlbnQ6IGFueSkge1xyXG4gICAgY29uc3QgZmlsZVByb21pc2VzID0gQXJyYXkuZnJvbShldmVudC50YXJnZXQuZmlsZXMpLm1hcCgoZmlsZTogYW55KSA9PiB7XHJcbiAgICAgIGNvbnN0IHNlbGVjdGVkRmlsZSA9IGZpbGU7XHJcbiAgICAgIHNlbGVjdGVkRmlsZVsnZGlzYWJsZVVwbG9hZEZpbGUnXSA9IGZhbHNlO1xyXG5cclxuICAgICAgaWYgKHNlbGVjdGVkRmlsZS50eXBlICE9PSAnaW1hZ2UvcG5nJykge1xyXG4gICAgICAgIHJldHVybiBzZWxlY3RlZEZpbGU7XHJcbiAgICAgIH1cclxuXHJcbiAgICAgIHJldHVybiB0aGlzLmdldFVybEZyb21GaWxlKHNlbGVjdGVkRmlsZSk7XHJcbiAgICB9KTtcclxuICAgIGNvbnN0IGZpbGVJbmZvcyA9IGF3YWl0IFByb21pc2UuYWxsKGZpbGVQcm9taXNlcyk7XHJcbiAgICBpZiAoZmlsZUluZm9zWzBdKSB7XHJcbiAgICAgIHRoaXMuc2VsZWN0ZWRGaWxlRGF0YS5wdXNoKGZpbGVJbmZvc1swXSk7XHJcbiAgICB9XHJcbiAgICB0aGlzLnJ1Y0V2ZW50LmVtaXQoe1xyXG4gICAgICBldmVudE5hbWU6ICdvbkZpbGVTZWxlY3Rpb24nLFxyXG4gICAgICBldmVudE91dHB1dDogZmlsZUluZm9zLFxyXG4gICAgfSk7XHJcbiAgfVxyXG5cclxuICAvKipcclxuICAgKiBUbyBkZWxldGUgdGhlIHNlbGVjdGVkIGZpbGVcclxuICAgKi9cclxuICByZW1vdmVTZWxlY3RlZEZpbGUoaW5kZXg6IG51bWJlciwgc2VsZWN0ZWQ6IGFueSkge1xyXG4gICAgaWYgKHRoaXMucnVjSW5wdXREYXRhLmRlbGV0ZVVybCkge1xyXG4gICAgICB0aGlzLnNlcnZpY2UuZGVsZXRlRmlsZShpbmRleCwgdGhpcy5ydWNJbnB1dERhdGEuZGVsZXRlVXJsKS5zdWJzY3JpYmUoKTtcclxuICAgICAgdGhpcy5zZWxlY3RlZEZpbGVEYXRhLnNwbGljZShpbmRleCwgMSk7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICB0aGlzLnNlbGVjdGVkRmlsZURhdGEuc3BsaWNlKGluZGV4LCAxKTtcclxuICAgIH1cclxuICAgIHRoaXMucnVjRXZlbnQuZW1pdCh7IGV2ZW50TmFtZTogJ29uRGVsZXRpbmcnLCBldmVudE91dHB1dDogc2VsZWN0ZWQgfSk7XHJcbiAgfVxyXG5cclxuICAvKipcclxuICAgKiBUbyB1cGxvYWQgdGhlIGZpbGVcclxuICAgKiBhbmQgc2VlIHByb2dyZXNzIGJhclxyXG4gICAqL1xyXG4gIHVwbG9hZFNlbGVjdGVkRmlsZShmaWxlT25lOiBhbnkpIHtcclxuICAgIHRoaXMucnVjRXZlbnQuZW1pdCh7IGV2ZW50TmFtZTogJ29uVXBsb2FkaW5nJywgZXZlbnRPdXRwdXQ6IGZpbGVPbmUgfSk7XHJcbiAgICBmaWxlT25lWydkaXNhYmxlVXBsb2FkRmlsZSddID0gdHJ1ZTtcclxuICAgIGNvbnN0IGZvcm1EYXRhID0gbmV3IEZvcm1EYXRhKCk7XHJcbiAgICB0aGlzLnNlcnZpY2VcclxuICAgICAgLnVwbG9hZEZpbGUoZm9ybURhdGEsIHRoaXMucnVjSW5wdXREYXRhLnVwbG9hZFVybClcclxuICAgICAgLnN1YnNjcmliZSgoZXZlbnQpID0+IHtcclxuICAgICAgICBpZiAoZXZlbnQudHlwZSA9PT0gSHR0cEV2ZW50VHlwZS5VcGxvYWRQcm9ncmVzcykge1xyXG4gICAgICAgICAgdGhpcy5wcm9ncmVzcyA9IE1hdGgucm91bmQoXHJcbiAgICAgICAgICAgICgoZXZlbnQubG9hZGVkIHx8IDEpIC8gKGV2ZW50LnRvdGFsIHx8IDEpKSAqIDEwMFxyXG4gICAgICAgICAgKTtcclxuICAgICAgICB9IGVsc2UgaWYgKGV2ZW50IGluc3RhbmNlb2YgSHR0cFJlc3BvbnNlKSB7XHJcbiAgICAgICAgICB0aGlzLnByb2dyZXNzID0gMDtcclxuICAgICAgICB9XHJcbiAgICAgIH0pO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwie3sgY3VzdG9tVGhlbWUgfX1cIj5cclxuICA8ZGl2IGNsYXNzPVwiY29sb3JjdXN0b21vdmVycmlkZVwiPlxyXG4gICAgPG1hdC1jYXJkIGNsYXNzPVwiY29udGFpbmVyXCIgKm5nSWY9XCJydWNJbnB1dERhdGFcIj5cclxuICAgICAgPCEtLUxhYmVsIEZvciBTZWxlY3RpbmcgRmlsZSBTdGFydHMtLT5cclxuICAgICAgPG1hdC1jYXJkLXRpdGxlPlxyXG4gICAgICAgIDxkaXY+XHJcbiAgICAgICAgICA8bWF0LWNhcmQgY2xhc3M9XCJtYXRDYXJkXCI+XHJcbiAgICAgICAgICAgIDxpbnB1dFxyXG4gICAgICAgICAgICAgICNhdHRhY2htZW50c1xyXG4gICAgICAgICAgICAgIHR5cGU9XCJmaWxlXCJcclxuICAgICAgICAgICAgICAoY2hhbmdlKT1cImNob29zZUZpbGUoJGV2ZW50KVwiXHJcbiAgICAgICAgICAgICAgI2ZpbGVJbnB1dFxyXG4gICAgICAgICAgICAgIFttdWx0aXBsZV09XCJydWNJbnB1dERhdGEubXVsdGlmaWxlU2VsZWN0aW9uXCJcclxuICAgICAgICAgICAgICBuYW1lPVwiZmlsZXNcIlxyXG4gICAgICAgICAgICAgIGlkPVwiaW1nXCJcclxuICAgICAgICAgICAgICBjbGFzcz1cImlzRGlzcGxheVwiXHJcbiAgICAgICAgICAgIC8+XHJcbiAgICAgICAgICAgIDxsYWJlbCBmb3I9XCJpbWdcIiBjbGFzcz1cImNvbnRhaW5lcmxhYmVsXCJcclxuICAgICAgICAgICAgICA+e3sgcnVjSW5wdXREYXRhLmxhYmVsIH19XHJcbiAgICAgICAgICAgICAgPG1hdC1pY29uIGNsYXNzPVwiYXR0YWNoZmlsZVwiPmF0dGFjaF9maWxlPC9tYXQtaWNvbj48L2xhYmVsXHJcbiAgICAgICAgICAgID5cclxuICAgICAgICAgIDwvbWF0LWNhcmQ+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgIDwvbWF0LWNhcmQtdGl0bGU+XHJcbiAgICAgIDwhLS1MYWJlbCBGb3IgU2VsZWN0aW5nIEZpbGUgU3RhcnRzLS0+XHJcbiAgICAgIDxtYXQtY2FyZC1jb250ZW50IGNsYXNzPVwibWFyQ2FyZFRhYmxlXCI+XHJcbiAgICAgICAgPGRpdlxyXG4gICAgICAgICAgKm5nRm9yPVwibGV0IHNlbGVjdGVkIG9mIHNlbGVjdGVkRmlsZURhdGE7IGxldCBpbmRleCA9IGluZGV4XCJcclxuICAgICAgICAgIGNsYXNzPVwicm93XCJcclxuICAgICAgICAgIGNsYXNzPVwic2VsZWN0ZWRGaWxlTGlzdFwiXHJcbiAgICAgICAgPlxyXG4gICAgICAgICAgPCEtLVRodW1ibmFpbCBwcmV2aWV3aW5nIG9mIEltYWdlIFN0YXJ0cy0tPlxyXG4gICAgICAgICAgPGRpdlxyXG4gICAgICAgICAgICAqbmdJZj1cInNlbGVjdGVkLnR5cGUgPT09ICdpbWFnZS9wbmcnXCJcclxuICAgICAgICAgICAgW25nQ2xhc3NdPVwicnVjSW5wdXREYXRhLmRpc3BsYXlUaHVtYm5haWwgPyAnJyA6ICdpc0Rpc3BsYXknXCJcclxuICAgICAgICAgID5cclxuICAgICAgICAgICAgPGltZyBbc3JjXT1cInNlbGVjdGVkLnVybFwiIHdpZHRoPVwiNTBweFwiIC8+XHJcbiAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgIDwhLS1UaHVtYm5haWwgcHJldmlld2luZyBvZiBJbWFnZSBFbmRzLS0+XHJcbiAgICAgICAgICA8IS0tTmFtZSBvZiBTZWxlY3RlZCBGaWxlIFN0YXJ0cy0tPlxyXG4gICAgICAgICAgPG1hdC1sYWJlbCBjbGFzcz1cInNlbGVjdGVkRmlsZU5hbWVcIj57eyBzZWxlY3RlZC5uYW1lIH19PC9tYXQtbGFiZWw+XHJcbiAgICAgICAgICA8IS0tTmFtZSBvZiBTZWxlY3RlZCBGaWxlIEVuZHMtLT5cclxuICAgICAgICAgIDwhLS1CdXR0b24gU3RhcnRzLS0+XHJcbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiZmxvYXRSaWdodFwiPlxyXG4gICAgICAgICAgICA8bWF0LWljb25cclxuICAgICAgICAgICAgICAoY2xpY2spPVwicmVtb3ZlU2VsZWN0ZWRGaWxlKGluZGV4LCBzZWxlY3RlZClcIlxyXG4gICAgICAgICAgICAgIGNsYXNzPVwiZGVsZXRlYnV0dG9uXCJcclxuICAgICAgICAgICAgICBjb2xvcj1cIndhcm5cIlxyXG4gICAgICAgICAgICAgID5kZWxldGVfb3V0bGluZTwvbWF0LWljb25cclxuICAgICAgICAgICAgPlxyXG4gICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiZmxvYXRSaWdodFN1Ym1pdFwiPlxyXG4gICAgICAgICAgICA8YnV0dG9uXHJcbiAgICAgICAgICAgICAgbWF0LXJhaXNlZC1idXR0b25cclxuICAgICAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxyXG4gICAgICAgICAgICAgIGNsYXNzPVwidXBsb2FkQnV0dG9uXCJcclxuICAgICAgICAgICAgICB0eXBlPVwic3VibWl0XCJcclxuICAgICAgICAgICAgICAoY2xpY2spPVwidXBsb2FkU2VsZWN0ZWRGaWxlKHNlbGVjdGVkKVwiXHJcbiAgICAgICAgICAgICAgW2Rpc2FibGVkXT1cInNlbGVjdGVkLmRpc2FibGVVcGxvYWRGaWxlXCJcclxuICAgICAgICAgICAgPlxyXG4gICAgICAgICAgICAgIFN1Ym1pdFxyXG4gICAgICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgPCEtLUJ1dHRvbiBFbmRzLS0+XHJcbiAgICAgICAgICA8IS0tUHJvZ3Jlc3MgQmFyIHdpdGggTGFiZWwgU3RhcnRzLS0+XHJcbiAgICAgICAgICA8ZGl2ICpuZ0lmPVwic2VsZWN0ZWQuZGlzYWJsZVVwbG9hZEZpbGVcIiBjbGFzcz1cInByb2dyZXNzYmFyXCI+XHJcbiAgICAgICAgICAgIDxtYXQtbGFiZWwgY2xhc3M9XCJmaWxlU2l6ZVwiXHJcbiAgICAgICAgICAgICAgPnt7IChzZWxlY3RlZC5zaXplIC8gMTAwMCkudG9GaXhlZCgyKSB9fSBLQjwvbWF0LWxhYmVsXHJcbiAgICAgICAgICAgID5cclxuICAgICAgICAgICAgPG1hdC1sYWJlbCBjbGFzcz1cImZpbGVQZXJjZW50YWdlXCI+IHt7IHByb2dyZXNzIH19JSA8L21hdC1sYWJlbD5cclxuICAgICAgICAgICAgPG1hdC1wcm9ncmVzcy1iYXJcclxuICAgICAgICAgICAgICBtb2RlPVwiZGV0ZXJtaW5hdGVcIlxyXG4gICAgICAgICAgICAgIFt2YWx1ZV09XCJwcm9ncmVzc1wiXHJcbiAgICAgICAgICAgICAgY2xhc3M9XCJkaXNwbGF5SW5saW5lXCJcclxuICAgICAgICAgICAgPjwvbWF0LXByb2dyZXNzLWJhcj5cclxuICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgPCEtLVByb2dyZXNzIEJhciB3aXRoIExhYmVsIEVuZHMtLT5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgPC9tYXQtY2FyZC1jb250ZW50PlxyXG4gICAgPC9tYXQtY2FyZD5cclxuICA8L2Rpdj5cclxuPC9kaXY+XHJcbiJdfQ==

package/esm2020/lib/ruclib-multi-file-upload.module.mjs

@@ -0,0 +1,48 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RuclibMultiFileUploadComponent } from './ruclib-multi-file-upload/ruclib-multi-file-upload.component';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+import { MatCardModule } from '@angular/material/card';
+import { MatIconModule } from '@angular/material/icon';
+import { MatButtonModule } from '@angular/material/button';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { HttpClientModule } from '@angular/common/http';
+import { RuclibMultiFileUploadService } from './services/ruclib-multi-file-upload.service';
+import * as i0 from "@angular/core";
+export 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],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicnVjbGliLW11bHRpLWZpbGUtdXBsb2FkLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9saWIvcnVjbGliLW11bHRpLWZpbGUtdXBsb2FkLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsOEJBQThCLEVBQUUsTUFBTSwrREFBK0QsQ0FBQztBQUMvRyxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUN0RSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDdkQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUNsRSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUN4RCxPQUFPLEVBQUUsNEJBQTRCLEVBQUUsTUFBTSw2Q0FBNkMsQ0FBQzs7QUFtQjNGLE1BQU0sT0FBTywyQkFBMkI7O3lIQUEzQiwyQkFBMkI7MEhBQTNCLDJCQUEyQixpQkFOcEMsOEJBQThCLGFBVDlCLFlBQVk7UUFDWixnQkFBZ0I7UUFDaEIsb0JBQW9CO1FBQ3BCLGFBQWE7UUFDYixhQUFhO1FBQ2IsZUFBZTtRQUNmLGtCQUFrQixhQU9WLDhCQUE4QjswSEFFN0IsMkJBQTJCLGFBSjNCLENBQUMsNEJBQTRCLENBQUMsWUFYdkMsWUFBWTtRQUNaLGdCQUFnQjtRQUNoQixvQkFBb0I7UUFDcEIsYUFBYTtRQUNiLGFBQWE7UUFDYixlQUFlO1FBQ2Ysa0JBQWtCOzRGQVNULDJCQUEyQjtrQkFqQnZDLFFBQVE7bUJBQUM7b0JBQ1IsT0FBTyxFQUFFO3dCQUNQLFlBQVk7d0JBQ1osZ0JBQWdCO3dCQUNoQixvQkFBb0I7d0JBQ3BCLGFBQWE7d0JBQ2IsYUFBYTt3QkFDYixlQUFlO3dCQUNmLGtCQUFrQjtxQkFDbkI7b0JBQ0QsWUFBWSxFQUFFO3dCQUNaLDhCQUE4QjtxQkFDL0I7b0JBQ0QsU0FBUyxFQUFFLENBQUMsNEJBQTRCLENBQUM7b0JBRXpDLE9BQU8sRUFBRSxDQUFDLDhCQUE4QixDQUFDO2lCQUMxQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IFJ1Y2xpYk11bHRpRmlsZVVwbG9hZENvbXBvbmVudCB9IGZyb20gJy4vcnVjbGliLW11bHRpLWZpbGUtdXBsb2FkL3J1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBNYXRQcm9ncmVzc0Jhck1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL3Byb2dyZXNzLWJhcic7XHJcbmltcG9ydCB7IE1hdENhcmRNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9jYXJkJztcclxuaW1wb3J0IHsgTWF0SWNvbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2ljb24nO1xyXG5pbXBvcnQgeyBNYXRCdXR0b25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9idXR0b24nO1xyXG5pbXBvcnQgeyBNYXRGb3JtRmllbGRNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9mb3JtLWZpZWxkJztcclxuaW1wb3J0IHsgSHR0cENsaWVudE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbi9odHRwJztcclxuaW1wb3J0IHsgUnVjbGliTXVsdGlGaWxlVXBsb2FkU2VydmljZSB9IGZyb20gJy4vc2VydmljZXMvcnVjbGliLW11bHRpLWZpbGUtdXBsb2FkLnNlcnZpY2UnO1xyXG5cclxuQE5nTW9kdWxlKHtcclxuICBpbXBvcnRzOiBbXHJcbiAgICBDb21tb25Nb2R1bGUsXHJcbiAgICBIdHRwQ2xpZW50TW9kdWxlLFxyXG4gICAgTWF0UHJvZ3Jlc3NCYXJNb2R1bGUsXHJcbiAgICBNYXRDYXJkTW9kdWxlLFxyXG4gICAgTWF0SWNvbk1vZHVsZSxcclxuICAgIE1hdEJ1dHRvbk1vZHVsZSxcclxuICAgIE1hdEZvcm1GaWVsZE1vZHVsZVxyXG4gIF0sXHJcbiAgZGVjbGFyYXRpb25zOiBbXHJcbiAgICBSdWNsaWJNdWx0aUZpbGVVcGxvYWRDb21wb25lbnRcclxuICBdLFxyXG4gIHByb3ZpZGVyczogW1J1Y2xpYk11bHRpRmlsZVVwbG9hZFNlcnZpY2VdLFxyXG5cclxuICBleHBvcnRzOiBbUnVjbGliTXVsdGlGaWxlVXBsb2FkQ29tcG9uZW50XSxcclxufSlcclxuZXhwb3J0IGNsYXNzIFJ1Y2xpYk11bHRpRmlsZVVwbG9hZE1vZHVsZSB7IH1cclxuIl19

package/esm2020/lib/services/ruclib-multi-file-upload.service.mjs

@@ -0,0 +1,24 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common/http";
+export 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 }]; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicnVjbGliLW11bHRpLWZpbGUtdXBsb2FkLnNlcnZpY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvbGliL3NlcnZpY2VzL3J1Y2xpYi1tdWx0aS1maWxlLXVwbG9hZC5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNsRCxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFHM0MsTUFBTSxPQUFPLDRCQUE0QjtJQUd2QyxZQUFvQixJQUFnQjtRQUFoQixTQUFJLEdBQUosSUFBSSxDQUFZO0lBQUcsQ0FBQztJQUV4QyxVQUFVLENBQUMsUUFBYSxFQUFFLEdBQVc7UUFDbkMsT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsUUFBUSxFQUFFO1lBQ25DLGNBQWMsRUFBRSxJQUFJO1lBQ3BCLE9BQU8sRUFBRSxRQUFRO1NBQ2xCLENBQUMsQ0FBQztJQUNMLENBQUM7SUFDRCxVQUFVLENBQUMsRUFBVSxFQUFFLFNBQWlCO1FBQ3RDLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsU0FBUyxHQUFHLEdBQUcsR0FBRyxFQUFFLENBQUMsQ0FBQztJQUNoRCxDQUFDOzswSEFiVSw0QkFBNEI7OEhBQTVCLDRCQUE0Qjs0RkFBNUIsNEJBQTRCO2tCQUR4QyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSHR0cENsaWVudCB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbi9odHRwJztcclxuaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuQEluamVjdGFibGUoKVxyXG5leHBvcnQgY2xhc3MgUnVjbGliTXVsdGlGaWxlVXBsb2FkU2VydmljZSB7XHJcbiAgcHJvZ3Jlc3M6IGFueTtcclxuXHJcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBodHRwOiBIdHRwQ2xpZW50KSB7fVxyXG5cclxuICB1cGxvYWRGaWxlKGZvcm1EYXRhOiBhbnksIGFwaTogc3RyaW5nKSB7XHJcbiAgICByZXR1cm4gdGhpcy5odHRwLnBvc3QoYXBpLCBmb3JtRGF0YSwge1xyXG4gICAgICByZXBvcnRQcm9ncmVzczogdHJ1ZSxcclxuICAgICAgb2JzZXJ2ZTogJ2V2ZW50cycsXHJcbiAgICB9KTtcclxuICB9XHJcbiAgZGVsZXRlRmlsZShpZDogbnVtYmVyLCBkZWxldGVBcGk6IHN0cmluZykge1xyXG4gICAgcmV0dXJuIHRoaXMuaHR0cC5kZWxldGUoZGVsZXRlQXBpICsgJy8nICsgaWQpO1xyXG4gIH1cclxufVxyXG4iXX0=

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

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicnVjLWxpYi1tdWx0aS1maWxlLXVwbG9hZC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9ydWMtbGliLW11bHRpLWZpbGUtdXBsb2FkLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxTQUFTLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vaW5kZXgnO1xuIl19

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

@@ -0,0 +1,184 @@
+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 { __awaiter } from 'tslib';
+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
+     */
+    chooseFile(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            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 = yield 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/fesm2015/ruc-lib-multi-file-upload.mjs.map

@@ -0,0 +1 @@
+{"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":"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"}

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

@@ -0,0 +1,181 @@
+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

@@ -0,0 +1 @@
+{"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":"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"}

package/index.d.ts

@@ -0,0 +1,3 @@
+export * from './lib/ruclib-multi-file-upload.module';
+export * from './lib/ruclib-multi-file-upload/ruclib-multi-file-upload.component';
+export * from './lib/services/ruclib-multi-file-upload.service';

package/lib/interfaces/multiFileUploadDefault.d.ts

@@ -0,0 +1,27 @@
+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

@@ -0,0 +1,43 @@
+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

@@ -0,0 +1,14 @@
+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

@@ -0,0 +1,11 @@
+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>;
+}

package/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "@ruc-lib/multi-file-upload",
+  "version": "2.0.1",
+  "peerDependencies": {
+    "@angular/common": "~15.2.0 || ^14.0.0 || ^13.0.0",
+    "@angular/core": "~15.2.0 || ^14.0.0 || ^13.0.0",
+    "@angular/material": "^15.2.9 || ^14.0.0 || ^13.0.0",
+    "@angular/forms": "~15.2.0",
+    "rxjs": "~7.8.0",
+    "@angular/platform-browser": "~15.2.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "sideEffects": false,
+  "module": "fesm2015/ruc-lib-multi-file-upload.mjs",
+  "es2020": "fesm2020/ruc-lib-multi-file-upload.mjs",
+  "esm2020": "esm2020/ruc-lib-multi-file-upload.mjs",
+  "fesm2020": "fesm2020/ruc-lib-multi-file-upload.mjs",
+  "fesm2015": "fesm2015/ruc-lib-multi-file-upload.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2020": "./esm2020/ruc-lib-multi-file-upload.mjs",
+      "es2020": "./fesm2020/ruc-lib-multi-file-upload.mjs",
+      "es2015": "./fesm2015/ruc-lib-multi-file-upload.mjs",
+      "node": "./fesm2015/ruc-lib-multi-file-upload.mjs",
+      "default": "./fesm2020/ruc-lib-multi-file-upload.mjs"
+    }
+  }
+}