export class LoginForm {
    constructor() {
        this.usernameLabel = 'Username';
        this.passwordLabel = 'Password';
        this.submitLabel = 'Login';
        this.forgotPasswordLabel = 'Forgot password?';
    }
    loginHandler() {
        event.preventDefault();
        let inputs = this.host.querySelectorAll('input');
        console.log(inputs[0].value);
        this.loginFormSubmit.emit({ username: inputs[0].value, password: inputs[1].value });
    }
    render() {
        return (h("form", { class: "login-form", onSubmit: () => this.loginHandler() },
            h("div", { class: "login-container form-group" },
                h("div", { class: "field-wrap" },
                    h("input", { name: "username", class: "form-control", required: true, placeholder: this.usernameLabel })),
                h("br", null),
                h("div", { class: "field-wrap" },
                    h("input", { type: "password", class: "form-control", name: "password", required: true, placeholder: this.passwordLabel })),
                this.forgotPasswordUrl ?
                    h("p", { class: "forgot" },
                        h("a", { href: this.forgotPasswordUrl }, this.forgotPasswordLabel)) : '',
                this.errorMessage ?
                    h("p", { class: "error" }, this.errorMessage) : '',
                h("br", null),
                h("button", { class: "btn btn-primary", type: "submit" }, this.submitLabel))));
    }
    static get is() { return "ema-login-form"; }
    static get properties() { return {
        "constraintsJson": {
            "type": String,
            "attr": "constraints-json"
        },
        "errorMessage": {
            "type": String,
            "attr": "error-message"
        },
        "forgotPasswordLabel": {
            "type": String,
            "attr": "forgot-password-label"
        },
        "forgotPasswordUrl": {
            "type": String,
            "attr": "forgot-password-url"
        },
        "host": {
            "elementRef": true
        },
        "passwordLabel": {
            "type": String,
            "attr": "password-label"
        },
        "submitLabel": {
            "type": String,
            "attr": "submit-label"
        },
        "usernameLabel": {
            "type": String,
            "attr": "username-label"
        }
    }; }
    static get events() { return [{
            "name": "loginFormSubmit",
            "method": "loginFormSubmit",
            "bubbles": true,
            "cancelable": true,
            "composed": true
        }]; }
    static get style() { return "/**style-placeholder:ema-login-form:**/"; }
}
