cat-documents-ng 0.0.5 → 0.0.7

package/{src → projects/cat-document-lib/src}/lib/document/components/document-list-item/document-list-item.component.html

@@ -1,33 +1,33 @@
-<div class="grid">
-    <div
-      class="col-12 flex align-items-center justify-content-between md:col-6 xl:col-12"
-    >
-      <div
-        class="col-5 flex cursor-pointer align-items-center pl-0"
-        (click)="handleOpenDocument(document)"
-      >
-        <img src="../../../../assets/images/Frame.png" alt="" />
-        <span class="ml-4">{{ document.fileName }}</span>
-      </div>
-      <div class="col-4 flex align-items-center justify-content-center">
-        <span
-          [class]="'product-badge status-' + document.status?.toLowerCase()"
-          class="flex align-items-center justify-content-center pl-2 pr-2 pt-1 pb-1 "
-        >
-          <ng-container *ngIf="document.status?.toLowerCase() === 'pending'">
-            <i class="pi pi-clock pr-1" style="font-size: 12px;"></i>
-            Pending
-          </ng-container>
-          <ng-container *ngIf="document.status?.toLowerCase() === 'verified'">
-            <i class="pi pi-check-circle pr-1" style="font-size: 12px;"></i>
-            Verified
-          </ng-container>
-          <ng-container *ngIf="document.status?.toLowerCase() === 'sentreminder'">
-            <i class="pi pi-bell pr-1" style="font-size: 12px;"></i>
-            Sent Reminder 
-          </ng-container>
-        </span>
-      </div>
-    </div>
-  </div>
+<div class="grid">
+    <div
+      class="col-12 flex align-items-center justify-content-between md:col-6 xl:col-12"
+    >
+      <div
+        class="col-5 flex cursor-pointer align-items-center pl-0"
+        (click)="handleOpenDocument(document)"
+      >
+        <img src="../../../../assets/images/Frame.png" alt="" />
+        <span class="ml-4">{{ document.fileName }}</span>
+      </div>
+      <div class="col-4 flex align-items-center justify-content-center">
+        <span
+          [class]="'product-badge status-' + document.status?.toLowerCase()"
+          class="flex align-items-center justify-content-center pl-2 pr-2 pt-1 pb-1 "
+        >
+          <ng-container *ngIf="document.status?.toLowerCase() === 'pending'">
+            <i class="pi pi-clock pr-1" style="font-size: 12px;"></i>
+            Pending
+          </ng-container>
+          <ng-container *ngIf="document.status?.toLowerCase() === 'verified'">
+            <i class="pi pi-check-circle pr-1" style="font-size: 12px;"></i>
+            Verified
+          </ng-container>
+          <ng-container *ngIf="document.status?.toLowerCase() === 'sentreminder'">
+            <i class="pi pi-bell pr-1" style="font-size: 12px;"></i>
+            Sent Reminder 
+          </ng-container>
+        </span>
+      </div>
+    </div>
+  </div>
   

package/{src → projects/cat-document-lib/src}/lib/document/components/document-list-item/document-list-item.component.scss

@@ -1,22 +1,22 @@
-.product-badge.status-pending {
-    background: #e9b127;
-    color: #ffffff;
-    border-radius: 4px;
-  }
-  .product-badge.status-verified {
-    background: #4caf50;
-    color: #ffffff;
-    border-radius: 4px;
-  }
-  .product-badge.status-sentreminder {
-    background: #f57c00;
-    color: #ffffff;
-    border-radius: 4px;
-  }
-  .product-badge {
-    text-transform: none;
-    font-weight: 500;
-    font-size: 12px;
-
-  }
+.product-badge.status-pending {
+    background: #e9b127;
+    color: #ffffff;
+    border-radius: 4px;
+  }
+  .product-badge.status-verified {
+    background: #4caf50;
+    color: #ffffff;
+    border-radius: 4px;
+  }
+  .product-badge.status-sentreminder {
+    background: #f57c00;
+    color: #ffffff;
+    border-radius: 4px;
+  }
+  .product-badge {
+    text-transform: none;
+    font-weight: 500;
+    font-size: 12px;
+
+  }
   

package/{src → projects/cat-document-lib/src}/lib/document/components/document-list-item/document-list-item.component.spec.ts

