@ifsworld/granite-components 14.1.2 → 14.2.1

package/fesm2022/ifsworld-granite-components-file-upload.mjs

@@ -0,0 +1,370 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Directive, HostBinding, Input, Output, HostListener, ElementRef, Component, ViewChild, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i2 from '@ifsworld/granite-components';
+import { GraniteButtonModule, GraniteIconModule } from '@ifsworld/granite-components';
+import * as i3 from '@ifsworld/granite-components/carousel';
+import { GraniteCarouselModule } from '@ifsworld/granite-components/carousel';
+
+const fileSizes = [
+    'Bytes',
+    'KB',
+    'MB',
+    'GB',
+    'TB',
+    'PB',
+    'EB',
+    'ZB',
+    'YB',
+];
+var FileUploadStatus;
+(function (FileUploadStatus) {
+    FileUploadStatus["NotStarted"] = "NotStarted";
+    FileUploadStatus["InProgress"] = "InProgress";
+    FileUploadStatus["Completed"] = "Completed";
+    FileUploadStatus["Failed"] = "Failed";
+    FileUploadStatus["Cancelled"] = "Cancelled";
+})(FileUploadStatus || (FileUploadStatus = {}));
+var FilUploadErrorTypes;
+(function (FilUploadErrorTypes) {
+    FilUploadErrorTypes["ExtensionNotSupported"] = "ExtensionNotSupported";
+    FilUploadErrorTypes["MultipleFilesNotSupported"] = "MultipleFilesNotSupported";
+})(FilUploadErrorTypes || (FilUploadErrorTypes = {}));
+const DEFAULT_MULTI_FILE_SUPPORT = false;
+const DEFAULT_ACCEPT_TYPE = '*.*';
+const DEFAULT_UPLOAD_TITLE = 'Upload Files';
+const DEFAULT_UPLOAD_ICON = 'icon-upload';
+const DEFAULT_FILE_BROWSE_BUTTON_ICON = 'icon-folder-alt';
+const DEFAULT_DROPZONE_TEXT = 'Drop here or';
+const DEFAULT_BROWSE_BUTTON_TEXT = 'Browse';
+const DEFAULT_DROP_PLACEHOLDER_TEXT = 'Drop files here';
+const DEFAULT_DROPZONE_HINT = '';
+const DEFAULT_REMOVE_BUTTON_TEXT = 'Remove';
+const DEFAULT_UPLOAD_BUTTON_TEXT = 'Upload Files';
+const DEFAULT_RETRY_BUTTON_TEXT = 'Retry';
+const DEFAULT_CANCEL_BUTTON_TEXT = 'Cancel';
+const DEFAULT_RESPONSIVE_OPTIONS = [
+    { breakpoint: '1200px', numVisible: 4, numScroll: 1 },
+    { breakpoint: '992px', numVisible: 3, numScroll: 1 },
+    { breakpoint: '768px', numVisible: 2, numScroll: 1 },
+    { breakpoint: '576px', numVisible: 1, numScroll: 1 },
+];
+const DEFAULT_VISIBLE_FILES = 10;
+
+function validFileTypes(mimeTypesStringToCheck, files) {
+    const supportedFileMimeTypes = mimeTypesStringToCheck
+        .split(',')
+        .map((ext) => ext.trim());
+    if (!files || files.length === 0) {
+        return false;
+    }
+    return files.every((file) => {
+        const fileType = file['type'];
+        return fileType && supportedFileMimeTypes.includes(fileType);
+    });
+}
+
+class GraniteFileDragAndDropDirective {
+    constructor() {
+        this.currentFiles = [];
+        this.droppedFiles = new EventEmitter();
+        this.isFileOver = new EventEmitter();
+        this.fileUploadValidation = new EventEmitter();
+    }
+    onDragOver(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        const transferFiles = event.dataTransfer?.items ?? [];
+        if (!validFileTypes(this.accept, Array.from(transferFiles))) {
+            this.fileBrowseError = true;
+            this.fileUploadValidation.emit({
+                isError: this.fileBrowseError,
+                type: FilUploadErrorTypes.ExtensionNotSupported,
+            });
+            return;
+        }
+        if (!this.multiFileUploadEnabled &&
+            (transferFiles.length > 1 || this.currentFiles.length >= 1)) {
+            this.fileBrowseError = true;
+            this.fileUploadValidation.emit({
+                isError: this.fileBrowseError,
+                type: FilUploadErrorTypes.MultipleFilesNotSupported,
+            });
+            return;
+        }
+        this.fileOver = true;
+        this.isFileOver.emit(this.fileOver);
+    }
+    onDragLeave(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.fileOver = false;
+        this.fileBrowseError = false;
+        this.fileUploadValidation.emit({ isError: false, type: null });
+        this.isFileOver.emit(this.fileOver);
+    }
+    onDrop(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (this.fileBrowseError) {
+            this.fileBrowseError = false;
+            this.fileUploadValidation.emit({
+                isError: this.fileBrowseError,
+                type: null,
+            });
+            return;
+        }
+        this.currentFiles = [
+            ...this.currentFiles,
+            ...Array.from(event.dataTransfer.files),
+        ];
+        this.fileOver = false;
+        this.isFileOver.emit(this.fileOver);
+        if (this.currentFiles.length > 0) {
+            this.droppedFiles.emit(this.currentFiles);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileDragAndDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: GraniteFileDragAndDropDirective, selector: "[graniteFileDragAndDrop]", inputs: { multiFileUploadEnabled: "multiFileUploadEnabled", accept: "accept", currentFiles: "currentFiles" }, outputs: { droppedFiles: "droppedFiles", isFileOver: "isFileOver", fileUploadValidation: "fileUploadValidation" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" }, properties: { "class.file-over": "this.fileOver", "class.file-error": "this.fileBrowseError" } }, exportAs: ["graniteFileDragAndDrop"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileDragAndDropDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[graniteFileDragAndDrop]',
+                    exportAs: 'graniteFileDragAndDrop',
+                }]
+        }], propDecorators: { fileOver: [{
+                type: HostBinding,
+                args: ['class.file-over']
+            }], fileBrowseError: [{
+                type: HostBinding,
+                args: ['class.file-error']
+            }], multiFileUploadEnabled: [{
+                type: Input
+            }], accept: [{
+                type: Input
+            }], currentFiles: [{
+                type: Input
+            }], droppedFiles: [{
+                type: Output
+            }], isFileOver: [{
+                type: Output
+            }], fileUploadValidation: [{
+                type: Output
+            }], onDragOver: [{
+                type: HostListener,
+                args: ['dragover', ['$event']]
+            }], onDragLeave: [{
+                type: HostListener,
+                args: ['dragleave', ['$event']]
+            }], onDrop: [{
+                type: HostListener,
+                args: ['drop', ['$event']]
+            }] } });
+
+class GraniteFileUploadComponent {
+    constructor() {
+        this.accept = DEFAULT_ACCEPT_TYPE;
+        this.uploadTitle = DEFAULT_UPLOAD_TITLE;
+        this.uploadIcon = DEFAULT_UPLOAD_ICON;
+        this.browseIcon = DEFAULT_FILE_BROWSE_BUTTON_ICON;
+        this.dropZoneText = DEFAULT_DROPZONE_TEXT;
+        this.browseButtonText = DEFAULT_BROWSE_BUTTON_TEXT;
+        this.dropPlaceholderText = DEFAULT_DROP_PLACEHOLDER_TEXT;
+        this.dropZoneHint = DEFAULT_DROPZONE_HINT;
+        this.removeButtonText = DEFAULT_REMOVE_BUTTON_TEXT;
+        this.uploadButtonText = DEFAULT_UPLOAD_BUTTON_TEXT;
+        this.retryButtonText = DEFAULT_RETRY_BUTTON_TEXT;
+        this.cancelButtonText = DEFAULT_CANCEL_BUTTON_TEXT;
+        this.multiFileUpload = DEFAULT_MULTI_FILE_SUPPORT;
+        this.responsiveOptions = DEFAULT_RESPONSIVE_OPTIONS;
+        this.browseOrDragFiles = new EventEmitter();
+        this.removeFiles = new EventEmitter();
+        this.filesUpload = new EventEmitter();
+        this.fileUploadValidation = new EventEmitter();
+        this.selectedFiles = [];
+        this.previewReadyFiles = [];
+        this.isFileOnDropzone = false;
+        this.FileUploadStatus = FileUploadStatus;
+        this.fileError = false;
+        this.numVisible = DEFAULT_VISIBLE_FILES;
+        this._uploadStatus = FileUploadStatus.NotStarted;
+        this._autoUpload = true;
+    }
+    get uploadStatus() {
+        return this._uploadStatus;
+    }
+    set uploadStatus(status) {
+        this._uploadStatus = status;
+    }
+    get autoUpload() {
+        return this._autoUpload;
+    }
+    set autoUpload(value) {
+        this._autoUpload = coerceBooleanProperty(value);
+    }
+    fileBrowseHandler(event) {
+        const target = event.target;
+        const files = Array.from(target.files);
+        if (!validFileTypes(this.accept, files)) {
+            this.fileUploadValidation.emit({
+                isError: true,
+                type: FilUploadErrorTypes.ExtensionNotSupported,
+            });
+            this.fileDropRef.nativeElement.value = null;
+            return;
+        }
+        this.selectedFiles = [...this.selectedFiles, ...files];
+        this.previewReadyFiles = this.prepareSelectedFiles(this.selectedFiles);
+        this.browseOrDragFiles.emit(this.previewReadyFiles);
+    }
+    fileRemoveHandler(fileToRemove) {
+        const index = this.previewReadyFiles.findIndex((file) => file.imageUrl === fileToRemove.imageUrl &&
+            file.file?.name === fileToRemove.file?.name &&
+            file.readableSize === fileToRemove.readableSize);
+        this.selectedFiles.splice(index, 1);
+        this.previewReadyFiles.splice(index, 1);
+        if (this.selectedFiles.length === 0 &&
+            this.previewReadyFiles.length === 0) {
+            this.fileDropRef.nativeElement.value = null;
+            this.uploadStatus = FileUploadStatus.NotStarted;
+        }
+        this.removeFiles.emit(this.previewReadyFiles);
+    }
+    onFilesDropHandler(files) {
+        if (!this.multiFileUpload &&
+            (this.selectedFiles.length === 1 || files.length !== 1)) {
+            this.fileError = true;
+            return;
+        }
+        this.selectedFiles = files;
+        this.previewReadyFiles = this.prepareSelectedFiles(this.selectedFiles);
+        this.browseOrDragFiles.emit(this.previewReadyFiles);
+    }
+    onFileOverDropzone(isFileOver) {
+        this.isFileOnDropzone = isFileOver;
+    }
+    onFileDropError(validation) {
+        this.fileError = validation.isError;
+        this.fileDropErrorType = validation.type;
+    }
+    prepareSelectedFiles(files) {
+        return files.map((file) => ({
+            file,
+            readableSize: this.formatBytesToReadableSize(file.size, 2),
+            imageUrl: file.type.startsWith('image/')
+                ? URL.createObjectURL(file)
+                : null,
+        }));
+    }
+    uploadFiles() {
+        this.filesUpload.emit();
+    }
+    retryUpload() {
+        this.filesUpload.emit();
+    }
+    cancelUpload() {
+        this.resetFileUpload();
+        this.removeFiles.emit(this.previewReadyFiles);
+    }
+    resetFileUpload() {
+        this.fileDropRef.nativeElement.value = null;
+        this.fileError = false;
+        this.fileDropErrorType = '';
+        this.selectedFiles = [];
+        this.previewReadyFiles = [];
+        this.uploadStatus = FileUploadStatus.NotStarted;
+    }
+    formatBytesToReadableSize(bytes, decimals) {
+        if (bytes === 0) {
+            return `0 ${fileSizes[0]}`;
+        }
+        const bytesPerKB = 1024;
+        const decimalPoints = decimals <= 0 ? 0 : decimals || 2;
+        const exp = Math.floor(Math.log(bytes) / Math.log(bytesPerKB));
+        return `${parseFloat((bytes / Math.pow(bytesPerKB, exp)).toFixed(decimalPoints))} ${fileSizes[exp]}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: GraniteFileUploadComponent, selector: "granite-file-upload", inputs: { accept: "accept", uploadTitle: "uploadTitle", uploadIcon: "uploadIcon", browseIcon: "browseIcon", dropZoneText: "dropZoneText", browseButtonText: "browseButtonText", dropPlaceholderText: "dropPlaceholderText", dropZoneHint: "dropZoneHint", removeButtonText: "removeButtonText", uploadButtonText: "uploadButtonText", retryButtonText: "retryButtonText", cancelButtonText: "cancelButtonText", multiFileUpload: "multiFileUpload", responsiveOptions: "responsiveOptions", uploadStatus: "uploadStatus", autoUpload: "autoUpload" }, outputs: { browseOrDragFiles: "browseOrDragFiles", removeFiles: "removeFiles", filesUpload: "filesUpload", fileUploadValidation: "fileUploadValidation" }, viewQueries: [{ propertyName: "fileDropRef", first: true, predicate: ["fileDropRef"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"file-upload-wrapper\">\n  <h2 class=\"file-upload-title\">{{ uploadTitle }}</h2>\n  <div\n    class=\"file-dropzone\"\n    [ngClass]=\"{ 'upload-failed': uploadStatus === FileUploadStatus.Failed }\"\n    graniteFileDragAndDrop\n    (droppedFiles)=\"onFilesDropHandler($event)\"\n    (isFileOver)=\"onFileOverDropzone($event)\"\n    (fileUploadValidation)=\"onFileDropError($event)\"\n    [multiFileUploadEnabled]=\"multiFileUpload\"\n    [accept]=\"accept\"\n    [currentFiles]=\"selectedFiles\"\n  >\n    <input\n      class=\"file-input\"\n      #fileDropRef\n      type=\"file\"\n      title=\"fileUpload\"\n      (change)=\"fileBrowseHandler($event)\"\n      [multiple]=\"multiFileUpload\"\n      [accept]=\"accept\"\n    />\n    <div class=\"file-upload-body\">\n      @if (!isFileOnDropzone && !fileError) {\n        @switch (previewReadyFiles.length) {\n          @case (0) {\n            <div class=\"file-upload-browse\">\n              <granite-icon\n                class=\"file-upload-icon\"\n                [fontIcon]=\"uploadIcon\"\n              ></granite-icon>\n              <div class=\"file-selection\">\n                <h2 class=\"file-upload-body-text\">{{ dropZoneText }}</h2>\n                <button\n                  class=\"file-select-button\"\n                  graniteButton\n                  (click)=\"fileDropRef.click()\"\n                >\n                  <granite-icon\n                    class=\"browse-button-icon\"\n                    [fontIcon]=\"browseIcon\"\n                  ></granite-icon>\n                  <div class=\"browse-button-text\">{{ browseButtonText }}</div>\n                </button>\n              </div>\n              <p *ngIf=\"dropZoneHint\" class=\"file-upload-hint\">\n                {{ dropZoneHint }}\n              </p>\n            </div>\n          }\n          @case (1) {\n            <ng-container\n              *ngTemplateOutlet=\"\n                filePreviewTemplate;\n                context: { previewFile: previewReadyFiles[0] }\n              \"\n            ></ng-container>\n          }\n          @default {\n            <granite-carousel\n              [items]=\"previewReadyFiles\"\n              [numVisible]=\"numVisible\"\n              [responsiveOptions]=\"responsiveOptions\"\n            >\n              <ng-template let-previewFile #itemTemplate>\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    filePreviewTemplate;\n                    context: { previewFile: previewFile }\n                  \"\n                ></ng-container>\n              </ng-template>\n            </granite-carousel>\n          }\n        }\n      } @else {\n        <p class=\"drop-area-placeholder\">\n          {{ dropPlaceholderText }}\n        </p>\n      }\n    </div>\n  </div>\n  <div class=\"file-upload-footer\">\n    <div class=\"footer-container\" *ngIf=\"previewReadyFiles.length > 0\">\n      <button\n        *ngIf=\"!autoUpload && uploadStatus === FileUploadStatus.NotStarted\"\n        granitePrimaryButton\n        (click)=\"uploadFiles()\"\n      >\n        {{ uploadButtonText }}\n      </button>\n      <ng-container *ngIf=\"uploadStatus === FileUploadStatus.Failed\">\n        <button graniteButton (click)=\"cancelUpload()\">\n          {{ cancelButtonText }}\n        </button>\n        <button\n          class=\"retry-upload-button\"\n          granitePrimaryButton\n          (click)=\"retryUpload()\"\n        >\n          {{ retryButtonText }}\n        </button>\n      </ng-container>\n    </div>\n  </div>\n</div>\n\n<ng-template #uploadingOverlay>\n  <div class=\"file-preview-overlay\"></div>\n  <div class=\"loading-container\">\n    <div class=\"uploading-spinner\"></div>\n  </div>\n</ng-template>\n\n<ng-template #uploadFailedOverlay>\n  <div class=\"file-preview-overlay\"></div>\n</ng-template>\n\n<ng-template #filePreviewTemplate let-previewFile=\"previewFile\">\n  <div class=\"file-preview-container\">\n    @if (previewFile?.imageUrl) {\n      <a\n        class=\"file-preview-link\"\n        [ngClass]=\"{\n          'uploading-in-progress': uploadStatus === FileUploadStatus.InProgress,\n          'upload-failed': uploadStatus === FileUploadStatus.Failed\n        }\"\n        [href]=\"previewFile?.imageUrl\"\n        target=\"_blank\"\n      >\n        <div class=\"file-preview-holder\">\n          <img\n            role=\"presentation\"\n            [src]=\"previewFile?.imageUrl\"\n            [alt]=\"previewFile?.file?.name\"\n          />\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.InProgress\"\n            [ngTemplateOutlet]=\"uploadingOverlay\"\n          ></ng-container>\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.Failed\"\n            [ngTemplateOutlet]=\"uploadFailedOverlay\"\n          >\n          </ng-container>\n        </div>\n        <p class=\"file-name\" [title]=\"previewFile?.file?.name\">\n          {{ previewFile?.file?.name }}\n        </p>\n        <p class=\"file-size\">{{ previewFile?.readableSize }}</p>\n      </a>\n    } @else {\n      <div\n        class=\"document-preview-link\"\n        [ngClass]=\"{\n          'uploading-in-progress': uploadStatus === FileUploadStatus.InProgress,\n          'upload-failed': uploadStatus === FileUploadStatus.Failed\n        }\"\n      >\n        <div class=\"document-preview-holder\">\n          <granite-icon\n            class=\"document-file-preview\"\n            [class.upload-failed]=\"uploadStatus === FileUploadStatus.Failed\"\n            [fontIcon]=\"'icon-document-alt'\"\n          ></granite-icon>\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.InProgress\"\n            [ngTemplateOutlet]=\"uploadingOverlay\"\n          ></ng-container>\n        </div>\n        <p class=\"file-name\" [title]=\"previewFile?.file?.name\">\n          {{ previewFile?.file?.name }}\n        </p>\n        <p class=\"file-size\">{{ previewFile?.readableSize }}</p>\n      </div>\n    }\n    <button\n      graniteButton\n      *ngIf=\"\n        [FileUploadStatus.Completed, FileUploadStatus.NotStarted].includes(\n          uploadStatus\n        )\n      \"\n      (click)=\"fileRemoveHandler(previewFile)\"\n    >\n      {{ removeButtonText }}\n    </button>\n  </div>\n</ng-template>\n", styles: [":host{width:100%}.file-upload-wrapper{display:flex;flex-direction:column;background-color:var(--granite-color-background);box-shadow:var(--granite-shadow-s);height:100%;width:100%}.file-upload-wrapper .file-upload-title{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-medium);font-weight:var(--granite-font-weight-bold);line-height:var(--granite-line-height-base-rem);color:var(--granite-color-text-weak);margin:0;padding:var(--granite-spacing-8) calc(var(--granite-spacing-16) * .813)}.file-upload-wrapper .file-dropzone{display:flex;flex-direction:column;border-width:var(--granite-border-width-focus);border-style:dashed;border-color:var(--granite-color-background-selected);border-radius:var(--granite-radius-m);margin:var(--granite-spacing-8);height:100%}.file-upload-wrapper .file-dropzone.upload-failed{border-color:var(--granite-color-categorical-4)}.file-upload-wrapper .file-dropzone.file-error{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text);text-align:center;background-color:var(--granite-color-background-lobby-failure);border-color:var(--granite-color-state-error);transition:background .15s ease}.file-upload-wrapper .file-dropzone.file-error .drop-area-placeholder{margin:0}.file-upload-wrapper .file-dropzone.file-over{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text);text-align:center;background-color:var(--granite-color-background-lobby-info);border-color:var(--granite-color-background-active);transition:background .15s ease}.file-upload-wrapper .file-dropzone.file-over .drop-area-placeholder{margin:0}.file-upload-wrapper .file-dropzone .file-input{opacity:0;position:absolute;width:0}.file-upload-wrapper .file-dropzone .file-upload-body{display:flex;align-items:center;justify-content:center;height:100%}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse{display:flex;flex-direction:column;gap:var(--granite-spacing-4);justify-content:center;align-items:center;padding:0 var(--granite-spacing-16)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-upload-icon{font-size:var(--granite-font-size-display-small);color:var(--granite-color-text)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection{display:flex;justify-content:space-between;align-items:center}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-upload-body-text{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text);text-align:center;width:100%;margin-inline-end:var(--granite-spacing-4)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button{display:flex;justify-content:space-between;align-items:center;color:var(--granite-color-text-link);padding-top:calc(var(--granite-spacing-24) / 4)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button .browse-button-icon{font-size:var(--granite-font-size-body);color:var(--granite-color-text-link);margin-inline-end:var(--granite-spacing-4);padding:0}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button .browse-button-text{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-flowing) / 2);margin-top:var(--granite-spacing-4)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button:hover .browse-button-icon,.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button:hover .browse-button-text{color:var(--granite-color-text-inverse)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-upload-hint{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-base-rem) * 1.125);text-align:center;color:var(--granite-color-text-hint);margin:calc(var(--granite-spacing-base-rem) * .625) 0 0}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container{display:flex;flex-direction:column;align-items:center;width:100%;max-height:100%;padding:calc(var(--granite-spacing-base-rem) * .375)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link{display:flex;flex-direction:column;align-items:center;max-width:50%;padding:0 var(--granite-spacing-8);text-decoration:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link:hover .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link:hover .file-size{text-decoration:underline}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder{display:flex;justify-content:center;align-items:flex-end;position:relative;width:80px;height:114px}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder img{width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(250%)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder .file-preview-overlay{position:absolute;top:0;inset-inline-start:0;width:100%;height:100%;pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder .loading-container{position:absolute;top:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder .loading-container .uploading-spinner{width:50px;height:50px;border-radius:50%;border:6px solid;border-color:var(--granite-color-background-page);border-right-color:var(--granite-color-background-active);animation:loading-keyframe 1s infinite linear}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-preview-holder img{opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-preview-holder .file-preview-overlay{background-color:var(--granite-color-signal-failure);opacity:.2}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-size{color:var(--granite-color-signal-failure);opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-preview-holder img,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-preview-holder .file-preview-overlay,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-size{opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-name{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text-link);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:calc(var(--granite-spacing-base-rem) * .375) 0 0;width:100%;text-align:center}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-size{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-base-rem) * .625);color:var(--granite-color-text-link);margin:0 0 calc(var(--granite-spacing-base-rem) * .875)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link{display:flex;flex-direction:column;align-items:center;max-width:50%;padding:0 var(--granite-spacing-8);text-decoration:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder{display:flex;justify-content:center;align-items:flex-end;position:relative;width:60px;height:60px}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .document-file-preview{font-size:calc(var(--granite-font-size-body) * 3);color:var(--granite-color-text-hint);padding:calc(var(--granite-spacing-4) * 3) 0}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .document-file-preview.upload-failed{color:var(--granite-color-background-failure)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .loading-container{position:absolute;top:50%;inset-inline-start:50%;transform:translate(-50%,-10%)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .loading-container .uploading-spinner{width:50px;height:50px;border-radius:50%;border:6px solid;border-color:var(--granite-color-background-page);border-right-color:var(--granite-color-background-active);animation:loading-keyframe 1s infinite linear}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed .document-preview-holder .file-preview-overlay{background-color:var(--granite-color-signal-failure);opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed .file-size{color:var(--granite-color-signal-failure);opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .document-preview-holder .document-file-preview,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .document-preview-holder .file-preview-overlay,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .file-size{opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .file-name{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text-weak);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:calc(var(--granite-spacing-base-rem) * .375) 0 0;width:100%;text-align:center}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .file-size{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-base-rem) * .625);color:var(--granite-color-text-week);margin:0 0 calc(var(--granite-spacing-base-rem) * .875)}.file-upload-wrapper .file-upload-footer{margin-inline:var(--granite-spacing-8);margin-bottom:var(--granite-spacing-8)}.file-upload-wrapper .file-upload-footer .footer-container{display:flex;justify-content:flex-end;align-items:center}.file-upload-wrapper .file-upload-footer .footer-container .retry-upload-button{margin-inline-start:var(--granite-spacing-8)}@keyframes loading-keyframe{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.GraniteButtonComponent, selector: "button[graniteButton],    button[granitePrimaryButton],    button[graniteFlatButton],    button[graniteToolbarButton]  ", inputs: ["disabled", "toggled"], exportAs: ["graniteButton"] }, { kind: "component", type: i2.GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }, { kind: "component", type: i3.GraniteCarouselComponent, selector: "granite-carousel", inputs: ["items", "responsiveOptions", "numVisible", "numScroll", "circular", "prevButtonAriaLabel", "nextButtonAriaLabel"] }, { kind: "directive", type: GraniteFileDragAndDropDirective, selector: "[graniteFileDragAndDrop]", inputs: ["multiFileUploadEnabled", "accept", "currentFiles"], outputs: ["droppedFiles", "isFileOver", "fileUploadValidation"], exportAs: ["graniteFileDragAndDrop"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileUploadComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'granite-file-upload', template: "<div class=\"file-upload-wrapper\">\n  <h2 class=\"file-upload-title\">{{ uploadTitle }}</h2>\n  <div\n    class=\"file-dropzone\"\n    [ngClass]=\"{ 'upload-failed': uploadStatus === FileUploadStatus.Failed }\"\n    graniteFileDragAndDrop\n    (droppedFiles)=\"onFilesDropHandler($event)\"\n    (isFileOver)=\"onFileOverDropzone($event)\"\n    (fileUploadValidation)=\"onFileDropError($event)\"\n    [multiFileUploadEnabled]=\"multiFileUpload\"\n    [accept]=\"accept\"\n    [currentFiles]=\"selectedFiles\"\n  >\n    <input\n      class=\"file-input\"\n      #fileDropRef\n      type=\"file\"\n      title=\"fileUpload\"\n      (change)=\"fileBrowseHandler($event)\"\n      [multiple]=\"multiFileUpload\"\n      [accept]=\"accept\"\n    />\n    <div class=\"file-upload-body\">\n      @if (!isFileOnDropzone && !fileError) {\n        @switch (previewReadyFiles.length) {\n          @case (0) {\n            <div class=\"file-upload-browse\">\n              <granite-icon\n                class=\"file-upload-icon\"\n                [fontIcon]=\"uploadIcon\"\n              ></granite-icon>\n              <div class=\"file-selection\">\n                <h2 class=\"file-upload-body-text\">{{ dropZoneText }}</h2>\n                <button\n                  class=\"file-select-button\"\n                  graniteButton\n                  (click)=\"fileDropRef.click()\"\n                >\n                  <granite-icon\n                    class=\"browse-button-icon\"\n                    [fontIcon]=\"browseIcon\"\n                  ></granite-icon>\n                  <div class=\"browse-button-text\">{{ browseButtonText }}</div>\n                </button>\n              </div>\n              <p *ngIf=\"dropZoneHint\" class=\"file-upload-hint\">\n                {{ dropZoneHint }}\n              </p>\n            </div>\n          }\n          @case (1) {\n            <ng-container\n              *ngTemplateOutlet=\"\n                filePreviewTemplate;\n                context: { previewFile: previewReadyFiles[0] }\n              \"\n            ></ng-container>\n          }\n          @default {\n            <granite-carousel\n              [items]=\"previewReadyFiles\"\n              [numVisible]=\"numVisible\"\n              [responsiveOptions]=\"responsiveOptions\"\n            >\n              <ng-template let-previewFile #itemTemplate>\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    filePreviewTemplate;\n                    context: { previewFile: previewFile }\n                  \"\n                ></ng-container>\n              </ng-template>\n            </granite-carousel>\n          }\n        }\n      } @else {\n        <p class=\"drop-area-placeholder\">\n          {{ dropPlaceholderText }}\n        </p>\n      }\n    </div>\n  </div>\n  <div class=\"file-upload-footer\">\n    <div class=\"footer-container\" *ngIf=\"previewReadyFiles.length > 0\">\n      <button\n        *ngIf=\"!autoUpload && uploadStatus === FileUploadStatus.NotStarted\"\n        granitePrimaryButton\n        (click)=\"uploadFiles()\"\n      >\n        {{ uploadButtonText }}\n      </button>\n      <ng-container *ngIf=\"uploadStatus === FileUploadStatus.Failed\">\n        <button graniteButton (click)=\"cancelUpload()\">\n          {{ cancelButtonText }}\n        </button>\n        <button\n          class=\"retry-upload-button\"\n          granitePrimaryButton\n          (click)=\"retryUpload()\"\n        >\n          {{ retryButtonText }}\n        </button>\n      </ng-container>\n    </div>\n  </div>\n</div>\n\n<ng-template #uploadingOverlay>\n  <div class=\"file-preview-overlay\"></div>\n  <div class=\"loading-container\">\n    <div class=\"uploading-spinner\"></div>\n  </div>\n</ng-template>\n\n<ng-template #uploadFailedOverlay>\n  <div class=\"file-preview-overlay\"></div>\n</ng-template>\n\n<ng-template #filePreviewTemplate let-previewFile=\"previewFile\">\n  <div class=\"file-preview-container\">\n    @if (previewFile?.imageUrl) {\n      <a\n        class=\"file-preview-link\"\n        [ngClass]=\"{\n          'uploading-in-progress': uploadStatus === FileUploadStatus.InProgress,\n          'upload-failed': uploadStatus === FileUploadStatus.Failed\n        }\"\n        [href]=\"previewFile?.imageUrl\"\n        target=\"_blank\"\n      >\n        <div class=\"file-preview-holder\">\n          <img\n            role=\"presentation\"\n            [src]=\"previewFile?.imageUrl\"\n            [alt]=\"previewFile?.file?.name\"\n          />\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.InProgress\"\n            [ngTemplateOutlet]=\"uploadingOverlay\"\n          ></ng-container>\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.Failed\"\n            [ngTemplateOutlet]=\"uploadFailedOverlay\"\n          >\n          </ng-container>\n        </div>\n        <p class=\"file-name\" [title]=\"previewFile?.file?.name\">\n          {{ previewFile?.file?.name }}\n        </p>\n        <p class=\"file-size\">{{ previewFile?.readableSize }}</p>\n      </a>\n    } @else {\n      <div\n        class=\"document-preview-link\"\n        [ngClass]=\"{\n          'uploading-in-progress': uploadStatus === FileUploadStatus.InProgress,\n          'upload-failed': uploadStatus === FileUploadStatus.Failed\n        }\"\n      >\n        <div class=\"document-preview-holder\">\n          <granite-icon\n            class=\"document-file-preview\"\n            [class.upload-failed]=\"uploadStatus === FileUploadStatus.Failed\"\n            [fontIcon]=\"'icon-document-alt'\"\n          ></granite-icon>\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.InProgress\"\n            [ngTemplateOutlet]=\"uploadingOverlay\"\n          ></ng-container>\n        </div>\n        <p class=\"file-name\" [title]=\"previewFile?.file?.name\">\n          {{ previewFile?.file?.name }}\n        </p>\n        <p class=\"file-size\">{{ previewFile?.readableSize }}</p>\n      </div>\n    }\n    <button\n      graniteButton\n      *ngIf=\"\n        [FileUploadStatus.Completed, FileUploadStatus.NotStarted].includes(\n          uploadStatus\n        )\n      \"\n      (click)=\"fileRemoveHandler(previewFile)\"\n    >\n      {{ removeButtonText }}\n    </button>\n  </div>\n</ng-template>\n", styles: [":host{width:100%}.file-upload-wrapper{display:flex;flex-direction:column;background-color:var(--granite-color-background);box-shadow:var(--granite-shadow-s);height:100%;width:100%}.file-upload-wrapper .file-upload-title{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-medium);font-weight:var(--granite-font-weight-bold);line-height:var(--granite-line-height-base-rem);color:var(--granite-color-text-weak);margin:0;padding:var(--granite-spacing-8) calc(var(--granite-spacing-16) * .813)}.file-upload-wrapper .file-dropzone{display:flex;flex-direction:column;border-width:var(--granite-border-width-focus);border-style:dashed;border-color:var(--granite-color-background-selected);border-radius:var(--granite-radius-m);margin:var(--granite-spacing-8);height:100%}.file-upload-wrapper .file-dropzone.upload-failed{border-color:var(--granite-color-categorical-4)}.file-upload-wrapper .file-dropzone.file-error{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text);text-align:center;background-color:var(--granite-color-background-lobby-failure);border-color:var(--granite-color-state-error);transition:background .15s ease}.file-upload-wrapper .file-dropzone.file-error .drop-area-placeholder{margin:0}.file-upload-wrapper .file-dropzone.file-over{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text);text-align:center;background-color:var(--granite-color-background-lobby-info);border-color:var(--granite-color-background-active);transition:background .15s ease}.file-upload-wrapper .file-dropzone.file-over .drop-area-placeholder{margin:0}.file-upload-wrapper .file-dropzone .file-input{opacity:0;position:absolute;width:0}.file-upload-wrapper .file-dropzone .file-upload-body{display:flex;align-items:center;justify-content:center;height:100%}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse{display:flex;flex-direction:column;gap:var(--granite-spacing-4);justify-content:center;align-items:center;padding:0 var(--granite-spacing-16)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-upload-icon{font-size:var(--granite-font-size-display-small);color:var(--granite-color-text)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection{display:flex;justify-content:space-between;align-items:center}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-upload-body-text{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text);text-align:center;width:100%;margin-inline-end:var(--granite-spacing-4)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button{display:flex;justify-content:space-between;align-items:center;color:var(--granite-color-text-link);padding-top:calc(var(--granite-spacing-24) / 4)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button .browse-button-icon{font-size:var(--granite-font-size-body);color:var(--granite-color-text-link);margin-inline-end:var(--granite-spacing-4);padding:0}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button .browse-button-text{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-flowing) / 2);margin-top:var(--granite-spacing-4)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button:hover .browse-button-icon,.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-selection .file-select-button:hover .browse-button-text{color:var(--granite-color-text-inverse)}.file-upload-wrapper .file-dropzone .file-upload-body .file-upload-browse .file-upload-hint{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-base-rem) * 1.125);text-align:center;color:var(--granite-color-text-hint);margin:calc(var(--granite-spacing-base-rem) * .625) 0 0}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container{display:flex;flex-direction:column;align-items:center;width:100%;max-height:100%;padding:calc(var(--granite-spacing-base-rem) * .375)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link{display:flex;flex-direction:column;align-items:center;max-width:50%;padding:0 var(--granite-spacing-8);text-decoration:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link:hover .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link:hover .file-size{text-decoration:underline}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder{display:flex;justify-content:center;align-items:flex-end;position:relative;width:80px;height:114px}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder img{width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(250%)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder .file-preview-overlay{position:absolute;top:0;inset-inline-start:0;width:100%;height:100%;pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder .loading-container{position:absolute;top:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-preview-holder .loading-container .uploading-spinner{width:50px;height:50px;border-radius:50%;border:6px solid;border-color:var(--granite-color-background-page);border-right-color:var(--granite-color-background-active);animation:loading-keyframe 1s infinite linear}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-preview-holder img{opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-preview-holder .file-preview-overlay{background-color:var(--granite-color-signal-failure);opacity:.2}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.upload-failed .file-size{color:var(--granite-color-signal-failure);opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-preview-holder img,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-preview-holder .file-preview-overlay,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link.uploading-in-progress .file-size{opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-name{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text-link);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:calc(var(--granite-spacing-base-rem) * .375) 0 0;width:100%;text-align:center}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .file-preview-link .file-size{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-base-rem) * .625);color:var(--granite-color-text-link);margin:0 0 calc(var(--granite-spacing-base-rem) * .875)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link{display:flex;flex-direction:column;align-items:center;max-width:50%;padding:0 var(--granite-spacing-8);text-decoration:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder{display:flex;justify-content:center;align-items:flex-end;position:relative;width:60px;height:60px}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .document-file-preview{font-size:calc(var(--granite-font-size-body) * 3);color:var(--granite-color-text-hint);padding:calc(var(--granite-spacing-4) * 3) 0}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .document-file-preview.upload-failed{color:var(--granite-color-background-failure)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .loading-container{position:absolute;top:50%;inset-inline-start:50%;transform:translate(-50%,-10%)}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .document-preview-holder .loading-container .uploading-spinner{width:50px;height:50px;border-radius:50%;border:6px solid;border-color:var(--granite-color-background-page);border-right-color:var(--granite-color-background-active);animation:loading-keyframe 1s infinite linear}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed .document-preview-holder .file-preview-overlay{background-color:var(--granite-color-signal-failure);opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.upload-failed .file-size{color:var(--granite-color-signal-failure);opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress{pointer-events:none}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .document-preview-holder .document-file-preview,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .document-preview-holder .file-preview-overlay,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .file-name,.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link.uploading-in-progress .file-size{opacity:.4}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .file-name{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);color:var(--granite-color-text-weak);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:calc(var(--granite-spacing-base-rem) * .375) 0 0;width:100%;text-align:center}.file-upload-wrapper .file-dropzone .file-upload-body .file-preview-container .document-preview-link .file-size{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:calc(var(--granite-line-height-base-rem) * .625);color:var(--granite-color-text-week);margin:0 0 calc(var(--granite-spacing-base-rem) * .875)}.file-upload-wrapper .file-upload-footer{margin-inline:var(--granite-spacing-8);margin-bottom:var(--granite-spacing-8)}.file-upload-wrapper .file-upload-footer .footer-container{display:flex;justify-content:flex-end;align-items:center}.file-upload-wrapper .file-upload-footer .footer-container .retry-upload-button{margin-inline-start:var(--granite-spacing-8)}@keyframes loading-keyframe{to{transform:rotate(360deg)}}\n"] }]
+        }], propDecorators: { fileDropRef: [{
+                type: ViewChild,
+                args: ['fileDropRef', { read: ElementRef }]
+            }], accept: [{
+                type: Input
+            }], uploadTitle: [{
+                type: Input
+            }], uploadIcon: [{
+                type: Input
+            }], browseIcon: [{
+                type: Input
+            }], dropZoneText: [{
+                type: Input
+            }], browseButtonText: [{
+                type: Input
+            }], dropPlaceholderText: [{
+                type: Input
+            }], dropZoneHint: [{
+                type: Input
+            }], removeButtonText: [{
+                type: Input
+            }], uploadButtonText: [{
+                type: Input
+            }], retryButtonText: [{
+                type: Input
+            }], cancelButtonText: [{
+                type: Input
+            }], multiFileUpload: [{
+                type: Input
+            }], responsiveOptions: [{
+                type: Input
+            }], browseOrDragFiles: [{
+                type: Output
+            }], removeFiles: [{
+                type: Output
+            }], filesUpload: [{
+                type: Output
+            }], fileUploadValidation: [{
+                type: Output
+            }], uploadStatus: [{
+                type: Input
+            }], autoUpload: [{
+                type: Input
+            }] } });
+
+class GraniteFileUploadModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileUploadModule, declarations: [GraniteFileUploadComponent, GraniteFileDragAndDropDirective], imports: [CommonModule,
+            GraniteButtonModule,
+            GraniteIconModule,
+            GraniteCarouselModule], exports: [GraniteFileUploadComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileUploadModule, imports: [CommonModule,
+            GraniteButtonModule,
+            GraniteIconModule,
+            GraniteCarouselModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GraniteFileUploadModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [GraniteFileUploadComponent, GraniteFileDragAndDropDirective],
+                    exports: [GraniteFileUploadComponent],
+                    imports: [
+                        CommonModule,
+                        GraniteButtonModule,
+                        GraniteIconModule,
+                        GraniteCarouselModule,
+                    ],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { GraniteFileUploadComponent, GraniteFileUploadModule };
+//# sourceMappingURL=ifsworld-granite-components-file-upload.mjs.map

package/fesm2022/ifsworld-granite-components-file-upload.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ifsworld-granite-components-file-upload.mjs","sources":["../../../../libs/granite-components/file-upload/src/lib/file-upload.constants.ts","../../../../libs/granite-components/file-upload/src/lib/file-upload.utils.ts","../../../../libs/granite-components/file-upload/src/lib/directives/file-drag-and-drop.directive.ts","../../../../libs/granite-components/file-upload/src/lib/file-upload.component.ts","../../../../libs/granite-components/file-upload/src/lib/file-upload.component.html","../../../../libs/granite-components/file-upload/src/lib/file-upload.module.ts","../../../../libs/granite-components/file-upload/src/ifsworld-granite-components-file-upload.ts"],"sourcesContent":["import { CarouselResponsiveOptions } from 'primeng/carousel';\n\nexport interface SelectedFile {\n  file: File;\n  readableSize?: string;\n  imageUrl?: string;\n}\n\nexport interface FileUploadError {\n  isError: boolean;\n  type: FilUploadErrorTypes;\n}\n\nexport const fileSizes: string[] = [\n  'Bytes',\n  'KB',\n  'MB',\n  'GB',\n  'TB',\n  'PB',\n  'EB',\n  'ZB',\n  'YB',\n];\n\nexport enum FileUploadStatus {\n  NotStarted = 'NotStarted',\n  InProgress = 'InProgress',\n  Completed = 'Completed',\n  Failed = 'Failed',\n  Cancelled = 'Cancelled',\n}\n\nexport enum FilUploadErrorTypes {\n  ExtensionNotSupported = 'ExtensionNotSupported',\n  MultipleFilesNotSupported = 'MultipleFilesNotSupported',\n}\n\nexport const DEFAULT_MULTI_FILE_SUPPORT = false;\nexport const DEFAULT_ACCEPT_TYPE: string = '*.*';\nexport const DEFAULT_UPLOAD_TITLE: string = 'Upload Files';\nexport const DEFAULT_UPLOAD_ICON: string = 'icon-upload';\nexport const DEFAULT_FILE_BROWSE_BUTTON_ICON: string = 'icon-folder-alt';\nexport const DEFAULT_DROPZONE_TEXT: string = 'Drop here or';\nexport const DEFAULT_BROWSE_BUTTON_TEXT: string = 'Browse';\nexport const DEFAULT_DROP_PLACEHOLDER_TEXT: string = 'Drop files here';\nexport const DEFAULT_DROPZONE_HINT: string = '';\nexport const DEFAULT_REMOVE_BUTTON_TEXT: string = 'Remove';\nexport const DEFAULT_UPLOAD_BUTTON_TEXT: string = 'Upload Files';\nexport const DEFAULT_RETRY_BUTTON_TEXT: string = 'Retry';\nexport const DEFAULT_CANCEL_BUTTON_TEXT: string = 'Cancel';\nexport const DEFAULT_RESPONSIVE_OPTIONS: CarouselResponsiveOptions[] = [\n  { breakpoint: '1200px', numVisible: 4, numScroll: 1 },\n  { breakpoint: '992px', numVisible: 3, numScroll: 1 },\n  { breakpoint: '768px', numVisible: 2, numScroll: 1 },\n  { breakpoint: '576px', numVisible: 1, numScroll: 1 },\n];\nexport const DEFAULT_VISIBLE_FILES: number = 10;\n","export function validFileTypes<T>(\n  mimeTypesStringToCheck: string,\n  files: T[]\n): boolean {\n  const supportedFileMimeTypes = mimeTypesStringToCheck\n    .split(',')\n    .map((ext) => ext.trim());\n\n  if (!files || files.length === 0) {\n    return false;\n  }\n\n  return files.every((file: T) => {\n    const fileType = file['type'];\n    return fileType && supportedFileMimeTypes.includes(fileType);\n  });\n}\n","import {\n  Directive,\n  EventEmitter,\n  HostBinding,\n  HostListener,\n  Input,\n  Output,\n} from '@angular/core';\nimport { FileUploadError, FilUploadErrorTypes } from '../file-upload.constants';\nimport { validFileTypes } from '../file-upload.utils';\n\n@Directive({\n  selector: '[graniteFileDragAndDrop]',\n  exportAs: 'graniteFileDragAndDrop',\n})\nexport class GraniteFileDragAndDropDirective {\n  @HostBinding('class.file-over')\n  fileOver: boolean;\n\n  @HostBinding('class.file-error')\n  fileBrowseError: boolean;\n\n  @Input()\n  multiFileUploadEnabled: boolean;\n\n  @Input()\n  accept: string;\n\n  @Input()\n  currentFiles: File[] = [];\n\n  @Output()\n  droppedFiles: EventEmitter<File[]> = new EventEmitter<File[]>();\n\n  @Output()\n  isFileOver: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n  @Output()\n  fileUploadValidation: EventEmitter<FileUploadError> =\n    new EventEmitter<FileUploadError>();\n\n  @HostListener('dragover', ['$event'])\n  onDragOver(event: DragEvent): void {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const transferFiles = event.dataTransfer?.items ?? [];\n\n    if (!validFileTypes(this.accept, Array.from(transferFiles))) {\n      this.fileBrowseError = true;\n      this.fileUploadValidation.emit({\n        isError: this.fileBrowseError,\n        type: FilUploadErrorTypes.ExtensionNotSupported,\n      });\n      return;\n    }\n\n    if (\n      !this.multiFileUploadEnabled &&\n      (transferFiles.length > 1 || this.currentFiles.length >= 1)\n    ) {\n      this.fileBrowseError = true;\n      this.fileUploadValidation.emit({\n        isError: this.fileBrowseError,\n        type: FilUploadErrorTypes.MultipleFilesNotSupported,\n      });\n      return;\n    }\n\n    this.fileOver = true;\n    this.isFileOver.emit(this.fileOver);\n  }\n\n  @HostListener('dragleave', ['$event'])\n  onDragLeave(event: DragEvent): void {\n    event.preventDefault();\n    event.stopPropagation();\n\n    this.fileOver = false;\n    this.fileBrowseError = false;\n    this.fileUploadValidation.emit({ isError: false, type: null });\n    this.isFileOver.emit(this.fileOver);\n  }\n\n  @HostListener('drop', ['$event'])\n  onDrop(event: DragEvent): void {\n    event.preventDefault();\n    event.stopPropagation();\n\n    if (this.fileBrowseError) {\n      this.fileBrowseError = false;\n      this.fileUploadValidation.emit({\n        isError: this.fileBrowseError,\n        type: null,\n      });\n      return;\n    }\n\n    this.currentFiles = [\n      ...this.currentFiles,\n      ...Array.from(event.dataTransfer.files),\n    ];\n\n    this.fileOver = false;\n    this.isFileOver.emit(this.fileOver);\n\n    if (this.currentFiles.length > 0) {\n      this.droppedFiles.emit(this.currentFiles);\n    }\n  }\n}\n","import {\n  Component,\n  ElementRef,\n  EventEmitter,\n  Input,\n  Output,\n  ViewChild,\n} from '@angular/core';\nimport {\n  DEFAULT_BROWSE_BUTTON_TEXT,\n  DEFAULT_CANCEL_BUTTON_TEXT,\n  DEFAULT_DROP_PLACEHOLDER_TEXT,\n  DEFAULT_DROPZONE_HINT,\n  DEFAULT_DROPZONE_TEXT,\n  DEFAULT_FILE_BROWSE_BUTTON_ICON,\n  DEFAULT_ACCEPT_TYPE,\n  DEFAULT_MULTI_FILE_SUPPORT,\n  DEFAULT_REMOVE_BUTTON_TEXT,\n  DEFAULT_RETRY_BUTTON_TEXT,\n  DEFAULT_UPLOAD_BUTTON_TEXT,\n  DEFAULT_UPLOAD_ICON,\n  DEFAULT_UPLOAD_TITLE,\n  fileSizes,\n  FileUploadError,\n  FileUploadStatus,\n  FilUploadErrorTypes,\n  SelectedFile,\n  DEFAULT_RESPONSIVE_OPTIONS,\n  DEFAULT_VISIBLE_FILES,\n} from './file-upload.constants';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { validFileTypes } from './file-upload.utils';\nimport { CarouselResponsiveOptions } from 'primeng/carousel';\n\n@Component({\n  selector: 'granite-file-upload',\n  templateUrl: './file-upload.component.html',\n  styleUrls: ['./file-upload.component.scss'],\n})\nexport class GraniteFileUploadComponent {\n  @ViewChild('fileDropRef', { read: ElementRef })\n  fileDropRef!: ElementRef<HTMLInputElement>;\n\n  @Input()\n  accept: string = DEFAULT_ACCEPT_TYPE;\n\n  @Input()\n  uploadTitle: string = DEFAULT_UPLOAD_TITLE;\n\n  @Input()\n  uploadIcon: string = DEFAULT_UPLOAD_ICON;\n\n  @Input()\n  browseIcon: string = DEFAULT_FILE_BROWSE_BUTTON_ICON;\n\n  @Input()\n  dropZoneText: string = DEFAULT_DROPZONE_TEXT;\n\n  @Input()\n  browseButtonText: string = DEFAULT_BROWSE_BUTTON_TEXT;\n\n  @Input()\n  dropPlaceholderText: string = DEFAULT_DROP_PLACEHOLDER_TEXT;\n\n  @Input()\n  dropZoneHint: string = DEFAULT_DROPZONE_HINT;\n\n  @Input()\n  removeButtonText: string = DEFAULT_REMOVE_BUTTON_TEXT;\n\n  @Input()\n  uploadButtonText: string = DEFAULT_UPLOAD_BUTTON_TEXT;\n\n  @Input()\n  retryButtonText: string = DEFAULT_RETRY_BUTTON_TEXT;\n\n  @Input()\n  cancelButtonText: string = DEFAULT_CANCEL_BUTTON_TEXT;\n\n  @Input()\n  multiFileUpload: boolean = DEFAULT_MULTI_FILE_SUPPORT;\n\n  @Input()\n  responsiveOptions: CarouselResponsiveOptions[] = DEFAULT_RESPONSIVE_OPTIONS;\n\n  @Output()\n  browseOrDragFiles: EventEmitter<SelectedFile[]> = new EventEmitter<\n    SelectedFile[]\n  >();\n\n  @Output()\n  removeFiles: EventEmitter<SelectedFile[]> = new EventEmitter<\n    SelectedFile[]\n  >();\n\n  @Output()\n  filesUpload: EventEmitter<void> = new EventEmitter<void>();\n\n  @Output()\n  fileUploadValidation: EventEmitter<FileUploadError> =\n    new EventEmitter<FileUploadError>();\n\n  selectedFiles: File[] = [];\n  previewReadyFiles: SelectedFile[] = [];\n  isFileOnDropzone: boolean = false;\n  FileUploadStatus = FileUploadStatus;\n  fileError: boolean = false;\n  fileDropErrorType: string;\n  numVisible: number = DEFAULT_VISIBLE_FILES;\n\n  protected _uploadStatus: FileUploadStatus = FileUploadStatus.NotStarted;\n\n  @Input()\n  get uploadStatus(): FileUploadStatus {\n    return this._uploadStatus;\n  }\n\n  set uploadStatus(status: FileUploadStatus) {\n    this._uploadStatus = status;\n  }\n\n  protected _autoUpload: boolean = true;\n\n  @Input()\n  get autoUpload(): boolean {\n    return this._autoUpload;\n  }\n\n  set autoUpload(value: boolean) {\n    this._autoUpload = coerceBooleanProperty(value);\n  }\n\n  fileBrowseHandler(event: Event): void {\n    const target = event.target as HTMLInputElement;\n    const files: File[] = Array.from(target.files);\n\n    if (!validFileTypes(this.accept, files)) {\n      this.fileUploadValidation.emit({\n        isError: true,\n        type: FilUploadErrorTypes.ExtensionNotSupported,\n      });\n      this.fileDropRef.nativeElement.value = null;\n      return;\n    }\n\n    this.selectedFiles = [...this.selectedFiles, ...files];\n    this.previewReadyFiles = this.prepareSelectedFiles(this.selectedFiles);\n    this.browseOrDragFiles.emit(this.previewReadyFiles);\n  }\n\n  fileRemoveHandler(fileToRemove: SelectedFile): void {\n    const index = this.previewReadyFiles.findIndex(\n      (file) =>\n        file.imageUrl === fileToRemove.imageUrl &&\n        file.file?.name === fileToRemove.file?.name &&\n        file.readableSize === fileToRemove.readableSize\n    );\n    this.selectedFiles.splice(index, 1);\n    this.previewReadyFiles.splice(index, 1);\n\n    if (\n      this.selectedFiles.length === 0 &&\n      this.previewReadyFiles.length === 0\n    ) {\n      this.fileDropRef.nativeElement.value = null;\n      this.uploadStatus = FileUploadStatus.NotStarted;\n    }\n\n    this.removeFiles.emit(this.previewReadyFiles);\n  }\n\n  onFilesDropHandler(files: File[]): void {\n    if (\n      !this.multiFileUpload &&\n      (this.selectedFiles.length === 1 || files.length !== 1)\n    ) {\n      this.fileError = true;\n      return;\n    }\n\n    this.selectedFiles = files;\n\n    this.previewReadyFiles = this.prepareSelectedFiles(this.selectedFiles);\n    this.browseOrDragFiles.emit(this.previewReadyFiles);\n  }\n\n  onFileOverDropzone(isFileOver: boolean): void {\n    this.isFileOnDropzone = isFileOver;\n  }\n\n  onFileDropError(validation: FileUploadError): void {\n    this.fileError = validation.isError;\n    this.fileDropErrorType = validation.type;\n  }\n\n  prepareSelectedFiles(files: File[]): SelectedFile[] {\n    return files.map((file: File) => ({\n      file,\n      readableSize: this.formatBytesToReadableSize(file.size, 2),\n      imageUrl: file.type.startsWith('image/')\n        ? URL.createObjectURL(file)\n        : null,\n    }));\n  }\n\n  uploadFiles(): void {\n    this.filesUpload.emit();\n  }\n\n  retryUpload(): void {\n    this.filesUpload.emit();\n  }\n\n  cancelUpload(): void {\n    this.resetFileUpload();\n    this.removeFiles.emit(this.previewReadyFiles);\n  }\n\n  resetFileUpload(): void {\n    this.fileDropRef.nativeElement.value = null;\n    this.fileError = false;\n    this.fileDropErrorType = '';\n    this.selectedFiles = [];\n    this.previewReadyFiles = [];\n    this.uploadStatus = FileUploadStatus.NotStarted;\n  }\n\n  formatBytesToReadableSize(bytes: number, decimals: number): string {\n    if (bytes === 0) {\n      return `0 ${fileSizes[0]}`;\n    }\n\n    const bytesPerKB = 1024;\n    const decimalPoints = decimals <= 0 ? 0 : decimals || 2;\n    const exp = Math.floor(Math.log(bytes) / Math.log(bytesPerKB));\n    return `${parseFloat(\n      (bytes / Math.pow(bytesPerKB, exp)).toFixed(decimalPoints)\n    )} ${fileSizes[exp]}`;\n  }\n}\n","<div class=\"file-upload-wrapper\">\n  <h2 class=\"file-upload-title\">{{ uploadTitle }}</h2>\n  <div\n    class=\"file-dropzone\"\n    [ngClass]=\"{ 'upload-failed': uploadStatus === FileUploadStatus.Failed }\"\n    graniteFileDragAndDrop\n    (droppedFiles)=\"onFilesDropHandler($event)\"\n    (isFileOver)=\"onFileOverDropzone($event)\"\n    (fileUploadValidation)=\"onFileDropError($event)\"\n    [multiFileUploadEnabled]=\"multiFileUpload\"\n    [accept]=\"accept\"\n    [currentFiles]=\"selectedFiles\"\n  >\n    <input\n      class=\"file-input\"\n      #fileDropRef\n      type=\"file\"\n      title=\"fileUpload\"\n      (change)=\"fileBrowseHandler($event)\"\n      [multiple]=\"multiFileUpload\"\n      [accept]=\"accept\"\n    />\n    <div class=\"file-upload-body\">\n      @if (!isFileOnDropzone && !fileError) {\n        @switch (previewReadyFiles.length) {\n          @case (0) {\n            <div class=\"file-upload-browse\">\n              <granite-icon\n                class=\"file-upload-icon\"\n                [fontIcon]=\"uploadIcon\"\n              ></granite-icon>\n              <div class=\"file-selection\">\n                <h2 class=\"file-upload-body-text\">{{ dropZoneText }}</h2>\n                <button\n                  class=\"file-select-button\"\n                  graniteButton\n                  (click)=\"fileDropRef.click()\"\n                >\n                  <granite-icon\n                    class=\"browse-button-icon\"\n                    [fontIcon]=\"browseIcon\"\n                  ></granite-icon>\n                  <div class=\"browse-button-text\">{{ browseButtonText }}</div>\n                </button>\n              </div>\n              <p *ngIf=\"dropZoneHint\" class=\"file-upload-hint\">\n                {{ dropZoneHint }}\n              </p>\n            </div>\n          }\n          @case (1) {\n            <ng-container\n              *ngTemplateOutlet=\"\n                filePreviewTemplate;\n                context: { previewFile: previewReadyFiles[0] }\n              \"\n            ></ng-container>\n          }\n          @default {\n            <granite-carousel\n              [items]=\"previewReadyFiles\"\n              [numVisible]=\"numVisible\"\n              [responsiveOptions]=\"responsiveOptions\"\n            >\n              <ng-template let-previewFile #itemTemplate>\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    filePreviewTemplate;\n                    context: { previewFile: previewFile }\n                  \"\n                ></ng-container>\n              </ng-template>\n            </granite-carousel>\n          }\n        }\n      } @else {\n        <p class=\"drop-area-placeholder\">\n          {{ dropPlaceholderText }}\n        </p>\n      }\n    </div>\n  </div>\n  <div class=\"file-upload-footer\">\n    <div class=\"footer-container\" *ngIf=\"previewReadyFiles.length > 0\">\n      <button\n        *ngIf=\"!autoUpload && uploadStatus === FileUploadStatus.NotStarted\"\n        granitePrimaryButton\n        (click)=\"uploadFiles()\"\n      >\n        {{ uploadButtonText }}\n      </button>\n      <ng-container *ngIf=\"uploadStatus === FileUploadStatus.Failed\">\n        <button graniteButton (click)=\"cancelUpload()\">\n          {{ cancelButtonText }}\n        </button>\n        <button\n          class=\"retry-upload-button\"\n          granitePrimaryButton\n          (click)=\"retryUpload()\"\n        >\n          {{ retryButtonText }}\n        </button>\n      </ng-container>\n    </div>\n  </div>\n</div>\n\n<ng-template #uploadingOverlay>\n  <div class=\"file-preview-overlay\"></div>\n  <div class=\"loading-container\">\n    <div class=\"uploading-spinner\"></div>\n  </div>\n</ng-template>\n\n<ng-template #uploadFailedOverlay>\n  <div class=\"file-preview-overlay\"></div>\n</ng-template>\n\n<ng-template #filePreviewTemplate let-previewFile=\"previewFile\">\n  <div class=\"file-preview-container\">\n    @if (previewFile?.imageUrl) {\n      <a\n        class=\"file-preview-link\"\n        [ngClass]=\"{\n          'uploading-in-progress': uploadStatus === FileUploadStatus.InProgress,\n          'upload-failed': uploadStatus === FileUploadStatus.Failed\n        }\"\n        [href]=\"previewFile?.imageUrl\"\n        target=\"_blank\"\n      >\n        <div class=\"file-preview-holder\">\n          <img\n            role=\"presentation\"\n            [src]=\"previewFile?.imageUrl\"\n            [alt]=\"previewFile?.file?.name\"\n          />\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.InProgress\"\n            [ngTemplateOutlet]=\"uploadingOverlay\"\n          ></ng-container>\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.Failed\"\n            [ngTemplateOutlet]=\"uploadFailedOverlay\"\n          >\n          </ng-container>\n        </div>\n        <p class=\"file-name\" [title]=\"previewFile?.file?.name\">\n          {{ previewFile?.file?.name }}\n        </p>\n        <p class=\"file-size\">{{ previewFile?.readableSize }}</p>\n      </a>\n    } @else {\n      <div\n        class=\"document-preview-link\"\n        [ngClass]=\"{\n          'uploading-in-progress': uploadStatus === FileUploadStatus.InProgress,\n          'upload-failed': uploadStatus === FileUploadStatus.Failed\n        }\"\n      >\n        <div class=\"document-preview-holder\">\n          <granite-icon\n            class=\"document-file-preview\"\n            [class.upload-failed]=\"uploadStatus === FileUploadStatus.Failed\"\n            [fontIcon]=\"'icon-document-alt'\"\n          ></granite-icon>\n          <ng-container\n            *ngIf=\"uploadStatus === FileUploadStatus.InProgress\"\n            [ngTemplateOutlet]=\"uploadingOverlay\"\n          ></ng-container>\n        </div>\n        <p class=\"file-name\" [title]=\"previewFile?.file?.name\">\n          {{ previewFile?.file?.name }}\n        </p>\n        <p class=\"file-size\">{{ previewFile?.readableSize }}</p>\n      </div>\n    }\n    <button\n      graniteButton\n      *ngIf=\"\n        [FileUploadStatus.Completed, FileUploadStatus.NotStarted].includes(\n          uploadStatus\n        )\n      \"\n      (click)=\"fileRemoveHandler(previewFile)\"\n    >\n      {{ removeButtonText }}\n    </button>\n  </div>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { GraniteFileUploadComponent } from './file-upload.component';\nimport { GraniteFileDragAndDropDirective } from './directives/file-drag-and-drop.directive';\nimport { GraniteCarouselModule } from '@ifsworld/granite-components/carousel';\nimport {\n  GraniteButtonModule,\n  GraniteIconModule,\n} from '@ifsworld/granite-components';\n\n@NgModule({\n  declarations: [GraniteFileUploadComponent, GraniteFileDragAndDropDirective],\n  exports: [GraniteFileUploadComponent],\n  imports: [\n    CommonModule,\n    GraniteButtonModule,\n    GraniteIconModule,\n    GraniteCarouselModule,\n  ],\n})\nexport class GraniteFileUploadModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i4.GraniteFileDragAndDropDirective"],"mappings":"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"}