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

package/fesm2022/covalent-core-dialogs.mjs

@@ -1,19 +1,19 @@
 import * as i0 from '@angular/core';
-import { Directive, Component, ContentChildren, ElementRef, ViewChild, Injectable, Inject, EventEmitter, ChangeDetectionStrategy, Output, Input, NgModule } from '@angular/core';
-import * as i2 from '@angular/common';
+import { Directive, Component, ContentChildren, inject, NgZone, ElementRef, ViewChild, RendererFactory2, Injectable, EventEmitter, ChangeDetectionStrategy, Output, Input, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
 import { CommonModule, DOCUMENT } from '@angular/common';
-import * as i1 from '@angular/material/dialog';
-import { MatDialogModule, MatDialogConfig } from '@angular/material/dialog';
-import * as i3 from '@angular/material/button';
+import * as i2 from '@angular/material/dialog';
+import { MatDialogModule, MatDialogRef, MatDialog, MatDialogConfig } from '@angular/material/dialog';
+import * as i2$1 from '@angular/material/button';
 import { MatButtonModule, MatButton, MatIconButton } from '@angular/material/button';
 import { RIGHT_ARROW, LEFT_ARROW } from '@angular/cdk/keycodes';
 import { Subject, fromEvent, takeUntil, merge } from 'rxjs';
-import * as i3$1 from '@angular/forms';
+import * as i2$2 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { MatFormField } from '@angular/material/form-field';
 import { MatInput } from '@angular/material/input';
 import { MatIcon } from '@angular/material/icon';
-import * as i2$1 from '@angular/cdk/drag-drop';
+import { DragDrop } from '@angular/cdk/drag-drop';
 import { MatToolbar, MatToolbarRow } from '@angular/material/toolbar';
 import { MatTooltip } from '@angular/material/tooltip';
 
@@ -117,7 +117,7 @@ class TdDialogComponent {
             i0.ɵɵproperty("ngIf", ctx.dialogContent.length > 0);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.dialogActions.length > 0);
-        } }, dependencies: [CommonModule, i2.NgIf, MatDialogModule, i1.MatDialogTitle, i1.MatDialogActions, i1.MatDialogContent], styles: [".td-dialog[_ngcontent-%COMP%]{width:100%}.td-dialog-wrapper[_ngcontent-%COMP%]{display:flex}.td-dialog-actions[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex}.td-dialog-actions[_ngcontent-%COMP%]   .td-dialog-spacer[_ngcontent-%COMP%]{flex:1}.td-dialog-actions[_ngcontent-%COMP%]     button{text-transform:uppercase;margin-left:8px;padding-left:8px;padding-right:8px;min-width:64px}[dir=rtl][_ngcontent-%COMP%]   .td-dialog-actions[_ngcontent-%COMP%]     button{margin-right:8px;margin-left:inherit}.td-dialog-actions[_ngcontent-%COMP%]     .td-status-dialog___button{padding:9px 16px}@media screen and (max-width: 480px){.td-dialog-wrapper[_ngcontent-%COMP%]{flex-direction:column}}"] });
+        } }, dependencies: [CommonModule, i1.NgIf, MatDialogModule, i2.MatDialogTitle, i2.MatDialogActions, i2.MatDialogContent], styles: [".td-dialog[_ngcontent-%COMP%]{width:100%}.td-dialog-wrapper[_ngcontent-%COMP%]{display:flex}.td-dialog-actions[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex}.td-dialog-actions[_ngcontent-%COMP%]   .td-dialog-spacer[_ngcontent-%COMP%]{flex:1}.td-dialog-actions[_ngcontent-%COMP%]     button{text-transform:uppercase;margin-left:8px;padding-left:8px;padding-right:8px;min-width:64px}[dir=rtl][_ngcontent-%COMP%]   .td-dialog-actions[_ngcontent-%COMP%]     button{margin-right:8px;margin-left:inherit}.td-dialog-actions[_ngcontent-%COMP%]     .td-status-dialog___button{padding:9px 16px}@media screen and (max-width: 480px){.td-dialog-wrapper[_ngcontent-%COMP%]{flex-direction:column}}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDialogComponent, [{
         type: Component,
@@ -147,17 +147,14 @@ function TdAlertDialogComponent_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate(ctx_r0.title);
 } }
 class TdAlertDialogComponent {
-    _dialogRef;
+    _dialogRef = inject(MatDialogRef);
     title;
     message;
     closeButton = 'CLOSE';
-    constructor(_dialogRef) {
-        this._dialogRef = _dialogRef;
-    }
     close() {
         this._dialogRef.close();
     }
-    static ɵfac = function TdAlertDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdAlertDialogComponent)(i0.ɵɵdirectiveInject(i1.MatDialogRef)); };
+    static ɵfac = function TdAlertDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdAlertDialogComponent)(); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdAlertDialogComponent, selectors: [["td-alert-dialog"]], decls: 8, vars: 3, consts: [["tdDialogTitle", "", 4, "ngIf"], ["tdDialogContent", ""], [1, "td-dialog-message"], ["tdDialogActions", ""], ["mat-button", "", "color", "accent", 3, "click"], ["tdDialogTitle", ""]], template: function TdAlertDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "td-dialog");
             i0.ɵɵtemplate(1, TdAlertDialogComponent_ng_container_1_Template, 2, 1, "ng-container", 0);
