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

package/README.md

@@ -1,186 +1,7 @@
 # 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.
+This library was generated with [Nx](https://nx.dev).
 
-# 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.
+## Running unit tests
 
-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!
-
-# ruclib-multi-file-upload
-
-A powerful and intuitive multi-file upload component for Angular applications. It allows users to select multiple files, view thumbnails for images, and manage uploads with features like individual submission, deletion, and progress tracking.
-
-## Installation Guide
-
-To use the Multi-File Upload component, you can install the entire RUC library or just this specific component.
-
-### Install the Entire Library
-```bash
-npm install @uxpractice/ruc-lib
-```
-
-### Install Individual Component
-If you only need the Multi-File Upload component:
-```bash
-npm install @ruc-lib/multi-file-upload
-```
-
-## Usage
-
-### 1. Import the Module
-In your Angular module file (e.g., `app.module.ts`), import the `RuclibMultiFileUploadModule`:
-
-```typescript
-import { RuclibMultiFileUploadModule } from '@ruc-lib/multi-file-upload';
-import { AppComponent } from './app.component';
-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { HttpClientModule } from '@angular/common/http';
-
-@NgModule({
-  declarations: [AppComponent],
-  imports: [
-    BrowserModule,
-    HttpClientModule,
-    RuclibMultiFileUploadModule
-  ],
-  providers: [],
-  bootstrap: [AppComponent]
-})
-export class AppModule {}
-```
-
-### 2. Use the Component
-In your component's template, use the `<uxp-ruclib-multi-file-upload>` selector and pass the configuration object to the `rucInputData` input.
-
-```html
-<uxp-ruclib-multi-file-upload 
-  [rucInputData]="inputObjectDataMultiFileUpload" 
-  [customTheme]="'custom-theme'"
-  (rucEvent)="handleEvent($event)">
-</uxp-ruclib-multi-file-upload>
-```
-
-## API Reference
-
-### Component Inputs
-
-| Input          | Type                     | Description                                      |
-|----------------|--------------------------|--------------------------------------------------|
-| `rucInputData` | `MultifiledefaultConfig` | The main configuration object for the component. |
-| `customTheme`  | `string`                 | An optional CSS class for custom theming.        |
-
-### Component Outputs
-
-| Output     | Type               | Description                                                                                      |
-|------------|--------------------|--------------------------------------------------------------------------------------------------|
-| `rucEvent` | `EventEmitter<any>` | Emits an event when a file is selected, uploaded, or deleted. The event object contains `eventName` and `eventOutput`. |
-
-### `MultifiledefaultConfig`
-This is the main configuration object for the multi-file-upload component.
-
-| Property           | Type      | Description                                                                                             |
-|--------------------|-----------|---------------------------------------------------------------------------------------------------------|
-| `multifileSelection` | `boolean` | If `true`, allows multiple files to be selected at once.                                                |
-| `displayThumbnail` | `boolean` | If `true`, displays a thumbnail preview for image files (PNG format).                                   |
-| `label`            | `string`  | The label for the file selection button.                                                                |
-| `uploadUrl`        | `string`  | The URL endpoint for uploading files.                                                                   |
-| `deleteUrl`        | `string`  | An optional URL endpoint for deleting files. If not provided, files are only removed from the list.     |
-
-## Example Configuration
-
-Here's an example of how to configure the Multi-File Upload component in your component's TypeScript file.
-
-```typescript
-import { Component } from '@angular/core';
-import { MultifiledefaultConfig } from '@ruc-lib/multi-file-upload';
-
-@Component({
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-})
-export class AppComponent {
-  
-  inputObjectDataMultiFileUpload: MultifiledefaultConfig = {
-    multifileSelection: true,
-    displayThumbnail: true,
-    label: 'Choose File',
-    uploadUrl: '/api/upload',
-    deleteUrl: '/api/delete',
-  };
-
-  handleEvent(event: any) {
-    console.log(event.eventName, event.eventOutput);
-  }
-}
-```
-
-## 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. If you have any feedback or suggestions, please let us know!
+Run `nx test ruclib-multi-file-upload` to execute the unit tests.

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

@@ -0,0 +1,152 @@
+import * as i0 from '@angular/core';
+import { Injectable, EventEmitter, inject, Output, Input, Component } from '@angular/core';
+import * as i1$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@angular/common/http';
+import { HttpEventType, HttpResponse } from '@angular/common/http';
+import * as i2 from '@angular/material/progress-bar';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+import * as i3 from '@angular/material/card';
+import { MatCardModule } from '@angular/material/card';
+import * as i4 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i5 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import * as i6 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);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: RuclibMultiFileUploadService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: RuclibMultiFileUploadService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: RuclibMultiFileUploadService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+
+class RuclibMultiFileUploadComponent {
+    constructor() {
+        this.rucEvent = new EventEmitter();
+        this.service = inject(RuclibMultiFileUploadService);
+        this.selectedFileData = [];
+        this.files = [];
+    }
+    // constructor(public service: RuclibMultiFileUploadService) {}
+    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;
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: RuclibMultiFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: RuclibMultiFileUploadComponent, isStandalone: true, selector: "uxp-ruclib-multi-file-upload", inputs: { rucInputData: "rucInputData", customTheme: "customTheme" }, outputs: { rucEvent: "rucEvent" }, providers: [RuclibMultiFileUploadService], ngImport: i0, template: "<p>ruclib-multi-file-upload works!</p>\r\n<div class=\"{{ customTheme }}\">\r\n  <div class=\"colorcustomoverride\">\r\n    @if (rucInputData) {\r\n      <mat-card class=\"container\">\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              @for (selected of selectedFileData; track selected; let index = $index) {\r\n                <div\r\n                  class=\"row\"\r\n                  class=\"selectedFileList\"\r\n                  >\r\n                  <!--Thumbnail previewing of Image Starts-->\r\n                  @if (selected.type === 'image/png') {\r\n                    <div\r\n                      [ngClass]=\"rucInputData.displayThumbnail ? '' : 'isDisplay'\"\r\n                      >\r\n                      <img [src]=\"selected.url\" width=\"50px\" />\r\n                    </div>\r\n                  }\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                    @if (selected.disableUploadFile) {\r\n                      <div 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                      }\r\n                      <!--Progress Bar with Label Ends-->\r\n                    </div>\r\n                  }\r\n                </mat-card-content>\r\n              </mat-card>\r\n            }\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: RuclibMultiFileUploadComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'uxp-ruclib-multi-file-upload', imports: [
+                        CommonModule,
+                        MatProgressBarModule,
+                        MatCardModule,
+                        MatIconModule,
+                        MatButtonModule,
+                        MatFormFieldModule,
+                    ], providers: [RuclibMultiFileUploadService], template: "<p>ruclib-multi-file-upload works!</p>\r\n<div class=\"{{ customTheme }}\">\r\n  <div class=\"colorcustomoverride\">\r\n    @if (rucInputData) {\r\n      <mat-card class=\"container\">\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              @for (selected of selectedFileData; track selected; let index = $index) {\r\n                <div\r\n                  class=\"row\"\r\n                  class=\"selectedFileList\"\r\n                  >\r\n                  <!--Thumbnail previewing of Image Starts-->\r\n                  @if (selected.type === 'image/png') {\r\n                    <div\r\n                      [ngClass]=\"rucInputData.displayThumbnail ? '' : 'isDisplay'\"\r\n                      >\r\n                      <img [src]=\"selected.url\" width=\"50px\" />\r\n                    </div>\r\n                  }\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                    @if (selected.disableUploadFile) {\r\n                      <div 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                      }\r\n                      <!--Progress Bar with Label Ends-->\r\n                    </div>\r\n                  }\r\n                </mat-card-content>\r\n              </mat-card>\r\n            }\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"] }]
+        }], propDecorators: { rucInputData: [{
+                type: Input
+            }], customTheme: [{
+                type: Input
+            }], rucEvent: [{
+                type: Output
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { RuclibMultiFileUploadComponent, RuclibMultiFileUploadService };
+//# sourceMappingURL=ruc-lib-multi-file-upload.mjs.map

package/fesm2022/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/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 { Component, EventEmitter, inject, Input, Output } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { MultifiledefaultConfig } from '../interfaces/multiFileUploadDefault';\r\nimport { RuclibMultiFileUploadService } from '../services/ruclib-multi-file-upload.service';\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 { HttpEventType, HttpResponse } from '@angular/common/http';\r\n\r\n@Component({\r\n    selector: 'uxp-ruclib-multi-file-upload',\r\n    imports: [\r\n        CommonModule,\r\n        MatProgressBarModule,\r\n        MatCardModule,\r\n        MatIconModule,\r\n        MatButtonModule,\r\n        MatFormFieldModule,\r\n    ],\r\n    templateUrl: './ruclib-multi-file-upload.component.html',\r\n    styleUrl: './ruclib-multi-file-upload.component.scss',\r\n    providers: [RuclibMultiFileUploadService]\r\n})\r\nexport class RuclibMultiFileUploadComponent {\r\n  @Input() rucInputData!: MultifiledefaultConfig; // Input Json\r\n  @Input() customTheme!: string;\r\n  @Output() rucEvent = new EventEmitter<any>();\r\n  public service = inject(RuclibMultiFileUploadService);\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(public 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","<p>ruclib-multi-file-upload works!</p>\r\n<div class=\"{{ customTheme }}\">\r\n  <div class=\"colorcustomoverride\">\r\n    @if (rucInputData) {\r\n      <mat-card class=\"container\">\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              @for (selected of selectedFileData; track selected; let index = $index) {\r\n                <div\r\n                  class=\"row\"\r\n                  class=\"selectedFileList\"\r\n                  >\r\n                  <!--Thumbnail previewing of Image Starts-->\r\n                  @if (selected.type === 'image/png') {\r\n                    <div\r\n                      [ngClass]=\"rucInputData.displayThumbnail ? '' : 'isDisplay'\"\r\n                      >\r\n                      <img [src]=\"selected.url\" width=\"50px\" />\r\n                    </div>\r\n                  }\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                    @if (selected.disableUploadFile) {\r\n                      <div 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                      }\r\n                      <!--Progress Bar with Label Ends-->\r\n                    </div>\r\n                  }\r\n                </mat-card-content>\r\n              </mat-card>\r\n            }\r\n          </div>\r\n        </div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1"],"mappings":";;;;;;;;;;;;;;;;;MAIa,4BAA4B,CAAA;AAGvC,IAAA,WAAA,CAAoB,IAAgB,EAAA;QAAhB,IAAA,CAAA,IAAI,GAAJ,IAAI;IAAe;IAEvC,UAAU,CAAC,QAAa,EAAE,GAAW,EAAA;QACnC,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,QAAQ,EAAE;AACnC,YAAA,cAAc,EAAE,IAAI;AACpB,YAAA,OAAO,EAAE,QAAQ;AAClB,SAAA,CAAC;IACJ;IACA,UAAU,CAAC,EAAU,EAAE,SAAiB,EAAA;AACtC,QAAA,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,GAAG,GAAG,EAAE,CAAC;IAC/C;8GAbW,4BAA4B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;kHAA5B,4BAA4B,EAAA,CAAA,CAAA;;2FAA5B,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBADxC;;;MCsBY,8BAA8B,CAAA;AAd3C,IAAA,WAAA,GAAA;AAiBY,QAAA,IAAA,CAAA,QAAQ,GAAG,IAAI,YAAY,EAAO;AACrC,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAC,4BAA4B,CAAC;QAGrD,IAAA,CAAA,gBAAgB,GAAU,EAAE;QAE5B,IAAA,CAAA,KAAK,GAAyC,EAAE;AA4FjD,IAAA;;IAvFC,QAAQ,GAAA;AACN,QAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACpB;AAEA;;;;AAIG;AACH,IAAA,cAAc,CAAC,IAAS,EAAA;QACtB,OAAO,IAAI,OAAO,CAAM,CAAC,OAAO,EAAE,MAAM,KAAI;AAC1C,YAAA,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE;AAC/B,YAAA,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC;AAE1B,YAAA,MAAM,CAAC,OAAO,GAAG,CAAC,KAAK,KAAI;gBACzB,MAAM,CAAC,KAAK,CAAC;AACf,YAAA,CAAC;AAED,YAAA,MAAM,CAAC,SAAS,GAAG,MAAK;AACtB,gBAAA,IAAI;AACF,oBAAA,IAAI,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,MAAM;oBAC3B,OAAO,CAAC,IAAI,CAAC;gBACf;gBAAE,OAAO,GAAG,EAAE;oBACZ,MAAM,CAAC,GAAG,CAAC;gBACb;AACF,YAAA,CAAC;AACH,QAAA,CAAC,CAAC;IACJ;AAEA;;;AAGG;IACH,MAAM,UAAU,CAAC,KAAU,EAAA;AACzB,QAAA,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAS,KAAI;YACpE,MAAM,YAAY,GAAG,IAAI;AACzB,YAAA,YAAY,CAAC,mBAAmB,CAAC,GAAG,KAAK;AAEzC,YAAA,IAAI,YAAY,CAAC,IAAI,KAAK,WAAW,EAAE;AACrC,gBAAA,OAAO,YAAY;YACrB;AAEA,YAAA,OAAO,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC;AAC1C,QAAA,CAAC,CAAC;QACF,MAAM,SAAS,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC;AACjD,QAAA,IAAI,SAAS,CAAC,CAAC,CAAC,EAAE;YAChB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;QAC1C;AACA,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;AACjB,YAAA,SAAS,EAAE,iBAAiB;AAC5B,YAAA,WAAW,EAAE,SAAS;AACvB,SAAA,CAAC;IACJ;AAEA;;AAEG;IACH,kBAAkB,CAAC,KAAa,EAAE,QAAa,EAAA;AAC7C,QAAA,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE;AAC/B,YAAA,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,SAAS,EAAE;YACvE,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;QACxC;aAAO;YACL,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;QACxC;AACA,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,QAAQ,EAAE,CAAC;IACxE;AAEA;;;AAGG;AACH,IAAA,kBAAkB,CAAC,OAAY,EAAA;AAC7B,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC;AACtE,QAAA,OAAO,CAAC,mBAAmB,CAAC,GAAG,IAAI;AACnC,QAAA,MAAM,QAAQ,GAAG,IAAI,QAAQ,EAAE;AAC/B,QAAA,IAAI,CAAC;aACF,UAAU,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,SAAS;AAChD,aAAA,SAAS,CAAC,CAAC,KAAK,KAAI;YACnB,IAAI,KAAK,CAAC,IAAI,KAAK,aAAa,CAAC,cAAc,EAAE;gBAC/C,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CACxB,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,KAAK,KAAK,CAAC,KAAK,IAAI,CAAC,CAAC,IAAI,GAAG,CACjD;YACH;AAAO,iBAAA,IAAI,KAAK,YAAY,YAAY,EAAE;AACxC,gBAAA,IAAI,CAAC,QAAQ,GAAG,CAAC;YACnB;AACF,QAAA,CAAC,CAAC;IACN;8GApGW,8BAA8B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAA9B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,8BAA8B,oLAF5B,CAAC,4BAA4B,CAAC,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECvB7C,42HAyFA,EAAA,MAAA,EAAA,CAAA,6uCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,ED3EQ,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACZ,oBAAoB,wNACpB,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,kDAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACb,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACb,eAAe,mXACf,kBAAkB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FAMb,8BAA8B,EAAA,UAAA,EAAA,CAAA;kBAd1C,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,8BAA8B,EAAA,OAAA,EAC/B;wBACL,YAAY;wBACZ,oBAAoB;wBACpB,aAAa;wBACb,aAAa;wBACb,eAAe;wBACf,kBAAkB;qBACrB,EAAA,SAAA,EAGU,CAAC,4BAA4B,CAAC,EAAA,QAAA,EAAA,42HAAA,EAAA,MAAA,EAAA,CAAA,6uCAAA,CAAA,EAAA;;sBAG1C;;sBACA;;sBACA;;;AE5BH;;AAEG;;;;"}

package/index.d.ts

@@ -1,3 +1,84 @@
-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';
+import * as i0 from '@angular/core';
+import { EventEmitter } from '@angular/core';
+import * as rxjs from 'rxjs';
+import * as _angular_common_http from '@angular/common/http';
+import { HttpClient } from '@angular/common/http';
+
+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;
+}
+
+declare class RuclibMultiFileUploadService {
+    private http;
+    progress: any;
+    constructor(http: HttpClient);
+    uploadFile(formData: any, api: string): rxjs.Observable<_angular_common_http.HttpEvent<Object>>;
+    deleteFile(id: number, deleteApi: string): rxjs.Observable<Object>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RuclibMultiFileUploadService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<RuclibMultiFileUploadService>;
+}
+
+declare class RuclibMultiFileUploadComponent {
+    rucInputData: MultifiledefaultConfig;
+    customTheme: string;
+    rucEvent: EventEmitter<any>;
+    service: RuclibMultiFileUploadService;
+    index: any;
+    result: string;
+    selectedFileData: any[];
+    progress: number;
+    files: Array<{
+        name: string;
+        url: string;
+    }>;
+    uploadUrl: string;
+    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": { "alias": "rucInputData"; "required": false; }; "customTheme": { "alias": "customTheme"; "required": false; }; }, { "rucEvent": "rucEvent"; }, never, never, true, never>;
+}
+
+export { RuclibMultiFileUploadComponent, RuclibMultiFileUploadService };

package/package.json

@@ -1,28 +1,21 @@
 {
   "name": "@ruc-lib/multi-file-upload",
-  "version": "2.0.8",
-  "license": "MIT",
+  "version": "3.1.0",
   "peerDependencies": {
-    "@angular/core": ">=15.0.0 <18.0.0",
-    "@angular/common": ">=15.0.0 <18.0.0",
-    "@angular/material": "^15.2.9 || ^14.0.0 || ^13.0.0",
-    "@angular/forms": ">=15.0.0 <18.0.0",
-    "@angular/platform-browser": ">=15.0.0 <18.0.0",
-    "rxjs": ">=6.5.0 <8.0.0",
-    "zone.js": ">=0.11.4 <0.14.0"
+    "@angular/common": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/core": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/material": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/platform-browser": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/animations": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/forms": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "rxjs": ">=7.5.0 <8.0.0",
+    "zone.js": "^0.13.0 || ^0.14.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",
+  "module": "fesm2022/ruc-lib-multi-file-upload.mjs",
   "typings": "index.d.ts",
   "exports": {
     "./package.json": {
@@ -30,11 +23,7 @@
     },
     ".": {
       "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"
+      "default": "./fesm2022/ruc-lib-multi-file-upload.mjs"
     }
   }
 }

package/esm2020/index.mjs

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

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