@@ -1,23 +1,23 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { DocumentListItemComponent } from './document-list-item.component';
-import { CommonModule } from '@angular/common';
-
-describe('DocumentListItemComponent', () => {
-  let component: DocumentListItemComponent;
-  let fixture: ComponentFixture<DocumentListItemComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [DocumentListItemComponent],
-      imports: [CommonModule], // Use CommonModule instead of BrowserModule
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(DocumentListItemComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { DocumentListItemComponent } from './document-list-item.component';
+import { CommonModule } from '@angular/common';
+
+describe('DocumentListItemComponent', () => {
+  let component: DocumentListItemComponent;
+  let fixture: ComponentFixture<DocumentListItemComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [DocumentListItemComponent],
+      imports: [CommonModule], // Use CommonModule instead of BrowserModule
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(DocumentListItemComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/{src → projects/cat-document-lib/src}/lib/document/components/document-list-item/document-list-item.component.ts

@@ -1,40 +1,40 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { DocumentModel } from '../../models/document.model';
-
-/**
- * DocumentListItemComponent
- *
- * This component displays individual document items within a list. 
- * It accepts a list of documents as input and handles interactions with documents.
- */
-@Component({
-  selector: 'lib-document-list-item',
-  standalone: false,
-  templateUrl: './document-list-item.component.html',
-  styleUrls: ['./document-list-item.component.scss']
-})
-export class DocumentListItemComponent {
- /**
-  * Emit the selected document.
-  * @type {EventEmitter<DocumentModel>}
-  */
-  @Output() documentClick = new EventEmitter<DocumentModel>();
-  
-  /**
-   * The document to display.
-   * @type {DocumentModel[]}
-   */
-  @Input() document!: DocumentModel;
-
-  /**
-   * Handles interactions with a document.
-   * @param {DocumentModel} document - The document to be opened or interacted with.
-   */
-    handleOpenDocument(document: DocumentModel): void {
-      if (!document) {
-        console.error('Error: Document is null or undefined:', document);
-        return;
-      }
-      this.documentClick.emit(document);
-    }
-}
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { DocumentModel } from '../../models/document.model';
+
+/**
+ * DocumentListItemComponent
+ *
+ * This component displays individual document items within a list. 
+ * It accepts a list of documents as input and handles interactions with documents.
+ */
+@Component({
+  selector: 'lib-document-list-item',
+  standalone: false,
+  templateUrl: './document-list-item.component.html',
+  styleUrls: ['./document-list-item.component.scss']
+})
+export class DocumentListItemComponent {
+ /**
+  * Emit the selected document.
+  * @type {EventEmitter<DocumentModel>}
+  */
+  @Output() documentClick = new EventEmitter<DocumentModel>();
+  
+  /**
+   * The document to display.
+   * @type {DocumentModel[]}
+   */
+  @Input() document!: DocumentModel;
+
+  /**
+   * Handles interactions with a document.
+   * @param {DocumentModel} document - The document to be opened or interacted with.
+   */
+    handleOpenDocument(document: DocumentModel): void {
+      if (!document) {
+        console.error('Error: Document is null or undefined:', document);
+        return;
+      }
+      this.documentClick.emit(document);
+    }
+}

package/{src → projects/cat-document-lib/src}/lib/document/components/document-upload/document-upload.component.html

@@ -1,56 +1,56 @@
-<div class="grid">
-  <div class="col-12 md:col-12">
-    <p-fileUpload #fileUploader [multiple]="true" auto="true" accept="image/png,application/pdf" maxFileSize="1000000"
-      (onSelect)="onSelectedFiles($event)">
-      <ng-template pTemplate="header" let-chooseCallback="chooseCallback" let-clearCallback="clearCallback">
-        <div class="p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2">
-          <div class="flex gap-2">
-            <p-button (onClick)="choose($event, chooseCallback)" icon="pi pi-images" [rounded]="true"
-              [outlined]="true" />
-          </div>
-        </div>
-      </ng-template>
-      <ng-template pTemplate="content" let-removeFileCallback="removeFileCallback"
-        let-removeUploadedFileCallback="removeUploadedFileCallback">
-        <div class="col-12 md:col-12 p-0">
-          <div class="col-12 md:col-12 p-0" *ngIf="uploadedFiles.length > 0">
-            <div *ngFor="let file of uploadedFiles; let i = index"
-              class="m-0 flex flex-column align-items-center gap-1 mt-3">
-              <div class="col-12 md:col-12 p-0 flex documentInfo">
-                <div class="documentImage">
-                  <img src="../../../../assets/images/document.png" [alt]="file.name" width="45"
-                    height="50" class="object-contain" />
-                </div>
-                <div class="flex w-full flex-column mt-2 ml-2">
-                  <div class="flex justify-content-between">
-                    <div style=" font-weight: bold;font-size: 14px">
-                      {{ file.fileName }}
-                    </div>
-                    <i class="pi pi-times cursor-pointer" (click)="handleDocumentRemove(file,i)"></i>
-                  </div>
-                  <div class="flex justify-content-between mt-1">
-                    <div style="color: #676B89; font-size: 12px;"></div>
-                    <div class="white-space-nowrap" style="color: #0F8BFD; font-family: 14px;">{{ getProgress(file) }} %
-                    </div>
-                  </div>
-                </div>
-              </div>
-              <div class="col-12 md:col-12 p-0">
-                <p-progressBar [value]="totalSizePercent" [showValue]="false" styleClass="h-1/2rem md:ml-auto relative"
-                  [ngClass]="{ 'exceeded-progress-bar': totalSizePercent > 100 }">
-                </p-progressBar>
-              </div>
-            </div>
-          </div>
-        </div>
-      </ng-template>
-      <ng-template pTemplate="empty" let-chooseCallback="chooseCallback" >
-        <div  *ngIf="!uploadedFiles.length"  class="flex align-items-center justify-content-center flex-column" (click)="triggerFileUpload()">
-          <i class="pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400"></i>
-          <p class="mt-4 mb-0">Drag and drop files here to upload.</p>
-        </div>
-      </ng-template>
-      <ng-template pTemplate="file"> </ng-template>
-    </p-fileUpload>
-  </div>
+<div class="grid">
+  <div class="col-12 md:col-12">
+    <p-fileUpload #fileUploader [multiple]="true" auto="true" accept="image/png,application/pdf" maxFileSize="1000000"
+      (onSelect)="onSelectedFiles($event)">
+      <ng-template pTemplate="header" let-chooseCallback="chooseCallback" let-clearCallback="clearCallback">
+        <div class="p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2">
+          <div class="flex gap-2">
+            <p-button (onClick)="choose($event, chooseCallback)" icon="pi pi-images" [rounded]="true"
+              [outlined]="true" />
+          </div>
+        </div>
+      </ng-template>
+      <ng-template pTemplate="content" let-removeFileCallback="removeFileCallback"
+        let-removeUploadedFileCallback="removeUploadedFileCallback">
+        <div class="col-12 md:col-12 p-0">
+          <div class="col-12 md:col-12 p-0" *ngIf="uploadedFiles.length > 0">
+            <div *ngFor="let file of uploadedFiles; let i = index"
+              class="m-0 flex flex-column align-items-center gap-1 mt-3">
+              <div class="col-12 md:col-12 p-0 flex documentInfo">
+                <div class="documentImage">
+                  <img src="../../../../assets/images/document.png" [alt]="file.name" width="45"
+                    height="50" class="object-contain" />
+                </div>
+                <div class="flex w-full flex-column mt-2 ml-2">
+                  <div class="flex justify-content-between">
+                    <div style=" font-weight: bold;font-size: 14px">
+                      {{ file.fileName }}
+                    </div>
+                    <i class="pi pi-times cursor-pointer" (click)="handleDocumentRemove(file,i)"></i>
+                  </div>
+                  <div class="flex justify-content-between mt-1">
+                    <div style="color: #676B89; font-size: 12px;"></div>
+                    <div class="white-space-nowrap" style="color: #0F8BFD; font-family: 14px;">{{ getProgress(file) }} %
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div class="col-12 md:col-12 p-0">
+                <p-progressBar [value]="totalSizePercent" [showValue]="false" styleClass="h-1/2rem md:ml-auto relative"
+                  [ngClass]="{ 'exceeded-progress-bar': totalSizePercent > 100 }">
+                </p-progressBar>
+              </div>
+            </div>
+          </div>
+        </div>
+      </ng-template>
+      <ng-template pTemplate="empty" let-chooseCallback="chooseCallback" >
+        <div  *ngIf="!uploadedFiles.length"  class="flex align-items-center justify-content-center flex-column" (click)="triggerFileUpload()">
+          <i class="pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400"></i>
+          <p class="mt-4 mb-0">Drag and drop files here to upload.</p>
+        </div>
+      </ng-template>
+      <ng-template pTemplate="file"> </ng-template>
+    </p-fileUpload>
+  </div>
 </div>

package/{src → projects/cat-document-lib/src}/lib/document/components/document-upload/document-upload.component.scss

@@ -1,26 +1,26 @@
-.flex {
-  display: flex;
-}
-.items-center {
-  align-items: center;
-}
-.justify-center {
-  justify-content: center;
-}
-.flex-col {
-  flex-direction: column;
-}
-.text-muted-color {
-  color: #6c757d; // Adjust to match your theme
-}
-.p-fileupload-buttonbar {
-  padding: 0px;
-}
-.p-fileupload-content {
-  background-color: #0f8bfd1a;
-}
-.p-fileupload {
-  .p-fileupload-content {
-    padding: 1rem 1rem;
-  }
-}
+.flex {
+  display: flex;
+}
+.items-center {
+  align-items: center;
+}
+.justify-center {
+  justify-content: center;
+}
+.flex-col {
+  flex-direction: column;
+}
+.text-muted-color {
+  color: #6c757d; // Adjust to match your theme
+}
+.p-fileupload-buttonbar {
+  padding: 0px;
+}
+.p-fileupload-content {
+  background-color: #0f8bfd1a;
+}
+.p-fileupload {
+  .p-fileupload-content {
+    padding: 1rem 1rem;
+  }
+}

package/{src → projects/cat-document-lib/src}/lib/document/components/document-upload/document-upload.component.spec.ts

@@ -1,24 +1,24 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { DocumentUploadComponent } from './document-upload.component';
-
-describe('DocumentUploadComponent', () => {
-  let component: DocumentUploadComponent;
-  let fixture: ComponentFixture<DocumentUploadComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [DocumentUploadComponent]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(DocumentUploadComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-
-});
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DocumentUploadComponent } from './document-upload.component';
+
+describe('DocumentUploadComponent', () => {
+  let component: DocumentUploadComponent;
+  let fixture: ComponentFixture<DocumentUploadComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [DocumentUploadComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(DocumentUploadComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+});