@yuuvis/client-framework 2.18.0 → 2.19.0

package/common/lib/components/confirm/confirm.component.d.ts

@@ -2,6 +2,7 @@ import { ConfirmOverlayData } from './confirm.interface';
 import * as i0 from "@angular/core";
 export declare class ConfirmComponent {
     readonly dialogData: ConfirmOverlayData;
+    buttonType: import("@angular/core").Signal<"danger" | "primary">;
     static ɵfac: i0.ɵɵFactoryDeclaration<ConfirmComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ConfirmComponent, "yuv-confirm", never, {}, {}, never, never, true, never>;
 }

package/common/lib/components/confirm/confirm.interface.d.ts

@@ -1,7 +1,9 @@
+export type LevelType = 'success' | 'warning' | 'error' | 'info' | 'default';
 export interface ConfirmOverlayData {
     title?: string;
     message: string;
     confirmLabel?: string;
     cancelLabel?: string;
     hideCancelButton?: boolean;
+    level?: Extract<LevelType, 'default' | 'info' | 'warning'>;
 }

package/fesm2022/yuuvis-client-framework-common.mjs

@@ -1,15 +1,15 @@
 import * as i0 from '@angular/core';
-import { input, ChangeDetectionStrategy, Component, inject, DestroyRef, viewChild, signal, afterNextRender, ElementRef, Input, Directive, computed, output, EnvironmentInjector, ViewContainerRef, effect, EventEmitter, HostListener, Output, NgZone, contentChildren, Injectable, HostBinding, forwardRef, Renderer2, NgModule, InjectionToken, makeEnvironmentProviders, RendererFactory2 } from '@angular/core';
-import { CommonModule, DOCUMENT } from '@angular/common';
+import { input, ChangeDetectionStrategy, Component, inject, computed, DestroyRef, viewChild, signal, afterNextRender, ElementRef, Input, Directive, output, EnvironmentInjector, ViewContainerRef, effect, EventEmitter, HostListener, Output, NgZone, contentChildren, Injectable, HostBinding, forwardRef, Renderer2, NgModule, InjectionToken, makeEnvironmentProviders, RendererFactory2 } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
 import * as i2 from '@angular/material/dialog';
 import { MatDialogActions, MatDialogTitle, MatDialogContent, MAT_DIALOG_DATA, MatDialogModule, MatDialog } from '@angular/material/dialog';
+import { TranslateModule as TranslateModule$1, AppCacheService, RetentionService, LocaleDatePipe } from '@yuuvis/client-core';
+import { YmtButtonDirective, YmtIconButtonDirective } from '@yuuvis/material';
 import * as i1 from '@ngx-translate/core';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
-import { YmtButtonDirective, YmtIconButtonDirective } from '@yuuvis/material';
-import { TranslateModule as TranslateModule$1, AppCacheService, RetentionService, LocaleDatePipe } from '@yuuvis/client-core';
 import * as i1$1 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
+import { CommonModule, DOCUMENT } from '@angular/common';
 import { MatProgressSpinner } from '@angular/material/progress-spinner';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { Subject, fromEvent, merge, timer, of, forkJoin, map as map$1 } from 'rxjs';
@@ -33,11 +33,11 @@ class DialogComponent {
       <h2 mat-dialog-title>{{ title }}</h2>
     }
     <mat-dialog-content>
-      <ng-content select="main"></ng-content>
+      <ng-content select="main" />
     </mat-dialog-content>
 
     <mat-dialog-actions align="end" class="footer">
-      <ng-content select="footer"></ng-content>
+      <ng-content select="footer" />
     </mat-dialog-actions>
   `, isInline: true, styles: [":host{--_dialog-area-background: var(--dialog-area-background, light-dark(var(--ymt-surface), var(--ymt-surface-container-low)));--_dialog-area-divider-color: var(--dialog-area-divider-color, var(--ymt-outline-variant));height:100%;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:1fr;grid-template-areas:\"header\" \"content\" \"footer\"}:host h2{grid-area:header;background-color:var(--_dialog-area-background);border-block-end:1px solid var(--_dialog-area-divider-color)}:host .footer{background-color:var(--_dialog-area-background);border-block-start:1px solid var(--_dialog-area-divider-color);gap:calc(var(--ymt-font-body) / 2)}:host.not-separated{background-color:var(--ymt-surface-app)}:host.not-separated h2,:host.not-separated .footer{background-color:transparent;border:0}.mat-mdc-dialog-container{height:100%}mat-dialog-content:empty{display:contents}mat-dialog-content main{display:var(--ymt-dialog-content-display);grid-area:content;overflow:hidden}mat-dialog-actions{grid-area:footer}mat-dialog-actions:empty{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
@@ -49,11 +49,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
       <h2 mat-dialog-title>{{ title }}</h2>
     }
     <mat-dialog-content>
-      <ng-content select="main"></ng-content>
+      <ng-content select="main" />
     </mat-dialog-content>
 
     <mat-dialog-actions align="end" class="footer">
-      <ng-content select="footer"></ng-content>
+      <ng-content select="footer" />
     </mat-dialog-actions>
   `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--_dialog-area-background: var(--dialog-area-background, light-dark(var(--ymt-surface), var(--ymt-surface-container-low)));--_dialog-area-divider-color: var(--dialog-area-divider-color, var(--ymt-outline-variant));height:100%;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:1fr;grid-template-areas:\"header\" \"content\" \"footer\"}:host h2{grid-area:header;background-color:var(--_dialog-area-background);border-block-end:1px solid var(--_dialog-area-divider-color)}:host .footer{background-color:var(--_dialog-area-background);border-block-start:1px solid var(--_dialog-area-divider-color);gap:calc(var(--ymt-font-body) / 2)}:host.not-separated{background-color:var(--ymt-surface-app)}:host.not-separated h2,:host.not-separated .footer{background-color:transparent;border:0}.mat-mdc-dialog-container{height:100%}mat-dialog-content:empty{display:contents}mat-dialog-content main{display:var(--ymt-dialog-content-display);grid-area:content;overflow:hidden}mat-dialog-actions{grid-area:footer}mat-dialog-actions:empty{display:contents}\n"] }]
         }] });
