import { Host, h } from "@stencil/core";
export class FormGroup {
    componentDidLoad() {
        if (this.anjLabel && this.anjControl && (this.anjLabel.for !== this.anjControl.inputId)) {
            this.anjLabel.for = this.anjControl.inputId;
            this.anjLabel.labelId = this.anjControl.labelId;
            this.anjLabel.optional = !this.anjControl.required;
        }
    }
    onInputDidLoad({ target }) {
        this.anjControl = target;
        this.componentDidLoad();
    }
    onLabelDidLoad({ target }) {
        this.anjLabel = target;
        this.componentDidLoad();
    }
    onFocus() {
        this.focused = true;
    }
    onBlur() {
        this.focused = false;
    }
    onValidChanged({ detail }) {
        this.invalid = detail;
    }
    onContextChanged({ detail }) {
        this.context = detail;
    }
    render() {
        return (h(Host, { class: { 'anj-focused': this.focused, 'anj-invalid': this.invalid, 'anj-disabled': this.anjControl ? this.anjControl.disabled : false } }, this.anjControl && !this.anjLabel ? [
            h("label", { class: "anj-hidden-control", id: this.anjControl.labelId, htmlFor: this.anjControl.inputId }, this.anjControl.placeholder),
            h("slot", null)
        ] : undefined));
    }
    static get is() { return "anj-form-group"; }
    static get originalStyleUrls() { return {
        "$": ["form-group.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["form-group.css"]
    }; }
    static get states() { return {
        "anjControl": {},
        "anjLabel": {},
        "context": {},
        "focused": {},
        "invalid": {}
    }; }
    static get listeners() { return [{
            "name": "anjControlDidLoad",
            "method": "onInputDidLoad",
            "target": undefined,
            "capture": false,
            "passive": false
        }, {
            "name": "anjLabelDidLoad",
            "method": "onLabelDidLoad",
            "target": undefined,
            "capture": false,
            "passive": false
        }, {
            "name": "anjFocus",
            "method": "onFocus",
            "target": undefined,
            "capture": false,
            "passive": false
        }, {
            "name": "anjBlur",
            "method": "onBlur",
            "target": undefined,
            "capture": false,
            "passive": false
        }, {
            "name": "anjInvalid",
            "method": "onValidChanged",
            "target": undefined,
            "capture": false,
            "passive": false
        }, {
            "name": "anjContextChange",
            "method": "onContextChanged",
            "target": undefined,
            "capture": false,
            "passive": false
        }]; }
}
