import { trigger, state, style, transition, animate } from '@angular/animations';
import { NgClass } from '@angular/common';
import * as i0 from '@angular/core';
import { Component, Input, NgModule } from '@angular/core';

/**
 * @description Componente de link expansor que mostra/oculta conteúdo transclusão
 * com animação de colapso. Exibe rótulos diferentes para os estados expandido e colapsado.
 *
 * @example
 * ```html
 * <s-collapse-link expandedLabel="Ver menos" collapsedLabel="Ver mais">
 *   <p>Conteúdo oculto</p>
 * </s-collapse-link>
 * ```
 *
 * @category Structure
 */
class CollapseLinkComponent {
    static nextIdSeed = 0;
    static _nextId = CollapseLinkComponent.nextIdSeed;
    static getNextId() {
        return this._nextId++;
    }
    /** @description Identificador do botão de toggle. Gerado automaticamente se não informado. */
    buttonId = `s-collapse-button-${CollapseLinkComponent.getNextId()}`;
    /** @description Rótulo exibido quando o conteúdo está expandido. @default 'Mostrar menos' */
    expandedLabel = 'Mostrar menos';
    /** @description Rótulo exibido quando o conteúdo está colapsado. @default 'Mostrar mais' */
    collapsedLabel = 'Mostrar mais';
    /** @description Desabilita o botão de toggle. @default false */
    disabled = false;
    /** @description Controla externamente o estado colapsado do componente. @default true */
    collapse = true;
    collapsed = true;
    animating = false;
    ngOnChanges(changes) {
        if (changes['collapse']) {
            this.onCollapse(changes['collapse'].currentValue);
        }
    }
    toggle() {
        if (this.animating) {
            return;
        }
        this.animating = true;
        this.collapsed = !this.collapsed;
    }
    onToggleDone() {
        this.animating = false;
    }
    onCollapse(collapse) {
        if (this.animating) {
            return;
        }
        this.animating = true;
        this.collapsed = collapse;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CollapseLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CollapseLinkComponent, isStandalone: true, selector: "s-collapse-link", inputs: { buttonId: "buttonId", expandedLabel: "expandedLabel", collapsedLabel: "collapsedLabel", disabled: "disabled", collapse: "collapse" }, usesOnChanges: true, ngImport: i0, template: "@if (!collapsed) {\n    <div\n        @collapseContent\n        (@collapseContent.done)=\"onToggleDone()\"\n    >\n        <ng-content></ng-content>\n    </div>\n}\n\n<button\n    [id]=\"buttonId\"\n    type=\"button\"\n    class=\"cursor-pointer font-open-sans text-sm h-[35px] max-w-full min-w-[40px] outline-none overflow-visible py-[5px] px-5 relative no-underline normal-case align-bottom bg-transparent border-0 disabled:cursor-text disabled:opacity-50\"\n    (click)=\"toggle()\"\n    [disabled]=\"disabled\"\n>\n    <span\n        class=\"left-[10px] -mt-[0.5em] absolute top-1/2 w-5 text-primary fa\"\n        [ngClass]=\"{ 'fa-caret-down': collapsed, 'fa-caret-up': !collapsed }\"\n        aria-hidden=\"true\"\n    >\n    </span>\n    <span class=\"overflow-hidden text-ellipsis whitespace-nowrap block mx-[10px] text-primary\">{{\n        collapsed ? collapsedLabel : expandedLabel\n    }}</span>\n</button>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
            trigger('collapseContent', [
                state('void', style({
                    height: 0,
                    opacity: 0,
                })),
                state('*', style({
                    height: '*',
                    opacity: 1,
                })),
                transition('void <=> *', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)')),
            ]),
        ] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CollapseLinkComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-collapse-link', animations: [
                        trigger('collapseContent', [
                            state('void', style({
                                height: 0,
                                opacity: 0,
                            })),
                            state('*', style({
                                height: '*',
                                opacity: 1,
                            })),
                            transition('void <=> *', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)')),
                        ]),
                    ], standalone: true, imports: [NgClass], template: "@if (!collapsed) {\n    <div\n        @collapseContent\n        (@collapseContent.done)=\"onToggleDone()\"\n    >\n        <ng-content></ng-content>\n    </div>\n}\n\n<button\n    [id]=\"buttonId\"\n    type=\"button\"\n    class=\"cursor-pointer font-open-sans text-sm h-[35px] max-w-full min-w-[40px] outline-none overflow-visible py-[5px] px-5 relative no-underline normal-case align-bottom bg-transparent border-0 disabled:cursor-text disabled:opacity-50\"\n    (click)=\"toggle()\"\n    [disabled]=\"disabled\"\n>\n    <span\n        class=\"left-[10px] -mt-[0.5em] absolute top-1/2 w-5 text-primary fa\"\n        [ngClass]=\"{ 'fa-caret-down': collapsed, 'fa-caret-up': !collapsed }\"\n        aria-hidden=\"true\"\n    >\n    </span>\n    <span class=\"overflow-hidden text-ellipsis whitespace-nowrap block mx-[10px] text-primary\">{{\n        collapsed ? collapsedLabel : expandedLabel\n    }}</span>\n</button>\n" }]
        }], propDecorators: { buttonId: [{
                type: Input
            }], expandedLabel: [{
                type: Input
            }], collapsedLabel: [{
                type: Input
            }], disabled: [{
                type: Input
            }], collapse: [{
                type: Input
            }] } });

class CollapseLinkModule {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CollapseLinkModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: CollapseLinkModule, imports: [CollapseLinkComponent], exports: [CollapseLinkComponent] });
    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CollapseLinkModule });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CollapseLinkModule, decorators: [{
            type: NgModule,
            args: [{
                    exports: [CollapseLinkComponent],
                    imports: [CollapseLinkComponent],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { CollapseLinkComponent, CollapseLinkModule };
//# sourceMappingURL=seniorsistemas-angular-components-collapse-link.mjs.map
