Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 | 1x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 1x 1x 1x 1x 1x 1x 1x | /**
* Copyright (c) Siemens 2016 - 2025
* SPDX-License-Identifier: MIT
*/
import { NgClass } from '@angular/common';
import { Component, computed, HostListener, inject, input, output, signal } from '@angular/core';
import {
addIcons,
elementCancel,
SiIconComponent,
SiStatusIconComponent,
STATUS_ICON_CONFIG
} from '@siemens/element-ng/icon';
import { SiLinkModule } from '@siemens/element-ng/link';
import { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';
import { SI_TOAST_AUTO_HIDE_DELAY, SiToast } from '../si-toast.model';
@Component({
selector: 'si-toast-notification',
imports: [NgClass, SiLinkModule, SiIconComponent, SiStatusIconComponent, SiTranslatePipe],
templateUrl: './si-toast-notification.component.html',
styleUrl: './si-toast-notification.component.scss'
})
export class SiToastNotificationComponent {
private readonly statusIcons = inject(STATUS_ICON_CONFIG);
readonly toast = input.required<SiToast>();
private closeAriaLabelDefault = t(() => $localize`:@@SI_TOAST.CLOSE:Close`);
protected readonly closeAriaLabel = computed(
() => this.toast().closeAriaLabel ?? this.closeAriaLabelDefault
);
protected readonly icons = addIcons({ elementCancel });
protected readonly status = computed(() => {
const toast = this.toast();
Iif (toast.state === 'connection') {
return 'danger';
} else {
return Object.keys(this.statusIcons).includes(toast.state) ? toast.state : 'info';
}
});
protected readonly statusColor = computed(() => this.statusIcons[this.status()].color);
protected readonly toastTimeoutInSeconds = computed(() => {
const toast = this.toast();
return toast.timeout ? toast.timeout / 1000 : SI_TOAST_AUTO_HIDE_DELAY / 1000;
});
protected readonly animationMode = signal('running');
readonly paused = output<void>();
readonly resumed = output<void>();
@HostListener('mouseenter')
protected onMouseEnter(): void {
if (!this.toast().disableAutoClose) {
this.animationMode.set('paused');
this.paused.emit();
}
}
@HostListener('mouseleave')
protected onMouseLeave(): void {
if (!this.toast().disableAutoClose) {
this.animationMode.set('running');
this.resumed.emit();
}
}
protected close(): void {
this.toast().close!();
}
}
|