import { h } from "@stencil/core";
export class DgaSlideoutMenu {
    constructor() {
        this.backgroundColor = 'gray';
        this.anchor = 'right';
        this.open = false;
        this.scrollbar = true;
    }
    // componentDidRender() {
    //     if (this.el.children.length > 0) {
    //         this.el.children
    //         .namedItem('DgaSlideoutMenuHeader')
    //         .setAttribute('slot', 'sideout-menu-header');
    //       this.el.children
    //         .namedItem('DgaSideoutMenuItems')
    //         .setAttribute('slot', 'sideout-menu-items');
    //       this.el.children
    //         .namedItem('DgaSideoutMenuActions')
    //         .setAttribute('slot', 'sideout-menu-actions');
    //     }
    //   }
    componentWillLoad() {
        this.el.childNodes.forEach(item => {
            const el = item;
            //   if(el.tagName === 'DGA-SECOND-NAV-HEADER-CONTENT' && this.hideContent === true) {
            //     el.style.display = 'none';
            //   }
            //   if(el.tagName === 'DGA-SECOND-NAV-HEADER-ACTIONS' && this.hideActions === true) {
            //     el.style.display = 'none';
            //   }
            if (el.tagName === 'DGA-SLIDEOUT-MENU-HEADER' && el.attributes.getNamedItem('slot') === null) {
                el.setAttribute('slot', 'slideout-menu-header');
                // Pass onClose to header component
                el.setAttribute('on-close', 'true');
                el.addEventListener('closeClick', () => {
                    if (this.onClose) {
                        this.onClose();
                    }
                });
            }
            if (el.tagName === 'DGA-SLIDEOUT-MENU-ITEMS' && el.attributes.getNamedItem('slot') === null) {
                el.setAttribute('slot', 'slideout-menu-items');
            }
            if (el.tagName === 'DGA-SLIDEOUT-MENU-ACTIONS' && el.attributes.getNamedItem('slot') === null) {
                el.setAttribute('slot', 'slideout-menu-actions');
            }
        });
    }
    disconnectedCallback() {
        // Clean up listeners
        this.el.childNodes.forEach(item => {
            const el = item;
            if (el.tagName === 'DGA-SLIDEOUT-MENU-HEADER') {
                el.removeEventListener('closeClick', this.onClose);
            }
        });
    }
    render() {
        return (h("div", { key: '371cbddb32ffb0d8829bb92fa3ea328339f52b80', class: `dga-slideout-menu dga-slideout-menu--${this.anchor} dga-slideout-menu--${this.backgroundColor} ${this.open ? "active" : ""}` }, h("slot", { key: 'd0e265caa58c2e8770fe4ba59b6ca4c7276612bb', name: "slideout-menu-header" }), h("div", { key: '8ec4c51c577c465bbbe80e8ab7833591f13e27fc', class: "dga-slideout-menu__body" }, h("div", { key: 'a7df2ea13bf22624fac685070d0ef68f2221646e', class: {
                'dga-slideout-menu__items': true,
                'dga-slideout-menu__items--hide-scrollbar': !this.scrollbar,
            } }, h("slot", { key: '88d9a49753aa0b164902fcb8c4dc0c19f02ca947', name: "slideout-menu-items" })), h("dga-divider", { key: '32b33160f4606c5e1caaf61aeff2e4716bf0e68e' }), h("slot", { key: 'fc617f9b16226ec47792edba8a42642cd184f7be', name: "slideout-menu-actions" }))));
    }
    static get is() { return "dga-slideout-menu"; }
    static get originalStyleUrls() {
        return {
            "$": ["dga-slideout-menu.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["dga-slideout-menu.css"]
        };
    }
    static get properties() {
        return {
            "backgroundColor": {
                "type": "string",
                "attribute": "background-color",
                "mutable": false,
                "complexType": {
                    "original": "'gray' | 'white'",
                    "resolved": "\"gray\" | \"white\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "defaultValue": "'gray'"
            },
            "anchor": {
                "type": "string",
                "attribute": "anchor",
                "mutable": false,
                "complexType": {
                    "original": "'left'|'right'",
                    "resolved": "\"left\" | \"right\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "defaultValue": "'right'"
            },
            "open": {
                "type": "boolean",
                "attribute": "open",
                "mutable": true,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "defaultValue": "false"
            },
            "scrollbar": {
                "type": "boolean",
                "attribute": "scrollbar",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "defaultValue": "true"
            },
            "onClose": {
                "type": "unknown",
                "attribute": "on-close",
                "mutable": false,
                "complexType": {
                    "original": "() => void",
                    "resolved": "() => void",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false
            }
        };
    }
    static get elementRef() { return "el"; }
}
