@covalent/core 6.3.0 → 7.0.0

package/{fesm2020 → fesm2022}/covalent-core-file.mjs

@@ -19,6 +19,8 @@ import * as i1$1 from '@angular/common/http';
 import { HttpRequest, HttpHeaders, HttpParams, HttpEventType } from '@angular/common/http';
 
 class TdFileSelectDirective {
+    model;
+    _multiple = false;
     /**
      * multiple?: boolean
      * Sets whether multiple files can be selected at once in host element, or just a single file.
@@ -27,6 +29,13 @@ class TdFileSelectDirective {
     set multiple(multiple) {
         this._multiple = coerceBooleanProperty(multiple);
     }
+    /**
+     * fileSelect?: function
+     * Event emitted when a file or files are selected in host [HTMLInputElement].
+     * Emits a [FileList | File] object.
+     * Alternative to not use [(ngModel)].
+     */
+    fileSelect = new EventEmitter();
     /**
      * Binds native 'multiple' attribute if [multiple] property is 'true'.
      */
@@ -35,14 +44,6 @@ class TdFileSelectDirective {
     }
     constructor(model) {
         this.model = model;
-        this._multiple = false;
-        /**
-         * fileSelect?: function
-         * Event emitted when a file or files are selected in host [HTMLInputElement].
-         * Emits a [FileList | File] object.
-         * Alternative to not use [(ngModel)].
-         */
-        this.fileSelect = new EventEmitter();
     }
     /**
      * Listens to 'change' host event to get [HTMLInputElement] files.
@@ -65,10 +66,10 @@ class TdFileSelectDirective {
             }
         }
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileSelectDirective, deps: [{ token: i1.NgModel, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.7", type: TdFileSelectDirective, selector: "[tdFileSelect]", inputs: { multiple: "multiple" }, outputs: { fileSelect: "fileSelect" }, host: { listeners: { "change": "onChange($event)" }, properties: { "attr.multiple": "this.multipleBinding" } }, ngImport: i0 });
 }
-TdFileSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileSelectDirective, deps: [{ token: i1.NgModel, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-TdFileSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.5", type: TdFileSelectDirective, selector: "[tdFileSelect]", inputs: { multiple: "multiple" }, outputs: { fileSelect: "fileSelect" }, host: { listeners: { "change": "onChange($event)" }, properties: { "attr.multiple": "this.multipleBinding" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileSelectDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileSelectDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[tdFileSelect]',
@@ -92,6 +93,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImpor
 class TdFileDropBase {
 }
 class TdFileDropDirective {
+    _renderer;
+    _element;
+    _ngZone;
+    _multiple = false;
+    _dragenterListener;
+    _dragleaveListener;
+    _dragoverListener;
     /**
      * multiple?: boolean
      * Sets whether multiple files can be dropped at once in host element, or just a single file.
@@ -100,6 +108,13 @@ class TdFileDropDirective {
     set multiple(multiple) {
         this._multiple = coerceBooleanProperty(multiple);
     }
+    disabled = false;
+    /**
+     * fileDrop?: function
+     * Event emitted when a file or files are dropped in host element after being validated.
+     * Emits a [FileList | File] object.
+     */
+    fileDrop = new EventEmitter();
     /**
      * Binds native 'multiple' attribute if [multiple] property is 'true'.
      */
@@ -116,14 +131,6 @@ class TdFileDropDirective {
         this._renderer = _renderer;
         this._element = _element;
         this._ngZone = _ngZone;
-        this._multiple = false;
-        this.disabled = false;
-        /**
-         * fileDrop?: function
-         * Event emitted when a file or files are dropped in host element after being validated.
-         * Emits a [FileList | File] object.
-         */
-        this.fileDrop = new EventEmitter();
     }
     ngOnInit() {
         this._ngZone.runOutsideAngular(() => {
@@ -202,10 +209,10 @@ class TdFileDropDirective {
         event.preventDefault();
         event.stopPropagation();
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileDropDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.7", type: TdFileDropDirective, selector: "[tdFileDrop]", inputs: { multiple: "multiple", disabled: "disabled" }, outputs: { fileDrop: "fileDrop" }, host: { listeners: { "drop": "onDrop($event)" }, properties: { "attr.multiple": "this.multipleBinding", "attr.disabled": "this.disabledBinding" } }, ngImport: i0 });
 }
-TdFileDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileDropDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
-TdFileDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.5", type: TdFileDropDirective, selector: "[tdFileDrop]", inputs: { multiple: "multiple", disabled: "disabled" }, outputs: { fileDrop: "fileDrop" }, host: { listeners: { "drop": "onDrop($event)" }, properties: { "attr.multiple": "this.multipleBinding", "attr.disabled": "this.disabledBinding" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileDropDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileDropDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[tdFileDrop]' }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { multiple: [{
@@ -229,25 +236,38 @@ class TdFileInputLabelDirective extends TemplatePortalDirective {
     constructor(templateRef, viewContainerRef) {
         super(templateRef, viewContainerRef);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileInputLabelDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.7", type: TdFileInputLabelDirective, selector: "[tdFileInputLabel]ng-template", usesInheritance: true, ngImport: i0 });
 }
-TdFileInputLabelDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileInputLabelDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
-TdFileInputLabelDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.5", type: TdFileInputLabelDirective, selector: "[tdFileInputLabel]ng-template", usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileInputLabelDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileInputLabelDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[tdFileInputLabel]ng-template',
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; } });
 class TdFileInputBase {
+    _changeDetectorRef;
     constructor(_changeDetectorRef) {
         this._changeDetectorRef = _changeDetectorRef;
     }
 }
 const _TdFileInputMixinBase = mixinControlValueAccessor(mixinDisabled(TdFileInputBase));
 class TdFileInputComponent extends _TdFileInputMixinBase {
+    _ngZone;
+    _renderer;
+    _multiple = false;
+    /** The native `<button class="td-file-input"></button>` element */
+    _inputButton;
+    /** The native `<input type="file"> element */
+    _inputElement;
     get inputElement() {
         return this._inputElement.nativeElement;
     }
+    /**
+     * color?: 'accent' | 'primary' | 'warn'
+     * Sets button color. Uses same color palette accepted as [MatButton].
+     */
+    color;
     /**
      * multiple?: boolean
      * Sets if multiple files can be dropped/selected at once in [TdFileInputComponent].
@@ -258,18 +278,23 @@ class TdFileInputComponent extends _TdFileInputMixinBase {
     get multiple() {
         return this._multiple;
     }
+    /**
+     * accept?: string
+     * Sets files accepted when opening the file browser dialog.
+     * Same as 'accept' attribute in <input/> element.
+     */
+    accept;
+    /**
+     * select?: function
+     * Event emitted a file is selected
+     * Emits a [File | FileList] object.
+     */
+    selectFile = new EventEmitter();
+    _destroy$ = new Subject();
     constructor(_ngZone, _renderer, _changeDetectorRef) {
         super(_changeDetectorRef);
         this._ngZone = _ngZone;
         this._renderer = _renderer;
-        this._multiple = false;
-        /**
-         * select?: function
-         * Event emitted a file is selected
-         * Emits a [File | FileList] object.
-         */
-        this.selectFile = new EventEmitter();
-        this._destroy$ = new Subject();
     }
     ngOnInit() {
         this._ngZone.runOutsideAngular(() => {
@@ -307,16 +332,16 @@ class TdFileInputComponent extends _TdFileInputMixinBase {
     setDisabledState(isDisabled) {
         this.disabled = isDisabled;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileInputComponent, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: TdFileInputComponent, selector: "td-file-input", inputs: { disabled: "disabled", value: "value", color: "color", multiple: "multiple", accept: "accept" }, outputs: { selectFile: "selectFile" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => TdFileInputComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "_inputButton", first: true, predicate: ["fileInputButton"], descendants: true, read: ElementRef, static: true }, { propertyName: "_inputElement", first: true, predicate: ["fileInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<button\n  #fileInputButton\n  mat-raised-button\n  class=\"td-file-input\"\n  type=\"button\"\n  [color]=\"color\"\n  [multiple]=\"multiple\"\n  [disabled]=\"disabled\"\n  (fileDrop)=\"handleSelect($event)\"\n  tdFileDrop\n>\n  <ng-content></ng-content>\n</button>\n<input\n  #fileInput\n  class=\"td-file-input-hidden\"\n  type=\"file\"\n  [attr.accept]=\"accept\"\n  (fileSelect)=\"handleSelect($event)\"\n  [multiple]=\"multiple\"\n  [disabled]=\"disabled\"\n  tdFileSelect\n/>\n", styles: [":host .td-file-input{padding-left:8px;padding-right:8px}:host input.td-file-input-hidden{display:none}:host ::ng-deep .mdc-button__label{display:flex;align-items:center}:host .drop-zone{border-radius:3px}:host .drop-zone *{pointer-events:none}\n"], dependencies: [{ kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: TdFileSelectDirective, selector: "[tdFileSelect]", inputs: ["multiple"], outputs: ["fileSelect"] }, { kind: "directive", type: TdFileDropDirective, selector: "[tdFileDrop]", inputs: ["multiple", "disabled"], outputs: ["fileDrop"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-TdFileInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileInputComponent, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TdFileInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.5", type: TdFileInputComponent, selector: "td-file-input", inputs: { disabled: "disabled", value: "value", color: "color", multiple: "multiple", accept: "accept" }, outputs: { selectFile: "selectFile" }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => TdFileInputComponent),
-            multi: true,
-        },
-    ], viewQueries: [{ propertyName: "_inputButton", first: true, predicate: ["fileInputButton"], descendants: true, read: ElementRef, static: true }, { propertyName: "_inputElement", first: true, predicate: ["fileInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<button\n  #fileInputButton\n  mat-raised-button\n  class=\"td-file-input\"\n  type=\"button\"\n  [color]=\"color\"\n  [multiple]=\"multiple\"\n  [disabled]=\"disabled\"\n  (fileDrop)=\"handleSelect($event)\"\n  tdFileDrop\n>\n  <ng-content></ng-content>\n</button>\n<input\n  #fileInput\n  class=\"td-file-input-hidden\"\n  type=\"file\"\n  [attr.accept]=\"accept\"\n  (fileSelect)=\"handleSelect($event)\"\n  [multiple]=\"multiple\"\n  [disabled]=\"disabled\"\n  tdFileSelect\n/>\n", styles: [":host .td-file-input{padding-left:8px;padding-right:8px}:host input.td-file-input-hidden{display:none}:host ::ng-deep .mdc-button__label{display:flex;align-items:center}:host .drop-zone{border-radius:3px}:host .drop-zone *{pointer-events:none}\n"], dependencies: [{ kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: TdFileSelectDirective, selector: "[tdFileSelect]", inputs: ["multiple"], outputs: ["fileSelect"] }, { kind: "directive", type: TdFileDropDirective, selector: "[tdFileDrop]", inputs: ["multiple", "disabled"], outputs: ["fileDrop"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileInputComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -342,11 +367,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImpor
             }] } });
 
 class TdFileUploadBase {
+    _changeDetectorRef;
     constructor(_changeDetectorRef) {
         this._changeDetectorRef = _changeDetectorRef;
     }
 }
 class TdFileUploadComponent {
+    _changeDetectorRef;
+    _multiple = false;
+    _required = false;
+    _disabled = false;
+    fileInput;
+    inputLabel;
+    /**
+     * defaultColor?: 'accent' | 'primary' | 'warn'
+     * Sets browse button color. Uses same color palette accepted as [MatButton] and defaults to 'primary'.
+     */
+    defaultColor = 'primary';
+    /**
+     * activeColor?: 'accent' | 'primary' | 'warn'
+     * Sets upload button color. Uses same color palette accepted as [MatButton] and defaults to 'accent'.
+     */
+    activeColor = 'accent';
+    /**
+     * cancelColor?: 'accent' | 'primary' | 'warn'
+     * Sets cancel button color. Uses same color palette accepted as [MatButton] and defaults to 'warn'.
+     */
+    cancelColor = 'warn';
     /**
      * multiple?: boolean
      * Sets if multiple files can be dropped/selected at once in [TdFileUploadComponent].
@@ -368,6 +415,12 @@ class TdFileUploadComponent {
     get required() {
         return this._required;
     }
+    /**
+     * accept?: string
+     * Sets files accepted when opening the file browser dialog.
+     * Same as 'accept' attribute in <input/> element.
+     */
+    accept;
     set disabled(disabled) {
         this._disabled = disabled;
         this.onDisabledChange(disabled);
@@ -375,43 +428,26 @@ class TdFileUploadComponent {
     get disabled() {
         return this._disabled;
     }
+    value;
+    /**
+     * select?: function
+     * Event emitted when a file is selected.
+     * Emits a [File | FileList] object.
+     */
+    selectFile = new EventEmitter();
+    /**
+     * upload?: function
+     * Event emitted when upload button is clicked.
+     * Emits a [File | FileList] object.
+     */
+    upload = new EventEmitter();
+    /**
+     * cancel?: function
+     * Event emitted when cancel button is clicked.
+     */
+    cancel = new EventEmitter();
     constructor(_changeDetectorRef) {
         this._changeDetectorRef = _changeDetectorRef;
-        this._multiple = false;
-        this._required = false;
-        this._disabled = false;
-        /**
-         * defaultColor?: 'accent' | 'primary' | 'warn'
-         * Sets browse button color. Uses same color palette accepted as [MatButton] and defaults to 'primary'.
-         */
-        this.defaultColor = 'primary';
-        /**
-         * activeColor?: 'accent' | 'primary' | 'warn'
-         * Sets upload button color. Uses same color palette accepted as [MatButton] and defaults to 'accent'.
-         */
-        this.activeColor = 'accent';
-        /**
-         * cancelColor?: 'accent' | 'primary' | 'warn'
-         * Sets cancel button color. Uses same color palette accepted as [MatButton] and defaults to 'warn'.
-         */
-        this.cancelColor = 'warn';
-        /**
-         * select?: function
-         * Event emitted when a file is selected.
-         * Emits a [File | FileList] object.
-         */
-        this.selectFile = new EventEmitter();
-        /**
-         * upload?: function
-         * Event emitted when upload button is clicked.
-         * Emits a [File | FileList] object.
-         */
-        this.upload = new EventEmitter();
-        /**
-         * cancel?: function
-         * Event emitted when cancel button is clicked.
-         */
-        this.cancel = new EventEmitter();
     }
     writeValue(value) {
         this.value = value;
@@ -456,16 +492,16 @@ class TdFileUploadComponent {
             this._cancel();
         }
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileUploadComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: TdFileUploadComponent, selector: "td-file-upload", inputs: { defaultColor: "defaultColor", activeColor: "activeColor", cancelColor: "cancelColor", multiple: "multiple", required: "required", accept: "accept", disabled: "disabled", value: "value" }, outputs: { selectFile: "selectFile", upload: "upload", cancel: "cancel" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => TdFileUploadComponent),
+                multi: true,
+            },
+        ], queries: [{ propertyName: "inputLabel", first: true, predicate: TdFileInputLabelDirective, descendants: true }], viewQueries: [{ propertyName: "fileInput", first: true, predicate: TdFileInputComponent, descendants: true }], ngImport: i0, template: "<td-file-input\n  *ngIf=\"!value\"\n  [(ngModel)]=\"value\"\n  [multiple]=\"multiple\"\n  [disabled]=\"disabled\"\n  [accept]=\"accept\"\n  [color]=\"defaultColor\"\n  (selectFile)=\"(handleSelect)\"\n>\n  <ng-template [cdkPortalOutlet]=\"inputLabel\" [ngIf]=\"true\"></ng-template>\n</td-file-input>\n<div *ngIf=\"value\">\n  <button\n    #fileUpload\n    class=\"td-file-upload\"\n    mat-raised-button\n    type=\"button\"\n    [color]=\"activeColor\"\n    (keyup.delete)=\"_cancel()\"\n    (keyup.backspace)=\"_cancel()\"\n    (keyup.escape)=\"_cancel()\"\n    (click)=\"uploadPressed()\"\n  >\n    <ng-content></ng-content>\n  </button>\n  <button\n    mat-icon-button\n    type=\"button\"\n    class=\"td-file-upload-cancel\"\n    [color]=\"cancelColor\"\n    (click)=\"_cancel()\"\n  >\n    <mat-icon>cancel</mat-icon>\n  </button>\n</div>\n", styles: [".td-file-upload{padding-left:8px;padding-right:8px}.td-file-upload-cancel{height:24px;width:24px;position:relative;top:24px;left:-12px}::ng-deep [dir=rtl] .td-file-upload-cancel{right:-12px;left:0}.td-file-upload-cancel mat-icon{border-radius:12px;vertical-align:baseline}.drop-zone{border-radius:3px}.drop-zone *{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i5.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: TdFileInputComponent, selector: "td-file-input", inputs: ["disabled", "value", "color", "multiple", "accept"], outputs: ["selectFile"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-TdFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileUploadComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TdFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.5", type: TdFileUploadComponent, selector: "td-file-upload", inputs: { defaultColor: "defaultColor", activeColor: "activeColor", cancelColor: "cancelColor", multiple: "multiple", required: "required", accept: "accept", disabled: "disabled", value: "value" }, outputs: { selectFile: "selectFile", upload: "upload", cancel: "cancel" }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => TdFileUploadComponent),
-            multi: true,
-        },
-    ], queries: [{ propertyName: "inputLabel", first: true, predicate: TdFileInputLabelDirective, descendants: true }], viewQueries: [{ propertyName: "fileInput", first: true, predicate: TdFileInputComponent, descendants: true }], ngImport: i0, template: "<td-file-input\n  *ngIf=\"!value\"\n  [(ngModel)]=\"value\"\n  [multiple]=\"multiple\"\n  [disabled]=\"disabled\"\n  [accept]=\"accept\"\n  [color]=\"defaultColor\"\n  (selectFile)=\"(handleSelect)\"\n>\n  <ng-template [cdkPortalOutlet]=\"inputLabel\" [ngIf]=\"true\"></ng-template>\n</td-file-input>\n<div *ngIf=\"value\">\n  <button\n    #fileUpload\n    class=\"td-file-upload\"\n    mat-raised-button\n    type=\"button\"\n    [color]=\"activeColor\"\n    (keyup.delete)=\"_cancel()\"\n    (keyup.backspace)=\"_cancel()\"\n    (keyup.escape)=\"_cancel()\"\n    (click)=\"uploadPressed()\"\n  >\n    <ng-content></ng-content>\n  </button>\n  <button\n    mat-icon-button\n    type=\"button\"\n    class=\"td-file-upload-cancel\"\n    [color]=\"cancelColor\"\n    (click)=\"_cancel()\"\n  >\n    <mat-icon>cancel</mat-icon>\n  </button>\n</div>\n", styles: [".td-file-upload{padding-left:8px;padding-right:8px}.td-file-upload-cancel{height:24px;width:24px;position:relative;top:24px;left:-12px}::ng-deep [dir=rtl] .td-file-upload-cancel{right:-12px;left:0}.td-file-upload-cancel mat-icon{border-radius:12px;vertical-align:baseline}.drop-zone{border-radius:3px}.drop-zone *{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i5.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: TdFileInputComponent, selector: "td-file-input", inputs: ["disabled", "value", "color", "multiple", "accept"], outputs: ["selectFile"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileUploadComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileUploadComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -505,6 +541,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImpor
             }] } });
 
 class TdFileService {
+    _http;
+    _progressSubject = new Subject();
+    _progressObservable;
     /**
      * Gets progress observable to keep track of the files being uploaded.
      * Needs to be supported by backend.
@@ -519,7 +558,6 @@ class TdFileService {
      */
     constructor(_http) {
         this._http = _http;
-        this._progressSubject = new Subject();
         this._progressObservable = this._progressSubject.asObservable();
     }
     /**
@@ -553,10 +591,10 @@ class TdFileService {
                 break;
         }
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileService, deps: [{ token: i1$1.HttpClient, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileService });
 }
-TdFileService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileService, deps: [{ token: i1$1.HttpClient, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-TdFileService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: TdFileService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TdFileService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1$1.HttpClient, decorators: [{
                     type: Optional
@@ -570,27 +608,27 @@ const TD_FILE = [
     TdFileInputLabelDirective,
 ];
 class CovalentFileModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CovalentFileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.7", ngImport: i0, type: CovalentFileModule, declarations: [TdFileSelectDirective,
+            TdFileDropDirective,
+            TdFileUploadComponent,
+            TdFileInputComponent,
+            TdFileInputLabelDirective], imports: [FormsModule,
+            CommonModule,
+            MatIconModule,
+            MatButtonModule,
+            PortalModule], exports: [TdFileSelectDirective,
+            TdFileDropDirective,
+            TdFileUploadComponent,
+            TdFileInputComponent,
+            TdFileInputLabelDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CovalentFileModule, providers: [TdFileService], imports: [FormsModule,
+            CommonModule,
+            MatIconModule,
+            MatButtonModule,
+            PortalModule] });
 }
-CovalentFileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: CovalentFileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CovalentFileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.5", ngImport: i0, type: CovalentFileModule, declarations: [TdFileSelectDirective,
-        TdFileDropDirective,
-        TdFileUploadComponent,
-        TdFileInputComponent,
-        TdFileInputLabelDirective], imports: [FormsModule,
-        CommonModule,
-        MatIconModule,
-        MatButtonModule,
-        PortalModule], exports: [TdFileSelectDirective,
-        TdFileDropDirective,
-        TdFileUploadComponent,
-        TdFileInputComponent,
-        TdFileInputLabelDirective] });
-CovalentFileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: CovalentFileModule, providers: [TdFileService], imports: [FormsModule,
-        CommonModule,
-        MatIconModule,
-        MatButtonModule,
-        PortalModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.5", ngImport: i0, type: CovalentFileModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CovalentFileModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [