/*!
 * Built with Stencil
 * By PostNord.
 */
import { h, Host, forceUpdate } from "@stencil/core";
/**
 * The `pn-accordion` is a wrapper for `pn-accordion-row` components.
 * This component gives the accordion rows some space between each one and provides the `single` feature.
 * Which will force the rule that only a single row to be open at one time.
 */
export class PnAccordion {
    mo;
    closeEvent = new CustomEvent('rowstate', { detail: false });
    hostElement;
    /** Only allow a single row to be open at once. @since v7.8.0 */
    single = false;
    /** Optional prop that removes the default white background on the accordion row. @since v7.10.0 */
    transparent = false;
    connectedCallback() {
        this.mo = new MutationObserver(() => forceUpdate(this.hostElement));
        this.mo.observe(this.hostElement, { childList: true, subtree: true });
    }
    disconnectedCallback() {
        this.mo.disconnect();
    }
    handleSingleRow({ detail }) {
        if (!this.single)
            return;
        const element = detail.element;
        const activeRow = element.closest('pn-accordion-row');
        const rows = Array.from(this.hostElement.querySelectorAll('pn-accordion-row'));
        rows.forEach(row => !row.isSameNode(activeRow) && row.dispatchEvent(this.closeEvent));
    }
    render() {
        return (h(Host, { key: 'd8cd9ef7bd0d93aafda0e6955a9ad35ec81d55ae', class: "pn-accordion", "data-transparent": this.transparent }, h("slot", { key: '43233bb6107dcc4608edb0086ef347d7c936556f' })));
    }
    static get is() { return "pn-accordion"; }
    static get originalStyleUrls() {
        return {
            "$": ["pn-accordion.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pn-accordion.css"]
        };
    }
    static get properties() {
        return {
            "single": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "since",
                            "text": "v7.8.0"
                        }],
                    "text": "Only allow a single row to be open at once."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "single",
                "defaultValue": "false"
            },
            "transparent": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "since",
                            "text": "v7.10.0"
                        }],
                    "text": "Optional prop that removes the default white background on the accordion row."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "transparent",
                "defaultValue": "false"
            }
        };
    }
    static get elementRef() { return "hostElement"; }
    static get listeners() {
        return [{
                "name": "togglerow",
                "method": "handleSingleRow",
                "target": undefined,
                "capture": false,
                "passive": false
            }];
    }
}
