import { isToastKind, ToastKind } from '../../enums/toast-kind.enum';
export class EdelToastComponent {
    constructor() {
        this.kind = ToastKind.default;
        this.noClose = false;
    }
    render() {
        return [
            h("div", { class: "toast-icon" }, this.renderToastIcon()),
            h("div", { class: "toast-label" },
                h("slot", null)),
            this.noClose ? null : this.renderCloseButton()
        ];
    }
    hostData() {
        return {
            class: 'toast'
        };
    }
    componentDidLoad() {
        this.handleKindChange(this.kind, ToastKind.default);
    }
    handleKindChange(newValue, oldValue) {
        if (isToastKind(newValue) === false) {
            this.kind = ToastKind.default;
        }
        if (isToastKind(oldValue)) {
            this.host.classList.remove(`toast--${oldValue}`);
        }
        this.host.classList.add(`toast--${this.kind}`);
    }
    renderToastIcon() {
        const iconNamed = (name, size) => (h("i", { class: `fa fa-${name} fa-w-${size}` }));
        switch (this.kind) {
            case ToastKind.info:
                return iconNamed('exclamation-triangle', 18);
            case ToastKind.good:
                return iconNamed('check-circle', 16);
            case ToastKind.bad:
                return iconNamed('times', 12);
            case ToastKind.warning:
                return iconNamed('exclamation-triangle', 18);
            default:
                return null;
        }
    }
    renderCloseButton() {
        return (h("div", { class: "toast-action" },
            h("edel-button", { icon: "times", slim: true, plain: true, onEmit: () => this.close.emit() })));
    }
    static get is() { return "edel-toast"; }
    static get properties() { return {
        "host": {
            "elementRef": true
        },
        "kind": {
            "type": String,
            "attr": "kind",
            "mutable": true,
            "watchCallbacks": ["handleKindChange"]
        },
        "noClose": {
            "type": Boolean,
            "attr": "no-close"
        }
    }; }
    static get events() { return [{
            "name": "close",
            "method": "close",
            "bubbles": true,
            "cancelable": true,
            "composed": true
        }]; }
}
