import { AppService } from "../../global/app-service";
import { DomUtil } from "@ema/core";
export class Home {
    constructor() {
        this.app = AppService.instance;
    }
    componentWillLoad() {
        this.data = { title: '@ema/components' };
    }
    componentDidLoad() {
        this.postRender();
    }
    componentDidUpdate() {
        this.postRender();
    }
    iframeLoaded(e) {
        console.log(e.detail);
    }
    postRender() {
        DomUtil.fadeIn(this.el.querySelector('.jumbotron'), 350, 1400);
    }
    render() {
        return (h("div", { class: 'text-center' },
            h("ema-svg", { src: '../assets/sketch-index/home-content/images/home-content.svg', "data-json": JSON.stringify(this.data), class: 'img-responsive' }),
            h("div", { class: 'jumbotron pt-3 pb-3 hidden' },
                h("h5", null, 'webcomponents'),
                h("ul", { class: 'list-inline' }, this.app.components.map((item) => {
                    return h("li", { class: "list-inline-item" },
                        h("ema-route-link", { url: '/components/' + item.tag }, '<' + item.tag + '>'));
                })))));
    }
    static get is() { return "ema-app-home"; }
    static get properties() { return {
        "data": {
            "state": true
        },
        "el": {
            "elementRef": true
        }
    }; }
    static get listeners() { return [{
            "name": "iframeLoaded",
            "method": "iframeLoaded"
        }]; }
    static get style() { return "/**style-placeholder:ema-app-home:**/"; }
}
