/**
 * @license
 * Copyright Endlessjs. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { Component, EventEmitter, HostBinding, HostListener, Input, Output } from '@angular/core';
import { ElToast } from './model';
/**
 * The `ElToastComponent` is responsible for rendering each toast with appropriate styles.
 *
 * @styles
 *
 * toastr-background-color:
 * toastr-border-color:
 * toastr-border-style:
 * toastr-border-width:
 * toastr-border-radius:
 * toastr-padding:
 * toastr-shadow:
 * toastr-text-color:
 * toastr-text-font-family:
 * toastr-text-font-size:
 * toastr-text-font-weight:
 * toastr-text-line-height:
 * toastr-title-text-font-family:
 * toastr-title-text-font-size:
 * toastr-title-text-font-weight:
 * toastr-title-text-line-height:
 * toastr-destroyable-hover-background-color:
 * toastr-destroyable-hover-border-color:
 * toastr-primary-background-color:
 * toastr-primary-border-color:
 * toastr-primary-text-color:
 * toastr-icon-primary-background-color:
 * toastr-icon-primary-color:
 * toastr-destroyable-hover-primary-background-color:
 * toastr-destroyable-hover-primary-border-color:
 * toastr-success-background-color:
 * toastr-success-border-color:
 * toastr-success-text-color:
 * toastr-icon-success-background-color:
 * toastr-icon-success-color:
 * toastr-destroyable-hover-success-background-color:
 * toastr-destroyable-hover-success-border-color:
 * toastr-info-background-color:
 * toastr-info-border-color:
 * toastr-info-text-color:
 * toastr-icon-info-background-color:
 * toastr-icon-info-color:
 * toastr-destroyable-hover-info-background-color:
 * toastr-destroyable-hover-info-border-color:
 * toastr-warning-background-color:
 * toastr-warning-border-color:
 * toastr-warning-text-color:
 * toastr-icon-warning-background-color:
 * toastr-icon-warning-color:
 * toastr-destroyable-hover-warning-background-color:
 * toastr-destroyable-hover-warning-border-color:
 * toastr-danger-background-color:
 * toastr-danger-border-color:
 * toastr-danger-text-color:
 * toastr-icon-danger-background-color:
 * toastr-icon-danger-color:
 * toastr-destroyable-hover-danger-background-color:
 * toastr-destroyable-hover-danger-border-color:
 * */
