import { AsyncPipe, NgTemplateOutlet } from '@angular/common';
import { ChangeDetectionStrategy, Component, ContentChild, ContentChildren, DestroyRef, Input, inject, } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { BehaviorSubject, filter, skip } from 'rxjs';
import { AccordionComponent } from '../../molecules/accordion/accordion.component';
import { IconComponent } from '../icon/icon.component';
import * as i0 from "@angular/core";
export class AccordionItemComponent {
    constructor() {
        this.destroyRef = inject(DestroyRef);
        this.id = '';
        this.label = '';
        this.isOpen = new BehaviorSubject(false);
    }
    ngAfterViewInit() {
        this.isOpen
            .pipe(takeUntilDestroyed(this.destroyRef), skip(1), filter(isOpen => !isOpen))
            .subscribe(() => {
            this.accordions.forEach(accordion => {
                accordion.closePanes();
            });
        });
    }
    togglePane() {
        this.isOpen.next(!this.isOpen.getValue());
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: AccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: AccordionItemComponent, isStandalone: true, selector: "ct-accordion-item", inputs: { id: "id", label: "label" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "accordions", predicate: AccordionComponent }], ngImport: i0, template: "<div class=\"flex flex-col\">\n  <div tabindex=\"0\" (click)=\"togglePane()\" class=\"flex cursor-pointer flex-row rounded-md\">\n    <ng-container *ngTemplateOutlet=\"headerTemplate; context: { isOpen: (isOpen | async) }\">\n      <ng-content select=\"[header]\" />\n    </ng-container>\n  </div>\n  <!-- providing a high value for max-height -->\n  <div\n    [style.max-height]=\"(isOpen | async) ? '1024px' : '0px'\"\n    class=\"overflow-hidden transition-[max-height] duration-500 ease-in-out\">\n    @if (isOpen | async) {\n      <ng-content />\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: AccordionItemComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ct-accordion-item', standalone: true, imports: [IconComponent, AsyncPipe, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col\">\n  <div tabindex=\"0\" (click)=\"togglePane()\" class=\"flex cursor-pointer flex-row rounded-md\">\n    <ng-container *ngTemplateOutlet=\"headerTemplate; context: { isOpen: (isOpen | async) }\">\n      <ng-content select=\"[header]\" />\n    </ng-container>\n  </div>\n  <!-- providing a high value for max-height -->\n  <div\n    [style.max-height]=\"(isOpen | async) ? '1024px' : '0px'\"\n    class=\"overflow-hidden transition-[max-height] duration-500 ease-in-out\">\n    @if (isOpen | async) {\n      <ng-content />\n    }\n  </div>\n</div>\n" }]
        }], propDecorators: { id: [{
                type: Input,
                args: [{ required: true }]
            }], label: [{
                type: Input
            }], headerTemplate: [{
                type: ContentChild,
                args: ['header']
            }], accordions: [{
                type: ContentChildren,
                args: [AccordionComponent]
            }] } });
//# sourceMappingURL=data:application/json;base64,[encoded data, 4988 characters]