@@ -180,13 +177,23 @@ class TdAlertDialogComponent {
             i0.ɵɵtextInterpolate(ctx.message);
             i0.ɵɵadvance(3);
             i0.ɵɵtextInterpolate1(" ", ctx.closeButton, " ");
-        } }, dependencies: [CommonModule, i2.NgIf, MatButtonModule, i3.MatButton, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective], styles: [".td-dialog-message[_ngcontent-%COMP%]{word-break:break-word}"] });
+        } }, dependencies: [CommonModule, i1.NgIf, MatButtonModule, i2$1.MatButton, TdDialogComponent,
+            TdDialogTitleDirective,
+            TdDialogContentDirective,
+            TdDialogActionsDirective], styles: [".td-dialog-message[_ngcontent-%COMP%]{word-break:break-word}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdAlertDialogComponent, [{
         type: Component,
-        args: [{ selector: 'td-alert-dialog', imports: [CommonModule, MatButtonModule, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective], template: "<td-dialog>\n  <ng-container tdDialogTitle *ngIf=\"title\">{{ title }}</ng-container>\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">{{ message }}</span>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button mat-button color=\"accent\" (click)=\"close()\">\n      {{ closeButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: [".td-dialog-message{word-break:break-word}\n"] }]
-    }], () => [{ type: i1.MatDialogRef }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdAlertDialogComponent, { className: "TdAlertDialogComponent", filePath: "alert-dialog/alert-dialog.component.ts", lineNumber: 13 }); })();
+        args: [{ selector: 'td-alert-dialog', imports: [
+                    CommonModule,
+                    MatButtonModule,
+                    TdDialogComponent,
+                    TdDialogTitleDirective,
+                    TdDialogContentDirective,
+                    TdDialogActionsDirective,
+                ], template: "<td-dialog>\n  <ng-container tdDialogTitle *ngIf=\"title\">{{ title }}</ng-container>\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">{{ message }}</span>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button mat-button color=\"accent\" (click)=\"close()\">\n      {{ closeButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: [".td-dialog-message{word-break:break-word}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdAlertDialogComponent, { className: "TdAlertDialogComponent", filePath: "alert-dialog/alert-dialog.component.ts", lineNumber: 25 }); })();
 
 function TdConfirmDialogComponent_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0, 8);
@@ -198,22 +205,19 @@ function TdConfirmDialogComponent_ng_container_1_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵtextInterpolate(ctx_r1.title);
 } }
 class TdConfirmDialogComponent {
-    _dialogRef;
+    _dialogRef = inject(MatDialogRef);
     title;
     message;
     cancelButton = 'CANCEL';
     acceptButton = 'ACCEPT';
     isDestructive = false;
-    constructor(_dialogRef) {
-        this._dialogRef = _dialogRef;
-    }
     cancel() {
         this._dialogRef.close(false);
     }
     accept() {
         this._dialogRef.close(true);
     }
-    static ɵfac = function TdConfirmDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdConfirmDialogComponent)(i0.ɵɵdirectiveInject(i1.MatDialogRef)); };
+    static ɵfac = function TdConfirmDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdConfirmDialogComponent)(); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdConfirmDialogComponent, selectors: [["td-confirm-dialog"]], decls: 12, vars: 5, consts: [["closeBtn", ""], ["acceptBtn", ""], ["tdDialogTitle", "", 4, "ngIf"], ["tdDialogContent", ""], [1, "td-dialog-message"], ["tdDialogActions", ""], ["mat-button", "", 3, "keydown.arrowright", "click"], ["mat-button", "", 3, "keydown.arrowleft", "click", "color"], ["tdDialogTitle", ""]], template: function TdConfirmDialogComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "td-dialog");
@@ -245,13 +249,24 @@ class TdConfirmDialogComponent {
             i0.ɵɵproperty("color", ctx.isDestructive ? "warn" : "accent");
             i0.ɵɵadvance(2);
             i0.ɵɵtextInterpolate1(" ", ctx.acceptButton, " ");
-        } }, dependencies: [CommonModule, i2.NgIf, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective, MatButtonModule, i3.MatButton], styles: [".td-dialog-message[_ngcontent-%COMP%]{word-break:break-word}"] });
+        } }, dependencies: [CommonModule, i1.NgIf, TdDialogComponent,
+            TdDialogTitleDirective,
+            TdDialogContentDirective,
+            TdDialogActionsDirective,
+            MatButtonModule, i2$1.MatButton], styles: [".td-dialog-message[_ngcontent-%COMP%]{word-break:break-word}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdConfirmDialogComponent, [{
         type: Component,
-        args: [{ selector: 'td-confirm-dialog', imports: [CommonModule, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective, MatButtonModule], template: "<td-dialog>\n  <ng-container tdDialogTitle *ngIf=\"title\">{{ title }}</ng-container>\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">{{ message }}</span>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button\n      mat-button\n      #closeBtn\n      (keydown.arrowright)=\"acceptBtn.focus()\"\n      (click)=\"cancel()\"\n    >\n      {{ cancelButton }}\n    </button>\n    <button\n      mat-button\n      [color]=\"isDestructive ? 'warn' : 'accent'\"\n      #acceptBtn\n      (keydown.arrowleft)=\"closeBtn.focus()\"\n      (click)=\"accept()\"\n    >\n      {{ acceptButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: [".td-dialog-message{word-break:break-word}\n"] }]
-    }], () => [{ type: i1.MatDialogRef }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdConfirmDialogComponent, { className: "TdConfirmDialogComponent", filePath: "confirm-dialog/confirm-dialog.component.ts", lineNumber: 13 }); })();
+        args: [{ selector: 'td-confirm-dialog', imports: [
+                    CommonModule,
+                    TdDialogComponent,
+                    TdDialogTitleDirective,
+                    TdDialogContentDirective,
+                    TdDialogActionsDirective,
+                    MatButtonModule,
+                ], template: "<td-dialog>\n  <ng-container tdDialogTitle *ngIf=\"title\">{{ title }}</ng-container>\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">{{ message }}</span>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button\n      mat-button\n      #closeBtn\n      (keydown.arrowright)=\"acceptBtn.focus()\"\n      (click)=\"cancel()\"\n    >\n      {{ cancelButton }}\n    </button>\n    <button\n      mat-button\n      [color]=\"isDestructive ? 'warn' : 'accent'\"\n      #acceptBtn\n      (keydown.arrowleft)=\"closeBtn.focus()\"\n      (click)=\"accept()\"\n    >\n      {{ acceptButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: [".td-dialog-message{word-break:break-word}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdConfirmDialogComponent, { className: "TdConfirmDialogComponent", filePath: "confirm-dialog/confirm-dialog.component.ts", lineNumber: 25 }); })();
 
 const _c0$2 = ["input"];
 const _c1 = ["closeBtn"];
@@ -266,8 +281,8 @@ function TdPromptDialogComponent_ng_container_1_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵtextInterpolate(ctx_r1.title);
 } }
 class TdPromptDialogComponent {
-    _ngZone;
-    _dialogRef;
+    _ngZone = inject(NgZone);
+    _dialogRef = inject(MatDialogRef);
     title;
     message;
     value;
@@ -278,10 +293,6 @@ class TdPromptDialogComponent {
     _closeBtn;
     _acceptBtn;
     _destroy$ = new Subject();
-    constructor(_ngZone, _dialogRef) {
-        this._ngZone = _ngZone;
-        this._dialogRef = _dialogRef;
-    }
     ngAfterViewInit() {
         this._ngZone.runOutsideAngular(() => {
             // Note: `element.focus()` causes re-layout and this may lead to frame drop on slower devices.
@@ -320,7 +331,7 @@ class TdPromptDialogComponent {
     accept() {
         this._dialogRef.close(this.value);
     }
-    static ɵfac = function TdPromptDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdPromptDialogComponent)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i1.MatDialogRef)); };
+    static ɵfac = function TdPromptDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdPromptDialogComponent)(); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdPromptDialogComponent, selectors: [["td-prompt-dialog"]], viewQuery: function TdPromptDialogComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0$2, 7);
             i0.ɵɵviewQuery(_c1, 7, ElementRef);
