import { h } from "@stencil/core";
const DROPDOWN_ITEM_CLASS = 'anj-dropdown-item';
export class DropdownItem {
    constructor() {
        this.active = false;
        /**
         * Is the item disabled
         */
        this.disabled = false;
    }
    onDisabled() {
        if (this.anchor) {
            this.anchor.setAttribute('tabindex', this.disabled ? '-1' : undefined);
            this.anchor.setAttribute('aria-disabled', this.disabled ? `${this.disabled}` : undefined);
        }
    }
    componentWillLoad() {
        this.anchor = this.element.querySelector('a') || undefined;
        if (this.anchor) {
            this.anchor.classList.add(DROPDOWN_ITEM_CLASS);
            this.onDisabled();
        }
    }
    onMouseDown(event) {
        if (this.disabled) {
            event.preventDefault();
            event.stopPropagation();
        }
    }
    onClick(event) {
        if (this.disabled) {
            return this.onMouseDown(event);
        }
        this.anjDropdownItemSelect.emit(this.payload);
    }
    render() {
        return this.anchor ? h("slot", null) :
            h("button", { type: "button", "aria-disabled": this.disabled, disabled: this.disabled, class: DROPDOWN_ITEM_CLASS },
                h("slot", null));
    }
    static get is() { return "anj-dropdown-item"; }
    static get originalStyleUrls() { return {
        "$": ["dropdown-item.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["dropdown-item.css"]
    }; }
    static get properties() { return {
        "active": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            },
            "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 item disabled"
            },
            "attribute": "disabled",
            "reflect": true,
            "defaultValue": "false"
        },
        "payload": {
            "type": "any",
            "mutable": false,
            "complexType": {
                "original": "any",
                "resolved": "any",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "Data to be emitted with the selection event"
            },
            "attribute": "payload",
            "reflect": false
        }
    }; }
    static get events() { return [{
            "method": "anjDropdownItemSelect",
            "name": "anjDropdownItemSelect",
            "bubbles": true,
            "cancelable": true,
            "composed": true,
            "docs": {
                "tags": [],
                "text": "Fires when the button clicked"
            },
            "complexType": {
                "original": "any",
                "resolved": "any",
                "references": {}
            }
        }]; }
    static get elementRef() { return "element"; }
    static get watchers() { return [{
            "propName": "disabled",
            "methodName": "onDisabled"
        }]; }
    static get listeners() { return [{
            "name": "mousedown",
            "method": "onMouseDown",
            "target": undefined,
            "capture": false,
            "passive": false
        }, {
            "name": "click",
            "method": "onClick",
            "target": undefined,
            "capture": false,
            "passive": false
        }]; }
}
