'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-a0b63bee.js');

const DgaCollapse = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.transitionDuration = '0.3s';
        this.transitionType = 'ease-in';
        this.height = 0;
    }
    componentDidLoad() {
        if (this.open && this.containerRef) {
            this.setHeight(this.containerRef.clientHeight);
            setTimeout(() => {
                this.setHeight('auto');
            }, parseFloat(this.transitionDuration) * 1000);
        }
    }
    watchOpen(newValue, oldValue) {
        if (newValue !== oldValue && this.containerRef) {
            if (newValue) {
                this.setHeight(this.containerRef.scrollHeight);
                setTimeout(() => {
                    this.setHeight('auto');
                }, 200);
            }
            else {
                // Handle closing animation
                this.setHeight(this.containerRef.clientHeight);
                setTimeout(() => {
                    this.setHeight(0);
                }, 20);
            }
        }
    }
    setHeight(value) {
        this.height = value;
    }
    render() {
        const styles = Object.assign(Object.assign({ overflow: 'hidden', transition: `height ${this.transitionDuration} ${this.transitionType}`, height: `${this.height}px` }, (this.height === 'auto' ? { height: 'auto' } : {})), this.customStyle);
        return (index.h("div", { key: 'db9c249e93c4b5280024c80a4dcbd4f75666bc42', ref: (el) => this.containerRef = el, "aria-hidden": !this.open, style: styles }, index.h("slot", { key: '4a7f485323b0a4023b0b97916667133a09c6d27e' })));
    }
    static get watchers() { return {
        "open": ["watchOpen"]
    }; }
};

exports.dga_collapse = DgaCollapse;

//# sourceMappingURL=dga-collapse.cjs.entry.js.map