@@ -368,12 +379,28 @@ class TdPromptDialogComponent {
             i0.ɵɵproperty("disabled", !form_r3.valid);
             i0.ɵɵadvance(2);
             i0.ɵɵtextInterpolate1(" ", ctx.acceptButton, " ");
-        } }, dependencies: [CommonModule, i2.NgIf, FormsModule, i3$1.ɵNgNoValidate, i3$1.DefaultValueAccessor, i3$1.NgControlStatus, i3$1.NgControlStatusGroup, i3$1.RequiredValidator, i3$1.NgModel, i3$1.NgForm, MatFormField, MatInput, MatButton, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective], styles: [".td-dialog-input-wrapper[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex}.td-dialog-input-wrapper[_ngcontent-%COMP%]   .td-dialog-input[_ngcontent-%COMP%]{flex:1;box-sizing:border-box}.td-dialog-message[_ngcontent-%COMP%]{word-break:break-word}"] });
+        } }, dependencies: [CommonModule, i1.NgIf, FormsModule, i2$2.ɵNgNoValidate, i2$2.DefaultValueAccessor, i2$2.NgControlStatus, i2$2.NgControlStatusGroup, i2$2.RequiredValidator, i2$2.NgModel, i2$2.NgForm, MatFormField,
+            MatInput,
+            MatButton,
+            TdDialogComponent,
+            TdDialogTitleDirective,
+            TdDialogContentDirective,
+            TdDialogActionsDirective], styles: [".td-dialog-input-wrapper[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex}.td-dialog-input-wrapper[_ngcontent-%COMP%]   .td-dialog-input[_ngcontent-%COMP%]{flex:1;box-sizing:border-box}.td-dialog-message[_ngcontent-%COMP%]{word-break:break-word}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdPromptDialogComponent, [{
         type: Component,
-        args: [{ selector: 'td-prompt-dialog', imports: [CommonModule, FormsModule, MatFormField, MatInput, MatButton, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective], template: "<td-dialog>\n  <ng-container tdDialogTitle *ngIf=\"title\">{{ title }}</ng-container>\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">{{ message }}</span>\n    <form #form=\"ngForm\" novalidate>\n      <div class=\"td-dialog-input-wrapper\">\n        <mat-form-field class=\"td-dialog-input\">\n          <input\n            matInput\n            #input\n            (keydown.enter)=\"$event.preventDefault(); form.valid && accept()\"\n            [(ngModel)]=\"value\"\n            name=\"value\"\n            required\n          />\n        </mat-form-field>\n      </div>\n    </form>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button mat-button #closeBtn (click)=\"cancel()\">{{ cancelButton }}</button>\n    <button\n      mat-button\n      color=\"accent\"\n      #acceptBtn\n      [disabled]=\"!form.valid\"\n      (click)=\"accept()\"\n    >\n      {{ acceptButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: [".td-dialog-input-wrapper{flex-direction:row;box-sizing:border-box;display:flex}.td-dialog-input-wrapper .td-dialog-input{flex:1;box-sizing:border-box}.td-dialog-message{word-break:break-word}\n"] }]
-    }], () => [{ type: i0.NgZone }, { type: i1.MatDialogRef }], { _input: [{
+        args: [{ selector: 'td-prompt-dialog', imports: [
+                    CommonModule,
+                    FormsModule,
+                    MatFormField,
+                    MatInput,
+                    MatButton,
+                    TdDialogComponent,
+                    TdDialogTitleDirective,
+                    TdDialogContentDirective,
+                    TdDialogActionsDirective,
+                ], template: "<td-dialog>\n  <ng-container tdDialogTitle *ngIf=\"title\">{{ title }}</ng-container>\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">{{ message }}</span>\n    <form #form=\"ngForm\" novalidate>\n      <div class=\"td-dialog-input-wrapper\">\n        <mat-form-field class=\"td-dialog-input\">\n          <input\n            matInput\n            #input\n            (keydown.enter)=\"$event.preventDefault(); form.valid && accept()\"\n            [(ngModel)]=\"value\"\n            name=\"value\"\n            required\n          />\n        </mat-form-field>\n      </div>\n    </form>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button mat-button #closeBtn (click)=\"cancel()\">{{ cancelButton }}</button>\n    <button\n      mat-button\n      color=\"accent\"\n      #acceptBtn\n      [disabled]=\"!form.valid\"\n      (click)=\"accept()\"\n    >\n      {{ acceptButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: [".td-dialog-input-wrapper{flex-direction:row;box-sizing:border-box;display:flex}.td-dialog-input-wrapper .td-dialog-input{flex:1;box-sizing:border-box}.td-dialog-message{word-break:break-word}\n"] }]
+    }], null, { _input: [{
             type: ViewChild,
             args: ['input', { static: true }]
         }], _closeBtn: [{
@@ -383,7 +410,7 @@ class TdPromptDialogComponent {
             type: ViewChild,
             args: ['acceptBtn', { static: true, read: ElementRef }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdPromptDialogComponent, { className: "TdPromptDialogComponent", filePath: "prompt-dialog/prompt-dialog.component.ts", lineNumber: 25 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdPromptDialogComponent, { className: "TdPromptDialogComponent", filePath: "prompt-dialog/prompt-dialog.component.ts", lineNumber: 41 }); })();
 
 const _c0$1 = (a0, a1) => ({ "td-status-dialog__arrow-icon": true, close: a0, open: a1 });
 function TdStatusDialogComponent_span_6_Template(rf, ctx) { if (rf & 1) {
@@ -420,7 +447,7 @@ function TdStatusDialogComponent_div_14_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate(ctx_r0.details);
 } }
 class TdStatusDialogComponent {
-    _dialogRef;
+    _dialogRef = inject(MatDialogRef);
     // Label of the close button in the footer
     closeButton = 'CLOSE';
     // Message to be displayed in the dialog
@@ -438,9 +465,6 @@ class TdStatusDialogComponent {
         showDetailsLabel: 'Show details',
         hideDetailsLabel: 'Hide details',
     };
-    constructor(_dialogRef) {
-        this._dialogRef = _dialogRef;
-    }
     close() {
         this._dialogRef.close();
     }
@@ -458,7 +482,7 @@ class TdStatusDialogComponent {
     toggleDetails() {
         this.showDetails = !this.showDetails;
     }
-    static ɵfac = function TdStatusDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdStatusDialogComponent)(i0.ɵɵdirectiveInject(i1.MatDialogRef)); };
+    static ɵfac = function TdStatusDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdStatusDialogComponent)(); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdStatusDialogComponent, selectors: [["td-status-dialog"]], decls: 18, vars: 7, consts: [[1, "td-status-dialog"], ["tdDialogStatus", "", 1, "td-status-dialog-state", 3, "ngClass"], ["tdDialogTitle", ""], [1, "td-status-dialog-title"], ["class", "", 4, "ngIf"], ["mat-icon-button", "", 1, "td-status-dialog__icon-button", 3, "click"], ["tdDialogContent", ""], [1, "td-dialog-message"], ["class", "td-status-dialog__toggle-details", "role", "button", "tabindex", "0", 3, "click", "keydown.enter", 4, "ngIf"], [4, "ngIf"], ["tdDialogActions", ""], ["mat-raised-button", "", "color", "primary", 1, "td-status-dialog___button", 3, "click"], [1, ""], ["role", "button", "tabindex", "0", 1, "td-status-dialog__toggle-details", 3, "click", "keydown.enter"], [3, "ngClass"]], template: function TdStatusDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "td-dialog", 0)(1, "div", 1)(2, "mat-icon");
             i0.ɵɵtext(3);
@@ -500,25 +524,39 @@ class TdStatusDialogComponent {
             i0.ɵɵproperty("ngIf", ctx.showDetails);
             i0.ɵɵadvance(3);
             i0.ɵɵtextInterpolate1(" ", ctx.closeButton, " ");
-        } }, dependencies: [CommonModule, i2.NgClass, i2.NgIf, MatIcon, MatIconButton, MatButton, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective, TdDialogStatusDirective], styles: [".mat-mdc-dialog-container .mdc-dialog__surface{background-color:var(--cv-theme-surface-container-lowest);border-radius:12px}  .td-status-dialog-title{align-items:flex-start;display:inline-flex;justify-content:space-between;width:100%;-webkit-font-smoothing:antialiased}  .td-status-dialog-title :first-child{padding-right:40px}  [mat-icon-button].td-status-dialog__icon-button{--mdc-icon-button-state-layer-size: 40px;padding:8px;position:absolute;right:8px;top:10px}  .td-status-dialog___button{border-radius:8px}  .mat-mdc-dialog-container .mdc-dialog__title{padding:18px 16px;line-height:var(--mdc-dialog-supporting-text-line-height)}  .mat-mdc-dialog-container .mdc-dialog__title:before{display:none}  .mat-mdc-icon-button .mat-mdc-button-base{padding:8px}  .mdc-dialog .mdc-dialog__content{padding:0 16px;-webkit-font-smoothing:antialiased}  .mdc-dialog__actions{padding:16px}.td-status-dialog[_ngcontent-%COMP%]{width:auto}.td-status-dialog[_ngcontent-%COMP%]:before{padding:14px 16px 0}.td-status-dialog[_ngcontent-%COMP%]   .td-dialog-message[_ngcontent-%COMP%]{font-feature-settings:\"clig\" off,\"liga\" off;color:var(--cv-theme-on-surface-variant);line-height:var(--mdc-dialog-supporting-text-line-height)}.td-status-dialog-state[_ngcontent-%COMP%]{padding:14px 16px 0}.td-status-dialog-state[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{font-size:var(--mat-toolbar-title-text-line-height);height:var(--mat-toolbar-title-text-line-height);width:var(--mat-toolbar-title-text-line-height);font-variation-settings:\"FILL\" 1}.td-status-dialog-state.error[_ngcontent-%COMP%]{background-color:var(--cv-theme-negative-8)}.td-status-dialog-state.error[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{color:var(--cv-theme-negative)}.td-status-dialog-state.positive[_ngcontent-%COMP%]{background-color:var(--cv-theme-positive-8)}.td-status-dialog-state.positive[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{color:var(--cv-theme-positive)}.td-status-dialog-state.warning[_ngcontent-%COMP%]{background-color:var(--cv-theme-caution-8)}.td-status-dialog-state.warning[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{color:var(--cv-theme-caution)}.td-status-dialog__toggle-details[_ngcontent-%COMP%]{align-items:center;color:var(--cv-theme-primary);cursor:pointer;display:flex;font-size:var(--mat-expansion-container-text-size);letter-spacing:.25px;line-height:var(--mat-expansion-container-text-line-height);padding:16px 0}.td-status-dialog__arrow-icon[_ngcontent-%COMP%]{margin-top:2px}.td-status-dialog__arrow-icon.open[_ngcontent-%COMP%]{transform:rotate(0);transition:transform .25s ease-out}.td-status-dialog__arrow-icon.close[_ngcontent-%COMP%]{transform:rotate(180deg);transition:transform .25s ease-in}@media screen and (max-width: 480px){[_nghost-%COMP%]   .td-status-dialog-state[_ngcontent-%COMP%]{padding:4px}[_nghost-%COMP%]   .td-status-dialog-state[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{display:none}[_nghost-%COMP%]   .td-status-dialog-state.error[_ngcontent-%COMP%]{background-color:var(--cv-theme-negative)}[_nghost-%COMP%]   .td-status-dialog-state.positive[_ngcontent-%COMP%]{background-color:var(--cv-theme-positive)}[_nghost-%COMP%]   .td-status-dialog-state.warning[_ngcontent-%COMP%]{background-color:var(--cv-theme-caution)}}"] });
+        } }, dependencies: [CommonModule, i1.NgClass, i1.NgIf, MatIcon,
+            MatIconButton,
+            MatButton,
+            TdDialogComponent,
+            TdDialogTitleDirective,
+            TdDialogContentDirective,
+            TdDialogActionsDirective,
+            TdDialogStatusDirective], styles: [".mat-mdc-dialog-container .mdc-dialog__surface{background-color:var(--cv-theme-surface-container-lowest);border-radius:12px}  .td-status-dialog-title{align-items:flex-start;display:inline-flex;justify-content:space-between;width:100%;-webkit-font-smoothing:antialiased}  .td-status-dialog-title :first-child{padding-right:40px}  [mat-icon-button].td-status-dialog__icon-button{--mdc-icon-button-state-layer-size: 40px;padding:8px;position:absolute;right:8px;top:10px}  .td-status-dialog___button{border-radius:8px}  .mat-mdc-dialog-container .mdc-dialog__title{padding:18px 16px;line-height:var(--mdc-dialog-supporting-text-line-height)}  .mat-mdc-dialog-container .mdc-dialog__title:before{display:none}  .mat-mdc-icon-button .mat-mdc-button-base{padding:8px}  .mdc-dialog .mdc-dialog__content{padding:0 16px;-webkit-font-smoothing:antialiased}  .mdc-dialog__actions{padding:16px}.td-status-dialog[_ngcontent-%COMP%]{width:auto}.td-status-dialog[_ngcontent-%COMP%]:before{padding:14px 16px 0}.td-status-dialog[_ngcontent-%COMP%]   .td-dialog-message[_ngcontent-%COMP%]{font-feature-settings:\"clig\" off,\"liga\" off;color:var(--cv-theme-on-surface-variant);line-height:var(--mdc-dialog-supporting-text-line-height)}.td-status-dialog-state[_ngcontent-%COMP%]{padding:14px 16px 0}.td-status-dialog-state[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{font-size:var(--mat-toolbar-title-text-line-height);height:var(--mat-toolbar-title-text-line-height);width:var(--mat-toolbar-title-text-line-height);font-variation-settings:\"FILL\" 1}.td-status-dialog-state.error[_ngcontent-%COMP%]{background-color:var(--cv-theme-negative-8)}.td-status-dialog-state.error[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{color:var(--cv-theme-negative)}.td-status-dialog-state.positive[_ngcontent-%COMP%]{background-color:var(--cv-theme-positive-8)}.td-status-dialog-state.positive[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{color:var(--cv-theme-positive)}.td-status-dialog-state.warning[_ngcontent-%COMP%]{background-color:var(--cv-theme-caution-8)}.td-status-dialog-state.warning[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{color:var(--cv-theme-caution)}.td-status-dialog__toggle-details[_ngcontent-%COMP%]{align-items:center;color:var(--cv-theme-primary);cursor:pointer;display:flex;font-size:var(--mat-expansion-container-text-size);letter-spacing:.25px;line-height:var(--mat-expansion-container-text-line-height);padding:16px 0}.td-status-dialog__arrow-icon[_ngcontent-%COMP%]{margin-top:2px}.td-status-dialog__arrow-icon.open[_ngcontent-%COMP%]{transform:rotate(0);transition:transform .25s ease-out}.td-status-dialog__arrow-icon.close[_ngcontent-%COMP%]{transform:rotate(180deg);transition:transform .25s ease-in}@media screen and (max-width: 480px){[_nghost-%COMP%]   .td-status-dialog-state[_ngcontent-%COMP%]{padding:4px}[_nghost-%COMP%]   .td-status-dialog-state[_ngcontent-%COMP%]   .mat-icon[_ngcontent-%COMP%]{display:none}[_nghost-%COMP%]   .td-status-dialog-state.error[_ngcontent-%COMP%]{background-color:var(--cv-theme-negative)}[_nghost-%COMP%]   .td-status-dialog-state.positive[_ngcontent-%COMP%]{background-color:var(--cv-theme-positive)}[_nghost-%COMP%]   .td-status-dialog-state.warning[_ngcontent-%COMP%]{background-color:var(--cv-theme-caution)}}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdStatusDialogComponent, [{
         type: Component,
-        args: [{ selector: 'td-status-dialog', imports: [CommonModule, MatIcon, MatIconButton, MatButton, TdDialogComponent, TdDialogTitleDirective, TdDialogContentDirective, TdDialogActionsDirective, TdDialogStatusDirective], template: "<td-dialog class=\"td-status-dialog\">\n  <!-- Displays the icon and background color according to the state -->\n  <div tdDialogStatus class=\"td-status-dialog-state\" [ngClass]=\"state\">\n    <mat-icon>\n      {{ getStatusIcon() }}\n    </mat-icon>\n  </div>\n  <!-- Dialog title and the close icon -->\n  <ng-container tdDialogTitle>\n    <div class=\"td-status-dialog-title\">\n      <span *ngIf=\"title\" class=\"\">{{ title }}</span>\n      <button\n        mat-icon-button\n        class=\"td-status-dialog__icon-button\"\n        (click)=\"close()\"\n      >\n        <mat-icon>close</mat-icon>\n      </button>\n    </div>\n  </ng-container>\n  <!-- Dialog content with additonal information -->\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">\n      {{ message }}\n      <div\n        class=\"td-status-dialog__toggle-details\"\n        role=\"button\"\n        tabindex=\"0\"\n        *ngIf=\"details\"\n        (click)=\"toggleDetails()\"\n        (keydown.enter)=\"toggleDetails()\"\n      >\n        {{\n          showDetails\n            ? detailsLabels?.hideDetailsLabel\n            : detailsLabels?.showDetailsLabel\n        }}\n        <mat-icon\n          [ngClass]=\"{\n            'td-status-dialog__arrow-icon': true,\n            close: !showDetails,\n            open: showDetails\n          }\"\n          >arrow_drop_down</mat-icon\n        >\n      </div>\n      <div *ngIf=\"showDetails\">{{ details }}</div>\n    </span>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button\n      mat-raised-button\n      color=\"primary\"\n      class=\"td-status-dialog___button\"\n      (click)=\"close()\"\n    >\n      {{ closeButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: ["::ng-deep .mat-mdc-dialog-container .mdc-dialog__surface{background-color:var(--cv-theme-surface-container-lowest);border-radius:12px}::ng-deep .td-status-dialog-title{align-items:flex-start;display:inline-flex;justify-content:space-between;width:100%;-webkit-font-smoothing:antialiased}::ng-deep .td-status-dialog-title :first-child{padding-right:40px}::ng-deep [mat-icon-button].td-status-dialog__icon-button{--mdc-icon-button-state-layer-size: 40px;padding:8px;position:absolute;right:8px;top:10px}::ng-deep .td-status-dialog___button{border-radius:8px}::ng-deep .mat-mdc-dialog-container .mdc-dialog__title{padding:18px 16px;line-height:var(--mdc-dialog-supporting-text-line-height)}::ng-deep .mat-mdc-dialog-container .mdc-dialog__title:before{display:none}::ng-deep .mat-mdc-icon-button .mat-mdc-button-base{padding:8px}::ng-deep .mdc-dialog .mdc-dialog__content{padding:0 16px;-webkit-font-smoothing:antialiased}::ng-deep .mdc-dialog__actions{padding:16px}.td-status-dialog{width:auto}.td-status-dialog:before{padding:14px 16px 0}.td-status-dialog .td-dialog-message{font-feature-settings:\"clig\" off,\"liga\" off;color:var(--cv-theme-on-surface-variant);line-height:var(--mdc-dialog-supporting-text-line-height)}.td-status-dialog-state{padding:14px 16px 0}.td-status-dialog-state .mat-icon{font-size:var(--mat-toolbar-title-text-line-height);height:var(--mat-toolbar-title-text-line-height);width:var(--mat-toolbar-title-text-line-height);font-variation-settings:\"FILL\" 1}.td-status-dialog-state.error{background-color:var(--cv-theme-negative-8)}.td-status-dialog-state.error .mat-icon{color:var(--cv-theme-negative)}.td-status-dialog-state.positive{background-color:var(--cv-theme-positive-8)}.td-status-dialog-state.positive .mat-icon{color:var(--cv-theme-positive)}.td-status-dialog-state.warning{background-color:var(--cv-theme-caution-8)}.td-status-dialog-state.warning .mat-icon{color:var(--cv-theme-caution)}.td-status-dialog__toggle-details{align-items:center;color:var(--cv-theme-primary);cursor:pointer;display:flex;font-size:var(--mat-expansion-container-text-size);letter-spacing:.25px;line-height:var(--mat-expansion-container-text-line-height);padding:16px 0}.td-status-dialog__arrow-icon{margin-top:2px}.td-status-dialog__arrow-icon.open{transform:rotate(0);transition:transform .25s ease-out}.td-status-dialog__arrow-icon.close{transform:rotate(180deg);transition:transform .25s ease-in}@media screen and (max-width: 480px){:host .td-status-dialog-state{padding:4px}:host .td-status-dialog-state .mat-icon{display:none}:host .td-status-dialog-state.error{background-color:var(--cv-theme-negative)}:host .td-status-dialog-state.positive{background-color:var(--cv-theme-positive)}:host .td-status-dialog-state.warning{background-color:var(--cv-theme-caution)}}\n"] }]
-    }], () => [{ type: i1.MatDialogRef }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdStatusDialogComponent, { className: "TdStatusDialogComponent", filePath: "status-dialog/status-dialog.component.ts", lineNumber: 21 }); })();
+        args: [{ selector: 'td-status-dialog', imports: [
+                    CommonModule,
+                    MatIcon,
+                    MatIconButton,
+                    MatButton,
+                    TdDialogComponent,
+                    TdDialogTitleDirective,
+                    TdDialogContentDirective,
+                    TdDialogActionsDirective,
+                    TdDialogStatusDirective,
+                ], template: "<td-dialog class=\"td-status-dialog\">\n  <!-- Displays the icon and background color according to the state -->\n  <div tdDialogStatus class=\"td-status-dialog-state\" [ngClass]=\"state\">\n    <mat-icon>\n      {{ getStatusIcon() }}\n    </mat-icon>\n  </div>\n  <!-- Dialog title and the close icon -->\n  <ng-container tdDialogTitle>\n    <div class=\"td-status-dialog-title\">\n      <span *ngIf=\"title\" class=\"\">{{ title }}</span>\n      <button\n        mat-icon-button\n        class=\"td-status-dialog__icon-button\"\n        (click)=\"close()\"\n      >\n        <mat-icon>close</mat-icon>\n      </button>\n    </div>\n  </ng-container>\n  <!-- Dialog content with additonal information -->\n  <ng-container tdDialogContent>\n    <span class=\"td-dialog-message\">\n      {{ message }}\n      <div\n        class=\"td-status-dialog__toggle-details\"\n        role=\"button\"\n        tabindex=\"0\"\n        *ngIf=\"details\"\n        (click)=\"toggleDetails()\"\n        (keydown.enter)=\"toggleDetails()\"\n      >\n        {{\n          showDetails\n            ? detailsLabels?.hideDetailsLabel\n            : detailsLabels?.showDetailsLabel\n        }}\n        <mat-icon\n          [ngClass]=\"{\n            'td-status-dialog__arrow-icon': true,\n            close: !showDetails,\n            open: showDetails\n          }\"\n          >arrow_drop_down</mat-icon\n        >\n      </div>\n      <div *ngIf=\"showDetails\">{{ details }}</div>\n    </span>\n  </ng-container>\n  <ng-container tdDialogActions>\n    <button\n      mat-raised-button\n      color=\"primary\"\n      class=\"td-status-dialog___button\"\n      (click)=\"close()\"\n    >\n      {{ closeButton }}\n    </button>\n  </ng-container>\n</td-dialog>\n", styles: ["::ng-deep .mat-mdc-dialog-container .mdc-dialog__surface{background-color:var(--cv-theme-surface-container-lowest);border-radius:12px}::ng-deep .td-status-dialog-title{align-items:flex-start;display:inline-flex;justify-content:space-between;width:100%;-webkit-font-smoothing:antialiased}::ng-deep .td-status-dialog-title :first-child{padding-right:40px}::ng-deep [mat-icon-button].td-status-dialog__icon-button{--mdc-icon-button-state-layer-size: 40px;padding:8px;position:absolute;right:8px;top:10px}::ng-deep .td-status-dialog___button{border-radius:8px}::ng-deep .mat-mdc-dialog-container .mdc-dialog__title{padding:18px 16px;line-height:var(--mdc-dialog-supporting-text-line-height)}::ng-deep .mat-mdc-dialog-container .mdc-dialog__title:before{display:none}::ng-deep .mat-mdc-icon-button .mat-mdc-button-base{padding:8px}::ng-deep .mdc-dialog .mdc-dialog__content{padding:0 16px;-webkit-font-smoothing:antialiased}::ng-deep .mdc-dialog__actions{padding:16px}.td-status-dialog{width:auto}.td-status-dialog:before{padding:14px 16px 0}.td-status-dialog .td-dialog-message{font-feature-settings:\"clig\" off,\"liga\" off;color:var(--cv-theme-on-surface-variant);line-height:var(--mdc-dialog-supporting-text-line-height)}.td-status-dialog-state{padding:14px 16px 0}.td-status-dialog-state .mat-icon{font-size:var(--mat-toolbar-title-text-line-height);height:var(--mat-toolbar-title-text-line-height);width:var(--mat-toolbar-title-text-line-height);font-variation-settings:\"FILL\" 1}.td-status-dialog-state.error{background-color:var(--cv-theme-negative-8)}.td-status-dialog-state.error .mat-icon{color:var(--cv-theme-negative)}.td-status-dialog-state.positive{background-color:var(--cv-theme-positive-8)}.td-status-dialog-state.positive .mat-icon{color:var(--cv-theme-positive)}.td-status-dialog-state.warning{background-color:var(--cv-theme-caution-8)}.td-status-dialog-state.warning .mat-icon{color:var(--cv-theme-caution)}.td-status-dialog__toggle-details{align-items:center;color:var(--cv-theme-primary);cursor:pointer;display:flex;font-size:var(--mat-expansion-container-text-size);letter-spacing:.25px;line-height:var(--mat-expansion-container-text-line-height);padding:16px 0}.td-status-dialog__arrow-icon{margin-top:2px}.td-status-dialog__arrow-icon.open{transform:rotate(0);transition:transform .25s ease-out}.td-status-dialog__arrow-icon.close{transform:rotate(180deg);transition:transform .25s ease-in}@media screen and (max-width: 480px){:host .td-status-dialog-state{padding:4px}:host .td-status-dialog-state .mat-icon{display:none}:host .td-status-dialog-state.error{background-color:var(--cv-theme-negative)}:host .td-status-dialog-state.positive{background-color:var(--cv-theme-positive)}:host .td-status-dialog-state.warning{background-color:var(--cv-theme-caution)}}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdStatusDialogComponent, { className: "TdStatusDialogComponent", filePath: "status-dialog/status-dialog.component.ts", lineNumber: 37 }); })();
 
 class TdDialogService {
-    _document;
-    _dialogService;
-    _dragDrop;
-    rendererFactory;
+    _document = inject(DOCUMENT);
+    _dialogService = inject(MatDialog);
+    _dragDrop = inject(DragDrop);
+    rendererFactory = inject(RendererFactory2);
     _renderer2;
-    constructor(_document, _dialogService, _dragDrop, rendererFactory) {
-        this._document = _document;
-        this._dialogService = _dialogService;
-        this._dragDrop = _dragDrop;
-        this.rendererFactory = rendererFactory;
+    constructor() {
+        const rendererFactory = this.rendererFactory;
         this._renderer2 = rendererFactory.createRenderer(undefined, null);
     }
     /**
@@ -701,15 +739,12 @@ class TdDialogService {
         }
         return dialogRef;
     }
-    static ɵfac = function TdDialogService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDialogService)(i0.ɵɵinject(DOCUMENT), i0.ɵɵinject(i1.MatDialog), i0.ɵɵinject(i2$1.DragDrop), i0.ɵɵinject(i0.RendererFactory2)); };
+    static ɵfac = function TdDialogService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDialogService)(); };
     static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: TdDialogService, factory: TdDialogService.ɵfac });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDialogService, [{
         type: Injectable
-    }], () => [{ type: undefined, decorators: [{
-                type: Inject,
-                args: [DOCUMENT]
-            }] }, { type: i1.MatDialog }, { type: i2$1.DragDrop }, { type: i0.RendererFactory2 }], null); })();
+    }], () => [], null); })();
 
 const _c0 = ["*"];
 class TdWindowDialogComponent {