@bnsights/bbsf-controls 1.0.144 → 1.0.145

package/fesm2022/bnsights-bbsf-controls.mjs

@@ -2101,7 +2101,7 @@ class FileUploadComponent {
         };
         FileUploadComponent.controlContainerstatic = this.controlContainer;
         this.uploader = new FileUploader({
-            disableMultipart: false, // 'DisableMultipart' must be 'true' for formatDataFunction to be called.
+            disableMultipart: false // 'DisableMultipart' must be 'true' for formatDataFunction to be called.
         });
         this.hasAnotherDropZoneOver = false;
     }
@@ -2121,8 +2121,7 @@ class FileUploadComponent {
         else {
             if (this.options.isMultipleFile == true) {
                 let files = [];
-                this.multipleFileUploadModel.existingFiles =
-                    this.options.value.existingFiles;
+                this.multipleFileUploadModel.existingFiles = this.options.value.existingFiles;
                 this.multipleFileUploadModel.uploadedFiles = [];
                 for (let index = 0; index < this.options.value.existingFiles.length; index++) {
                     const element = this.options.value.existingFiles[index];
@@ -2152,7 +2151,7 @@ class FileUploadComponent {
                 this.fileLikeObject = {
                     name: element.nameWithExtension,
                     type: element.mimeType,
-                    rawFile: base64,
+                    rawFile: base64
                 };
                 this.file = element;
                 let file = this.fileLikeObject;
@@ -2166,7 +2165,7 @@ class FileUploadComponent {
                     this.fileUploadModel = this.options.value;
                 this.options.value = this.fileUploadModel;
             }
-            this.uploader.queue.forEach(element => {
+            this.uploader.queue.forEach((element) => {
                 element.progress = 100;
             });
         }
@@ -2179,7 +2178,7 @@ class FileUploadComponent {
                 this.acceptedType = this.acceptedType + Type + ',';
             }
             this.acceptedTypeArray = this.acceptedType.split(',');
-            this.acceptedTypeArray = this.acceptedTypeArray.filter(value => value != "");
+            this.acceptedTypeArray = this.acceptedTypeArray.filter((value) => value != '');
             for (let index = 0; index < this.acceptedTypeArray.length; index++) {
                 const element = this.acceptedTypeArray[index];
                 for (let index = 0; index < this.acceptedTypeArray.length; index++) {
@@ -2213,63 +2212,63 @@ class FileUploadComponent {
                             if (!this.toolTipTypeArray.includes('PowerPoint'))
                                 this.toolTipTypeArray.push('PowerPoint');
                             break;
-                        case "image/png":
+                        case 'image/png':
                             if (!this.toolTipTypeArray.includes('PNG'))
                                 this.toolTipTypeArray.push('PNG');
                             break;
-                        case "image/bmp":
+                        case 'image/bmp':
                             if (!this.toolTipTypeArray.includes('BMP'))
                                 this.toolTipTypeArray.push('BMP');
                             break;
-                        case "image/jpeg":
+                        case 'image/jpeg':
                             if (!this.toolTipTypeArray.includes('JPEG'))
                                 this.toolTipTypeArray.push('JPEG');
                             break;
-                        case "application/zip":
+                        case 'application/zip':
                             if (!this.toolTipTypeArray.includes('ZIP'))
                                 this.toolTipTypeArray.push('ZIP');
                             break;
-                        case "application/x-rar-compressed":
+                        case 'application/x-rar-compressed':
                             if (!this.toolTipTypeArray.includes('RAR'))
                                 this.toolTipTypeArray.push('RAR');
                             break;
-                        case "video/mp4":
+                        case 'video/mp4':
                             if (!this.toolTipTypeArray.includes('MP4'))
                                 this.toolTipTypeArray.push('MP4');
                             break;
-                        case "video/avi":
+                        case 'video/avi':
                             if (!this.toolTipTypeArray.includes('AVI'))
                                 this.toolTipTypeArray.push('AVI');
                             break;
-                        case "video/quicktime":
+                        case 'video/quicktime':
                             if (!this.toolTipTypeArray.includes('MOV'))
                                 this.toolTipTypeArray.push('MOV');
                             break;
-                        case "video/mpeg":
+                        case 'video/mpeg':
                             if (!this.toolTipTypeArray.includes('MPEG'))
                                 this.toolTipTypeArray.push('MPEG');
                             break;
-                        case "audio/mpeg":
+                        case 'audio/mpeg':
                             if (!this.toolTipTypeArray.includes('MP3'))
                                 this.toolTipTypeArray.push('MP3');
                             break;
-                        case "video/x-flv":
+                        case 'video/x-flv':
                             if (!this.toolTipTypeArray.includes('FLV'))
                                 this.toolTipTypeArray.push('FLV');
                             break;
-                        case "video/x-ms-wmv":
+                        case 'video/x-ms-wmv':
                             if (!this.toolTipTypeArray.includes('WMV'))
                                 this.toolTipTypeArray.push('WMV');
                             break;
-                        case "image/svg+xml":
+                        case 'image/svg+xml':
                             if (!this.toolTipTypeArray.includes('SVG'))
                                 this.toolTipTypeArray.push('SVG');
                             break;
-                        case "text/plain":
+                        case 'text/plain':
                             if (!this.toolTipTypeArray.includes('Txt'))
                                 this.toolTipTypeArray.push('Txt');
                             break;
-                        case "application/BN":
+                        case 'application/BN':
                             if (!this.toolTipTypeArray.includes('License'))
                                 this.toolTipTypeArray.push('License');
                             break;
@@ -2290,7 +2289,7 @@ class FileUploadComponent {
         if (this.options.minNoOfFiles > 0) {
             this.validationMessage =
                 this.validationMessage +
-                    `<br /> ${this.UtilityService.getResourceValue("MinFileCountValidationKey") + this.options.minNoOfFiles}`;
+                    `<br /> ${this.UtilityService.getResourceValue('MinFileCountValidationKey') + this.options.minNoOfFiles}`;
         }
         if (this.options.fileUploadAcceptsTypes != null &&
             this.options.fileUploadAcceptsTypes.length > 0) {
@@ -2365,7 +2364,7 @@ class FileUploadComponent {
             this.options.minNoOfFiles > this.uploader.queue.length) {
             const formControl = this.fileUploadFormControl;
             formControl.setErrors({
-                MinFileCountValidationKey: this.options.minNoOfFiles,
+                MinFileCountValidationKey: this.options.minNoOfFiles
             });
             formControl.markAsTouched();
             this.uploader.queue = [];
@@ -2384,14 +2383,14 @@ class FileUploadComponent {
             if (AllSizeFile > MaxSizeForAllFiles) {
                 const formControl = this.fileUploadFormControl;
                 formControl.setErrors({
-                    MaxSizeForAllFilesInMB: this.options.maxSizeForAllFilesInMB + 'M',
+                    MaxSizeForAllFilesInMB: this.options.maxSizeForAllFilesInMB + 'M'
                 });
                 formControl.markAsTouched();
                 this.uploader.queue = [];
                 return;
             }
         }
-        let AddedQueue = this.uploader.queue.filter((object) => object['some'].lastModified != null);
+        let AddedQueue = this.uploader.queue.filter((obj) => obj['some'].lastModified != null);
         for (let index = 0; index < AddedQueue.length; index++) {
             const element = AddedQueue[index];
             const file = element.file;
@@ -2401,7 +2400,7 @@ class FileUploadComponent {
                 if (file.size > maxFileSize) {
                     const formControl = this.fileUploadFormControl;
                     formControl.setErrors({
-                        FileMaxSizeInMB: this.options.fileMaxSizeInMB + 'M',
+                        FileMaxSizeInMB: this.options.fileMaxSizeInMB + 'M'
                     });
                     formControl.markAsTouched();
                     this.uploader.queue = [];
@@ -2417,20 +2416,19 @@ class FileUploadComponent {
                     this.uploader.queue = [];
                     return;
                 }
-                if (this.options.isUploadFileAsync && !element._file["iD_GUID"]) {
-                    this.fileUploadService.uploadFile(element._file)
-                        .subscribe({
+                if (this.options.isUploadFileAsync && !element._file['iD_GUID']) {
+                    this.fileUploadService.uploadFile(element._file).subscribe({
                         next: (event) => {
-                            let queueIndex = this.uploader.queue.findIndex(file => file == element);
+                            let queueIndex = this.uploader.queue.findIndex((file) => file == element);
                             if (event.type === HttpEventType.UploadProgress) {
-                                let value = Math.round(100 * event.loaded / event.total);
+                                let value = Math.round((100 * event.loaded) / event.total);
                                 this.uploader.queue[queueIndex].progress = value >= 95 ? 95 : value;
                             }
                             else if (event.type === HttpEventType.Response) {
                                 this.uploader.queue[queueIndex].progress = 100;
                                 let fileID = event.body.val;
-                                this.uploader.queue[queueIndex]._file["iD_GUID"] = fileID;
-                                this.uploader.queue[queueIndex]._file["isNew"] = true;
+                                this.uploader.queue[queueIndex]._file['iD_GUID'] = fileID;
+                                this.uploader.queue[queueIndex]._file['isNew'] = true;
                                 let AddedFile = {
                                     iD_GUID: fileID,
                                     fileName: this.uploader.queue[queueIndex]._file['name'],
@@ -2453,11 +2451,10 @@ class FileUploadComponent {
                                             this.multipleFileUploadModel.removedFiles = [];
                                         }
                                     }
-                                    this.multipleFileUploadModel.correlationID_GUID = this.options.value?.correlationID_GUID;
+                                    this.multipleFileUploadModel.correlationID_GUID =
+                                        this.options.value?.correlationID_GUID;
                                     this.fileUploadFormControl.setValue(this.multipleFileUploadModel);
-                                    this.group
-                                        .get(this.options.name)
-                                        .setValue(this.multipleFileUploadModel);
+                                    this.group.get(this.options.name).setValue(this.multipleFileUploadModel);
                                     //Use this line to enable two way binding.
                                     this.options.value = this.multipleFileUploadModel;
                                     this.isUploadComplete.emit(true);
@@ -2473,10 +2470,7 @@ class FileUploadComponent {
                     reader.onload = () => {
                         let existingID_GUID = null;
                         if (!this.options.isMultipleFile && this.file)
-                            existingID_GUID =
-                                this.file.NameWithExtension == file.name
-                                    ? this.file.iD_GUID
-                                    : null;
+                            existingID_GUID = this.file.NameWithExtension == file.name ? this.file.iD_GUID : null;
                         let AddedFile = {
                             fileName: file.name,
                             fileType: file.type,
@@ -2502,11 +2496,10 @@ class FileUploadComponent {
                                     this.multipleFileUploadModel.removedFiles = [];
                                 }
                             }
-                            this.multipleFileUploadModel.correlationID_GUID = this.options.value?.correlationID_GUID;
+                            this.multipleFileUploadModel.correlationID_GUID =
+                                this.options.value?.correlationID_GUID;
                             this.fileUploadFormControl.setValue(this.multipleFileUploadModel);
-                            this.group
-                                .get(this.options.name)
-                                .setValue(this.multipleFileUploadModel);
+                            this.group.get(this.options.name).setValue(this.multipleFileUploadModel);
                             //Use this line to enable two way binding.
                             this.options.value = this.multipleFileUploadModel;
                         }
@@ -2523,9 +2516,8 @@ class FileUploadComponent {
         }
     }
     removeFromControlValue(item) {
-        if (this.options.isUploadFileAsync && item.progress == 100 && item._file["isNew"]) {
-            this.fileUploadService.deleteFile(item._file["iD_GUID"]).subscribe(res => {
-            });
+        if (this.options.isUploadFileAsync && item.progress == 100 && item._file['isNew']) {
+            this.fileUploadService.deleteFile(item._file['iD_GUID']).subscribe((res) => { });
         }
         if (this.options.isMultipleFile == false) {
             this.fileUploadModel = null;
@@ -2545,19 +2537,19 @@ class FileUploadComponent {
                 else {
                     if (this.multipleFileUploadModel.removedFiles.length == 0) {
                         let FileObject = item.file.rawFile;
-                        let DeletedItem = this.multipleFileUploadModel.existingFiles.filter((Object) => Object.nameWithExtension == FileObject.name)[0];
+                        let DeletedItem = this.multipleFileUploadModel.existingFiles.filter((obj) => obj.nameWithExtension == FileObject.name)[0];
                         this.multipleFileUploadModel.existingFiles =
-                            this.multipleFileUploadModel.existingFiles.filter((Object) => Object.nameWithExtension != FileObject.name);
+                            this.multipleFileUploadModel.existingFiles.filter((obj) => obj.nameWithExtension != FileObject.name);
                         this.deletedFiles.push(DeletedItem);
                         this.multipleFileUploadModel.removedFiles.push(DeletedItem.iD_GUID);
                     }
                     else {
                         let FileObject = item.file.rawFile;
-                        let deletedList = this.deletedFiles.filter((Object) => Object.nameWithExtension == FileObject.name);
+                        let deletedList = this.deletedFiles.filter((obj) => obj.nameWithExtension == FileObject.name);
                         if (deletedList.length == 0 || deletedList == undefined) {
-                            let DeletedItem = this.multipleFileUploadModel.existingFiles.filter((Object) => Object.nameWithExtension == FileObject.name)[0];
+                            let DeletedItem = this.multipleFileUploadModel.existingFiles.filter((obj) => obj.nameWithExtension == FileObject.name)[0];
                             this.multipleFileUploadModel.existingFiles =
-                                this.multipleFileUploadModel.existingFiles.filter((Object) => Object.nameWithExtension != FileObject.name);
+                                this.multipleFileUploadModel.existingFiles.filter((obj) => obj.nameWithExtension != FileObject.name);
                             this.deletedFiles.push(DeletedItem);
                             this.multipleFileUploadModel.removedFiles.push(DeletedItem.iD_GUID);
                         }
@@ -2569,13 +2561,14 @@ class FileUploadComponent {
                 this.multipleFileUploadModel.removedFiles = [];
             }
             this.multipleFileUploadModel.uploadedFiles =
-                this.multipleFileUploadModel.uploadedFiles.filter((Object) => (Object.nameWithExtension && Object.nameWithExtension != item._file.name) || (Object.iD_GUID != item._file["iD_GUID"]));
+                this.multipleFileUploadModel.uploadedFiles.filter((obj) => (obj.nameWithExtension && obj.nameWithExtension != item._file.name) ||
+                    obj.iD_GUID != item._file['iD_GUID']);
             if ((this.multipleFileUploadModel.uploadedFiles == null ||
                 this.multipleFileUploadModel.uploadedFiles.length == 0) &&
                 this.options.isRequired) {
                 const formControl = this.fileUploadFormControl;
                 formControl.setErrors({
-                    MinFileCountValidationKey: this.options.minNoOfFiles,
+                    MinFileCountValidationKey: this.options.minNoOfFiles
                 });
                 this.fileUploadFormControl.markAsTouched();
                 this.fileUploadFormControl.invalid;
@@ -2598,11 +2591,11 @@ class FileUploadComponent {
         return roundedMegabytes;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: FileUploadComponent, deps: [{ token: i2.ControlContainer, optional: true }, { token: i2.FormGroupDirective }, { token: ControlUtility }, { token: i3.UtilityService }, { token: i3.ControlValidationService }, { token: GlobalSettings }, { token: FileUploadService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", type: FileUploadComponent, selector: "BBSF-FileUplaod", inputs: { group: "group", options: "options" }, outputs: { OnChange: "OnChange", isUploadComplete: "isUploadComplete" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"form-group bbsf-control bbsf-file-upload\" [formGroup]=\"group\">\r\n  <div [ngClass]=\"options.viewType == 1 ? 'bbsf-vertical' : 'bbsf-horizontal'\">\r\n    <!--label-->\r\n    <label [hidden]=\"options.hideLabel\" class=\"bbsf-label {{ options.labelExtraClasses }}\">\r\n      {{ options.labelValue }}\r\n      <!--Asterisk-->\r\n      <span *ngIf=\"((options.showAsterisk && options.isRequired) || options.isRequired) && !options.isReadonly\" class=\"text-danger\">*</span>\r\n    </label>\r\n    <!--Allow dropZone-->\r\n    <div\r\n      ng2FileDrop\r\n      class=\"bbsf-input-container {{ options.extraClasses }}\"\r\n      *ngIf=\"options.isDropZone && !(options.isMultipleFile == false && uploader.queue.length > 0) && !options.isReadonly\"\r\n      [ngClass]=\"{ 'another-file-over-class': hasAnotherDropZoneOver }\"\r\n      (onFileDrop)=\"onFileChange()\"\r\n      (fileOver)=\"fileOverAnother($event)\"\r\n      [uploader]=\"uploader\"\r\n      [accept]=\"acceptedType\"\r\n      id=\"{{ options.name }}\"\r\n      multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n      aria-describedby=\"email-error\"\r\n      aria-invalid=\"true\"\r\n      type=\"file\"\r\n      #fileInput\r\n      [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\"\r\n      (click)=\"fileInputControl.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg validation-msg-header text-center\">\r\n            {{ UtilityService.getResourceValue(\"DragAndDropHere\") }}\r\n          </div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInputControl\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!--Not allowed dropZone-->\r\n    <div class=\"bbsf-input-container\" *ngIf=\"!options.isDropZone && !isHideInput() && !options.isReadonly\" (click)=\"fileInput.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg text-center\">{{ UtilityService.getResourceValue(\"Upload\") }}</div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInput\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!-- readonly -->\r\n    <div *ngIf=\"options.isReadonly && !options.value\">\r\n      <span class=\"readonly-view\">{{ UtilityService.getResourceValue(\"NA\") }}</span>\r\n    </div>\r\n  </div>\r\n  <!--items uploaded-->\r\n  <div class=\"uploaded-items\">\r\n    <div class=\"btn-group\" *ngFor=\"let item of uploader.queue\">\r\n      <ng-container *ngIf=\"item?.progress == 100 && options.isUploadFileAsync\">\r\n        <a *ngIf=\"item?.file?.rawFile['url']\" href=\"{{ item?.file?.rawFile['url'] }}\" class=\"btn-download-file btn-sm btn-progress-upload\" download>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <a *ngIf=\"item?.file?.rawFile['url'] == null\" class=\"btn-download-file btn-sm btn-progress-upload\">\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M9.33301 3.70584V3.26663C9.33301 2.65166 9.33301 2.34419 9.20587 2.1093C9.09405 1.9027 8.91555 1.73471 8.69604 1.62944C8.44647 1.50977 8.11977 1.50977 7.46638 1.50977H6.53305C5.87965 1.50977 5.55296 1.50977 5.30339 1.62944C5.08387 1.73471 4.90539 1.9027 4.79354 2.1093C4.66638 2.34419 4.66638 2.65166 4.66638 3.26663V3.70584\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M1.75 3.70605H12.25M11.0834 3.70605V9.8551C11.0834 10.7775 11.0834 11.2387 10.8926 11.591C10.7248 11.901 10.4571 12.1529 10.1278 12.3109C9.75345 12.4904 9.26345 12.4904 8.28334 12.4904H5.71666C4.73658 12.4904 4.24653 12.4904 3.87218 12.3109C3.5429 12.1529 3.27519 11.901 3.10741 11.591C2.91666 11.2387 2.91666 10.7775 2.91666 9.8551V3.70605\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n        </button>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"!options.isUploadFileAsync\">\r\n        <a href=\"{{ item?.file?.rawFile }}\" class=\"btn btn-download-file btn-sm\" download>\r\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n            <path\r\n              d=\"M21 22H3C2.4 22 2 21.6 2 21C2 20.4 2.4 20 3 20H21C21.6 20 22 20.4 22 21C22 21.6 21.6 22 21 22ZM13 13.4V3C13 2.4 12.6 2 12 2C11.4 2 11 2.4 11 3V13.4H13Z\"\r\n              fill=\"currentColor\"></path>\r\n            <path opacity=\"0.3\" d=\"M7 13.4H17L12.7 17.7C12.3 18.1 11.7 18.1 11.3 17.7L7 13.4Z\" fill=\"currentColor\"></path>\r\n          </svg>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm btn-danger\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <i class=\"fa fa-times px-0\"></i>\r\n        </button>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n  <!--progress bar file upload-->\r\n  <div *ngFor=\"let item of uploader.queue\">\r\n    <div class=\"upload-items\" [ngClass]=\"{ 'mt-4': options.isMultipleFile == true }\" *ngIf=\"item?.progress < 100 && options.isUploadFileAsync\">\r\n      <div class=\"upload-items-toolbar\">\r\n        <h4>{{ item?.file?.name }}</h4>\r\n        <span (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n            <g clip-path=\"url(#clip0_1324_13216)\">\r\n              <path\r\n                opacity=\"0.4\"\r\n                d=\"M9 16.5C13.1421 16.5 16.5 13.1421 16.5 9C16.5 4.85786 13.1421 1.5 9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 13.1421 4.85786 16.5 9 16.5Z\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n              <path\r\n                d=\"M11.25 6.75L6.75 11.25M6.75 6.75L11.25 11.25\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n            </g>\r\n            <defs>\r\n              <clipPath id=\"clip0_1324_13216\">\r\n                <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n              </clipPath>\r\n            </defs>\r\n          </svg>\r\n        </span>\r\n      </div>\r\n      <div class=\"progress\">\r\n        <div\r\n          class=\"progress-bar\"\r\n          role=\"progressbar\"\r\n          aria-valuenow=\"70\"\r\n          aria-valuemin=\"0\"\r\n          aria-valuemax=\"100\"\r\n          [class.file-uploaded]=\"item?.progress < 100\"\r\n          [style.width.%]=\"item?.progress\"\r\n          *ngIf=\"item?.progress > 0\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"subtext-container\" *ngIf=\"!options.isReadonly\">\r\n    <!-- required text-->\r\n    <div class=\"bbsf-validation\" *ngIf=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n      {{ getErrorValidation(fileUploadFormControl.errors | keyvalue) }}\r\n    </div>\r\n    <!-- LabelDescription-->\r\n    <div class=\"bbsf-control-desc\" *ngIf=\"options.labelDescription != null\">{{ options.labelDescription }}</div>\r\n    <div *ngIf=\"(group.valid && group.dirty && group.touched) || (group.untouched && group.invalid && group.dirty)\">\r\n      {{ resetError() }}\r\n    </div>\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7$2.FileDropDirective, selector: "[ng2FileDrop]", inputs: ["uploader"], outputs: ["fileOver", "onFileDrop"] }, { kind: "directive", type: i7$2.FileSelectDirective, selector: "[ng2FileSelect]", inputs: ["uploader"], outputs: ["onFileSelected"] }, { kind: "directive", type: i7.NativeElementInjectorDirective, selector: "[ngModel], [formControl], [formControlName]" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i5.KeyValuePipe, name: "keyvalue" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", type: FileUploadComponent, selector: "BBSF-FileUplaod", inputs: { group: "group", options: "options" }, outputs: { OnChange: "OnChange", isUploadComplete: "isUploadComplete" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"form-group bbsf-control bbsf-file-upload\" [formGroup]=\"group\">\r\n  <div [ngClass]=\"options.viewType == 1 ? 'bbsf-vertical' : 'bbsf-horizontal'\">\r\n    <!--label-->\r\n    <label [hidden]=\"options.hideLabel\" class=\"bbsf-label {{ options.labelExtraClasses }}\">\r\n      {{ options.labelValue }}\r\n      <!--Asterisk-->\r\n      <span *ngIf=\"((options.showAsterisk && options.isRequired) || options.isRequired) && !options.isReadonly\" class=\"text-danger\">*</span>\r\n    </label>\r\n    <!--Allow dropZone-->\r\n    <div\r\n      ng2FileDrop\r\n      class=\"bbsf-input-container {{ options.extraClasses }}\"\r\n      *ngIf=\"options.isDropZone && !(options.isMultipleFile == false && uploader.queue.length > 0) && !options.isReadonly\"\r\n      [ngClass]=\"{ 'another-file-over-class': hasAnotherDropZoneOver }\"\r\n      (onFileDrop)=\"onFileChange()\"\r\n      (fileOver)=\"fileOverAnother($event)\"\r\n      [uploader]=\"uploader\"\r\n      [accept]=\"acceptedType\"\r\n      id=\"{{ options.name }}\"\r\n      multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n      aria-describedby=\"email-error\"\r\n      aria-invalid=\"true\"\r\n      type=\"file\"\r\n      #fileInput\r\n      [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\"\r\n      (click)=\"fileInputControl.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg validation-msg-header text-center\">\r\n            {{ UtilityService.getResourceValue('DragAndDropHere') }}\r\n          </div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInputControl\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!--Not allowed dropZone-->\r\n    <div class=\"bbsf-input-container\" *ngIf=\"!options.isDropZone && !isHideInput() && !options.isReadonly\" (click)=\"fileInput.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg text-center\">{{ UtilityService.getResourceValue('Upload') }}</div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInput\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!-- readonly -->\r\n    <div *ngIf=\"options.isReadonly && !options.value\">\r\n      <span class=\"readonly-view\">{{ UtilityService.getResourceValue('NA') }}</span>\r\n    </div>\r\n  </div>\r\n  <!--items uploaded-->\r\n  <div class=\"uploaded-items\">\r\n    <div class=\"btn-group\" *ngFor=\"let item of uploader.queue\">\r\n      <ng-container *ngIf=\"item?.progress == 100 && options.isUploadFileAsync\">\r\n        <a *ngIf=\"item?.file?.rawFile['url']\" href=\"{{ item?.file?.rawFile['url'] }}\" class=\"btn-download-file btn-sm btn-progress-upload\" download>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <a *ngIf=\"item?.file?.rawFile['url'] == null\" class=\"btn-download-file btn-sm btn-progress-upload\">\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M9.33301 3.70584V3.26663C9.33301 2.65166 9.33301 2.34419 9.20587 2.1093C9.09405 1.9027 8.91555 1.73471 8.69604 1.62944C8.44647 1.50977 8.11977 1.50977 7.46638 1.50977H6.53305C5.87965 1.50977 5.55296 1.50977 5.30339 1.62944C5.08387 1.73471 4.90539 1.9027 4.79354 2.1093C4.66638 2.34419 4.66638 2.65166 4.66638 3.26663V3.70584\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M1.75 3.70605H12.25M11.0834 3.70605V9.8551C11.0834 10.7775 11.0834 11.2387 10.8926 11.591C10.7248 11.901 10.4571 12.1529 10.1278 12.3109C9.75345 12.4904 9.26345 12.4904 8.28334 12.4904H5.71666C4.73658 12.4904 4.24653 12.4904 3.87218 12.3109C3.5429 12.1529 3.27519 11.901 3.10741 11.591C2.91666 11.2387 2.91666 10.7775 2.91666 9.8551V3.70605\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n        </button>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"!options.isUploadFileAsync\">\r\n        <a href=\"{{ item?.file?.rawFile }}\" class=\"btn btn-download-file btn-sm\" download>\r\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n            <path\r\n              d=\"M21 22H3C2.4 22 2 21.6 2 21C2 20.4 2.4 20 3 20H21C21.6 20 22 20.4 22 21C22 21.6 21.6 22 21 22ZM13 13.4V3C13 2.4 12.6 2 12 2C11.4 2 11 2.4 11 3V13.4H13Z\"\r\n              fill=\"currentColor\"></path>\r\n            <path opacity=\"0.3\" d=\"M7 13.4H17L12.7 17.7C12.3 18.1 11.7 18.1 11.3 17.7L7 13.4Z\" fill=\"currentColor\"></path>\r\n          </svg>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm btn-danger\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <i class=\"fa fa-times px-0\"></i>\r\n        </button>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n  <!--progress bar file upload-->\r\n  <div *ngFor=\"let item of uploader.queue\">\r\n    <div class=\"upload-items\" [ngClass]=\"{ 'mt-4': options.isMultipleFile == true }\" *ngIf=\"item?.progress < 100 && options.isUploadFileAsync\">\r\n      <div class=\"upload-items-toolbar\">\r\n        <h4>{{ item?.file?.name }}</h4>\r\n        <span (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n            <g clip-path=\"url(#clip0_1324_13216)\">\r\n              <path\r\n                opacity=\"0.4\"\r\n                d=\"M9 16.5C13.1421 16.5 16.5 13.1421 16.5 9C16.5 4.85786 13.1421 1.5 9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 13.1421 4.85786 16.5 9 16.5Z\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n              <path\r\n                d=\"M11.25 6.75L6.75 11.25M6.75 6.75L11.25 11.25\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n            </g>\r\n            <defs>\r\n              <clipPath id=\"clip0_1324_13216\">\r\n                <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n              </clipPath>\r\n            </defs>\r\n          </svg>\r\n        </span>\r\n      </div>\r\n      <div class=\"progress\">\r\n        <div\r\n          class=\"progress-bar\"\r\n          role=\"progressbar\"\r\n          aria-valuenow=\"70\"\r\n          aria-valuemin=\"0\"\r\n          aria-valuemax=\"100\"\r\n          [class.file-uploaded]=\"item?.progress < 100\"\r\n          [style.width.%]=\"item?.progress\"\r\n          *ngIf=\"item?.progress > 0\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"subtext-container\" *ngIf=\"!options.isReadonly\">\r\n    <!-- required text-->\r\n    <div class=\"bbsf-validation\" *ngIf=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n      {{ getErrorValidation(fileUploadFormControl.errors | keyvalue) }}\r\n    </div>\r\n    <!-- LabelDescription-->\r\n    <div class=\"bbsf-control-desc\" *ngIf=\"options.labelDescription != null\">{{ options.labelDescription }}</div>\r\n    <div *ngIf=\"(group.valid && group.dirty && group.touched) || (group.untouched && group.invalid && group.dirty)\">\r\n      {{ resetError() }}\r\n    </div>\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7$2.FileDropDirective, selector: "[ng2FileDrop]", inputs: ["uploader"], outputs: ["fileOver", "onFileDrop"] }, { kind: "directive", type: i7$2.FileSelectDirective, selector: "[ng2FileSelect]", inputs: ["uploader"], outputs: ["onFileSelected"] }, { kind: "directive", type: i7.NativeElementInjectorDirective, selector: "[ngModel], [formControl], [formControlName]" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i5.KeyValuePipe, name: "keyvalue" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: FileUploadComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'BBSF-FileUplaod', template: "<div class=\"form-group bbsf-control bbsf-file-upload\" [formGroup]=\"group\">\r\n  <div [ngClass]=\"options.viewType == 1 ? 'bbsf-vertical' : 'bbsf-horizontal'\">\r\n    <!--label-->\r\n    <label [hidden]=\"options.hideLabel\" class=\"bbsf-label {{ options.labelExtraClasses }}\">\r\n      {{ options.labelValue }}\r\n      <!--Asterisk-->\r\n      <span *ngIf=\"((options.showAsterisk && options.isRequired) || options.isRequired) && !options.isReadonly\" class=\"text-danger\">*</span>\r\n    </label>\r\n    <!--Allow dropZone-->\r\n    <div\r\n      ng2FileDrop\r\n      class=\"bbsf-input-container {{ options.extraClasses }}\"\r\n      *ngIf=\"options.isDropZone && !(options.isMultipleFile == false && uploader.queue.length > 0) && !options.isReadonly\"\r\n      [ngClass]=\"{ 'another-file-over-class': hasAnotherDropZoneOver }\"\r\n      (onFileDrop)=\"onFileChange()\"\r\n      (fileOver)=\"fileOverAnother($event)\"\r\n      [uploader]=\"uploader\"\r\n      [accept]=\"acceptedType\"\r\n      id=\"{{ options.name }}\"\r\n      multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n      aria-describedby=\"email-error\"\r\n      aria-invalid=\"true\"\r\n      type=\"file\"\r\n      #fileInput\r\n      [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\"\r\n      (click)=\"fileInputControl.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg validation-msg-header text-center\">\r\n            {{ UtilityService.getResourceValue(\"DragAndDropHere\") }}\r\n          </div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInputControl\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!--Not allowed dropZone-->\r\n    <div class=\"bbsf-input-container\" *ngIf=\"!options.isDropZone && !isHideInput() && !options.isReadonly\" (click)=\"fileInput.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg text-center\">{{ UtilityService.getResourceValue(\"Upload\") }}</div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInput\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!-- readonly -->\r\n    <div *ngIf=\"options.isReadonly && !options.value\">\r\n      <span class=\"readonly-view\">{{ UtilityService.getResourceValue(\"NA\") }}</span>\r\n    </div>\r\n  </div>\r\n  <!--items uploaded-->\r\n  <div class=\"uploaded-items\">\r\n    <div class=\"btn-group\" *ngFor=\"let item of uploader.queue\">\r\n      <ng-container *ngIf=\"item?.progress == 100 && options.isUploadFileAsync\">\r\n        <a *ngIf=\"item?.file?.rawFile['url']\" href=\"{{ item?.file?.rawFile['url'] }}\" class=\"btn-download-file btn-sm btn-progress-upload\" download>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <a *ngIf=\"item?.file?.rawFile['url'] == null\" class=\"btn-download-file btn-sm btn-progress-upload\">\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M9.33301 3.70584V3.26663C9.33301 2.65166 9.33301 2.34419 9.20587 2.1093C9.09405 1.9027 8.91555 1.73471 8.69604 1.62944C8.44647 1.50977 8.11977 1.50977 7.46638 1.50977H6.53305C5.87965 1.50977 5.55296 1.50977 5.30339 1.62944C5.08387 1.73471 4.90539 1.9027 4.79354 2.1093C4.66638 2.34419 4.66638 2.65166 4.66638 3.26663V3.70584\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M1.75 3.70605H12.25M11.0834 3.70605V9.8551C11.0834 10.7775 11.0834 11.2387 10.8926 11.591C10.7248 11.901 10.4571 12.1529 10.1278 12.3109C9.75345 12.4904 9.26345 12.4904 8.28334 12.4904H5.71666C4.73658 12.4904 4.24653 12.4904 3.87218 12.3109C3.5429 12.1529 3.27519 11.901 3.10741 11.591C2.91666 11.2387 2.91666 10.7775 2.91666 9.8551V3.70605\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n        </button>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"!options.isUploadFileAsync\">\r\n        <a href=\"{{ item?.file?.rawFile }}\" class=\"btn btn-download-file btn-sm\" download>\r\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n            <path\r\n              d=\"M21 22H3C2.4 22 2 21.6 2 21C2 20.4 2.4 20 3 20H21C21.6 20 22 20.4 22 21C22 21.6 21.6 22 21 22ZM13 13.4V3C13 2.4 12.6 2 12 2C11.4 2 11 2.4 11 3V13.4H13Z\"\r\n              fill=\"currentColor\"></path>\r\n            <path opacity=\"0.3\" d=\"M7 13.4H17L12.7 17.7C12.3 18.1 11.7 18.1 11.3 17.7L7 13.4Z\" fill=\"currentColor\"></path>\r\n          </svg>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm btn-danger\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <i class=\"fa fa-times px-0\"></i>\r\n        </button>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n  <!--progress bar file upload-->\r\n  <div *ngFor=\"let item of uploader.queue\">\r\n    <div class=\"upload-items\" [ngClass]=\"{ 'mt-4': options.isMultipleFile == true }\" *ngIf=\"item?.progress < 100 && options.isUploadFileAsync\">\r\n      <div class=\"upload-items-toolbar\">\r\n        <h4>{{ item?.file?.name }}</h4>\r\n        <span (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n            <g clip-path=\"url(#clip0_1324_13216)\">\r\n              <path\r\n                opacity=\"0.4\"\r\n                d=\"M9 16.5C13.1421 16.5 16.5 13.1421 16.5 9C16.5 4.85786 13.1421 1.5 9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 13.1421 4.85786 16.5 9 16.5Z\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n              <path\r\n                d=\"M11.25 6.75L6.75 11.25M6.75 6.75L11.25 11.25\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n            </g>\r\n            <defs>\r\n              <clipPath id=\"clip0_1324_13216\">\r\n                <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n              </clipPath>\r\n            </defs>\r\n          </svg>\r\n        </span>\r\n      </div>\r\n      <div class=\"progress\">\r\n        <div\r\n          class=\"progress-bar\"\r\n          role=\"progressbar\"\r\n          aria-valuenow=\"70\"\r\n          aria-valuemin=\"0\"\r\n          aria-valuemax=\"100\"\r\n          [class.file-uploaded]=\"item?.progress < 100\"\r\n          [style.width.%]=\"item?.progress\"\r\n          *ngIf=\"item?.progress > 0\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"subtext-container\" *ngIf=\"!options.isReadonly\">\r\n    <!-- required text-->\r\n    <div class=\"bbsf-validation\" *ngIf=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n      {{ getErrorValidation(fileUploadFormControl.errors | keyvalue) }}\r\n    </div>\r\n    <!-- LabelDescription-->\r\n    <div class=\"bbsf-control-desc\" *ngIf=\"options.labelDescription != null\">{{ options.labelDescription }}</div>\r\n    <div *ngIf=\"(group.valid && group.dirty && group.touched) || (group.untouched && group.invalid && group.dirty)\">\r\n      {{ resetError() }}\r\n    </div>\r\n  </div>\r\n</div>\r\n" }]
+            args: [{ selector: 'BBSF-FileUplaod', template: "<div class=\"form-group bbsf-control bbsf-file-upload\" [formGroup]=\"group\">\r\n  <div [ngClass]=\"options.viewType == 1 ? 'bbsf-vertical' : 'bbsf-horizontal'\">\r\n    <!--label-->\r\n    <label [hidden]=\"options.hideLabel\" class=\"bbsf-label {{ options.labelExtraClasses }}\">\r\n      {{ options.labelValue }}\r\n      <!--Asterisk-->\r\n      <span *ngIf=\"((options.showAsterisk && options.isRequired) || options.isRequired) && !options.isReadonly\" class=\"text-danger\">*</span>\r\n    </label>\r\n    <!--Allow dropZone-->\r\n    <div\r\n      ng2FileDrop\r\n      class=\"bbsf-input-container {{ options.extraClasses }}\"\r\n      *ngIf=\"options.isDropZone && !(options.isMultipleFile == false && uploader.queue.length > 0) && !options.isReadonly\"\r\n      [ngClass]=\"{ 'another-file-over-class': hasAnotherDropZoneOver }\"\r\n      (onFileDrop)=\"onFileChange()\"\r\n      (fileOver)=\"fileOverAnother($event)\"\r\n      [uploader]=\"uploader\"\r\n      [accept]=\"acceptedType\"\r\n      id=\"{{ options.name }}\"\r\n      multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n      aria-describedby=\"email-error\"\r\n      aria-invalid=\"true\"\r\n      type=\"file\"\r\n      #fileInput\r\n      [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\"\r\n      (click)=\"fileInputControl.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg validation-msg-header text-center\">\r\n            {{ UtilityService.getResourceValue('DragAndDropHere') }}\r\n          </div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInputControl\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!--Not allowed dropZone-->\r\n    <div class=\"bbsf-input-container\" *ngIf=\"!options.isDropZone && !isHideInput() && !options.isReadonly\" (click)=\"fileInput.click()\">\r\n      <div class=\"dropzone-label\">\r\n        <div class=\"svg-and-validation\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M58.333 48.8332C61.8957 45.8908 64.1663 41.4397 64.1663 36.4583C64.1663 27.5988 56.9843 20.4167 48.1247 20.4167C47.4874 20.4167 46.8912 20.0842 46.5675 19.5351C42.7641 13.0808 35.7417 8.75 27.708 8.75C15.6268 8.75 5.83301 18.5438 5.83301 30.625C5.83301 36.6511 8.26974 42.1082 12.2116 46.0644\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M23.333 46.6667L34.9997 35M34.9997 35L46.6663 46.6667M34.9997 35V61.25\"\r\n              stroke=\"#4B5489\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n          <!--Validation text-->\r\n          <div class=\"bbsf-validation-msg text-center\">{{ UtilityService.getResourceValue('Upload') }}</div>\r\n          <div class=\"bbsf-validation-msg text-center\" *ngIf=\"validationMessage\" [innerHTML]=\"validationMessage\"></div>\r\n          <div\r\n            class=\"bbsf-validation-msg ng-star-inserted text-center text-danger\"\r\n            *ngIf=\"validationCountMessage && options.isMultipleFile && options.maxNoOfFiles > 0\"\r\n            [innerHTML]=\"validationCountMessage\"></div>\r\n        </div>\r\n      </div>\r\n      <input\r\n        ng2FileSelect\r\n        [uploader]=\"uploader\"\r\n        [accept]=\"acceptedType\"\r\n        class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n        multiple=\"{{ options.isMultipleFile ? 'multiple' : '' }}\"\r\n        name=\"file\"\r\n        type=\"file\"\r\n        value=\"\"\r\n        autocomplete=\"off\"\r\n        (change)=\"onFileChange()\"\r\n        [ngClass]=\"options.viewType == 1 ? '' : 'col-md-9'\"\r\n        id=\"{{ options.name }}\"\r\n        aria-describedby=\"email-error\"\r\n        aria-invalid=\"true\"\r\n        formControlName=\"{{ options.name }}\"\r\n        #fileInput\r\n        [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\" />\r\n    </div>\r\n    <!-- readonly -->\r\n    <div *ngIf=\"options.isReadonly && !options.value\">\r\n      <span class=\"readonly-view\">{{ UtilityService.getResourceValue('NA') }}</span>\r\n    </div>\r\n  </div>\r\n  <!--items uploaded-->\r\n  <div class=\"uploaded-items\">\r\n    <div class=\"btn-group\" *ngFor=\"let item of uploader.queue\">\r\n      <ng-container *ngIf=\"item?.progress == 100 && options.isUploadFileAsync\">\r\n        <a *ngIf=\"item?.file?.rawFile['url']\" href=\"{{ item?.file?.rawFile['url'] }}\" class=\"btn-download-file btn-sm btn-progress-upload\" download>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <a *ngIf=\"item?.file?.rawFile['url'] == null\" class=\"btn-download-file btn-sm btn-progress-upload\">\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n            <path\r\n              opacity=\"0.4\"\r\n              d=\"M9.33301 3.70584V3.26663C9.33301 2.65166 9.33301 2.34419 9.20587 2.1093C9.09405 1.9027 8.91555 1.73471 8.69604 1.62944C8.44647 1.50977 8.11977 1.50977 7.46638 1.50977H6.53305C5.87965 1.50977 5.55296 1.50977 5.30339 1.62944C5.08387 1.73471 4.90539 1.9027 4.79354 2.1093C4.66638 2.34419 4.66638 2.65166 4.66638 3.26663V3.70584\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n            <path\r\n              d=\"M1.75 3.70605H12.25M11.0834 3.70605V9.8551C11.0834 10.7775 11.0834 11.2387 10.8926 11.591C10.7248 11.901 10.4571 12.1529 10.1278 12.3109C9.75345 12.4904 9.26345 12.4904 8.28334 12.4904H5.71666C4.73658 12.4904 4.24653 12.4904 3.87218 12.3109C3.5429 12.1529 3.27519 11.901 3.10741 11.591C2.91666 11.2387 2.91666 10.7775 2.91666 9.8551V3.70605\"\r\n              stroke=\"#D83731\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\" />\r\n          </svg>\r\n        </button>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"!options.isUploadFileAsync\">\r\n        <a href=\"{{ item?.file?.rawFile }}\" class=\"btn btn-download-file btn-sm\" download>\r\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n            <path\r\n              d=\"M21 22H3C2.4 22 2 21.6 2 21C2 20.4 2.4 20 3 20H21C21.6 20 22 20.4 22 21C22 21.6 21.6 22 21 22ZM13 13.4V3C13 2.4 12.6 2 12 2C11.4 2 11 2.4 11 3V13.4H13Z\"\r\n              fill=\"currentColor\"></path>\r\n            <path opacity=\"0.3\" d=\"M7 13.4H17L12.7 17.7C12.3 18.1 11.7 18.1 11.3 17.7L7 13.4Z\" fill=\"currentColor\"></path>\r\n          </svg>\r\n          <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n        </a>\r\n        <button *ngIf=\"!options.isReadonly\" class=\"btn btn-download-file btn-sm btn-danger\" (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <i class=\"fa fa-times px-0\"></i>\r\n        </button>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n  <!--progress bar file upload-->\r\n  <div *ngFor=\"let item of uploader.queue\">\r\n    <div class=\"upload-items\" [ngClass]=\"{ 'mt-4': options.isMultipleFile == true }\" *ngIf=\"item?.progress < 100 && options.isUploadFileAsync\">\r\n      <div class=\"upload-items-toolbar\">\r\n        <h4>{{ item?.file?.name }}</h4>\r\n        <span (click)=\"item.remove(); removeFromControlValue(item)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n            <g clip-path=\"url(#clip0_1324_13216)\">\r\n              <path\r\n                opacity=\"0.4\"\r\n                d=\"M9 16.5C13.1421 16.5 16.5 13.1421 16.5 9C16.5 4.85786 13.1421 1.5 9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 13.1421 4.85786 16.5 9 16.5Z\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n              <path\r\n                d=\"M11.25 6.75L6.75 11.25M6.75 6.75L11.25 11.25\"\r\n                stroke=\"#DBE1F0\"\r\n                stroke-width=\"2\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\" />\r\n            </g>\r\n            <defs>\r\n              <clipPath id=\"clip0_1324_13216\">\r\n                <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n              </clipPath>\r\n            </defs>\r\n          </svg>\r\n        </span>\r\n      </div>\r\n      <div class=\"progress\">\r\n        <div\r\n          class=\"progress-bar\"\r\n          role=\"progressbar\"\r\n          aria-valuenow=\"70\"\r\n          aria-valuemin=\"0\"\r\n          aria-valuemax=\"100\"\r\n          [class.file-uploaded]=\"item?.progress < 100\"\r\n          [style.width.%]=\"item?.progress\"\r\n          *ngIf=\"item?.progress > 0\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"subtext-container\" *ngIf=\"!options.isReadonly\">\r\n    <!-- required text-->\r\n    <div class=\"bbsf-validation\" *ngIf=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n      {{ getErrorValidation(fileUploadFormControl.errors | keyvalue) }}\r\n    </div>\r\n    <!-- LabelDescription-->\r\n    <div class=\"bbsf-control-desc\" *ngIf=\"options.labelDescription != null\">{{ options.labelDescription }}</div>\r\n    <div *ngIf=\"(group.valid && group.dirty && group.touched) || (group.untouched && group.invalid && group.dirty)\">\r\n      {{ resetError() }}\r\n    </div>\r\n  </div>\r\n</div>\r\n" }]
         }], ctorParameters: () => [{ type: i2.ControlContainer, decorators: [{
                     type: Optional
                 }] }, { type: i2.FormGroupDirective }, { type: ControlUtility }, { type: i3.UtilityService }, { type: i3.ControlValidationService }, { type: GlobalSettings }, { type: FileUploadService }], propDecorators: { fileInput: [{