import { h, Host } from "@stencil/core";
import { BEM } from "../../utils/bem";
export class List {
    constructor() {
        /**
         * If `true` the list item can not be hovered
         */
        this.disabled = false;
        /**
         * If `true` the list can be used on a light, dark or colored backgrounds
         */
        this.background = 'light';
        /**
         * If `true` each list item has a bottom border
         */
        this.border = false;
        /**
         * If `true` only one of the layers can be open and the others close automatically
         */
        this.accordionOneLevel = false;
        /**
         * Defines the min height of the list item
         */
        this.size = '';
    }
    accordionOneLevelHandler(newValue, oldValue) {
        if (newValue !== oldValue) {
            const allNestedLists = Array.from(this.el.querySelectorAll('bal-list'));
            allNestedLists.forEach(list => (list.accordionOneLevel = newValue));
        }
    }
    componentWillLoad() {
        this.accordionOneLevelHandler(this.accordionOneLevel, false);
    }
    render() {
        const block = BEM.block('list');
        const closestListEl = this.el.closest('.bal-list');
        const nested = closestListEl !== null && closestListEl !== this.el;
        return (h(Host, { key: '0281c452d5bd2104752752af0d20b5d2202b9d79', role: "list", class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('nested').class(nested)), block.modifier('disabled').class(this.disabled)), block.modifier('border').class(this.border)), block.modifier(`size-${this.size || 'normal'}`).class()), block.modifier(`background-${this.background}`).class()) }, h("slot", { key: 'e8a76162ebc3582e1402f0688ac9c008a811aae1' })));
    }
    static get is() { return "bal-list"; }
    static get originalStyleUrls() {
        return {
            "$": ["bal-list.sass"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["bal-list.css"]
        };
    }
    static get properties() {
        return {
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` the list item can not be hovered"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "disabled",
                "defaultValue": "false"
            },
            "background": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "BalProps.BalListBackground",
                    "resolved": "\"color\" | \"dark\" | \"light\"",
                    "references": {
                        "BalProps": {
                            "location": "global",
                            "id": "global::BalProps"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` the list can be used on a light, dark or colored backgrounds"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "background",
                "defaultValue": "'light'"
            },
            "border": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` each list item has a bottom border"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "border",
                "defaultValue": "false"
            },
            "accordionOneLevel": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` only one of the layers can be open and the others close automatically"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "accordion-one-level",
                "defaultValue": "false"
            },
            "size": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "BalProps.BalListSize",
                    "resolved": "\"\" | \"large\" | \"small\"",
                    "references": {
                        "BalProps": {
                            "location": "global",
                            "id": "global::BalProps"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Defines the min height of the list item"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "size",
                "defaultValue": "''"
            }
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "accordionOneLevel",
                "methodName": "accordionOneLevelHandler"
            }];
    }
}
