cat-documents-ng 0.2.85 → 0.2.86

package/fesm2022/cat-documents-ng.mjs

@@ -13,15 +13,15 @@ import * as i3 from 'primeng/api';
 import { ConfirmationService, MessageService } from 'primeng/api';
 import * as i4 from 'primeng/button';
 import { ButtonModule } from 'primeng/button';
-import * as i9 from 'primeng/fileupload';
+import * as i10 from 'primeng/fileupload';
 import { FileUploadModule } from 'primeng/fileupload';
-import * as i10 from 'primeng/progressbar';
+import * as i11 from 'primeng/progressbar';
 import { ProgressBarModule } from 'primeng/progressbar';
-import * as i11 from 'primeng/radiobutton';
+import * as i12 from 'primeng/radiobutton';
 import { RadioButtonModule } from 'primeng/radiobutton';
 import * as i3$1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
-import * as i13 from 'primeng/dropdown';
+import * as i14 from 'primeng/dropdown';
 import { DropdownModule } from 'primeng/dropdown';
 import * as i4$1 from 'primeng/sidebar';
 import { SidebarModule } from 'primeng/sidebar';
@@ -48,7 +48,7 @@ import * as i7$2 from 'primeng/badge';
 import { BadgeModule } from 'primeng/badge';
 import * as i8$1 from 'primeng/menu';
 import { MenuModule } from 'primeng/menu';
-import * as i9$1 from 'primeng/card';
+import * as i9 from 'primeng/card';
 import { CardModule } from 'primeng/card';
 import { ListboxModule } from 'primeng/listbox';
 import { TimelineModule } from 'primeng/timeline';