let ElToastComponent = class ElToastComponent {
    /**
     * The `ElToastComponent` is responsible for rendering each toast with appropriate styles.
     *
     * @styles
     *
     * toastr-background-color:
     * toastr-border-color:
     * toastr-border-style:
     * toastr-border-width:
     * toastr-border-radius:
     * toastr-padding:
     * toastr-shadow:
     * toastr-text-color:
     * toastr-text-font-family:
     * toastr-text-font-size:
     * toastr-text-font-weight:
     * toastr-text-line-height:
     * toastr-title-text-font-family:
     * toastr-title-text-font-size:
     * toastr-title-text-font-weight:
     * toastr-title-text-line-height:
     * toastr-destroyable-hover-background-color:
     * toastr-destroyable-hover-border-color:
     * toastr-primary-background-color:
     * toastr-primary-border-color:
     * toastr-primary-text-color:
     * toastr-icon-primary-background-color:
     * toastr-icon-primary-color:
     * toastr-destroyable-hover-primary-background-color:
     * toastr-destroyable-hover-primary-border-color:
     * toastr-success-background-color:
     * toastr-success-border-color:
     * toastr-success-text-color:
     * toastr-icon-success-background-color:
     * toastr-icon-success-color:
     * toastr-destroyable-hover-success-background-color:
     * toastr-destroyable-hover-success-border-color:
     * toastr-info-background-color:
     * toastr-info-border-color:
     * toastr-info-text-color:
     * toastr-icon-info-background-color:
     * toastr-icon-info-color:
     * toastr-destroyable-hover-info-background-color:
     * toastr-destroyable-hover-info-border-color:
     * toastr-warning-background-color:
     * toastr-warning-border-color:
     * toastr-warning-text-color:
     * toastr-icon-warning-background-color:
     * toastr-icon-warning-color:
     * toastr-destroyable-hover-warning-background-color:
     * toastr-destroyable-hover-warning-border-color:
     * toastr-danger-background-color:
     * toastr-danger-border-color:
     * toastr-danger-text-color:
     * toastr-icon-danger-background-color:
     * toastr-icon-danger-color:
     * toastr-destroyable-hover-danger-background-color:
     * toastr-destroyable-hover-danger-border-color:
     * */
    constructor() {
        this.destroy = new EventEmitter();
    }
    get success() {
        return this.toast.config.status === 'success';
    }
    get info() {
        return this.toast.config.status === 'info';
    }
    get warning() {
        return this.toast.config.status === 'warning';
    }
    get primary() {
        return this.toast.config.status === 'primary';
    }
    get danger() {
        return this.toast.config.status === 'danger';
    }
    get destroyByClick() {
        return this.toast.config.destroyByClick;
    }
    get hasIcon() {
        return this.toast.config.hasIcon && !!this.toast.config.status;
    }
    get customIcon() {
        return !!this.icon;
    }
    get icon() {
        return this.toast.config.icon;
    }
    /* @deprecated Use pack property of icon config */
    get iconPack() {
        return this.toast.config.iconPack;
    }
    /*
      @breaking-change 5 remove
      @deprecated
    */
    get iconConfig() {
        const toastConfig = this.toast.config;
        const isIconName = typeof this.icon === 'string';
        if (!isIconName) {
            return toastConfig.icon;
        }
        const iconConfig = { icon: toastConfig.icon };
        if (toastConfig.iconPack) {
            iconConfig.pack = toastConfig.iconPack;
        }
        return iconConfig;
    }
    onClick() {
        this.destroy.emit();
    }
};
__decorate([
    Input(),
    __metadata("design:type", ElToast)
], ElToastComponent.prototype, "toast", void 0);
__decorate([
    Output(),
    __metadata("design:type", EventEmitter)
], ElToastComponent.prototype, "destroy", void 0);
__decorate([
    HostBinding('class.status-success'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "success", null);
__decorate([
    HostBinding('class.status-info'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "info", null);
__decorate([
    HostBinding('class.status-warning'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "warning", null);
__decorate([
    HostBinding('class.status-primary'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "primary", null);
__decorate([
    HostBinding('class.status-danger'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "danger", null);
__decorate([
    HostBinding('class.destroy-by-click'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "destroyByClick", null);
__decorate([
    HostBinding('class.has-icon'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "hasIcon", null);
__decorate([
    HostBinding('class.custom-icon'),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [])
], ElToastComponent.prototype, "customIcon", null);
__decorate([
    HostListener('click'),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", []),
    __metadata("design:returntype", void 0)
], ElToastComponent.prototype, "onClick", null);
ElToastComponent = __decorate([
    Component({
        selector: 'el-toast',
        template: "<div class=\"icon-container\" *ngIf=\"hasIcon && icon\">\n  <el-icon [config]=\"iconConfig\"></el-icon>\n</div>\n<div class=\"content-container\">\n  <span class=\"title subtitle\">{{ toast.title }}</span>\n  <div class=\"message\">{{ toast.message }}</div>\n</div>\n",
        styles: [":host{display:flex;align-items:center;width:25rem;margin:0.5rem}:host .title{margin-right:0.25rem}:host.default .content-container,:host:not(.has-icon) .content-container{display:flex;flex-direction:row}:host.destroy-by-click{cursor:pointer}:host el-icon{font-size:2.5rem}:host svg{width:2.5rem;height:2.5rem}\n"]
    })
], ElToastComponent);
export { ElToastComponent };
//# sourceMappingURL=toast.component.js.map