import { Component, Attribute, HostBinding } from '@angular/core';
import { AlertService } from './alert.service';
import { AlertOutletBase } from './alert-outlet-base';
import * as i0 from "@angular/core";
import * as i1 from "./alert.service";
import * as i2 from "../common/icon.directive";
import * as i3 from "@angular/common";
import * as i4 from "../i18n/c8y-translate.pipe";
/*
 * Alert outlet component shows all added alerts. It is used in the application's `c8y-bootstrap` component.
 *
 * For applications which don’t use `c8y-bootstrap` component but want to display alerts via AlertService, a c8y-alert-outlet component needs to be added explicitly in the template.
 *
 * ```html
 *  <div class="alerts">
 *    <c8y-alert-outlet></c8y-alert-outlet>
 *  </div>
 * ```
 */
export class AlertOutletComponent extends AlertOutletBase {
    /**
     * The array of current alerts.
     */
    get alerts() {
        return this.alertService.state$;
    }
    /**
     * @ignore
     */
    constructor(position, alertService) {
        super(alertService);
        this.position = position;
        this.alertService = alertService;
        /**
         * @ignore
         */
        this.isStatic = false;
        this.isStatic = this.position === 'static';
    }
    /**
     * Returns a CSS class for an alert depending on its type to style the corresponding alert component.
     */
    getClass(alert) {
        const classes = [];
        if (alert.type !== 'danger') {
            classes.push('interact');
        }
        classes.push(`alert-${alert.type}`);
        return classes.join(' ');
    }
    /**
     * Executes alert’s onClose method, if provided, and closes the alert.
     * @param alert The alert which will be closed.
     */
    close(alert) {
        if (alert.onClose) {
            alert.onClose();
        }
        this.alertService.remove(alert);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AlertOutletComponent, deps: [{ token: 'position', attribute: true }, { token: i1.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AlertOutletComponent, selector: "c8y-alert-outlet", host: { properties: { "class.static": "this.isStatic" } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"alert animated fadeInRightBig m-t-16\"\n  data-cy=\"c8y-alert--message\"\n  *ngFor=\"let alert of alerts | async\"\n  [ngClass]=\"[getClass(alert), isDetailsShow(alert) ? 'expanded' : '']\"\n>\n  <button title=\"{{ 'Close' | translate }}\" type=\"button\" class=\"close\" (click)=\"close(alert)\">\n    <span aria-hidden=\"true\"><i c8yIcon=\"times\"></i></span>\n    <span class=\"sr-only\">{{ 'Close' | translate }}</span>\n  </button>\n\n  <div *ngIf=\"!isTemplateRef(alert.text); else template(alert.text)\">\n    <strong *ngIf=\"!alert.allowHtml\" [textContent]=\"alert.text | translate\" class=\"message\"></strong>\n    <strong *ngIf=\"alert.allowHtml\" [innerHTML]=\"alert.text | translate\" class=\"message\"></strong>\n  </div>\n  <p *ngIf=\"hasDetails(alert) && !isDetailsShow(alert)\" class=\"text-muted m-t-8\">\n    <button\n      title=\"{{ 'Show details' | translate }}\"\n      class=\"btn btn-clean\"\n      (click)=\"showDetails(alert)\"\n    >\n      <i c8yIcon=\"chevron-down\"></i>\n      {{ 'Show details' | translate }}\n    </button>\n  </p>\n  <p *ngIf=\"hasDetails(alert) && isDetailsShow(alert)\" class=\"text-muted m-t-8\">\n    <button title=\"{{ 'Hide details' | translate }}\" class=\"btn btn-clean\" (click)=\"closeDetails()\">\n      <i c8yIcon=\"chevron-up\"></i>\n      {{ 'Hide details' | translate }}\n    </button>\n  </p>\n  <div *ngIf=\"isDetailsShow(alert)\">\n    <div *ngIf=\"!isTemplateRef(detailDisplayedAlert.contents); else template(alert.detailedData)\">\n      <pre><code [textContent]=\"detailDisplayedAlert.contents | translate\"></code></pre>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AlertOutletComponent, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-alert-outlet', template: "<div\n  class=\"alert animated fadeInRightBig m-t-16\"\n  data-cy=\"c8y-alert--message\"\n  *ngFor=\"let alert of alerts | async\"\n  [ngClass]=\"[getClass(alert), isDetailsShow(alert) ? 'expanded' : '']\"\n>\n  <button title=\"{{ 'Close' | translate }}\" type=\"button\" class=\"close\" (click)=\"close(alert)\">\n    <span aria-hidden=\"true\"><i c8yIcon=\"times\"></i></span>\n    <span class=\"sr-only\">{{ 'Close' | translate }}</span>\n  </button>\n\n  <div *ngIf=\"!isTemplateRef(alert.text); else template(alert.text)\">\n    <strong *ngIf=\"!alert.allowHtml\" [textContent]=\"alert.text | translate\" class=\"message\"></strong>\n    <strong *ngIf=\"alert.allowHtml\" [innerHTML]=\"alert.text | translate\" class=\"message\"></strong>\n  </div>\n  <p *ngIf=\"hasDetails(alert) && !isDetailsShow(alert)\" class=\"text-muted m-t-8\">\n    <button\n      title=\"{{ 'Show details' | translate }}\"\n      class=\"btn btn-clean\"\n      (click)=\"showDetails(alert)\"\n    >\n      <i c8yIcon=\"chevron-down\"></i>\n      {{ 'Show details' | translate }}\n    </button>\n  </p>\n  <p *ngIf=\"hasDetails(alert) && isDetailsShow(alert)\" class=\"text-muted m-t-8\">\n    <button title=\"{{ 'Hide details' | translate }}\" class=\"btn btn-clean\" (click)=\"closeDetails()\">\n      <i c8yIcon=\"chevron-up\"></i>\n      {{ 'Hide details' | translate }}\n    </button>\n  </p>\n  <div *ngIf=\"isDetailsShow(alert)\">\n    <div *ngIf=\"!isTemplateRef(detailDisplayedAlert.contents); else template(alert.detailedData)\">\n      <pre><code [textContent]=\"detailDisplayedAlert.contents | translate\"></code></pre>\n    </div>\n  </div>\n</div>\n" }]
        }], ctorParameters: () => [{ type: undefined, decorators: [{
                    type: Attribute,
                    args: ['position']
                }] }, { type: i1.AlertService }], propDecorators: { isStatic: [{
                type: HostBinding,
                args: ['class.static']
            }] } });
//# sourceMappingURL=data:application/json;base64, 