import { Component, Input } from "@angular/core";
import { coerceNumberProperty } from '@angular/cdk/coercion';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class DxcFilePreviewComponent {
    constructor() {
        this.fileFormat = "default";
    }
    get tabIndexValue() {
        return this._tabIndexValue;
    }
    set tabIndexValue(value) {
        this._tabIndexValue = coerceNumberProperty(value);
    }
    ngOnInit() {
        if (this.file.format.includes("image")) {
            this.fileFormat = "image";
        }
        else if (this.file.format.includes("video")) {
            this.fileFormat = "video";
        }
        else if (this.file.format.includes("audio")) {
            this.fileFormat = "audio";
        }
    }
    onCloseHandler() {
        this.file.removeFile();
    }
}
DxcFilePreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: DxcFilePreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
DxcFilePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: DxcFilePreviewComponent, selector: "dxc-file-preview", inputs: { file: "file", tabIndexValue: "tabIndexValue" }, ngImport: i0, template: "<div class=\"info\">\n  <div class=\"previewImage\" *ngIf=\"!file.image\">\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'default'\"\n    >\n      <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n      <path\n        d=\"M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6z\"\n      />\n    </svg>\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'image'\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z\"\n      />\n    </svg>\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'video'\"\n    >\n      <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n      <path\n        d=\"M4 6.47L5.76 10H20v8H4V6.47M22 4h-4l2 4h-3l-2-4h-2l2 4h-3l-2-4H8l2 4H7L5 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V4z\"\n      />\n    </svg>\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'audio'\"\n    >\n      <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n      <path\n        d=\"M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zM8 15c0-1.66 1.34-3 3-3 .35 0 .69.07 1 .18V6h5v2h-3v7.03c-.02 1.64-1.35 2.97-3 2.97-1.66 0-3-1.34-3-3z\"\n      />\n    </svg>\n  </div>\n  <img class=\"previewImage\" *ngIf=\"file.image\" [src]=\"file.image\" />\n  <div class=\"labels\">\n    <label class=\"fileName\">{{ file.name }}</label>\n    <label class=\"fileSize\">{{ file.size }}</label>\n  </div>\n</div>\n\n<div class=\"removeIcon\" (click)=\"onCloseHandler()\">\n  <svg\n    [tabIndex]=\"tabIndexValue\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n  >\n    <path\n      d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n    />\n    <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n  </svg>\n</div>\n", styles: [":host{padding:24px 40px 24px 24px;height:48px;display:flex;justify-content:space-between;border-bottom:var(--upload-fileUnderlineThickness) solid var(--upload-fileUnderlineColor)}:host .removeIcon{display:flex;align-items:center;cursor:pointer;fill:var(--upload-fileDeleteIconColor)}:host .removeIcon svg{width:var(--upload-fileDeleteIconSize);height:var(--upload-fileDeleteIconSize)}:host:hover{background-color:var(--upload-hoverFileColor)}:host .info{display:flex;width:90%}:host .info .previewImage{width:70px;display:flex;justify-content:center;margin-right:24px;object-fit:contain}:host .info .previewImage svg{height:48px;width:48px}:host .info .labels{width:85%;display:flex;flex-direction:column;justify-content:space-between}:host .info .labels label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host .info .fileName{font-size:var(--upload-fileNameFontSize);font-style:var(--upload-fileNameFontStyle);font-weight:var(--upload-fileNameFontWeight);text-transform:var(--upload-fileNameFontTextTransform);color:var(--upload-fileNameFontColor);font-family:var(--upload-fontFamily)}:host .info .fileSize{font-size:var(--upload-fileTypeFontSize);font-family:var(--upload-fontFamily);letter-spacing:1.88px;color:var(--upload-fileTypeFontColor);font-style:var(--upload-fileTypeFontStyle);font-weight:var(--upload-fileTypeFontWeight);text-transform:var(--upload-fileTypeFontTextTransform)}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: DxcFilePreviewComponent, decorators: [{
            type: Component,
            args: [{ selector: "dxc-file-preview", template: "<div class=\"info\">\n  <div class=\"previewImage\" *ngIf=\"!file.image\">\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'default'\"\n    >\n      <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n      <path\n        d=\"M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6z\"\n      />\n    </svg>\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'image'\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z\"\n      />\n    </svg>\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'video'\"\n    >\n      <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n      <path\n        d=\"M4 6.47L5.76 10H20v8H4V6.47M22 4h-4l2 4h-3l-2-4h-2l2 4h-3l-2-4H8l2 4H7L5 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V4z\"\n      />\n    </svg>\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      *ngIf=\"fileFormat == 'audio'\"\n    >\n      <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n      <path\n        d=\"M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zM8 15c0-1.66 1.34-3 3-3 .35 0 .69.07 1 .18V6h5v2h-3v7.03c-.02 1.64-1.35 2.97-3 2.97-1.66 0-3-1.34-3-3z\"\n      />\n    </svg>\n  </div>\n  <img class=\"previewImage\" *ngIf=\"file.image\" [src]=\"file.image\" />\n  <div class=\"labels\">\n    <label class=\"fileName\">{{ file.name }}</label>\n    <label class=\"fileSize\">{{ file.size }}</label>\n  </div>\n</div>\n\n<div class=\"removeIcon\" (click)=\"onCloseHandler()\">\n  <svg\n    [tabIndex]=\"tabIndexValue\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n  >\n    <path\n      d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n    />\n    <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n  </svg>\n</div>\n", styles: [":host{padding:24px 40px 24px 24px;height:48px;display:flex;justify-content:space-between;border-bottom:var(--upload-fileUnderlineThickness) solid var(--upload-fileUnderlineColor)}:host .removeIcon{display:flex;align-items:center;cursor:pointer;fill:var(--upload-fileDeleteIconColor)}:host .removeIcon svg{width:var(--upload-fileDeleteIconSize);height:var(--upload-fileDeleteIconSize)}:host:hover{background-color:var(--upload-hoverFileColor)}:host .info{display:flex;width:90%}:host .info .previewImage{width:70px;display:flex;justify-content:center;margin-right:24px;object-fit:contain}:host .info .previewImage svg{height:48px;width:48px}:host .info .labels{width:85%;display:flex;flex-direction:column;justify-content:space-between}:host .info .labels label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host .info .fileName{font-size:var(--upload-fileNameFontSize);font-style:var(--upload-fileNameFontStyle);font-weight:var(--upload-fileNameFontWeight);text-transform:var(--upload-fileNameFontTextTransform);color:var(--upload-fileNameFontColor);font-family:var(--upload-fontFamily)}:host .info .fileSize{font-size:var(--upload-fileTypeFontSize);font-family:var(--upload-fontFamily);letter-spacing:1.88px;color:var(--upload-fileTypeFontColor);font-style:var(--upload-fileTypeFontStyle);font-weight:var(--upload-fileTypeFontWeight);text-transform:var(--upload-fileTypeFontTextTransform)}\n"] }]
        }], propDecorators: { file: [{
                type: Input
            }], tabIndexValue: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 