import { Host, h } from "@stencil/core";
let optionId = 0;
export class Option {
    constructor() {
        this.optId = `anj-option-${optionId++}`;
        /**
         * Is the option active
         */
        this.active = false;
        /**
         * Is the option disabled
         */
        this.disabled = false;
        /**
         * Is the option selected
         */
        this.selected = false;
    }
    componentDidLoad() {
        this.anjOptionDidLoad.emit();
    }
    componentDidUnload() {
        this.anjOptionDidUnload.emit();
    }
    onMouseDown(event) {
        // eat the event so that the select can decide to blur or not
        event.preventDefault();
        if (!this.disabled) {
            this.select();
        }
    }
    async select() {
        this.anjSelect.emit(this.value);
    }
    render() {
        return h(Host, { "aria-label": this.element.textContent, "aria-disabled": this.disabled ? `${this.disabled}` : null, "aria-selected": `${this.selected}`, id: this.optId, role: "option", tabindex: "0" });
    }
    static get is() { return "anj-option"; }
    static get originalStyleUrls() { return {
        "$": ["option.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["option.css"]
    }; }
    static get properties() { return {
        "active": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "Is the option active"
            },
            "attribute": "active",
            "reflect": true,
            "defaultValue": "false"
        },
        "disabled": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "Is the option disabled"
            },
            "attribute": "disabled",
            "reflect": true,
            "defaultValue": "false"
        },
        "selected": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "Is the option selected"
            },
            "attribute": "selected",
            "reflect": true,
            "defaultValue": "false"
        },
        "value": {
            "type": "any",
            "mutable": false,
            "complexType": {
                "original": "any",
                "resolved": "any",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "The value the option represents"
            },
            "attribute": "value",
            "reflect": false
        }
    }; }
    static get events() { return [{
            "method": "anjOptionDidLoad",
            "name": "anjOptionDidLoad",
            "bubbles": true,
            "cancelable": true,
            "composed": true,
            "docs": {
                "tags": [],
                "text": "Emitted when the input has been created."
            },
            "complexType": {
                "original": "void",
                "resolved": "void",
                "references": {}
            }
        }, {
            "method": "anjOptionDidUnload",
            "name": "anjOptionDidUnload",
            "bubbles": true,
            "cancelable": true,
            "composed": true,
            "docs": {
                "tags": [],
                "text": "Emitted when the input has been removed."
            },
            "complexType": {
                "original": "void",
                "resolved": "void",
                "references": {}
            }
        }, {
            "method": "anjSelect",
            "name": "anjSelect",
            "bubbles": true,
            "cancelable": true,
            "composed": true,
            "docs": {
                "tags": [],
                "text": "Emitted when the option is set active"
            },
            "complexType": {
                "original": "any",
                "resolved": "any",
                "references": {}
            }
        }]; }
    static get methods() { return {
        "select": {
            "complexType": {
                "signature": "() => Promise<void>",
                "parameters": [],
                "references": {
                    "Promise": {
                        "location": "global"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        }
    }; }
    static get elementRef() { return "element"; }
    static get listeners() { return [{
            "name": "mousedown",
            "method": "onMouseDown",
            "target": undefined,
            "capture": false,
            "passive": false
        }]; }
}
