circletone/esm2022/lib/components/atoms/accordion-item/accordion-item.component.mjs

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,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWNjb3JkaW9uLWl0ZW0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2lyY2xldG9uZS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvYWNjb3JkaW9uLWl0ZW0vYWNjb3JkaW9uLWl0ZW0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2lyY2xldG9uZS9zcmMvbGliL2NvbXBvbmVudHMvYXRvbXMvYWNjb3JkaW9uLWl0ZW0vYWNjb3JkaW9uLWl0ZW0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQzlELE9BQU8sRUFFTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixlQUFlLEVBQ2YsVUFBVSxFQUNWLEtBQUssRUFHTCxNQUFNLEdBQ1AsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFDaEUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQ3JELE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLCtDQUErQyxDQUFDO0FBQ25GLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7QUFTdkQsTUFBTSxPQUFPLHNCQUFzQjtJQVBuQztRQVFtQixlQUFVLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBQ3RCLE9BQUUsR0FBRyxFQUFFLENBQUM7UUFDMUIsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUNwQixXQUFNLEdBQUcsSUFBSSxlQUFlLENBQVUsS0FBSyxDQUFDLENBQUM7S0FzQjlDO0lBakJDLGVBQWU7UUFDYixJQUFJLENBQUMsTUFBTTthQUNSLElBQUksQ0FDSCxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEVBQ25DLElBQUksQ0FBQyxDQUFDLENBQUMsRUFDUCxNQUFNLENBQUMsTUFBTSxDQUFDLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUMxQjthQUNBLFNBQVMsQ0FBQyxHQUFHLEVBQUU7WUFDZCxJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUMsRUFBRTtnQkFDbEMsU0FBUyxDQUFDLFVBQVUsRUFBRSxDQUFDO1lBQ3pCLENBQUMsQ0FBQyxDQUFDO1FBQ0wsQ0FBQyxDQUFDLENBQUM7SUFDUCxDQUFDO0lBRUQsVUFBVTtRQUNSLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLEVBQUUsQ0FBQyxDQUFDO0lBQzVDLENBQUM7OEdBekJVLHNCQUFzQjtrR0FBdEIsc0JBQXNCLHlPQU9oQixrQkFBa0IsNkJDaENyQyxta0JBZUEsdUNETTJCLFNBQVMsOENBQUUsZ0JBQWdCOzsyRkFJekMsc0JBQXNCO2tCQVBsQyxTQUFTOytCQUNFLG1CQUFtQixjQUNqQixJQUFJLFdBQ1AsQ0FBQyxhQUFhLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixDQUFDLG1CQUVwQyx1QkFBdUIsQ0FBQyxNQUFNOzhCQUlwQixFQUFFO3NCQUE1QixLQUFLO3VCQUFDLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRTtnQkFDaEIsS0FBSztzQkFBYixLQUFLO2dCQUdrQixjQUFjO3NCQUFyQyxZQUFZO3VCQUFDLFFBQVE7Z0JBQ2UsVUFBVTtzQkFBOUMsZUFBZTt1QkFBQyxrQkFBa0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBc3luY1BpcGUsIE5nVGVtcGxhdGVPdXRsZXQgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENvbXBvbmVudCxcbiAgQ29udGVudENoaWxkLFxuICBDb250ZW50Q2hpbGRyZW4sXG4gIERlc3Ryb3lSZWYsXG4gIElucHV0LFxuICBRdWVyeUxpc3QsXG4gIFRlbXBsYXRlUmVmLFxuICBpbmplY3QsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgdGFrZVVudGlsRGVzdHJveWVkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZS9yeGpzLWludGVyb3AnO1xuaW1wb3J0IHsgQmVoYXZpb3JTdWJqZWN0LCBmaWx0ZXIsIHNraXAgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IEFjY29yZGlvbkNvbXBvbmVudCB9IGZyb20gJy4uLy4uL21vbGVjdWxlcy9hY2NvcmRpb24vYWNjb3JkaW9uLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSAnLi4vaWNvbi9pY29uLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2N0LWFjY29yZGlvbi1pdGVtJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0ljb25Db21wb25lbnQsIEFzeW5jUGlwZSwgTmdUZW1wbGF0ZU91dGxldF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9hY2NvcmRpb24taXRlbS5jb21wb25lbnQuaHRtbCcsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBBY2NvcmRpb25JdGVtQ29tcG9uZW50IGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCB7XG4gIHByaXZhdGUgcmVhZG9ubHkgZGVzdHJveVJlZiA9IGluamVjdChEZXN0cm95UmVmKTtcbiAgQElucHV0KHsgcmVxdWlyZWQ6IHRydWUgfSkgaWQgPSAnJztcbiAgQElucHV0KCkgbGFiZWwgPSAnJztcbiAgaXNPcGVuID0gbmV3IEJlaGF2aW9yU3ViamVjdDxib29sZWFuPihmYWxzZSk7XG5cbiAgQENvbnRlbnRDaGlsZCgnaGVhZGVyJykgaGVhZGVyVGVtcGxhdGUhOiBUZW1wbGF0ZVJlZjxhbnk+O1xuICBAQ29udGVudENoaWxkcmVuKEFjY29yZGlvbkNvbXBvbmVudCkgYWNjb3JkaW9ucyE6IFF1ZXJ5TGlzdDxBY2NvcmRpb25Db21wb25lbnQ+O1xuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICB0aGlzLmlzT3BlblxuICAgICAgLnBpcGUoXG4gICAgICAgIHRha2VVbnRpbERlc3Ryb3llZCh0aGlzLmRlc3Ryb3lSZWYpLFxuICAgICAgICBza2lwKDEpLFxuICAgICAgICBmaWx0ZXIoaXNPcGVuID0+ICFpc09wZW4pXG4gICAgICApXG4gICAgICAuc3Vic2NyaWJlKCgpID0+IHtcbiAgICAgICAgdGhpcy5hY2NvcmRpb25zLmZvckVhY2goYWNjb3JkaW9uID0+IHtcbiAgICAgICAgICBhY2NvcmRpb24uY2xvc2VQYW5lcygpO1xuICAgICAgICB9KTtcbiAgICAgIH0pO1xuICB9XG5cbiAgdG9nZ2xlUGFuZSgpIHtcbiAgICB0aGlzLmlzT3Blbi5uZXh0KCF0aGlzLmlzT3Blbi5nZXRWYWx1ZSgpKTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImZsZXggZmxleC1jb2xcIj5cbiAgPGRpdiB0YWJpbmRleD1cIjBcIiAoY2xpY2spPVwidG9nZ2xlUGFuZSgpXCIgY2xhc3M9XCJmbGV4IGN1cnNvci1wb2ludGVyIGZsZXgtcm93IHJvdW5kZWQtbWRcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiaGVhZGVyVGVtcGxhdGU7IGNvbnRleHQ6IHsgaXNPcGVuOiAoaXNPcGVuIHwgYXN5bmMpIH1cIj5cbiAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltoZWFkZXJdXCIgLz5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgPC9kaXY+XG4gIDwhLS0gcHJvdmlkaW5nIGEgaGlnaCB2YWx1ZSBmb3IgbWF4LWhlaWdodCAtLT5cbiAgPGRpdlxuICAgIFtzdHlsZS5tYXgtaGVpZ2h0XT1cIihpc09wZW4gfCBhc3luYykgPyAnMTAyNHB4JyA6ICcwcHgnXCJcbiAgICBjbGFzcz1cIm92ZXJmbG93LWhpZGRlbiB0cmFuc2l0aW9uLVttYXgtaGVpZ2h0XSBkdXJhdGlvbi01MDAgZWFzZS1pbi1vdXRcIj5cbiAgICBAaWYgKGlzT3BlbiB8IGFzeW5jKSB7XG4gICAgICA8bmctY29udGVudCAvPlxuICAgIH1cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==