import { Host, h } from "@stencil/core";
export class NavTree {
    constructor() {
        this.handler = () => {
            this.isOpen = !this.isOpen;
        };
        this.isOpenAftAnimation = false;
        this.collapse = 'single';
        this.isOpen = false;
        this.icon = null;
        this.text = undefined;
        this.secondaryText = null;
        this.dataTest = null;
    }
    async toggle() {
        this.isOpen = !this.isOpen;
    }
    isOpenChanged(value) {
        this.bdsToogleChange.emit({ value: value, element: this.element });
    }
    handleKeyDown(event) {
        if (event.key == 'Enter') {
            this.isOpen = !this.isOpen;
        }
    }
    render() {
        return (h(Host, { key: '81160834f26459c6e209f2846511c8c1a337d7e7' }, h("div", { key: '242643dea0604b6c115a9074482e4bee52fef6b4', tabindex: "0", onKeyDown: this.handleKeyDown.bind(this), class: "focus" }, h("div", { key: 'a639e7262a17c7f02699657ff9514c6c2fc71077', onClick: this.handler, class: {
                nav_main: true,
                nav_main_active: this.isOpen,
            }, "data-test": this.dataTest, "aria-label": this.text + (this.secondaryText && `: ${this.secondaryText}`) }, this.icon && (h("bds-icon", { key: '1fe3eefebab00ef60805bbcc8430b277d8b6171d', class: {
                [`icon-item`]: true,
                [`icon-item-active`]: this.isOpen,
            }, size: "medium", name: this.icon, color: "inherit", theme: this.isOpen ? 'solid' : 'outline' })), h("div", { key: '013e1b36a169b2b4bdc110dde78d2a739faca589', class: "nav_main_text" }, this.text && (h("bds-typo", { key: '6847e2e0802a08f20ea6722f384565dacf59b208', class: "title-item", variant: "fs-14", tag: "span", "line-height": "small", bold: this.isOpen ? 'bold' : 'regular' }, this.text)), this.secondaryText && (h("bds-typo", { key: 'a800b26ebfe03cf421268d8fcacde5442ffd2416', class: "subtitle-item", variant: "fs-12", "line-height": "small", tag: "span", margin: false }, this.secondaryText))), h("div", { key: 'f9c72e255ff0d71a89775a1c69e716da84d267ff', class: "nav_main_content" }, h("slot", { key: 'd37a4aed58e7c562ea242e80160e233385869163', name: "header-content" })), h("bds-icon", { key: '1bdbd0ba741283e99705e087145ee007432b8aff', name: "arrow-down", class: { [`nav_main_arrow`]: true, [`nav_main_arrow_active`]: this.isOpen } }))), h("div", { key: '1d44c8dea1b29998a6d75a78195691fe6fd4c391', class: {
                accordion: true,
                accordion_open: this.isOpen,
            } }, h("div", { key: '56e35e9e1a96bbfd85f956c0dddb9264953e9910', class: "container" }, h("slot", { key: '91ebc7b043402c8197bd9bc446b10ab01834050b' })))));
    }
    static get is() { return "bds-nav-tree"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["nav-tree.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["nav-tree.css"]
        };
    }
    static get properties() {
        return {
            "collapse": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "collapses",
                    "resolved": "\"multiple\" | \"single\"",
                    "references": {
                        "collapses": {
                            "location": "local",
                            "path": "/home/runner/work/blip-ds/blip-ds/src/components/nav-tree/nav-tree.tsx",
                            "id": "src/components/nav-tree/nav-tree.tsx::collapses"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Focus Selected. Used to add title in header accordion."
                },
                "attribute": "collapse",
                "reflect": false,
                "defaultValue": "'single'"
            },
            "isOpen": {
                "type": "boolean",
                "mutable": true,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "A prop for make the nav open."
                },
                "attribute": "is-open",
                "reflect": true,
                "defaultValue": "false"
            },
            "icon": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Icon. Used to add icon in list item."
                },
                "attribute": "icon",
                "reflect": false,
                "defaultValue": "null"
            },
            "text": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Text. Used to insert a text in the display item."
                },
                "attribute": "text",
                "reflect": false
            },
            "secondaryText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "SecondaryText. Used to insert a secondaryText in the display item."
                },
                "attribute": "secondary-text",
                "reflect": false,
                "defaultValue": "null"
            },
            "dataTest": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Data test is the prop to specifically test the component action object."
                },
                "attribute": "data-test",
                "reflect": false,
                "defaultValue": "null"
            }
        };
    }
    static get states() {
        return {
            "isOpenAftAnimation": {}
        };
    }
    static get events() {
        return [{
                "method": "bdsToogleChange",
                "name": "bdsToogleChange",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "When de open or close of component change, the event are dispache."
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }];
    }
    static get methods() {
        return {
            "toggle": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "",
                    "tags": []
                }
            }
        };
    }
    static get elementRef() { return "element"; }
    static get watchers() {
        return [{
                "propName": "isOpen",
                "methodName": "isOpenChanged"
            }];
    }
}
//# sourceMappingURL=nav-tree.js.map
