import { __decorate, __metadata } from "tslib";
import { Host, h } from "@stencil/core";
import { ListenToBreakpoints, balBreakpoints } from "../../../utils/breakpoints";
import { debounce, raf } from "../../../utils/helpers";
import { Logger } from "../../../utils/log";
import { ListenToResize } from "../../../utils/resize";
export class ListItemAccordionBody {
    constructor() {
        this.isMobile = balBreakpoints.isMobile;
        this.internalId = `bal-list-item-accordion-body-${ListItemAccordionBodyIds++}`;
        this.ariaState = {};
        /**
         * Sets space to content of the accordion body
         */
        this.contentSpace = 'none';
        /**
         * Sets justify-content of the items to start, center, end, or space-between. Default is start
         */
        this.contentAlignment = 'start';
        this.setMinHeightForAnimation = () => {
            if (this.currentRaf !== undefined) {
                cancelAnimationFrame(this.currentRaf);
            }
            if (this.isMobile && this.contentElWrapper) {
                this.contentElWrapper.style.removeProperty('min-height');
                return;
            }
            raf(() => {
                if (this.accordionGroup !== undefined && this.accordionGroup !== '') {
                    const allAccordionBodies = Array.from(document.body.querySelectorAll('bal-list-item-accordion-body'));
                    const groupContents = allAccordionBodies
                        .filter(el => el.accordionGroup === this.accordionGroup)
                        .map(el => el.querySelector('.bal-list__item__accordion-body__content'))
                        .filter(el => el);
                    const groupContentHeight = groupContents.reduce((acc, el) => (acc < el.offsetHeight ? el.offsetHeight : acc), 0);
                    if (this.contentElWrapper && groupContentHeight > 0 && this.el.offsetHeight !== groupContentHeight) {
                        this.contentElWrapper.style.setProperty('min-height', `${groupContentHeight}px`);
                    }
                }
            });
        };
        this.debounceSetMinHeightForAnimation = debounce(this.setMinHeightForAnimation.bind(this), 100);
    }
    createLogger(log) {
        this.log = log;
    }
    /**
     * LIFECYCLE
     * ------------------------------------------------------
     */
    connectedCallback() {
        this.setMinHeightForAnimation();
    }
    componentDidRender() {
        this.setMinHeightForAnimation();
        this.setControlIdToHead();
    }
    /**
     * LISTENERS
     * ------------------------------------------------------
     */
    resizeListener() {
        this.debounceSetMinHeightForAnimation;
    }
    breakpointListener(breakpoints) {
        this.isMobile = breakpoints.mobile;
        this.debounceSetMinHeightForAnimation();
    }
    /**
     * PUBLIC METHODS
     * ------------------------------------------------------
     */
    /**
     * @internal
     */
    async setAria(aria) {
        if (aria.labelledby && aria.labelledby !== this.ariaState.labelledby) {
            this.ariaState.labelledby = aria.labelledby;
        }
    }
    /**
     * PRIVATE METHODS
     * ------------------------------------------------------
     */
    setControlIdToHead() {
        const headEl = this.el.parentElement.querySelector('bal-list-item-accordion-head');
        if (headEl) {
            headEl.setAria({ controlId: this.internalId });
        }
    }
    /**
     * RENDER
     * ------------------------------------------------------
     */
    render() {
        return (h(Host, { key: '0d63a86061285cb7877781ed793ba47581f88421', id: this.internalId, role: 'region', "aria-labelledby": this.ariaState.labelledby, class: {
                'bal-list__item': true,
                'bal-list__item__accordion-body': true,
                'bal-list__item__accordion-body--grouped': this.accordionGroup !== undefined && this.accordionGroup !== '',
            } }, h("div", { key: 'fd39532522d0d477e222e8153eac0eeed546f4e8', class: {
                'bal-list__item__accordion-body__content': true,
                [`bal-list__item__accordion-body__content--${this.contentAlignment}`]: this.contentAlignment !== undefined,
                [`bal-list__item__accordion-body__content--space-${this.contentSpace}`]: this.contentSpace !== undefined,
            }, ref: contentElWrapper => (this.contentElWrapper = contentElWrapper) }, h("slot", { key: '067a8e5178c0396586d0491b0438ce190bd8aa85' }))));
    }
    static get is() { return "bal-list-item-accordion-body"; }
    static get properties() {
        return {
            "accordionGroup": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Synchronizes the height of the accordion to max of all\nthe other grouped accordion bodies"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "accordion-group"
            },
            "contentSpace": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "BalProps.BalListContentSpacing",
                    "resolved": "\"none\" | \"normal\"",
                    "references": {
                        "BalProps": {
                            "location": "global",
                            "id": "global::BalProps"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Sets space to content of the accordion body"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "content-space",
                "defaultValue": "'none'"
            },
            "contentAlignment": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "BalProps.BalListContentAlignment",
                    "resolved": "\"center\" | \"end\" | \"space-between\" | \"start\"",
                    "references": {
                        "BalProps": {
                            "location": "global",
                            "id": "global::BalProps"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Sets justify-content of the items to start, center, end, or space-between. Default is start"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "content-alignment",
                "defaultValue": "'start'"
            }
        };
    }
    static get states() {
        return {
            "ariaState": {}
        };
    }
    static get methods() {
        return {
            "setAria": {
                "complexType": {
                    "signature": "(aria: BalListItemAccordionBodyAria) => Promise<void>",
                    "parameters": [{
                            "name": "aria",
                            "type": "BalListItemAccordionBodyAria",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        },
                        "BalListItemAccordionBodyAria": {
                            "location": "local",
                            "path": "/home/runner/work/design-system/design-system/packages/core/src/components/bal-list/bal-list-item-accordion-body/bal-list-item-accordion-body.tsx",
                            "id": "src/components/bal-list/bal-list-item-accordion-body/bal-list-item-accordion-body.tsx::BalListItemAccordionBodyAria"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "",
                    "tags": [{
                            "name": "internal",
                            "text": undefined
                        }]
                }
            }
        };
    }
    static get elementRef() { return "el"; }
}
__decorate([
    Logger('bal-list-item-accordion-body'),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [Function]),
    __metadata("design:returntype", void 0)
], ListItemAccordionBody.prototype, "createLogger", null);
__decorate([
    ListenToResize(),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", []),
    __metadata("design:returntype", void 0)
], ListItemAccordionBody.prototype, "resizeListener", null);
__decorate([
    ListenToBreakpoints(),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [Object]),
    __metadata("design:returntype", void 0)
], ListItemAccordionBody.prototype, "breakpointListener", null);
let ListItemAccordionBodyIds = 0;
