import { DomUtil } from '@ema/core';
export class FlashMessage {
    constructor() {
        this.active = false;
        this.activeClass = 'primary';
    }
    async show(message, activeClass, duration = 2000) {
        this.message = message;
        this.activeClass = activeClass;
        this.active = true;
        DomUtil.fadeIn(this.el, 150, 0, 'flex');
        this.timeout = setTimeout(() => {
            this.active = false;
        }, duration);
    }
    dismiss() {
        this.active = false;
        DomUtil.fadeOut(this.el, 150, 0);
        clearTimeout(this.timeout);
    }
    render() {
        return (h("div", { onClick: () => this.dismiss(), class: 'flash-container ' + (this.active ? 'show ' : 'hide ') + this.activeClass },
            h("div", { class: "message" }, this.message),
            h("p", { class: "dismiss" }, "tap to dismiss")));
    }
    static get is() { return "ema-flash-message"; }
    static get properties() { return {
        "active": {
            "state": true
        },
        "activeClass": {
            "state": true
        },
        "el": {
            "elementRef": true
        },
        "message": {
            "state": true
        },
        "show": {
            "method": true
        }
    }; }
    static get style() { return "/**style-placeholder:ema-flash-message:**/"; }
}
