@covalent/core 11.0.0-beta.2 → 11.0.0-beta.4

package/fesm2022/covalent-core-file.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Directive, Optional, Host, HostListener, HostBinding, Output, Input, forwardRef, ElementRef, ChangeDetectionStrategy, Component, ViewChild, ContentChild, Injectable, NgModule } from '@angular/core';
+import { inject, EventEmitter, Directive, HostListener, HostBinding, Output, Input, Renderer2, ElementRef, NgZone, TemplateRef, ViewContainerRef, ChangeDetectorRef, forwardRef, ChangeDetectionStrategy, Component, ViewChild, ContentChild, Injectable, NgModule } from '@angular/core';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import * as i1 from '@angular/forms';
-import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
+import * as i2 from '@angular/forms';
+import { NgModel, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
 import { TemplatePortalDirective, CdkPortalOutlet } from '@angular/cdk/portal';
 import { ENTER } from '@angular/cdk/keycodes';
 import { Subject, merge, fromEvent } from 'rxjs';
@@ -11,13 +11,12 @@ import { mixinControlValueAccessor, mixinDisabled } from '@covalent/core/common'
 import * as i3 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import { MatIcon } from '@angular/material/icon';
-import * as i1$1 from '@angular/common';
+import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i1$2 from '@angular/common/http';
-import { HttpRequest, HttpParams, HttpHeaders, HttpEventType } from '@angular/common/http';
+import { HttpClient, HttpRequest, HttpParams, HttpHeaders, HttpEventType } from '@angular/common/http';
 
 class TdFileSelectDirective {
-    model;
+    model = inject(NgModel, { optional: true, host: true });
     _multiple = false;
     /**
      * multiple?: boolean
@@ -40,9 +39,6 @@ class TdFileSelectDirective {
     get multipleBinding() {
         return this._multiple ? '' : undefined;
     }
-    constructor(model) {
-        this.model = model;
-    }
     /**
      * Listens to 'change' host event to get [HTMLInputElement] files.
      * Emits the 'fileSelect' event with a [FileList] or [File] depending if 'multiple' attr exists in host.
@@ -64,7 +60,7 @@ class TdFileSelectDirective {
             }
         }
     }
-    static ɵfac = function TdFileSelectDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileSelectDirective)(i0.ɵɵdirectiveInject(i1.NgModel, 9)); };
+    static ɵfac = function TdFileSelectDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileSelectDirective)(); };
     static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdFileSelectDirective, selectors: [["", "tdFileSelect", ""]], hostVars: 1, hostBindings: function TdFileSelectDirective_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("change", function TdFileSelectDirective_change_HostBindingHandler($event) { return ctx.onChange($event); });
         } if (rf & 2) {
@@ -76,11 +72,7 @@ class TdFileSelectDirective {
         args: [{
                 selector: '[tdFileSelect]',
             }]
-    }], () => [{ type: i1.NgModel, decorators: [{
-                type: Optional
-            }, {
-                type: Host
-            }] }], { multiple: [{
+    }], null, { multiple: [{
             type: Input
         }], fileSelect: [{
             type: Output
@@ -95,9 +87,9 @@ class TdFileSelectDirective {
 class TdFileDropBase {
 }
 class TdFileDropDirective {
-    _renderer;
-    _element;
-    _ngZone;
+    _renderer = inject(Renderer2);
+    _element = inject(ElementRef);
+    _ngZone = inject(NgZone);
     _multiple = false;
     _dragenterListener;
     _dragleaveListener;
@@ -129,11 +121,6 @@ class TdFileDropDirective {
     get disabledBinding() {
         return this.disabled ? '' : undefined;
     }
-    constructor(_renderer, _element, _ngZone) {
-        this._renderer = _renderer;
-        this._element = _element;
-        this._ngZone = _ngZone;
-    }
     ngOnInit() {
         this._ngZone.runOutsideAngular(() => {
             // Listens to 'dragenter' host event to add animation class 'drop-zone' which can be overriden in host.
@@ -211,7 +198,7 @@ class TdFileDropDirective {
         event.preventDefault();
         event.stopPropagation();
     }
-    static ɵfac = function TdFileDropDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileDropDirective)(i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.NgZone)); };
+    static ɵfac = function TdFileDropDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileDropDirective)(); };
     static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdFileDropDirective, selectors: [["", "tdFileDrop", ""]], hostVars: 2, hostBindings: function TdFileDropDirective_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("drop", function TdFileDropDirective_drop_HostBindingHandler($event) { return ctx.onDrop($event); });
         } if (rf & 2) {
@@ -221,7 +208,7 @@ class TdFileDropDirective {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdFileDropDirective, [{
         type: Directive,
         args: [{ selector: '[tdFileDrop]' }]
-    }], () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.NgZone }], { multiple: [{
+    }], null, { multiple: [{
             type: Input
         }], disabled: [{
             type: Input
@@ -242,10 +229,12 @@ const _c0$1 = ["fileInputButton"];
 const _c1 = ["fileInput"];
 const _c2 = ["*"];
 class TdFileInputLabelDirective extends TemplatePortalDirective {
-    constructor(templateRef, viewContainerRef) {
+    constructor() {
+        const templateRef = inject(TemplateRef);
+        const viewContainerRef = inject(ViewContainerRef);
         super(templateRef, viewContainerRef);
     }
-    static ɵfac = function TdFileInputLabelDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileInputLabelDirective)(i0.ɵɵdirectiveInject(i0.TemplateRef), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); };
+    static ɵfac = function TdFileInputLabelDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileInputLabelDirective)(); };
     static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdFileInputLabelDirective, selectors: [["ng-template", "tdFileInputLabel", ""]], features: [i0.ɵɵInheritDefinitionFeature] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdFileInputLabelDirective, [{
@@ -253,7 +242,7 @@ class TdFileInputLabelDirective extends TemplatePortalDirective {
         args: [{
                 selector: '[tdFileInputLabel]ng-template',
             }]
-    }], () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }], null); })();
+    }], () => [], null); })();
 class TdFileInputBase {
     _changeDetectorRef;
     constructor(_changeDetectorRef) {
@@ -262,8 +251,8 @@ class TdFileInputBase {
 }
 const _TdFileInputMixinBase = mixinControlValueAccessor(mixinDisabled(TdFileInputBase));
 class TdFileInputComponent extends _TdFileInputMixinBase {
-    _ngZone;
-    _renderer;
+    _ngZone = inject(NgZone);
+    _renderer = inject(Renderer2);
     _multiple = false;
     /** The native `<button class="td-file-input"></button>` element */
     _inputButton;
@@ -300,10 +289,9 @@ class TdFileInputComponent extends _TdFileInputMixinBase {
      */
     selectFile = new EventEmitter();
     _destroy$ = new Subject();
-    constructor(_ngZone, _renderer, _changeDetectorRef) {
+    constructor() {
+        const _changeDetectorRef = inject(ChangeDetectorRef);
         super(_changeDetectorRef);
-        this._ngZone = _ngZone;
-        this._renderer = _renderer;
     }
     ngOnInit() {
         this._ngZone.runOutsideAngular(() => {
@@ -341,7 +329,7 @@ class TdFileInputComponent extends _TdFileInputMixinBase {
     setDisabledState(isDisabled) {
         this.disabled = isDisabled;
     }
-    static ɵfac = function TdFileInputComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileInputComponent)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
+    static ɵfac = function TdFileInputComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileInputComponent)(); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdFileInputComponent, selectors: [["td-file-input"]], viewQuery: function TdFileInputComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0$1, 7, ElementRef);
             i0.ɵɵviewQuery(_c1, 7);
@@ -381,7 +369,7 @@ class TdFileInputComponent extends _TdFileInputMixinBase {
                         multi: true,
                     },
                 ], selector: 'td-file-input', inputs: ['disabled', 'value'], imports: [MatButtonModule, TdFileDropDirective, TdFileSelectDirective], template: "<button\n  #fileInputButton\n  mat-stroked-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"] }]
-    }], () => [{ type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }], { _inputButton: [{
+    }], () => [], { _inputButton: [{
             type: ViewChild,
             args: ['fileInputButton', { static: true, read: ElementRef }]
         }], _inputElement: [{
@@ -396,7 +384,7 @@ class TdFileInputComponent extends _TdFileInputMixinBase {
         }], selectFile: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdFileInputComponent, { className: "TdFileInputComponent", filePath: "file-input/file-input.component.ts", lineNumber: 71 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdFileInputComponent, { className: "TdFileInputComponent", filePath: "file-input/file-input.component.ts", lineNumber: 72 }); })();
 
 const _c0 = ["*"];
 function TdFileUploadComponent_td_file_input_0_ng_template_1_Template(rf, ctx) { }
@@ -439,7 +427,7 @@ class TdFileUploadBase {
     }
 }
 class TdFileUploadComponent {
-    _changeDetectorRef;
+    _changeDetectorRef = inject(ChangeDetectorRef);
     _multiple = false;
     _required = false;
     _disabled = false;
@@ -512,10 +500,7 @@ class TdFileUploadComponent {
      * Event emitted when cancel button is clicked.
      */
     // eslint-disable-next-line @angular-eslint/no-output-native
-    cancel = new EventEmitter(); // TODO: check if we can change the name of this emitter
-    constructor(_changeDetectorRef) {
-        this._changeDetectorRef = _changeDetectorRef;
-    }
+    cancel = new EventEmitter();
     writeValue(value) {
         this.value = value;
         this._changeDetectorRef.markForCheck();
@@ -561,7 +546,7 @@ class TdFileUploadComponent {
             this._cancel();
         }
     }
-    static ɵfac = function TdFileUploadComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileUploadComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
+    static ɵfac = function TdFileUploadComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileUploadComponent)(); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdFileUploadComponent, selectors: [["td-file-upload"]], contentQueries: function TdFileUploadComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
             i0.ɵɵcontentQuery(dirIndex, TdFileInputLabelDirective, 5);
         } if (rf & 2) {
@@ -585,7 +570,9 @@ class TdFileUploadComponent {
             i0.ɵɵproperty("ngIf", !ctx.value);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.value);
-        } }, dependencies: [CommonModule, i1$1.NgIf, FormsModule, i1.NgControlStatus, i1.NgModel, TdFileInputComponent, MatButtonModule, i3.MatButton, i3.MatIconButton, MatIcon, CdkPortalOutlet], styles: [".td-file-upload[_ngcontent-%COMP%]{padding-left:8px;padding-right:8px}.td-file-upload-cancel[_ngcontent-%COMP%]{height:24px;width:24px;position:relative;top:24px;left:-12px}  [dir=rtl] .td-file-upload-cancel{right:-12px;left:0}.td-file-upload-cancel[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%]{border-radius:12px;vertical-align:baseline}.drop-zone[_ngcontent-%COMP%]{border-radius:3px}.drop-zone[_ngcontent-%COMP%]   *[_ngcontent-%COMP%]{pointer-events:none}"], changeDetection: 0 });
+        } }, dependencies: [CommonModule, i1.NgIf, FormsModule, i2.NgControlStatus, i2.NgModel, TdFileInputComponent,
+            MatButtonModule, i3.MatButton, i3.MatIconButton, MatIcon,
+            CdkPortalOutlet], styles: [".td-file-upload[_ngcontent-%COMP%]{padding-left:8px;padding-right:8px}.td-file-upload-cancel[_ngcontent-%COMP%]{height:24px;width:24px;position:relative;top:24px;left:-12px}  [dir=rtl] .td-file-upload-cancel{right:-12px;left:0}.td-file-upload-cancel[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%]{border-radius:12px;vertical-align:baseline}.drop-zone[_ngcontent-%COMP%]{border-radius:3px}.drop-zone[_ngcontent-%COMP%]   *[_ngcontent-%COMP%]{pointer-events:none}"], changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdFileUploadComponent, [{
         type: Component,
@@ -595,8 +582,15 @@ class TdFileUploadComponent {
                         useExisting: forwardRef(() => TdFileUploadComponent),
                         multi: true,
                     },
-                ], selector: 'td-file-upload', imports: [CommonModule, FormsModule, TdFileInputComponent, MatButtonModule, MatIcon, CdkPortalOutlet], 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(value)\"\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"] }]
-    }], () => [{ type: i0.ChangeDetectorRef }], { fileInput: [{
+                ], selector: 'td-file-upload', imports: [
+                    CommonModule,
+                    FormsModule,
+                    TdFileInputComponent,
+                    MatButtonModule,
+                    MatIcon,
+                    CdkPortalOutlet,
+                ], 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(value)\"\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"] }]
+    }], null, { fileInput: [{
             type: ViewChild,
             args: [TdFileInputComponent]
         }], inputLabel: [{
@@ -625,10 +619,10 @@ class TdFileUploadComponent {
         }], cancel: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdFileUploadComponent, { className: "TdFileUploadComponent", filePath: "file-upload/file-upload.component.ts", lineNumber: 41 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdFileUploadComponent, { className: "TdFileUploadComponent", filePath: "file-upload/file-upload.component.ts", lineNumber: 53 }); })();
 
 class TdFileService {
-    _http;
+    _http = inject(HttpClient, { optional: true });
     _progressSubject = new Subject();
     _progressObservable;
     /**
@@ -643,8 +637,7 @@ class TdFileService {
      * @param _http the http client instance
      * @breaking-change 3.0.0 remove 'Optional' decorator once the legay upload method is removed
      */
-    constructor(_http) {
-        this._http = _http;
+    constructor() {
         this._progressObservable = this._progressSubject.asObservable();
     }
     /**
@@ -678,14 +671,12 @@ class TdFileService {
                 break;
         }
     }
-    static ɵfac = function TdFileService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileService)(i0.ɵɵinject(i1$2.HttpClient, 8)); };
+    static ɵfac = function TdFileService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdFileService)(); };
     static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: TdFileService, factory: TdFileService.ɵfac });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdFileService, [{
         type: Injectable
-    }], () => [{ type: i1$2.HttpClient, decorators: [{
-                type: Optional
-            }] }], null); })();
+    }], () => [], null); })();
 
 const TD_FILE = [
     TdFileSelectDirective,