@@ -61,13 +61,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
 class ConfirmComponent {
     constructor() {
         this.dialogData = inject(MAT_DIALOG_DATA);
+        this.buttonType = computed(() => {
+            switch (this.dialogData.level) {
+                case 'warning':
+                    return 'danger';
+                // case 'warning':
+                //   return 'tertiary' as ButtonType;
+                // case 'info':
+                //   return 'primary' as ButtonType;
+                // case 'success':
+                //   return 'primary' as ButtonType;
+                default:
+                    return 'primary';
+            }
+        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ConfirmComponent, isStandalone: true, selector: "yuv-confirm", ngImport: i0, template: "<yuv-dialog [headertitel]=\"dialogData.title || ''\">\n  <main>{{ dialogData.message }}</main>\n  <footer>\n    @if (!dialogData.hideCancelButton) {\n      <button ymtButton=\"secondary\" mat-dialog-close type=\"button\">\n        {{ dialogData.cancelLabel || ('yuv.confirm.cancel' | translate) }}\n      </button>\n    }\n    <button ymtButton=\"primary\" type=\"button\" [mat-dialog-close]=\"true\">{{ dialogData.confirmLabel || ('yuv.confirm.confirm' | translate) }}</button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: TranslateModule$1 }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ConfirmComponent, isStandalone: true, selector: "yuv-confirm", ngImport: i0, template: "<yuv-dialog [headertitle]=\"dialogData.title || ''\">\n  <main>{{ dialogData.message }}</main>\n  <footer>\n    @if (!dialogData.hideCancelButton) {\n      <button ymtButton=\"secondary\" mat-dialog-close type=\"button\">\n        {{ dialogData.cancelLabel || ('yuv.confirm.cancel' | translate) }}\n      </button>\n    }\n    <button [ymtButton]=\"buttonType()\" type=\"button\" [mat-dialog-close]=\"true\">\n      {{ dialogData.confirmLabel || ('yuv.confirm.confirm' | translate) }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m)}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: TranslateModule$1 }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ConfirmComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'yuv-confirm', imports: [CommonModule, MatButtonModule, TranslateModule$1, MatDialogModule, DialogComponent, YmtButtonDirective], template: "<yuv-dialog [headertitel]=\"dialogData.title || ''\">\n  <main>{{ dialogData.message }}</main>\n  <footer>\n    @if (!dialogData.hideCancelButton) {\n      <button ymtButton=\"secondary\" mat-dialog-close type=\"button\">\n        {{ dialogData.cancelLabel || ('yuv.confirm.cancel' | translate) }}\n      </button>\n    }\n    <button ymtButton=\"primary\" type=\"button\" [mat-dialog-close]=\"true\">{{ dialogData.confirmLabel || ('yuv.confirm.confirm' | translate) }}</button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m)}\n"] }]
+            args: [{ selector: 'yuv-confirm', imports: [MatButtonModule, TranslateModule$1, MatDialogModule, DialogComponent, YmtButtonDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<yuv-dialog [headertitle]=\"dialogData.title || ''\">\n  <main>{{ dialogData.message }}</main>\n  <footer>\n    @if (!dialogData.hideCancelButton) {\n      <button ymtButton=\"secondary\" mat-dialog-close type=\"button\">\n        {{ dialogData.cancelLabel || ('yuv.confirm.cancel' | translate) }}\n      </button>\n    }\n    <button [ymtButton]=\"buttonType()\" type=\"button\" [mat-dialog-close]=\"true\">\n      {{ dialogData.confirmLabel || ('yuv.confirm.confirm' | translate) }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m)}\n"] }]
         }] });
 
 const DEFAULT_SCROLL_AMOUNT$1 = 150;