c3-components 0.12.0 → 0.14.0

package/lib/c3-file-displayer/c3-file-display-card/c3-file-display-card.component.d.ts

@@ -10,10 +10,11 @@ export declare class C3FileDisplayCardComponent {
     readonly deletable: import("@angular/core").InputSignal<boolean>;
     readonly size: import("@angular/core").InputSignal<C3FileCardSize>;
     readonly onDelete: import("@angular/core").OutputEmitterRef<void>;
+    readonly onDownload: import("@angular/core").OutputEmitterRef<void>;
     readonly getFileType: import("@angular/core").Signal<"image" | "application" | "video" | "unknown">;
     readonly getFileObjectUrl: import("@angular/core").Signal<Observable<string> | null>;
     readonly getFileName: import("@angular/core").Signal<string>;
     readonly getDisplayName: import("@angular/core").Signal<string>;
     static ɵfac: i0.ɵɵFactoryDeclaration<C3FileDisplayCardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<C3FileDisplayCardComponent, "c3-file-display-card", never, { "fileObjectUrl": { "alias": "fileObjectUrl"; "required": true; "isSignal": true; }; "displayFn": { "alias": "displayFn"; "required": false; "isSignal": true; }; "deletable": { "alias": "deletable"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "onDelete": "onDelete"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<C3FileDisplayCardComponent, "c3-file-display-card", never, { "fileObjectUrl": { "alias": "fileObjectUrl"; "required": true; "isSignal": true; }; "displayFn": { "alias": "displayFn"; "required": false; "isSignal": true; }; "deletable": { "alias": "deletable"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "onDelete": "onDelete"; "onDownload": "onDownload"; }, never, never, true, never>;
 }

package/lib/c3-file-displayer/c3-file-display-list/c3-file-display-list-column-def.directive.d.ts

@@ -2,11 +2,12 @@ import { TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare class C3FileDisplayListColumnDefDirective {
     readonly title: import("@angular/core").InputSignal<string>;
+    readonly classList: import("@angular/core").InputSignal<string[]>;
     private readonly _table;
     readonly headerCellDef: import("@angular/core").Signal<C3FileDisplayListHeaderCellDefDirective | undefined>;
     readonly cellDef: import("@angular/core").Signal<C3FileDisplayListCellDefDirective | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<C3FileDisplayListColumnDefDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<C3FileDisplayListColumnDefDirective, "[c3FileDisplayListColumnDef]", never, { "title": { "alias": "c3FileDisplayListColumnDef"; "required": true; "isSignal": true; }; }, {}, ["headerCellDef", "cellDef"], never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<C3FileDisplayListColumnDefDirective, "[c3FileDisplayListColumnDef]", never, { "title": { "alias": "c3FileDisplayListColumnDef"; "required": true; "isSignal": true; }; "classList": { "alias": "classList"; "required": false; "isSignal": true; }; }, {}, ["headerCellDef", "cellDef"], never, true, never>;
 }
 export declare class C3FileDisplayListHeaderCellDefDirective {
     template: TemplateRef<any>;

package/lib/c3-file-displayer/c3-file-display-list/c3-file-display-list.component.scss

@@ -3,84 +3,43 @@
   flex-direction: column;
   margin: 0.5rem;
 
-  .header {
-    display: flex;
-    align-items: center;
-    padding: 0 0.5rem;
-    border-bottom: 1px solid var(--mat-divider-color);
+  .file-table {
+    width: 100%;
+    border-collapse: collapse;
+
+    th,
+    td {
+      padding: 0.5rem;
+      text-align: left;
+      border-bottom: 1px solid var(--mat-divider-color);
+    }
 
-    .title {
-      flex-basis: 304px;
-      width: 304px;
+    th {
       font-size: 1.5rem;
       font-weight: bold;
-
-      &.full {
-        flex: auto;
-      }
-
-      &.icon {
-        flex: 0 0 auto;
-        width: 56px;
-        min-width: 56px;
-      }
+      background-color: var(--mat-table-header-container-background-color);
     }
 
-    .icon {
-      flex-basis: 40px;
-      width: 40px;
-    }
-  }
-
-  .file-display-list {
-    display: flex;
-    flex-direction: column;
-
-    > button {
-      display: flex;
-      flex-direction: row;
-      height: 3rem;
-      align-items: center;
-      border-bottom: 1px solid var(--mat-divider-color);
-      background-color: var(--mdc-protected-button-container-color);
-      text-align: start;
-      padding: 0 0.5rem;
-
+    tr {
       &:hover {
         background-color: var(--background-hover);
       }
+    }
 
-      .icon-cell {
-        flex: 0 0 auto;
-        width: 56px;
-        min-width: 56px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        padding: 0 0.5rem;
-
-        .icon {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-        }
-      }
-
-      .name {
-        flex: auto;
-        flex-basis: 304px;
-        width: 304px;
-      }
+    .icon {
+      width: 56px;
+      min-width: 56px;
+      text-align: center;
+    }
 
-      .cell {
-        flex-basis: 304px;
-        width: 304px;
-      }
+    :where(th, td):not(.full) {
+      width: 0;
+      white-space: nowrap;
+    }
 
-      .date-label {
-        flex-basis: 304px;
-        width: 304px;
-      }
+    .actions {
+      width: 48px;
+      text-align: center;
     }
   }
 }

package/lib/c3-file-viewer/c3-file-viewer.module.d.ts

@@ -7,11 +7,14 @@ import * as i5 from "./components/c3-file-viewer-pdf/c3-file-viewer-pdf.componen
 import * as i6 from "./components/c3-file-viewer-video/c3-file-viewer-video.component";
 import * as i7 from "./components/public/c3-file-viewer-dialog/c3-file-viewer-dialog.component";
 import * as i8 from "./components/public/c3-file-viewer-dialog/c3-file-viewer-dialog";
-import * as i9 from "@angular/common";
-import * as i10 from "../c3-safe-url/pipes/c3-safe-url.pipe";
-import * as i11 from "@angular/material/dialog";
+import * as i9 from "./components/c3-file-viewer-default/c3-file-viewer-default.component";
+import * as i10 from "@angular/common";
+import * as i11 from "../c3-safe-url/pipes/c3-safe-url.pipe";
+import * as i12 from "@angular/material/dialog";
+import * as i13 from "@angular/material/icon";
+import * as i14 from "@angular/material/button";
 export declare class C3FileViewerModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<C3FileViewerModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<C3FileViewerModule, [typeof i1.FullScreenDirective, typeof i2.C3FileViewerComponent, typeof i3.C3FileViewerActionsComponent, typeof i4.C3FileViewerImageComponent, typeof i5.C3FileViewerPdfComponent, typeof i6.C3FileViewerVideoComponent, typeof i7.C3FileViewerDialogComponent, typeof i8.C3FileViewerDialog], [typeof i9.CommonModule, typeof i10.C3SafeUrlPipe, typeof i11.MatDialogModule], [typeof i1.FullScreenDirective, typeof i2.C3FileViewerComponent, typeof i7.C3FileViewerDialogComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<C3FileViewerModule, [typeof i1.FullScreenDirective, typeof i2.C3FileViewerComponent, typeof i3.C3FileViewerActionsComponent, typeof i4.C3FileViewerImageComponent, typeof i5.C3FileViewerPdfComponent, typeof i6.C3FileViewerVideoComponent, typeof i7.C3FileViewerDialogComponent, typeof i8.C3FileViewerDialog, typeof i9.C3FileViewerDefaultComponent], [typeof i10.CommonModule, typeof i11.C3SafeUrlPipe, typeof i12.MatDialogModule, typeof i13.MatIconModule, typeof i14.MatButtonModule], [typeof i1.FullScreenDirective, typeof i2.C3FileViewerComponent, typeof i7.C3FileViewerDialogComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<C3FileViewerModule>;
 }

package/lib/c3-file-viewer/components/c3-file-viewer-default/c3-file-viewer-default.component.d.ts

@@ -0,0 +1,7 @@
+import { C3FileViewer } from '../../models/file-viewer';
+import * as i0 from "@angular/core";
+export declare class C3FileViewerDefaultComponent {
+    readonly fileViewer: import("@angular/core").InputSignal<C3FileViewer>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<C3FileViewerDefaultComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<C3FileViewerDefaultComponent, "c3-file-viewer-default", never, { "fileViewer": { "alias": "fileViewer"; "required": true; "isSignal": true; }; }, {}, never, never, false, never>;
+}

package/lib/c3-file-viewer/components/c3-file-viewer-default/c3-file-viewer-default.component.scss

@@ -0,0 +1,3 @@
+:host {
+  display: block;
+}

package/lib/c3-file-viewer/components/c3-file-viewer-video/c3-file-viewer-video.component.d.ts

@@ -1,12 +1,7 @@
-import { FileMetadata } from '../../models/file-metadata';
 import { C3FileViewer } from '../../models/file-viewer';
 import * as i0 from "@angular/core";
 export declare class C3FileViewerVideoComponent {
-    set _srcUpdated({ location }: FileMetadata);
-    src: string;
-    private src$;
-    fileViewer: C3FileViewer;
-    constructor();
+    readonly fileViewer: import("@angular/core").InputSignal<C3FileViewer>;
     static ɵfac: i0.ɵɵFactoryDeclaration<C3FileViewerVideoComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<C3FileViewerVideoComponent, "c3-file-viewer-video", never, { "_srcUpdated": { "alias": "file"; "required": false; }; "fileViewer": { "alias": "fileViewer"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<C3FileViewerVideoComponent, "c3-file-viewer-video", never, { "fileViewer": { "alias": "fileViewer"; "required": true; "isSignal": true; }; }, {}, never, never, false, never>;
 }

package/lib/c3-file-viewer/consts/supported-type.d.ts

@@ -0,0 +1,2 @@
+export declare const SUPPORTED_MIME_TYPES: string[];
+export declare function isMimeTypeSupported(mimeType: string): boolean;

package/lib/c3-file-viewer/models/file-viewer-config.model.d.ts

@@ -23,6 +23,7 @@ export interface C3FileViewerConfig {
         next?: boolean;
         prev?: boolean;
         reset?: boolean;
+        download?: boolean;
     };
     btnIcons?: {
         zoomIn?: MultiBtn['btn'];
@@ -33,6 +34,7 @@ export interface C3FileViewerConfig {
         prev?: MultiBtn['btn'];
         fullscreen?: MultiBtn['btn'];
         reset?: MultiBtn['btn'];
+        download?: MultiBtn['btn'];
     };
     customBtns?: Array<{
         name: string;

package/lib/c3-file-viewer/models/file-viewer.d.ts

@@ -32,7 +32,7 @@ export declare class C3FileViewer {
     get files(): FileMetadata[];
     private _files;
     filesObjectUrl: Array<FileMetadata & {
-        objectUrl: Observable<string>;
+        objectUrl?: Observable<string>;
     }>;
     private locationBlobMap;
     private scale;
@@ -41,12 +41,12 @@ export declare class C3FileViewer {
     private translateY;
     private prevX;
     private prevY;
-    constructor({ config, files, client, }: {
+    constructor({ config, files, client }: {
         config?: C3FileViewerConfig;
         files?: FileMetadata[];
         client: HttpClient;
     });
-    createObjectURL(file: FileMetadata | VariantFile): Observable<string>;
+    createObjectURL(file: FileMetadata | VariantFile): Observable<string> | undefined;
     getFile(location: string): Observable<Blob>;
     previousImage(event: KeyboardEvent | MouseEvent): void;
     nextImage(event: KeyboardEvent | MouseEvent): void;
@@ -55,15 +55,19 @@ export declare class C3FileViewer {
     scrollZoom(evt: WheelEvent): boolean;
     rotateClockwise(): void;
     rotateCounterClockwise(): void;
-    onLoad(): void;
+    onLoaded(): void;
     onLoadStart(): void;
     imageNotFound(file: FileMetadata): void;
     onDragOver(evt: DragEvent): void;
     onDragStart(evt: DragEvent): void;
     toggleFullscreen(): void;
     reset(): void;
+    getOriginalName(file?: FileMetadata): any;
     private canNavigate;
     private updateStyle;
     private valueToCss;
     private mergeConfig;
+    download(file?: FileMetadata): void;
+    private downloadFromUrl;
+    private downloadWithClient;
 }

package/lib/c3-file-viewer/styles/_c3-file-viewer.scss

@@ -102,6 +102,20 @@
   .c3-file-viewer-pdf {
     height: 100%;
     width: 100%;
+    position: relative;
+
+    .download-button {
+      position: absolute;
+      bottom: 10px;
+      right: 10px;
+      z-index: 99;
+      background-color: #00000000;
+      border: none;
+      color: #fff;
+      font-size: 24px;
+      cursor: pointer;
+      padding: 10px;
+    }
   }
 
   .c3-file-viewer {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "c3-components",
-  "version": "0.12.0",
+  "version": "0.14.0",
   "description": "C3 Components Library",
   "author": "c3ulnta0rk",
   "license": "MIT",