@@ -1299,7 +1299,7 @@ class DocumentService {
      * @returns {Observable<any>} Observable that emits the newly created document.
      */
     create(entity) {
-        const headers = { 'Authorization': 'Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f' };
+        const headers = { 'Authorization': 'Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d' };
         return this.http.post(`${this.apiUrl}${URLS.DOCUMENT_UPLOAD_FILE}`, entity, { headers }).pipe(tap((newEntity) => this.documentStore.add(newEntity)));
     }
     /**
@@ -1390,13 +1390,6 @@ class DocumentQuery extends QueryEntity {
     selectDocumentCategories() {
         return this.select((state) => state.documentCategories);
     }
-    /**
-     * Gets the current document categories value (synchronous).
-     * @returns {DocumentCategory[]} The current document categories.
-     */
-    getDocumentCategories() {
-        return this.getValue().documentCategories;
-    }
     // New query methods for selection state
     /**
      * Selects the currently selected menu item.
@@ -1711,7 +1704,7 @@ class DocumentHttpService {
      * @returns {Observable<any>} Observable that emits the transformed data for dropdown options.
      */
     getDocumentCatagories(contextId) {
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.get(`${this.apiUrl}${URLS.DOCUMENTS_CATAGORIES}/${contextId}`, { headers }).pipe(tap((response) => {
             // Store only the categories array, not the entire response
             if (response && response.categories) {
@@ -1770,7 +1763,7 @@ class DocumentHttpService {
      * @returns {Observable<DocumentModel>} An observable that emits the updated DocumentModel.
      */
     updateDocumentName(documentId, payload) {
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.put(`${this.apiUrl}${URLS.DOCUMENT_UPLOAD}/${documentId}`, payload, { headers }).pipe(catchError((error) => {
             return throwError(() => new Error(error));
         }));
@@ -1783,7 +1776,7 @@ class DocumentHttpService {
     getUserListByContextId(contextId) {
         if (!contextId)
             return EMPTY;
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.get(`${this.apiUrl}${URLS.USERLIST}${contextId}`, { headers }).pipe(tap((userList) => {
             this.documentStore.setUserList(userList);
         }), catchError((error) => {
@@ -1809,7 +1802,7 @@ class DocumentHttpService {
         if (categoryId) {
             params = params.set(SHARED.CATEGORY, categoryId);
         }
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.get(url, { params, headers }).pipe(tap((statusData) => {
             this.documentStore.setStatusData(statusData);
         }), catchError((error) => {
@@ -1840,7 +1833,7 @@ class DocumentHttpService {
         if (searchKey) {
             params = params.set(SHARED.SEARCH_KEY, searchKey);
         }
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.get(`${this.apiUrl}${URLS.GETALL}/${contextId}`, { params, headers }).pipe(tap((response) => {
             if (response.documents) {
                 this.documentStore.setDocumentList(response.documents);
@@ -1853,7 +1846,7 @@ class DocumentHttpService {
         if (!documentId) {
             return of([]);
         }
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.get(`${this.apiUrl}${URLS.DOCUMENT_HISTORY}${documentId}`, { headers });
     }
     /**
@@ -1864,7 +1857,7 @@ class DocumentHttpService {
     getCategoriesBySource(source) {
         if (!source)
             return EMPTY;
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.get(`${this.apiUrl}${URLS.GET_CATEGORIES_BY_SOURCE}${source}`, { headers }).pipe(catchError((error) => {
             return throwError(() => new Error(error));
         }));
@@ -1877,7 +1870,7 @@ class DocumentHttpService {
     getDocumentTypesByCategory(categoryId) {
         if (!categoryId)
             return EMPTY;
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.get(`${this.apiUrl}${URLS.GET_DOCUMENT_TYPES_BY_CATEGORY}${categoryId}`, { headers }).pipe(catchError((error) => {
             return throwError(() => new Error(error));
         }));
@@ -1888,7 +1881,7 @@ class DocumentHttpService {
      * @returns {Observable<any>} Observable that emits the upload response.
      */
     uploadFile(formData) {
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.post(`${this.apiUrl}${URLS.DOCUMENT_UPLOAD_FILE}`, formData, { headers }).pipe(catchError((error) => {
             return throwError(() => new Error(error));
         }));
@@ -1899,7 +1892,7 @@ class DocumentHttpService {
      * @returns {Observable<any>} Observable that emits the save response.
      */
     saveDocumentUpload(payload) {
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.post(`${this.apiUrl}${URLS.SAVE_DOCUMENT_UPLOAD}`, payload, { headers }).pipe(catchError((error) => {
             return throwError(() => new Error(error));
         }));
@@ -1915,7 +1908,7 @@ class DocumentHttpService {
         const payload = {
             statusUpdateDescription: statusUpdateDescription
         };
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.put(`${this.apiUrl}${URLS.UPDATE_DOCUMENT_STATUS}${documentId}/${status}`, payload, { headers }).pipe(tap((response) => {
             if (response && response.status) {
                 const normalizedStatus = this.normalizeStatus(response.status);
@@ -1949,7 +1942,7 @@ class DocumentHttpService {
      * @returns {Observable<any>} Observable that emits the delete response
      */
     deleteDocument(documentId, contextId) {
-        let headers = new HttpHeaders({ Authorization: `Bearer 498dad38-e776-4d9a-ad2a-71d8064d657f` });
+        let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
         return this.http.delete(`${this.apiUrl}${URLS.DELETE_DOCUMENT}${documentId}`, { headers }).pipe(tap(() => {
             this.getDocumentCatagories(contextId).subscribe();
             this.getUserListByContextId(contextId).subscribe();
@@ -2261,6 +2254,10 @@ class DocumentUploadService {
     documentService;
     documentUploadStore;
     messageService;
+    /**
+     * Event emitter for upload completion
+     */
+    uploadCompleted = new EventEmitter();
     /**
      * The file to upload.
      * @type {*}
@@ -2293,6 +2290,123 @@ class DocumentUploadService {
         this.documentUploadStore = documentUploadStore;
         this.messageService = messageService;
     }
+    /**
+     * Prepares the files for upload by creating a FormData object.
+     * This method appends each file to the FormData for submission.
+     * @returns {Promise<any>} Promise that resolves when upload completes
+     */
+    handleTemplatedUpload(file, contextId) {
+        return new Promise((resolve, reject) => {
+            let formsData = this.handleCreateFormData(file, contextId);
+            if (!formsData) {
+                const error = new Error('Failed to create form data');
+                this.messageService.add({ severity: SHARED.SEVERITY, summary: SHARED.UPLOAD_ERROR_SUMMERY, detail: SHARED.UPLOAD_ERROR_DETAILS });
+                reject(error);
+                return;
+            }
+            // Update progress to show upload starting
+            this.documentUploadStore.setMessage([{
+                    severity: 'info',
+                    detail: 'Uploading document...'
+                }]);
+            this.documentService.create(formsData)
+                .subscribe({
+                /**
+                 * Handles the successful upload event.
+                 * Updates the list of uploaded files and emits the file ID.
+                 * @returns {void}
+                 */
+                next: (event) => {
+                    this.documentUploadStore.setUploadedDocumentFiles(event);
+                    this.documentUploadStore.setMessage([{
+                            severity: SHARED.SUCCESS_SEVERITY,
+                            detail: SHARED.UPLOAD_SUCCESS
+                        }]);
+                    // Emit upload completion event with file and response
+                    this.uploadCompleted.emit({ file: file, response: event });
+                    resolve(event);
+                },
+                /**
+                 * Handles the error event during file upload.
+                 * Updates the progress of the file to indicate failure.
+                 * @param {any} error - The error object returned by the upload service.
+                 */
+                error: (error) => {
+                    this.messageService.add({ severity: SHARED.SEVERITY, summary: SHARED.UPLOAD_SUMMERY, detail: error?.message });
+                    reject(error);
+                },
+            });
+        });
+    }
+    /**
+     * Uploads multiple files sequentially using promises
+     * @param files - Array of files to upload
+     * @param contextId - The context ID for upload
+     * @returns {Promise<any[]>} Promise that resolves with all upload responses
+     */
+    async uploadFilesSequentially(files, contextId) {
+        const results = [];
+        for (const file of files) {
+            try {
+                const result = await this.handleTemplatedUpload(file, contextId);
+                results.push(result);
+            }
+            catch (error) {
+                console.error(`Failed to upload file ${file.name}:`, error);
+                // Continue with next file even if one fails
+                results.push({ error: true, fileName: file.name, errorMessage: error });
+            }
+        }
+        return results;
+    }
+    /**
+     * Alternative method to upload files sequentially with progress tracking
+     * @param files - Array of files to upload
+     * @param contextId - The context ID for upload
+     * @param onProgress - Optional callback for progress updates
+     * @returns {Promise<any[]>} Promise that resolves with all upload responses
+     */
+    async uploadFilesSequentiallyWithProgress(files, contextId, onProgress) {
+        const results = [];
+        for (let i = 0; i < files.length; i++) {
+            const file = files[i];
+            // Call progress callback if provided
+            if (onProgress) {
+                onProgress(file, i, files.length);
+            }
+            try {
+                const result = await this.handleTemplatedUpload(file, contextId);
+                results.push(result);
+            }
+            catch (error) {
+                console.error(`Failed to upload file ${file.name}:`, error);
+                // Continue with next file even if one fails
+                results.push({ error: true, fileName: file.name, errorMessage: error });
+            }
+        }
+        return results;
+    }
+    /**
+     * Get the file and contextId
+     * @param file - The file to upload.
+     * @param contextId - The contextId to upload.
+     */
+    getUploadFileData(file, contextId) {
+        if (file && contextId) {
+            this.uploadedFile = file;
+            this.contextId = contextId;
+        }
+    }
+    /**
+     * Get the document name and document type id
+     * @param documentName - The document name to upload.
+     * @param documentTypeId - The document type id to upload.
+     */
+    getDocumentNameAndType(documentTypeId) {
+        if (documentTypeId && documentTypeId !== SHARED.EMPTY) {
+            this.docTypeId = documentTypeId;
+        }
+    }
     /**
      * Handle the creation of formdata.
      * @returns {*} - The formdata object.
@@ -2301,40 +2415,13 @@ class DocumentUploadService {
         if (uploadedFile) {
             let formData = new FormData();
             formData.append(SHARED.FILE, uploadedFile, uploadedFile.name);
-            formData.append(SHARED.CONTEXT_ID, contextId || this.contextId);
+            formData.append(SHARED.CONTEXT_ID, this.contextId);
             return formData;
         }
         else {
             return null;
         }
     }
-    /**
-     * Upload a file and return the response.
-     * @param {File} file - The file to upload
-     * @param {string} contextId - The context ID for the upload
-     * @returns {Promise<UploadedFileResponse>} - Promise that resolves with the upload response
-     */
-    async uploadFile(file, contextId) {
-        const formData = this.handleCreateFormData(file, contextId);
-        if (!formData) {
-            throw new Error('Failed to create form data');
-        }
-        return new Promise((resolve, reject) => {
-            this.documentService.create(formData).subscribe({
-                next: (response) => {
-                    if (response) {
-                        resolve(response);
-                    }
-                    else {
-                        reject(new Error('No response received'));
-                    }
-                },
-                error: (error) => {
-                    reject(error);
-                }
-            });
-        });
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadService, deps: [{ token: DocumentService }, { token: DocumentStore }, { token: i3.MessageService }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadService, providedIn: 'root' });
 }
@@ -2543,8 +2630,7 @@ class DocumentUploadBusinessService {
                 fileSize: file.file.size,
                 url: file.url,
                 contentType: file.contentType,
-                size: file.size,
-                uploadedFileId: file.uploadResponse?.id || file.uploadResponse?.fileName
+                uploadedFileId: file.uploadResponse?.fileId || file.uploadResponse?.id || file.uploadResponse?.fileName
             }))
         };
         // For Applicant type, include the applicant ID
@@ -2783,7 +2869,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
  * categories, document types, and applicant selection.
  */
 class DocumentUploadComponent {
-    documentUploadService;
+    documentUpload;
+    uploadService;
     config;
     fileFormatService;
     messageService;
@@ -2845,8 +2932,9 @@ class DocumentUploadComponent {
      * @param formService - Service for form validation and handling
      * @param dataService - Service for data loading operations
      */
-    constructor(documentUploadService, config, fileFormatService, messageService, cdr, businessService, formService, dataService) {
-        this.documentUploadService = documentUploadService;
+    constructor(documentUpload, uploadService, config, fileFormatService, messageService, cdr, businessService, formService, dataService) {
+        this.documentUpload = documentUpload;
+        this.uploadService = uploadService;
         this.config = config;
         this.fileFormatService = fileFormatService;
         this.messageService = messageService;
@@ -2889,21 +2977,39 @@ class DocumentUploadComponent {
     onApplicantSelectionChange() { this.validateAndEmit(); }
     /**
      * Handles file selection from the file upload component.
-     * Processes each selected file for templated upload.
+     * Processes each selected file for templated upload sequentially.
      * @param event - Event containing the selected files
      */
     async onSelectedFiles(event) {
-        for (let i = 0; i < event.currentFiles.length; i++) {
-            const file = event.currentFiles[i];
-            try {
-                await this.handleTemplatedUpload(file);
-            }
-            catch (error) {
-                console.error(`Failed to upload file ${i + 1}/${event.currentFiles.length}: ${file.name}`, error);
-            }
-        }
+        // Process files sequentially instead of in parallel
+        await this.processFilesSequentially(event.currentFiles);
         this.fileUploader.clear();
     }
+    /**
+     * Processes files sequentially for upload
+     * @param files - Array of files to process
+     */
+    async processFilesSequentially(files) {
+        // Validate context ID before processing any files
+        if (!this.formService.validateContextId(this.contextId, 'Context ID is required for upload.')) {
+            return;
+        }
+        // Use the service method with progress tracking
+        await this.documentUpload.uploadFilesSequentiallyWithProgress(files, this.contextId, (currentFile, currentIndex, totalFiles) => {
+            // Set up progress tracking and upload listener for the current file
+            this.fileProgress.set(currentFile, SHARED.UPLOAD_PROGRESS_10);
+            this.setupFileUploadListener(currentFile);
+            // Create uploaded file object
+            const formattedSize = this.businessService.formatFileSize(currentFile.size, this.config);
+            const uploadedFile = this.businessService.createUploadedFile(currentFile, formattedSize);
+            uploadedFile.progress = SHARED.UPLOAD_PROGRESS_10;
+            this.uploadedFiles.push(uploadedFile);
+            // Validate form after adding file
+            this.validateForm();
+            // Update UI to show which file is currently being processed
+            this.cdr.detectChanges();
+        });
+    }
     /**
      * Loads the list of applicants for the current context.
      * Sets loading state and handles success/error responses.
@@ -2952,46 +3058,6 @@ class DocumentUploadComponent {
         this.isSaving = true;
         this.saveDocumentMetadata();
     }
-    /**
-     * Handles templated upload for a single file.
-     * Sets up progress tracking and upload listener for the file.
-     * @param file - The file to be uploaded
-     */
-    async handleTemplatedUpload(file) {
-        if (!this.formService.validateContextId(this.contextId, 'Context ID is required for upload.'))
-            return;
-        this.uploadedFiles.push({
-            file: file,
-            formattedSize: this.businessService.formatFileSize(file.size, this.config),
-            progress: SHARED.UPLOAD_PROGRESS_10,
-            uploadResponse: {
-                fileName: file.name,
-                contentType: file.type,
-                url: SHARED.EMPTY,
-                size: this.businessService.formatFileSize(file.size, this.config)
-            },
-            url: undefined,
-        });
-        this.fileProgress.set(file, SHARED.UPLOAD_PROGRESS_10);
-        try {
-            const response = await this.documentUploadService.uploadFile(file, this.contextId);
-            const formattedSize = this.businessService.formatFileSize(file.size, this.config);
-            const uploadedFile = {
-                file: file, formattedSize: formattedSize, progress: SHARED.UPLOAD_PROGRESS_100,
-                uploadResponse: response, url: response.url, contentType: response.contentType,
-                fileName: response.fileName,
-                size: response.size
-            };
-            this.uploadedFiles.push(uploadedFile);
-            this.fileProgress.set(file, SHARED.UPLOAD_PROGRESS_100);
-            this.validateForm();
-            this.onFormValidationChange.emit();
-        }
-        catch (error) {
-            this.fileProgress.set(file, -1);
-            console.error('Upload failed:', error);
-        }
-    }
     /**
      * Removes a document from the uploaded files list.
      * Updates progress tracking and validates form.
@@ -3171,6 +3237,27 @@ class DocumentUploadComponent {
             error: (error) => this.handleUploadError(error)
         });
     }
+    /**
+     * Sets up a listener for file upload completion.
+     * Updates progress tracking and emits validation change when upload completes.
+     * @param file - The file to monitor for upload completion
+     */
+    setupFileUploadListener(file) {
+        this.documentUpload.uploadCompleted.pipe(takeUntil(this.destroy$)).subscribe(({ file: uploadedFile, response }) => {
+            if (uploadedFile === file) {
+                this.fileProgress.set(file, SHARED.UPLOAD_PROGRESS_100);
+                const uploadedFileObj = this.uploadedFiles.find(uf => uf.file === file);
+                if (uploadedFileObj) {
+                    uploadedFileObj.uploadResponse = response;
+                    uploadedFileObj.progress = SHARED.UPLOAD_PROGRESS_100;
+                    uploadedFileObj.url = response?.url;
+                    uploadedFileObj.contentType = response?.contentType;
+                }
+                this.cdr.detectChanges();
+                this.onFormValidationChange.emit();
+            }
+        });
+    }
     /**
      * Handles errors during data loading operations.
      * Resets loading state and can be extended for error logging.
@@ -3211,13 +3298,13 @@ class DocumentUploadComponent {
         this.businessService.destroy();
         this.dataService.destroy();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadComponent, deps: [{ token: DocumentUploadService }, { token: i3.PrimeNGConfig }, { token: FileFormatService }, { token: i3.MessageService }, { token: i0.ChangeDetectorRef }, { token: DocumentUploadBusinessService }, { token: DocumentUploadFormService }, { token: DocumentUploadDataService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentUploadComponent, isStandalone: false, selector: "lib-document-upload", inputs: { contextId: "contextId" }, outputs: { onFormValidationChange: "onFormValidationChange", onUploadSuccess: "onUploadSuccess" }, viewQueries: [{ propertyName: "fileUploader", first: true, predicate: ["fileUploader"], descendants: true }], ngImport: i0, template: "<div class=\"document-upload-container\">\n  <!-- Assignment Section -->\n  <div class=\"assignment-section\">\n    <h4>Assign to Applicant(s) or Application</h4>\n    <div class=\"radio-group\">\n      <div class=\"radio-item\">\n        <p-radioButton \n          name=\"assignmentType\" \n          value=\"Applicant\" \n          [(ngModel)]=\"selectedAssignmentType\"\n          (onClick)=\"onAssignmentTypeChange()\"\n          [inputId]=\"'applicant'\"\n        ></p-radioButton>\n        <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\n      </div>\n      <div class=\"radio-item\">\n        <p-radioButton \n          name=\"assignmentType\" \n          value=\"Application\" \n          [(ngModel)]=\"selectedAssignmentType\"\n          (onClick)=\"onAssignmentTypeChange()\"\n          [inputId]=\"'application'\"\n        ></p-radioButton>\n        <label [for]=\"'application'\" class=\"radio-label\">Application</label>\n      </div>\n    </div>\n  </div>\n\n  <!-- Applicant Selection (only shown when Applicant is selected) -->\n  <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\n    <h4>Select Applicant(s)</h4>\n    <div class=\"grid\">\n      <div \n        *ngFor=\"let applicant of filteredApplicantList\" \n        class=\"applicant-item col-12 md:col-6\"\n      >\n        <p-radioButton \n          name=\"selectedApplicant\"\n          [value]=\"applicant._id\"\n          [(ngModel)]=\"selectedApplicant\"\n          [inputId]=\"'applicant-' + applicant._id\"\n          (onClick)=\"onApplicantSelectionChange()\"\n        ></p-radioButton>\n        <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\n          {{ applicant.name }}\n        </label>\n      </div>\n    </div>\n  </div>\n\n  <!-- Category Selection -->\n  <div class=\"category-section\">\n    <h4>Category</h4>\n    <p-dropdown\n      [options]=\"categoryOptions\"\n      [(ngModel)]=\"selectedCategory\"\n      placeholder=\"Select Category type\"\n      optionLabel=\"label\"\n      optionValue=\"_id\"\n      (onChange)=\"onCategoryChange()\"\n      [disabled]=\"!categoryOptions.length\"\n      class=\"w-full\"\n    ></p-dropdown>\n  </div>\n\n  <!-- Document Type Selection -->\n  <div class=\"document-type-section\">\n    <h4>Document Type</h4>\n    <p-dropdown\n      [options]=\"documentTypeOptions\"\n      [(ngModel)]=\"selectedDocumentType\"\n      placeholder=\"Select Document type\"\n      optionLabel=\"label\"\n      optionValue=\"_id\"\n      (onChange)=\"onDocumentTypeChange()\"\n      [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\n      class=\"w-full\"\n    ></p-dropdown>\n  </div>\n\n  <!-- File Upload Section -->\n  <div class=\"file-upload-section\">\n    <h4>Upload Documents</h4>\n    <div class=\"grid\">\n      <div class=\"col-12 md:col-12\">\n        <p-fileUpload \n          #fileUploader \n          [multiple]=\"true\" \n          auto=\"true\" \n          accept=\"image/png,application/pdf\" \n          maxFileSize=\"26214400\"\n          (onSelect)=\"onSelectedFiles($event)\"\n        >\n          <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\n            <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n              <div class=\"flex gap-2\">\n                <p-button \n                  (onClick)=\"choose($event, chooseCallback)\" \n                  icon=\"pi pi-images\" \n                  [rounded]=\"true\"\n                  [outlined]=\"true\" \n                />\n              </div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\n            let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\n            <div class=\"col-12 md:col-12 p-0\">\n              <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\n                <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\n                  class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\n                  <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\n                    <div class=\"documentImage\">\n                      <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\n                        class=\"object-contain\" />\n                    </div>\n                    <div class=\"flex w-full flex-column mt-2 ml-2\">\n                      <div class=\"flex justify-content-between\">\n                        <div style=\"font-weight: bold;font-size: 14px\">\n                          {{ uploadedFile.file.name }}\n                        </div>\n                        <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\n                      </div>\n                      <div class=\"flex justify-content-between mt-1\">\n                        <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \n                          {{ uploadedFile.formattedSize }}\n                        </div>\n                        <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \n                          {{ uploadedFile.progress }} % \n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-12 md:col-12 p-0\">\n                    <p-progressBar \n                      [value]=\"uploadedFile.progress\" \n                      [showValue]=\"false\" \n                      styleClass=\"h-1/2rem md:ml-auto relative\"\n                      [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress && uploadedFile.progress > 100 }\"\n                    >\n                    </p-progressBar>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\n            <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\n              (click)=\"triggerFileUpload()\">\n              <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\n              <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"file\"> </ng-template>\n        </p-fileUpload>\n      </div>\n    </div>\n  </div>\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.upload-status{margin-bottom:1rem;padding:.75rem;background-color:#f8f9fa;border-radius:.5rem;border-left:4px solid #0F8BFD}.upload-status .status-message{display:flex;align-items:center;font-size:.9rem;color:#495057}.upload-status .status-message .pi{font-size:1rem}.upload-status .status-message .pi.pi-spinner{color:#0f8bfd}.upload-status .status-message .pi.pi-check-circle{color:#28a745}.upload-status .status-message .pi.pi-clock{color:#ffc107}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-progressbar.error-progress-bar .p-progressbar-value{background-color:#dc3545!important}:host ::ng-deep .p-progressbar.success-progress-bar .p-progressbar-value{background-color:#28a745!important}:host ::ng-deep .p-progressbar.exceeded-progress-bar .p-progressbar-value{background-color:#ffc107!important}.applicant-list{display:none}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i9.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "component", type: i10.ProgressBar, selector: "p-progressBar", inputs: ["value", "showValue", "styleClass", "style", "unit", "mode", "color"] }, { kind: "component", type: i11.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i13.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadComponent, deps: [{ token: DocumentUploadService }, { token: DocumentService }, { token: i3.PrimeNGConfig }, { token: FileFormatService }, { token: i3.MessageService }, { token: i0.ChangeDetectorRef }, { token: DocumentUploadBusinessService }, { token: DocumentUploadFormService }, { token: DocumentUploadDataService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentUploadComponent, isStandalone: false, selector: "lib-document-upload", inputs: { contextId: "contextId" }, outputs: { onFormValidationChange: "onFormValidationChange", onUploadSuccess: "onUploadSuccess" }, viewQueries: [{ propertyName: "fileUploader", first: true, predicate: ["fileUploader"], descendants: true }], ngImport: i0, template: "<div class=\"document-upload-container\">\r\n  <!-- Assignment Section -->\r\n  <div class=\"assignment-section\">\r\n    <h4>Assign to Applicant(s) or Application</h4>\r\n    <div class=\"radio-group\">\r\n      <div class=\"radio-item\">\r\n        <p-radioButton \r\n          name=\"assignmentType\" \r\n          value=\"Applicant\" \r\n          [(ngModel)]=\"selectedAssignmentType\"\r\n          (onClick)=\"onAssignmentTypeChange()\"\r\n          [inputId]=\"'applicant'\"\r\n        ></p-radioButton>\r\n        <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\r\n      </div>\r\n      <div class=\"radio-item\">\r\n        <p-radioButton \r\n          name=\"assignmentType\" \r\n          value=\"Application\" \r\n          [(ngModel)]=\"selectedAssignmentType\"\r\n          (onClick)=\"onAssignmentTypeChange()\"\r\n          [inputId]=\"'application'\"\r\n        ></p-radioButton>\r\n        <label [for]=\"'application'\" class=\"radio-label\">Application</label>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Applicant Selection (only shown when Applicant is selected) -->\r\n  <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\r\n    <h4>Select Applicant(s)</h4>\r\n    <div class=\"grid\">\r\n      <div \r\n        *ngFor=\"let applicant of filteredApplicantList\" \r\n        class=\"applicant-item col-12 md:col-6\"\r\n      >\r\n        <p-radioButton \r\n          name=\"selectedApplicant\"\r\n          [value]=\"applicant._id\"\r\n          [(ngModel)]=\"selectedApplicant\"\r\n          [inputId]=\"'applicant-' + applicant._id\"\r\n          (onClick)=\"onApplicantSelectionChange()\"\r\n        ></p-radioButton>\r\n        <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\r\n          {{ applicant.name }}\r\n        </label>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Category Selection -->\r\n  <div class=\"category-section\">\r\n    <h4>Category</h4>\r\n    <p-dropdown\r\n      [options]=\"categoryOptions\"\r\n      [(ngModel)]=\"selectedCategory\"\r\n      placeholder=\"Select Category type\"\r\n      optionLabel=\"label\"\r\n      optionValue=\"_id\"\r\n      (onChange)=\"onCategoryChange()\"\r\n      [disabled]=\"!categoryOptions.length\"\r\n      class=\"w-full\"\r\n    ></p-dropdown>\r\n  </div>\r\n\r\n  <!-- Document Type Selection -->\r\n  <div class=\"document-type-section\">\r\n    <h4>Document Type</h4>\r\n    <p-dropdown\r\n      [options]=\"documentTypeOptions\"\r\n      [(ngModel)]=\"selectedDocumentType\"\r\n      placeholder=\"Select Document type\"\r\n      optionLabel=\"label\"\r\n      optionValue=\"_id\"\r\n      (onChange)=\"onDocumentTypeChange()\"\r\n      [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\r\n      class=\"w-full\"\r\n    ></p-dropdown>\r\n  </div>\r\n\r\n  <!-- File Upload Section -->\r\n  <div class=\"file-upload-section\">\r\n    <h4>Upload Documents</h4>\r\n    <div class=\"grid\">\r\n      <div class=\"col-12 md:col-12\">\r\n        <p-fileUpload \r\n          #fileUploader \r\n          [multiple]=\"true\" \r\n          auto=\"true\" \r\n          accept=\"image/png,application/pdf\" \r\n          maxFileSize=\"26214400\"\r\n          (onSelect)=\"onSelectedFiles($event)\"\r\n        >\r\n          <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\r\n            <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\r\n              <div class=\"flex gap-2\">\r\n                <p-button \r\n                  (onClick)=\"choose($event, chooseCallback)\" \r\n                  icon=\"pi pi-images\" \r\n                  [rounded]=\"true\"\r\n                  [outlined]=\"true\" \r\n                />\r\n              </div>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\r\n            let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\r\n            <div class=\"col-12 md:col-12 p-0\">\r\n              <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\r\n                <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\r\n                  class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\r\n                  <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\r\n                    <div class=\"documentImage\">\r\n                      <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\r\n                        class=\"object-contain\" />\r\n                    </div>\r\n                    <div class=\"flex w-full flex-column mt-2 ml-2\">\r\n                      <div class=\"flex justify-content-between\">\r\n                        <div style=\"font-weight: bold;font-size: 14px\">\r\n                          {{ uploadedFile.file.name }}\r\n                        </div>\r\n                        <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\r\n                      </div>\r\n                      <div class=\"flex justify-content-between mt-1\">\r\n                        <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \r\n                          {{ uploadedFile.formattedSize }}\r\n                        </div>\r\n                        <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \r\n                          {{ uploadedFile.progress }} % \r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-12 md:col-12 p-0\">\r\n                    <p-progressBar \r\n                      [value]=\"uploadedFile.progress\" \r\n                      [showValue]=\"false\" \r\n                      styleClass=\"h-1/2rem md:ml-auto relative\"\r\n                      [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress > 100 }\"\r\n                    >\r\n                    </p-progressBar>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\r\n            <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\r\n              (click)=\"triggerFileUpload()\">\r\n              <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\r\n              <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template pTemplate=\"file\"> </ng-template>\r\n        </p-fileUpload>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}.applicant-list{display:none}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i10.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "component", type: i11.ProgressBar, selector: "p-progressBar", inputs: ["value", "showValue", "styleClass", "style", "unit", "mode", "color"] }, { kind: "component", type: i12.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i14.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-document-upload', standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"document-upload-container\">\n  <!-- Assignment Section -->\n  <div class=\"assignment-section\">\n    <h4>Assign to Applicant(s) or Application</h4>\n    <div class=\"radio-group\">\n      <div class=\"radio-item\">\n        <p-radioButton \n          name=\"assignmentType\" \n          value=\"Applicant\" \n          [(ngModel)]=\"selectedAssignmentType\"\n          (onClick)=\"onAssignmentTypeChange()\"\n          [inputId]=\"'applicant'\"\n        ></p-radioButton>\n        <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\n      </div>\n      <div class=\"radio-item\">\n        <p-radioButton \n          name=\"assignmentType\" \n          value=\"Application\" \n          [(ngModel)]=\"selectedAssignmentType\"\n          (onClick)=\"onAssignmentTypeChange()\"\n          [inputId]=\"'application'\"\n        ></p-radioButton>\n        <label [for]=\"'application'\" class=\"radio-label\">Application</label>\n      </div>\n    </div>\n  </div>\n\n  <!-- Applicant Selection (only shown when Applicant is selected) -->\n  <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\n    <h4>Select Applicant(s)</h4>\n    <div class=\"grid\">\n      <div \n        *ngFor=\"let applicant of filteredApplicantList\" \n        class=\"applicant-item col-12 md:col-6\"\n      >\n        <p-radioButton \n          name=\"selectedApplicant\"\n          [value]=\"applicant._id\"\n          [(ngModel)]=\"selectedApplicant\"\n          [inputId]=\"'applicant-' + applicant._id\"\n          (onClick)=\"onApplicantSelectionChange()\"\n        ></p-radioButton>\n        <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\n          {{ applicant.name }}\n        </label>\n      </div>\n    </div>\n  </div>\n\n  <!-- Category Selection -->\n  <div class=\"category-section\">\n    <h4>Category</h4>\n    <p-dropdown\n      [options]=\"categoryOptions\"\n      [(ngModel)]=\"selectedCategory\"\n      placeholder=\"Select Category type\"\n      optionLabel=\"label\"\n      optionValue=\"_id\"\n      (onChange)=\"onCategoryChange()\"\n      [disabled]=\"!categoryOptions.length\"\n      class=\"w-full\"\n    ></p-dropdown>\n  </div>\n\n  <!-- Document Type Selection -->\n  <div class=\"document-type-section\">\n    <h4>Document Type</h4>\n    <p-dropdown\n      [options]=\"documentTypeOptions\"\n      [(ngModel)]=\"selectedDocumentType\"\n      placeholder=\"Select Document type\"\n      optionLabel=\"label\"\n      optionValue=\"_id\"\n      (onChange)=\"onDocumentTypeChange()\"\n      [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\n      class=\"w-full\"\n    ></p-dropdown>\n  </div>\n\n  <!-- File Upload Section -->\n  <div class=\"file-upload-section\">\n    <h4>Upload Documents</h4>\n    <div class=\"grid\">\n      <div class=\"col-12 md:col-12\">\n        <p-fileUpload \n          #fileUploader \n          [multiple]=\"true\" \n          auto=\"true\" \n          accept=\"image/png,application/pdf\" \n          maxFileSize=\"26214400\"\n          (onSelect)=\"onSelectedFiles($event)\"\n        >\n          <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\n            <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n              <div class=\"flex gap-2\">\n                <p-button \n                  (onClick)=\"choose($event, chooseCallback)\" \n                  icon=\"pi pi-images\" \n                  [rounded]=\"true\"\n                  [outlined]=\"true\" \n                />\n              </div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\n            let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\n            <div class=\"col-12 md:col-12 p-0\">\n              <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\n                <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\n                  class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\n                  <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\n                    <div class=\"documentImage\">\n                      <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\n                        class=\"object-contain\" />\n                    </div>\n                    <div class=\"flex w-full flex-column mt-2 ml-2\">\n                      <div class=\"flex justify-content-between\">\n                        <div style=\"font-weight: bold;font-size: 14px\">\n                          {{ uploadedFile.file.name }}\n                        </div>\n                        <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\n                      </div>\n                      <div class=\"flex justify-content-between mt-1\">\n                        <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \n                          {{ uploadedFile.formattedSize }}\n                        </div>\n                        <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \n                          {{ uploadedFile.progress }} % \n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-12 md:col-12 p-0\">\n                    <p-progressBar \n                      [value]=\"uploadedFile.progress\" \n                      [showValue]=\"false\" \n                      styleClass=\"h-1/2rem md:ml-auto relative\"\n                      [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress && uploadedFile.progress > 100 }\"\n                    >\n                    </p-progressBar>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\n            <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\n              (click)=\"triggerFileUpload()\">\n              <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\n              <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"file\"> </ng-template>\n        </p-fileUpload>\n      </div>\n    </div>\n  </div>\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.upload-status{margin-bottom:1rem;padding:.75rem;background-color:#f8f9fa;border-radius:.5rem;border-left:4px solid #0F8BFD}.upload-status .status-message{display:flex;align-items:center;font-size:.9rem;color:#495057}.upload-status .status-message .pi{font-size:1rem}.upload-status .status-message .pi.pi-spinner{color:#0f8bfd}.upload-status .status-message .pi.pi-check-circle{color:#28a745}.upload-status .status-message .pi.pi-clock{color:#ffc107}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-progressbar.error-progress-bar .p-progressbar-value{background-color:#dc3545!important}:host ::ng-deep .p-progressbar.success-progress-bar .p-progressbar-value{background-color:#28a745!important}:host ::ng-deep .p-progressbar.exceeded-progress-bar .p-progressbar-value{background-color:#ffc107!important}.applicant-list{display:none}\n"] }]
-        }], ctorParameters: () => [{ type: DocumentUploadService }, { type: i3.PrimeNGConfig }, { type: FileFormatService }, { type: i3.MessageService }, { type: i0.ChangeDetectorRef }, { type: DocumentUploadBusinessService }, { type: DocumentUploadFormService }, { type: DocumentUploadDataService }], propDecorators: { contextId: [{
+            args: [{ selector: 'lib-document-upload', standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"document-upload-container\">\r\n  <!-- Assignment Section -->\r\n  <div class=\"assignment-section\">\r\n    <h4>Assign to Applicant(s) or Application</h4>\r\n    <div class=\"radio-group\">\r\n      <div class=\"radio-item\">\r\n        <p-radioButton \r\n          name=\"assignmentType\" \r\n          value=\"Applicant\" \r\n          [(ngModel)]=\"selectedAssignmentType\"\r\n          (onClick)=\"onAssignmentTypeChange()\"\r\n          [inputId]=\"'applicant'\"\r\n        ></p-radioButton>\r\n        <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\r\n      </div>\r\n      <div class=\"radio-item\">\r\n        <p-radioButton \r\n          name=\"assignmentType\" \r\n          value=\"Application\" \r\n          [(ngModel)]=\"selectedAssignmentType\"\r\n          (onClick)=\"onAssignmentTypeChange()\"\r\n          [inputId]=\"'application'\"\r\n        ></p-radioButton>\r\n        <label [for]=\"'application'\" class=\"radio-label\">Application</label>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Applicant Selection (only shown when Applicant is selected) -->\r\n  <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\r\n    <h4>Select Applicant(s)</h4>\r\n    <div class=\"grid\">\r\n      <div \r\n        *ngFor=\"let applicant of filteredApplicantList\" \r\n        class=\"applicant-item col-12 md:col-6\"\r\n      >\r\n        <p-radioButton \r\n          name=\"selectedApplicant\"\r\n          [value]=\"applicant._id\"\r\n          [(ngModel)]=\"selectedApplicant\"\r\n          [inputId]=\"'applicant-' + applicant._id\"\r\n          (onClick)=\"onApplicantSelectionChange()\"\r\n        ></p-radioButton>\r\n        <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\r\n          {{ applicant.name }}\r\n        </label>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Category Selection -->\r\n  <div class=\"category-section\">\r\n    <h4>Category</h4>\r\n    <p-dropdown\r\n      [options]=\"categoryOptions\"\r\n      [(ngModel)]=\"selectedCategory\"\r\n      placeholder=\"Select Category type\"\r\n      optionLabel=\"label\"\r\n      optionValue=\"_id\"\r\n      (onChange)=\"onCategoryChange()\"\r\n      [disabled]=\"!categoryOptions.length\"\r\n      class=\"w-full\"\r\n    ></p-dropdown>\r\n  </div>\r\n\r\n  <!-- Document Type Selection -->\r\n  <div class=\"document-type-section\">\r\n    <h4>Document Type</h4>\r\n    <p-dropdown\r\n      [options]=\"documentTypeOptions\"\r\n      [(ngModel)]=\"selectedDocumentType\"\r\n      placeholder=\"Select Document type\"\r\n      optionLabel=\"label\"\r\n      optionValue=\"_id\"\r\n      (onChange)=\"onDocumentTypeChange()\"\r\n      [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\r\n      class=\"w-full\"\r\n    ></p-dropdown>\r\n  </div>\r\n\r\n  <!-- File Upload Section -->\r\n  <div class=\"file-upload-section\">\r\n    <h4>Upload Documents</h4>\r\n    <div class=\"grid\">\r\n      <div class=\"col-12 md:col-12\">\r\n        <p-fileUpload \r\n          #fileUploader \r\n          [multiple]=\"true\" \r\n          auto=\"true\" \r\n          accept=\"image/png,application/pdf\" \r\n          maxFileSize=\"26214400\"\r\n          (onSelect)=\"onSelectedFiles($event)\"\r\n        >\r\n          <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\r\n            <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\r\n              <div class=\"flex gap-2\">\r\n                <p-button \r\n                  (onClick)=\"choose($event, chooseCallback)\" \r\n                  icon=\"pi pi-images\" \r\n                  [rounded]=\"true\"\r\n                  [outlined]=\"true\" \r\n                />\r\n              </div>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\r\n            let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\r\n            <div class=\"col-12 md:col-12 p-0\">\r\n              <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\r\n                <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\r\n                  class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\r\n                  <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\r\n                    <div class=\"documentImage\">\r\n                      <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\r\n                        class=\"object-contain\" />\r\n                    </div>\r\n                    <div class=\"flex w-full flex-column mt-2 ml-2\">\r\n                      <div class=\"flex justify-content-between\">\r\n                        <div style=\"font-weight: bold;font-size: 14px\">\r\n                          {{ uploadedFile.file.name }}\r\n                        </div>\r\n                        <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\r\n                      </div>\r\n                      <div class=\"flex justify-content-between mt-1\">\r\n                        <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \r\n                          {{ uploadedFile.formattedSize }}\r\n                        </div>\r\n                        <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \r\n                          {{ uploadedFile.progress }} % \r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-12 md:col-12 p-0\">\r\n                    <p-progressBar \r\n                      [value]=\"uploadedFile.progress\" \r\n                      [showValue]=\"false\" \r\n                      styleClass=\"h-1/2rem md:ml-auto relative\"\r\n                      [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress > 100 }\"\r\n                    >\r\n                    </p-progressBar>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\r\n            <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\r\n              (click)=\"triggerFileUpload()\">\r\n              <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\r\n              <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template pTemplate=\"file\"> </ng-template>\r\n        </p-fileUpload>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}.applicant-list{display:none}\n"] }]
+        }], ctorParameters: () => [{ type: DocumentUploadService }, { type: DocumentService }, { type: i3.PrimeNGConfig }, { type: FileFormatService }, { type: i3.MessageService }, { type: i0.ChangeDetectorRef }, { type: DocumentUploadBusinessService }, { type: DocumentUploadFormService }, { type: DocumentUploadDataService }], propDecorators: { contextId: [{
                 type: Input
             }], fileUploader: [{
                 type: ViewChild,
@@ -3388,19 +3475,7 @@ class UserListService {
         this.documentQuery = documentQuery;
     }
     getInitials(name) {
-        if (!name || name.trim() === SHARED.EMPTY) {
-            return SHARED.EMPTY;
-        }
-        const words = name.trim().split(SHARED.EMPTY_SPACE).filter(word => word.length > SHARED.INITIAL_COUNT);
-        if (words.length === 1) {
-            return words[0].substring(0, 2).toUpperCase();
-        }
-        else if (words.length >= 2) {
-            const firstWord = words[0];
-            const lastWord = words[words.length - 1];
-            return (firstWord.charAt(0) + lastWord.charAt(0)).toUpperCase();
-        }
-        return SHARED.EMPTY;
+        return name.substring(0, 2).toUpperCase();
     }
     getColorByIndex(index) {
         const colors = SHARED.COLORS;
@@ -3606,7 +3681,7 @@ class UserListComponent {
         this.categoriesSubscription.unsubscribe();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UserListComponent, deps: [{ token: DocumentHelperService }, { token: DocumentStore }, { token: DocumentQuery }, { token: UserListService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UserListComponent, isStandalone: false, selector: "lib-user-list", inputs: { userList: "userList", categories: "categories" }, outputs: { userSelected: "userSelected" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n  <div class=\"user-cards\">\r\n    <div \r\n      *ngFor=\"let user of filteredUserData\" \r\n      class=\"user-card\"\r\n      [class.selected]=\"selectedUser === user.name\"\r\n      [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n      (click)=\"onUserSelect(user.name, user._id)\"\r\n    >\r\n      @if(user.name === \"Application Docs\"){\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n        </div>\r\n      }@else {\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\">{{ user.initials }}</span>\r\n        </div>\r\n      }\r\n      <div class=\"user-info\">\r\n        <div class=\"username\">{{ user.name }}</div>\r\n        <div class=\"document-counts\">\r\n        <span style=\"color : #16A34A;\"> {{ user.approved }} approved </span><span>/ {{ user.pending }} pending</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"selection-indicator\" *ngIf=\"selectedUser === user.name\" [@fadeIn]>\r\n        <i class=\"ri-check-line\"></i>\r\n      </div>\r\n    </div>\r\n    \r\n    <!-- Show message when filtered list is empty -->\r\n    <div *ngIf=\"filteredUserData.length === 0 && shouldShowContainer\" class=\"no-users-message\" [@slideInFromTop]>\r\n      <p>No users available for this category.</p>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".user-list-container{padding:1rem}.user-cards{display:flex;flex-wrap:wrap;gap:1rem;transition:all .3s ease-in-out}.user-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;box-shadow:0 2px 4px #0000001a;min-width:284px;max-width:284px;height:80px;position:relative;flex-shrink:0}.user-card:hover{box-shadow:0 4px 8px #00000026}.user-card.selected{background-color:#f8fafc;box-shadow:0 4px 8px #00000026;border-width:2px}.user-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:14px;flex-shrink:0}.avatar-orange{background-color:#f97316}.avatar-blue{background-color:#3b82f6}.avatar-green{background-color:#10b981}.avatar-grey{background-color:#6b7280}.avatar-purple{background-color:#8b5cf6}.user-info{flex:1;min-width:0;overflow:hidden}.username{font-weight:600;color:#1f2937;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.document-counts{font-size:.875rem;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.selection-indicator{position:absolute;top:8px;right:8px;width:20px;height:20px;background-color:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;flex-shrink:0}.no-users-message{display:flex;justify-content:center;align-items:center;padding:2rem;background:#f8fafc;border-radius:8px;border:2px dashed #d1d5db;margin:1rem 0}.no-users-message p{color:#6b7280;font-size:.875rem;font-weight:500;margin:0;text-align:center}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UserListComponent, isStandalone: false, selector: "lib-user-list", inputs: { userList: "userList", categories: "categories" }, outputs: { userSelected: "userSelected" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n  <div class=\"user-cards\">\r\n    <div \r\n      *ngFor=\"let user of filteredUserData\" \r\n      class=\"user-card\"\r\n      [class.selected]=\"selectedUser === user.name\"\r\n      [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n      (click)=\"onUserSelect(user.name, user._id)\"\r\n    >\r\n      @if(user.name === \"Application Docs\"){\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n        </div>\r\n      }@else {\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\">{{ user.initials }}</span>\r\n        </div>\r\n      }\r\n      <div class=\"user-info\">\r\n        <div class=\"username\">{{ user.name }}</div>\r\n        <div class=\"document-counts\">\r\n          {{ user.approved }} approved / {{ user.pending }} pending\r\n        </div>\r\n      </div>\r\n      <div class=\"selection-indicator\" *ngIf=\"selectedUser === user.name\" [@fadeIn]>\r\n        <i class=\"ri-check-line\"></i>\r\n      </div>\r\n    </div>\r\n    \r\n    <!-- Show message when filtered list is empty -->\r\n    <div *ngIf=\"filteredUserData.length === 0 && shouldShowContainer\" class=\"no-users-message\" [@slideInFromTop]>\r\n      <p>No users available for this category.</p>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".user-list-container{padding:1rem}.user-cards{display:flex;flex-wrap:wrap;gap:1rem;transition:all .3s ease-in-out}.user-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;box-shadow:0 2px 4px #0000001a;min-width:284px;max-width:284px;height:80px;position:relative;flex-shrink:0}.user-card:hover{box-shadow:0 4px 8px #00000026}.user-card.selected{background-color:#f8fafc;box-shadow:0 4px 8px #00000026;border-width:2px}.user-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:14px;flex-shrink:0}.avatar-orange{background-color:#f97316}.avatar-blue{background-color:#3b82f6}.avatar-green{background-color:#10b981}.avatar-grey{background-color:#6b7280}.avatar-purple{background-color:#8b5cf6}.user-info{flex:1;min-width:0;overflow:hidden}.username{font-weight:600;color:#1f2937;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.document-counts{font-size:.875rem;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.selection-indicator{position:absolute;top:8px;right:8px;width:20px;height:20px;background-color:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;flex-shrink:0}.no-users-message{display:flex;justify-content:center;align-items:center;padding:2rem;background:#f8fafc;border-radius:8px;border:2px dashed #d1d5db;margin:1rem 0}.no-users-message p{color:#6b7280;font-size:.875rem;font-weight:500;margin:0;text-align:center}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
             trigger('slideInFromTop', [
                 state('void', style({
                     opacity: 0,
@@ -3664,7 +3739,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                                 animate('200ms ease-in-out')
                             ])
                         ])
-                    ], template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n  <div class=\"user-cards\">\r\n    <div \r\n      *ngFor=\"let user of filteredUserData\" \r\n      class=\"user-card\"\r\n      [class.selected]=\"selectedUser === user.name\"\r\n      [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n      (click)=\"onUserSelect(user.name, user._id)\"\r\n    >\r\n      @if(user.name === \"Application Docs\"){\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n        </div>\r\n      }@else {\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\">{{ user.initials }}</span>\r\n        </div>\r\n      }\r\n      <div class=\"user-info\">\r\n        <div class=\"username\">{{ user.name }}</div>\r\n        <div class=\"document-counts\">\r\n        <span style=\"color : #16A34A;\"> {{ user.approved }} approved </span><span>/ {{ user.pending }} pending</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"selection-indicator\" *ngIf=\"selectedUser === user.name\" [@fadeIn]>\r\n        <i class=\"ri-check-line\"></i>\r\n      </div>\r\n    </div>\r\n    \r\n    <!-- Show message when filtered list is empty -->\r\n    <div *ngIf=\"filteredUserData.length === 0 && shouldShowContainer\" class=\"no-users-message\" [@slideInFromTop]>\r\n      <p>No users available for this category.</p>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".user-list-container{padding:1rem}.user-cards{display:flex;flex-wrap:wrap;gap:1rem;transition:all .3s ease-in-out}.user-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;box-shadow:0 2px 4px #0000001a;min-width:284px;max-width:284px;height:80px;position:relative;flex-shrink:0}.user-card:hover{box-shadow:0 4px 8px #00000026}.user-card.selected{background-color:#f8fafc;box-shadow:0 4px 8px #00000026;border-width:2px}.user-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:14px;flex-shrink:0}.avatar-orange{background-color:#f97316}.avatar-blue{background-color:#3b82f6}.avatar-green{background-color:#10b981}.avatar-grey{background-color:#6b7280}.avatar-purple{background-color:#8b5cf6}.user-info{flex:1;min-width:0;overflow:hidden}.username{font-weight:600;color:#1f2937;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.document-counts{font-size:.875rem;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.selection-indicator{position:absolute;top:8px;right:8px;width:20px;height:20px;background-color:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;flex-shrink:0}.no-users-message{display:flex;justify-content:center;align-items:center;padding:2rem;background:#f8fafc;border-radius:8px;border:2px dashed #d1d5db;margin:1rem 0}.no-users-message p{color:#6b7280;font-size:.875rem;font-weight:500;margin:0;text-align:center}\n"] }]
+                    ], template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n  <div class=\"user-cards\">\r\n    <div \r\n      *ngFor=\"let user of filteredUserData\" \r\n      class=\"user-card\"\r\n      [class.selected]=\"selectedUser === user.name\"\r\n      [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n      (click)=\"onUserSelect(user.name, user._id)\"\r\n    >\r\n      @if(user.name === \"Application Docs\"){\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n        </div>\r\n      }@else {\r\n        <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n          <span class=\"initials\">{{ user.initials }}</span>\r\n        </div>\r\n      }\r\n      <div class=\"user-info\">\r\n        <div class=\"username\">{{ user.name }}</div>\r\n        <div class=\"document-counts\">\r\n          {{ user.approved }} approved / {{ user.pending }} pending\r\n        </div>\r\n      </div>\r\n      <div class=\"selection-indicator\" *ngIf=\"selectedUser === user.name\" [@fadeIn]>\r\n        <i class=\"ri-check-line\"></i>\r\n      </div>\r\n    </div>\r\n    \r\n    <!-- Show message when filtered list is empty -->\r\n    <div *ngIf=\"filteredUserData.length === 0 && shouldShowContainer\" class=\"no-users-message\" [@slideInFromTop]>\r\n      <p>No users available for this category.</p>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".user-list-container{padding:1rem}.user-cards{display:flex;flex-wrap:wrap;gap:1rem;transition:all .3s ease-in-out}.user-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;box-shadow:0 2px 4px #0000001a;min-width:284px;max-width:284px;height:80px;position:relative;flex-shrink:0}.user-card:hover{box-shadow:0 4px 8px #00000026}.user-card.selected{background-color:#f8fafc;box-shadow:0 4px 8px #00000026;border-width:2px}.user-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:14px;flex-shrink:0}.avatar-orange{background-color:#f97316}.avatar-blue{background-color:#3b82f6}.avatar-green{background-color:#10b981}.avatar-grey{background-color:#6b7280}.avatar-purple{background-color:#8b5cf6}.user-info{flex:1;min-width:0;overflow:hidden}.username{font-weight:600;color:#1f2937;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.document-counts{font-size:.875rem;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.selection-indicator{position:absolute;top:8px;right:8px;width:20px;height:20px;background-color:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;flex-shrink:0}.no-users-message{display:flex;justify-content:center;align-items:center;padding:2rem;background:#f8fafc;border-radius:8px;border:2px dashed #d1d5db;margin:1rem 0}.no-users-message p{color:#6b7280;font-size:.875rem;font-weight:500;margin:0;text-align:center}\n"] }]
         }], ctorParameters: () => [{ type: DocumentHelperService }, { type: DocumentStore }, { type: DocumentQuery }, { type: UserListService }, { type: i0.ChangeDetectorRef }], propDecorators: { userList: [{
                 type: Input
             }], categories: [{
@@ -3815,19 +3890,12 @@ class DocumentSearchComponent {
         this.searchTerm = SHARED.EMPTY;
         this.documentHelperService.setSearchKey(null);
     }
-    /**
-     * Clears all filters including search, menu item, user, and status selections
-     */
-    onClearAllFilters() {
-        this.searchTerm = SHARED.EMPTY;
-        this.documentHelperService.clearSelectionState();
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentSearchComponent, deps: [{ token: DocumentHelperService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentSearchComponent, isStandalone: false, selector: "document-search", inputs: { contextId: "contextId" }, outputs: { onActionClick: "onActionClick" }, ngImport: i0, template: "<div class=\"search-container\">\r\n  <div class=\"search-input-wrapper\">\r\n    <i class=\"pi pi-search search-icon\"></i>\r\n    <input \r\n      type=\"text\" \r\n      [(ngModel)]=\"searchTerm\"\r\n      (ngModelChange)=\"onSearchInputChange($event)\"\r\n      class=\"search-input\"\r\n      placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n      [attr.aria-label]=\"'Search documents'\"\r\n    />\r\n    <button \r\n      *ngIf=\"searchTerm\"\r\n      type=\"button\"\r\n      class=\"clear-button\"\r\n      (click)=\"onClearSearch()\"\r\n      [attr.aria-label]=\"'Clear search'\"\r\n    >\r\n      <i class=\"pi pi-times\"></i>\r\n    </button>\r\n  </div>\r\n\r\n  <button \r\n    type=\"button\"\r\n    class=\"clear-all-filters-link\"\r\n    (click)=\"onClearAllFilters()\"\r\n    [attr.aria-label]=\"'Clear all'\"\r\n  >\r\n  Clear All\r\n  <i class=\"pi pi-times\"></i>\r\n  </button>\r\n\r\n  <div class=\"filters-section\">\r\n    <button \r\n      type=\"button\"\r\n      class=\"action-button\"\r\n      (click)=\"onActionClick.emit()\"\r\n      [attr.aria-label]=\"'Open actions menu'\"\r\n    >\r\n      Actions\r\n    </button>\r\n  </div>\r\n</div> ", styles: [".search-container{display:flex;align-items:center;gap:1rem;width:100%;justify-content:flex-start;padding:10px}.search-input-wrapper{position:relative;flex:1;display:flex;align-items:center;max-width:50%;min-width:300px}.clear-all-filters-link{background:none;border:none;color:#0f8bfd;cursor:pointer;padding:8px 12px;border-radius:4px;font-size:16px;font-weight:500;text-decoration:none!important;transition:background-color .2s ease,color .2s ease;white-space:nowrap;flex-shrink:0;display:flex;justify-content:center;align-items:center;gap:4px}.filters-section{display:flex;align-items:center;gap:1rem;flex-shrink:0;margin-left:auto}.search-icon{position:absolute;left:12px;color:#6c757d;z-index:1}.search-input{width:100%;padding:12px 40px;border:1px solid #dee2e6;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.search-input:focus{border-color:#0f8bfd;box-shadow:0 0 0 3px #0f8bfd1a}.search-input::placeholder{color:#6c757d}.clear-button{position:absolute;right:12px;background:none;border:none;color:#6c757d;cursor:pointer;padding:4px;border-radius:4px;transition:background-color .2s ease,color .2s ease}.clear-button:hover{background-color:#f8f9fa;color:#495057}.action-button{background-color:#0f8bfd;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease;white-space:nowrap}.action-button:hover{background-color:#0d7ae6;transform:translateY(-1px)}.action-button:active{transform:translateY(0)}.action-button:focus{outline:none;box-shadow:0 0 0 3px #0f8bfd4d}@media (max-width: 768px){.search-container{flex-direction:column;gap:.75rem}.search-input-wrapper{max-width:100%}.filters-section{width:100%;justify-content:center;gap:.5rem}.action-button{width:auto;justify-content:center}}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentSearchComponent, isStandalone: false, selector: "document-search", inputs: { contextId: "contextId" }, outputs: { onActionClick: "onActionClick" }, ngImport: i0, template: "<div class=\"search-container\">\r\n  <div class=\"search-input-wrapper\">\r\n    <i class=\"pi pi-search search-icon\"></i>\r\n    <input \r\n      type=\"text\" \r\n      [(ngModel)]=\"searchTerm\"\r\n      (ngModelChange)=\"onSearchInputChange($event)\"\r\n      class=\"search-input\"\r\n      placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n      [attr.aria-label]=\"'Search documents'\"\r\n    />\r\n    <button \r\n      *ngIf=\"searchTerm\"\r\n      type=\"button\"\r\n      class=\"clear-button\"\r\n      (click)=\"onClearSearch()\"\r\n      [attr.aria-label]=\"'Clear search'\"\r\n    >\r\n      <i class=\"pi pi-times\"></i>\r\n    </button>\r\n  </div>\r\n  \r\n  <button \r\n    type=\"button\"\r\n    class=\"action-button\"\r\n    (click)=\"onActionClick.emit()\"\r\n    [attr.aria-label]=\"'Open actions menu'\"\r\n  >\r\n    Actions\r\n  </button>\r\n</div> ", styles: [".search-container{display:flex;align-items:center;gap:1rem;width:100%;justify-content:space-between;padding:10px}.search-input-wrapper{position:relative;flex:1;display:flex;align-items:center;max-width:40%}.search-icon{position:absolute;left:12px;color:#6c757d;z-index:1}.search-input{width:100%;padding:12px 40px;border:1px solid #dee2e6;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.search-input:focus{border-color:#0f8bfd;box-shadow:0 0 0 3px #0f8bfd1a}.search-input::placeholder{color:#6c757d}.clear-button{position:absolute;right:12px;background:none;border:none;color:#6c757d;cursor:pointer;padding:4px;border-radius:4px;transition:background-color .2s ease,color .2s ease}.clear-button:hover{background-color:#f8f9fa;color:#495057}.action-button{background-color:#0f8bfd;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease;white-space:nowrap}.action-button:hover{background-color:#0d7ae6;transform:translateY(-1px)}.action-button:active{transform:translateY(0)}.action-button:focus{outline:none;box-shadow:0 0 0 3px #0f8bfd4d}@media (max-width: 768px){.search-container{flex-direction:column;gap:.75rem}.search-input-wrapper{max-width:100%}.action-button{width:100%;justify-content:center}}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentSearchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'document-search', standalone: false, template: "<div class=\"search-container\">\r\n  <div class=\"search-input-wrapper\">\r\n    <i class=\"pi pi-search search-icon\"></i>\r\n    <input \r\n      type=\"text\" \r\n      [(ngModel)]=\"searchTerm\"\r\n      (ngModelChange)=\"onSearchInputChange($event)\"\r\n      class=\"search-input\"\r\n      placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n      [attr.aria-label]=\"'Search documents'\"\r\n    />\r\n    <button \r\n      *ngIf=\"searchTerm\"\r\n      type=\"button\"\r\n      class=\"clear-button\"\r\n      (click)=\"onClearSearch()\"\r\n      [attr.aria-label]=\"'Clear search'\"\r\n    >\r\n      <i class=\"pi pi-times\"></i>\r\n    </button>\r\n  </div>\r\n\r\n  <button \r\n    type=\"button\"\r\n    class=\"clear-all-filters-link\"\r\n    (click)=\"onClearAllFilters()\"\r\n    [attr.aria-label]=\"'Clear all'\"\r\n  >\r\n  Clear All\r\n  <i class=\"pi pi-times\"></i>\r\n  </button>\r\n\r\n  <div class=\"filters-section\">\r\n    <button \r\n      type=\"button\"\r\n      class=\"action-button\"\r\n      (click)=\"onActionClick.emit()\"\r\n      [attr.aria-label]=\"'Open actions menu'\"\r\n    >\r\n      Actions\r\n    </button>\r\n  </div>\r\n</div> ", styles: [".search-container{display:flex;align-items:center;gap:1rem;width:100%;justify-content:flex-start;padding:10px}.search-input-wrapper{position:relative;flex:1;display:flex;align-items:center;max-width:50%;min-width:300px}.clear-all-filters-link{background:none;border:none;color:#0f8bfd;cursor:pointer;padding:8px 12px;border-radius:4px;font-size:16px;font-weight:500;text-decoration:none!important;transition:background-color .2s ease,color .2s ease;white-space:nowrap;flex-shrink:0;display:flex;justify-content:center;align-items:center;gap:4px}.filters-section{display:flex;align-items:center;gap:1rem;flex-shrink:0;margin-left:auto}.search-icon{position:absolute;left:12px;color:#6c757d;z-index:1}.search-input{width:100%;padding:12px 40px;border:1px solid #dee2e6;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.search-input:focus{border-color:#0f8bfd;box-shadow:0 0 0 3px #0f8bfd1a}.search-input::placeholder{color:#6c757d}.clear-button{position:absolute;right:12px;background:none;border:none;color:#6c757d;cursor:pointer;padding:4px;border-radius:4px;transition:background-color .2s ease,color .2s ease}.clear-button:hover{background-color:#f8f9fa;color:#495057}.action-button{background-color:#0f8bfd;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease;white-space:nowrap}.action-button:hover{background-color:#0d7ae6;transform:translateY(-1px)}.action-button:active{transform:translateY(0)}.action-button:focus{outline:none;box-shadow:0 0 0 3px #0f8bfd4d}@media (max-width: 768px){.search-container{flex-direction:column;gap:.75rem}.search-input-wrapper{max-width:100%}.filters-section{width:100%;justify-content:center;gap:.5rem}.action-button{width:auto;justify-content:center}}\n"] }]
+            args: [{ selector: 'document-search', standalone: false, template: "<div class=\"search-container\">\r\n  <div class=\"search-input-wrapper\">\r\n    <i class=\"pi pi-search search-icon\"></i>\r\n    <input \r\n      type=\"text\" \r\n      [(ngModel)]=\"searchTerm\"\r\n      (ngModelChange)=\"onSearchInputChange($event)\"\r\n      class=\"search-input\"\r\n      placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n      [attr.aria-label]=\"'Search documents'\"\r\n    />\r\n    <button \r\n      *ngIf=\"searchTerm\"\r\n      type=\"button\"\r\n      class=\"clear-button\"\r\n      (click)=\"onClearSearch()\"\r\n      [attr.aria-label]=\"'Clear search'\"\r\n    >\r\n      <i class=\"pi pi-times\"></i>\r\n    </button>\r\n  </div>\r\n  \r\n  <button \r\n    type=\"button\"\r\n    class=\"action-button\"\r\n    (click)=\"onActionClick.emit()\"\r\n    [attr.aria-label]=\"'Open actions menu'\"\r\n  >\r\n    Actions\r\n  </button>\r\n</div> ", styles: [".search-container{display:flex;align-items:center;gap:1rem;width:100%;justify-content:space-between;padding:10px}.search-input-wrapper{position:relative;flex:1;display:flex;align-items:center;max-width:40%}.search-icon{position:absolute;left:12px;color:#6c757d;z-index:1}.search-input{width:100%;padding:12px 40px;border:1px solid #dee2e6;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.search-input:focus{border-color:#0f8bfd;box-shadow:0 0 0 3px #0f8bfd1a}.search-input::placeholder{color:#6c757d}.clear-button{position:absolute;right:12px;background:none;border:none;color:#6c757d;cursor:pointer;padding:4px;border-radius:4px;transition:background-color .2s ease,color .2s ease}.clear-button:hover{background-color:#f8f9fa;color:#495057}.action-button{background-color:#0f8bfd;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease;white-space:nowrap}.action-button:hover{background-color:#0d7ae6;transform:translateY(-1px)}.action-button:active{transform:translateY(0)}.action-button:focus{outline:none;box-shadow:0 0 0 3px #0f8bfd4d}@media (max-width: 768px){.search-container{flex-direction:column;gap:.75rem}.search-input-wrapper{max-width:100%}.action-button{width:100%;justify-content:center}}\n"] }]
         }], ctorParameters: () => [{ type: DocumentHelperService }], propDecorators: { contextId: [{
                 type: Input
             }], onActionClick: [{
@@ -6093,7 +6161,7 @@ class DocumentsMenuComponent {
         return this.selectedMenuItemId;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentsMenuComponent, deps: [{ token: DocumentStore }, { token: DocumentQuery }, { token: DocumentMenuService }, { token: DocumentHelperService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DocumentsMenuComponent, isStandalone: false, selector: "lib-documents-menu", inputs: { catagories: "catagories", applicationNumber: "applicationNumber", contextId: "contextId" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"document-sidebar-container h-full\">\r\n  <p-card class=\"widget-menu-wrapper h-full\">\r\n    @if(applicationNumber){\r\n      <div class=\"flex align-items-center justify-content-between widget-menu-header-wrapper\">\r\n        <p class=\"mb-0 application-title-wrapper\">ID - {{applicationNumber}}</p>\r\n        <div class=\"expand-icon-wrapper\">\r\n          <i class=\"ri-arrow-left-s-line text-primary flex align-items-center justify-content-center w-full h-full\"></i>\r\n        </div>\r\n      </div>\r\n    }\r\n\r\n    <div class=\"widget-menu-container\" >\r\n      <div class=\"widget-menu-wrapper h-ful l custom-scroll\">\r\n       <p-menu [model]=\"categories\" styleClass=\"w-full md:w-15rem\">\r\n            <ng-template pTemplate=\"submenuheader\" let-item>\r\n                <span [style]=\"{\r\n                    color : '#9EA0B3'\r\n                }\">{{  item.label === 'Application' ? 'Application Documents' : item.label }}</span>\r\n            </ng-template>\r\n            <ng-template pTemplate=\"item\" let-item>\r\n                <a pRipple \r\n                   class=\"flex align-items-center p-menuitem-link\"\r\n                   [class.selected-menu-item]=\"selectedMenuItemId === item._id\"\r\n                   (click)=\"onMenuItemClick($event, item)\">\r\n                    <span [class]=\"item.icon\" class=\"text-xl\"></span>\r\n                    <span class=\"ml-2\">{{ item.label }}</span>\r\n                    <p-badge *ngIf=\"item.menuData?.shouldShowBadge\" \r\n                           class=\"ml-auto\" \r\n                           [severity]=\"item.menuData?.badgeSeverity\" \r\n                           [value]=\"item.menuData?.badgeValue\" />\r\n                </a>\r\n            </ng-template>\r\n        </p-menu>\r\n      </div>\r\n    </div>\r\n  </p-card>\r\n</div>\r\n\r\n  ", styles: [".expand-icon-wrapper{border:1px solid var(--primary-color);height:24px;width:24px;border-radius:50%;background:var(--blue-bg-light)}::ng-deep .p-badge.p-badge-success{background-color:#dcfce7;color:#16a34a;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-danger{background-color:#fee2e2;color:#dc2626;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-warning{background-color:#fef3c7;color:#d97706;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-menu .p-menuitem>.p-menuitem-content .p-menuitem-link{color:#1f2937}@media screen and (min-width: 768px){::ng-deep .md\\:w-15rem{width:100%!important}}::ng-deep .p-menu .p-menuitem:not(p-highlight):not(p-disabled)>.p-menuitem-content:hover{color:#06f!important;border:none!important}::ng-deep .p-menu{border:none}::ng-deep .custom-scroll{scrollbar-gutter:inherit}::ng-deep .selected-menu-item{background-color:#0066ff1a!important;color:var(--primary-color)!important;border:1px solid rgba(68,72,109,.1)!important;border-radius:10px!important}::ng-deep .selected-menu-item .text-xl{color:var(--primary-color)!important}::ng-deep .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important}::ng-deep .p-menuitem-link:not(.selected-menu-item) .text-xl{color:var(--text-color)!important}::ng-deep .p-panelmenu .p-panelmenu-content{border:none!important}.application-title-wrapper{color:#9ea0b3;font-weight:500}.widget-menu-wrapper{margin-top:8px}.widget-menu-header-wrapper{padding:4px 4px 4px 16px}.widget-menu-container{height:calc(100% - 38px)}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}::ng-deep .document-sidebar-container .p-card{height:100%;box-shadow:none}::ng-deep .document-sidebar-container .p-card .p-card-content{height:100%;padding:0!important}::ng-deep .document-sidebar-container .p-card .p-card-body{height:100%;width:100%;padding:12px 8px;border-radius:10px;border:1px solid #e5e7eb}::ng-deep .document-sidebar-container .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content{border:none;color:var(--text-color);font-weight:400!important;background-color:var(--surface-0)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action{color:var(--text-color);font-weight:400!important;position:relative;padding:12px}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{position:absolute;right:0;top:16px;margin-right:7px;transform:rotate(90deg)!important;transition:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .company-action-wrapper:not(.p-disabled).p-highlight .p-panelmenu-header-content{margin:12px 0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content{background-color:transparent!important;border-radius:10px;padding:12px;border-bottom:0!important;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{transform:rotate(180deg)!important;transition:none!important;top:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link{background-color:#fff!important;color:var(--text-color);padding:12px 6px!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);box-shadow:none!important;background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem.p-focus>.p-menuitem-content{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-focus)>.p-menuitem-content .p-menuitem-link{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important;color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-icon{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-text{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:1px solid rgba(68,72,109,.1)!important;border-top:0!important;border-bottom-left-radius:10px;border-bottom-right-radius:10px}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator{border-top:1px solid rgba(68,72,109,.1)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}.no-documents-message{padding:12px 16px;text-align:center}.no-documents-message .text-muted{color:#9ea0b3;font-size:14px;font-style:italic}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i7$2.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }, { kind: "component", type: i8$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i9$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DocumentsMenuComponent, isStandalone: false, selector: "lib-documents-menu", inputs: { catagories: "catagories", applicationNumber: "applicationNumber", contextId: "contextId" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"document-sidebar-container h-full\">\r\n  <p-card class=\"widget-menu-wrapper h-full\">\r\n    @if(applicationNumber){\r\n      <div class=\"flex align-items-center justify-content-between widget-menu-header-wrapper\">\r\n        <p class=\"mb-0 application-title-wrapper\">ID - {{applicationNumber}}</p>\r\n        <div class=\"expand-icon-wrapper\">\r\n          <i class=\"ri-arrow-left-s-line text-primary flex align-items-center justify-content-center w-full h-full\"></i>\r\n        </div>\r\n      </div>\r\n    }\r\n\r\n    <div class=\"widget-menu-container\" >\r\n      <div class=\"widget-menu-wrapper h-ful l custom-scroll\">\r\n       <p-menu [model]=\"categories\" styleClass=\"w-full md:w-15rem\">\r\n            <ng-template pTemplate=\"submenuheader\" let-item>\r\n                <span [style]=\"{\r\n                    color : '#9EA0B3'\r\n                }\">{{  item.label === 'Application' ? 'Application Documents' : item.label }}</span>\r\n            </ng-template>\r\n            <ng-template pTemplate=\"item\" let-item>\r\n                <a pRipple \r\n                   class=\"flex align-items-center p-menuitem-link\"\r\n                   [class.selected-menu-item]=\"selectedMenuItemId === item._id\"\r\n                   (click)=\"onMenuItemClick($event, item)\">\r\n                    <span [class]=\"item.icon\" class=\"text-xl\"></span>\r\n                    <span class=\"ml-2\">{{ item.label }}</span>\r\n                    <p-badge *ngIf=\"item.menuData?.shouldShowBadge\" \r\n                           class=\"ml-auto\" \r\n                           [severity]=\"item.menuData?.badgeSeverity\" \r\n                           [value]=\"item.menuData?.badgeValue\" />\r\n                </a>\r\n            </ng-template>\r\n        </p-menu>\r\n      </div>\r\n    </div>\r\n  </p-card>\r\n</div>\r\n\r\n  ", styles: [".expand-icon-wrapper{border:1px solid var(--primary-color);height:24px;width:24px;border-radius:50%;background:var(--blue-bg-light)}::ng-deep .p-badge.p-badge-success{background-color:#dcfce7;color:#16a34a;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-danger{background-color:#fee2e2;color:#dc2626;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-warning{background-color:#fef3c7;color:#d97706;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-menu .p-menuitem>.p-menuitem-content .p-menuitem-link{color:#1f2937}@media screen and (min-width: 768px){::ng-deep .md\\:w-15rem{width:100%!important}}::ng-deep .p-menu .p-menuitem:not(p-highlight):not(p-disabled)>.p-menuitem-content:hover{color:#06f!important;border:none!important}::ng-deep .p-menu{border:none}::ng-deep .custom-scroll{scrollbar-gutter:inherit}::ng-deep .selected-menu-item{background-color:#0066ff1a!important;color:var(--primary-color)!important;border:1px solid rgba(68,72,109,.1)!important;border-radius:10px!important}::ng-deep .selected-menu-item .text-xl{color:var(--primary-color)!important}::ng-deep .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important}::ng-deep .p-menuitem-link:not(.selected-menu-item) .text-xl{color:var(--text-color)!important}::ng-deep .p-panelmenu .p-panelmenu-content{border:none!important}.application-title-wrapper{color:#9ea0b3;font-weight:500}.widget-menu-wrapper{margin-top:8px}.widget-menu-header-wrapper{padding:4px 4px 4px 16px}.widget-menu-container{height:calc(100% - 38px)}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}::ng-deep .document-sidebar-container .p-card{height:100%;box-shadow:none}::ng-deep .document-sidebar-container .p-card .p-card-content{height:100%;padding:0!important}::ng-deep .document-sidebar-container .p-card .p-card-body{height:100%;width:100%;padding:12px 8px;border-radius:10px;border:1px solid #e5e7eb}::ng-deep .document-sidebar-container .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content{border:none;color:var(--text-color);font-weight:400!important;background-color:var(--surface-0)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action{color:var(--text-color);font-weight:400!important;position:relative;padding:12px}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{position:absolute;right:0;top:16px;margin-right:7px;transform:rotate(90deg)!important;transition:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .company-action-wrapper:not(.p-disabled).p-highlight .p-panelmenu-header-content{margin:12px 0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content{background-color:transparent!important;border-radius:10px;padding:12px;border-bottom:0!important;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{transform:rotate(180deg)!important;transition:none!important;top:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link{background-color:#fff!important;color:var(--text-color);padding:12px 6px!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);box-shadow:none!important;background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem.p-focus>.p-menuitem-content{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-focus)>.p-menuitem-content .p-menuitem-link{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important;color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-icon{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-text{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:1px solid rgba(68,72,109,.1)!important;border-top:0!important;border-bottom-left-radius:10px;border-bottom-right-radius:10px}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator{border-top:1px solid rgba(68,72,109,.1)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}.no-documents-message{padding:12px 16px;text-align:center}.no-documents-message .text-muted{color:#9ea0b3;font-size:14px;font-style:italic}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i7$2.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }, { kind: "component", type: i8$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i9.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentsMenuComponent, decorators: [{
             type: Component,