@seniorsistemas/angular-components 19.3.3 → 19.3.4

package/fesm2022/seniorsistemas-angular-components-loading-state.mjs

@@ -1,7 +1,7 @@
 import * as i1$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Component, Input, inject, ViewContainerRef, TemplateRef, ComponentFactoryResolver, ChangeDetectorRef, Directive, NgModule } from '@angular/core';
+import { Component, ViewEncapsulation, Input, inject, ViewContainerRef, TemplateRef, ComponentFactoryResolver, ChangeDetectorRef, Directive, NgModule } from '@angular/core';
 import * as i1 from '@seniorsistemas/angular-components/common';
 import { SVGFactoryModule } from '@seniorsistemas/angular-components/common';
 
@@ -117,11 +117,11 @@ class LoadingStateComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LoadingStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LoadingStateComponent, selector: "s-loading-state", inputs: { indicator: "indicator", id: "id", blockWindow: "blockWindow", loading: "loading" }, ngImport: i0, template: "<div\n    [id]=\"id\"\n    class=\"s-loading-state\"\n    [ngClass]=\"{\n        's-loading-state--loading': loading,\n        's-loading-state--blocking': blocking,\n        's-loading-state--fullscreen': blockWindow\n    }\"\n>\n    <div\n        [id]=\"id + '-loader'\"\n        class=\"loader\"\n    >\n        <div\n            [id]=\"id + '-spinner'\"\n            class=\"spinner\"\n        >\n            @switch (indicator) {\n                @case ('logo') {\n                    <s-logo-indicator></s-logo-indicator>\n                }\n                @case ('dots') {\n                    <s-dots-indicator></s-dots-indicator>\n                }\n            }\n        </div>\n        <div\n            [id]=\"id + '-overlay'\"\n            class=\"overlay\"\n        ></div>\n    </div>\n    <div\n        [id]=\"id + '-contents'\"\n        class=\"state-contents\"\n    >\n        <ng-container *ngTemplateOutlet=\"contents || originalContent\"></ng-container>\n        <ng-template #originalContent>\n            <ng-content></ng-content>\n        </ng-template>\n    </div>\n</div>\n", styles: [".s-loading-state{position:relative}.s-loading-state .loader{opacity:0;position:absolute;transition:opacity .2s ease-out,display .2s ease-out;visibility:hidden;inset:1px;display:flex;justify-content:center;align-items:center}.s-loading-state .loader .overlay{background-color:#fff;height:100%;opacity:.8;transition:opacity .2s ease-out,display .2s ease-out;width:100%}.s-loading-state .loader .spinner{display:flex;position:absolute;z-index:2}.s-loading-state.s-loading-state--loading>.loader,.s-loading-state.s-loading-state--blocking>.loader{visibility:visible}.s-loading-state.s-loading-state--loading>.loader,.s-loading-state.s-loading-state--loading>.loader>.overlay,.s-loading-state.s-loading-state--blocking>.loader,.s-loading-state.s-loading-state--blocking>.loader>.overlay{cursor:wait;z-index:1}.s-loading-state.s-loading-state--loading>.state-contents,.s-loading-state.s-loading-state--blocking>.state-contents{z-index:0!important}.s-loading-state.s-loading-state--blocking.s-loading-state--loading>.loader{opacity:1}.s-loading-state.s-loading-state--fullscreen>.loader{left:0;position:fixed;top:0;z-index:1005}::ng-deep .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.loader{opacity:0;visibility:hidden}::ng-deep .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.state-contents{z-index:0!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DotsIndicatorComponent, selector: "s-dots-indicator" }, { kind: "component", type: LoadingIndicatorComponent, selector: "s-logo-indicator" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LoadingStateComponent, selector: "s-loading-state", inputs: { indicator: "indicator", id: "id", blockWindow: "blockWindow", loading: "loading" }, ngImport: i0, template: "<div\n    [id]=\"id\"\n    class=\"s-loading-state\"\n    [ngClass]=\"{\n        's-loading-state--loading': loading,\n        's-loading-state--blocking': blocking,\n        's-loading-state--fullscreen': blockWindow\n    }\"\n>\n    <div\n        [id]=\"id + '-loader'\"\n        class=\"loader\"\n    >\n        <div\n            [id]=\"id + '-spinner'\"\n            class=\"spinner\"\n        >\n            @switch (indicator) {\n                @case ('logo') {\n                    <s-logo-indicator></s-logo-indicator>\n                }\n                @case ('dots') {\n                    <s-dots-indicator></s-dots-indicator>\n                }\n            }\n        </div>\n        <div\n            [id]=\"id + '-overlay'\"\n            class=\"overlay\"\n        ></div>\n    </div>\n    <div\n        [id]=\"id + '-contents'\"\n        class=\"state-contents\"\n    >\n        <ng-container *ngTemplateOutlet=\"contents || originalContent\"></ng-container>\n        <ng-template #originalContent>\n            <ng-content></ng-content>\n        </ng-template>\n    </div>\n</div>\n", styles: ["s-loading-state .s-loading-state{position:relative}s-loading-state .s-loading-state .loader{opacity:0;position:absolute;transition:opacity .2s ease-out,display .2s ease-out;visibility:hidden;inset:1px;display:flex;justify-content:center;align-items:center}s-loading-state .s-loading-state .loader .overlay{height:100%;opacity:.8;transition:opacity .2s ease-out,display .2s ease-out;width:100%}s-loading-state .s-loading-state .loader .spinner{display:flex;position:absolute;z-index:2}s-loading-state .s-loading-state.s-loading-state--loading>.loader,s-loading-state .s-loading-state.s-loading-state--blocking>.loader{cursor:wait;visibility:visible;z-index:2}s-loading-state .s-loading-state.s-loading-state--loading>.loader>.overlay,s-loading-state .s-loading-state.s-loading-state--blocking>.loader>.overlay{cursor:wait;z-index:1}s-loading-state .s-loading-state.s-loading-state--loading>.state-contents,s-loading-state .s-loading-state.s-loading-state--blocking>.state-contents{position:relative;z-index:0!important;opacity:.5}s-loading-state .s-loading-state.s-loading-state--fullscreen>.loader{left:0;position:fixed;top:0;z-index:1005}s-loading-state .s-loading-state.s-loading-state--blocking.s-loading-state--loading>.loader{opacity:1}s-loading-state .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.loader{opacity:0;visibility:hidden}s-loading-state .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.state-contents{z-index:0!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DotsIndicatorComponent, selector: "s-dots-indicator" }, { kind: "component", type: LoadingIndicatorComponent, selector: "s-logo-indicator" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LoadingStateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-loading-state', template: "<div\n    [id]=\"id\"\n    class=\"s-loading-state\"\n    [ngClass]=\"{\n        's-loading-state--loading': loading,\n        's-loading-state--blocking': blocking,\n        's-loading-state--fullscreen': blockWindow\n    }\"\n>\n    <div\n        [id]=\"id + '-loader'\"\n        class=\"loader\"\n    >\n        <div\n            [id]=\"id + '-spinner'\"\n            class=\"spinner\"\n        >\n            @switch (indicator) {\n                @case ('logo') {\n                    <s-logo-indicator></s-logo-indicator>\n                }\n                @case ('dots') {\n                    <s-dots-indicator></s-dots-indicator>\n                }\n            }\n        </div>\n        <div\n            [id]=\"id + '-overlay'\"\n            class=\"overlay\"\n        ></div>\n    </div>\n    <div\n        [id]=\"id + '-contents'\"\n        class=\"state-contents\"\n    >\n        <ng-container *ngTemplateOutlet=\"contents || originalContent\"></ng-container>\n        <ng-template #originalContent>\n            <ng-content></ng-content>\n        </ng-template>\n    </div>\n</div>\n", styles: [".s-loading-state{position:relative}.s-loading-state .loader{opacity:0;position:absolute;transition:opacity .2s ease-out,display .2s ease-out;visibility:hidden;inset:1px;display:flex;justify-content:center;align-items:center}.s-loading-state .loader .overlay{background-color:#fff;height:100%;opacity:.8;transition:opacity .2s ease-out,display .2s ease-out;width:100%}.s-loading-state .loader .spinner{display:flex;position:absolute;z-index:2}.s-loading-state.s-loading-state--loading>.loader,.s-loading-state.s-loading-state--blocking>.loader{visibility:visible}.s-loading-state.s-loading-state--loading>.loader,.s-loading-state.s-loading-state--loading>.loader>.overlay,.s-loading-state.s-loading-state--blocking>.loader,.s-loading-state.s-loading-state--blocking>.loader>.overlay{cursor:wait;z-index:1}.s-loading-state.s-loading-state--loading>.state-contents,.s-loading-state.s-loading-state--blocking>.state-contents{z-index:0!important}.s-loading-state.s-loading-state--blocking.s-loading-state--loading>.loader{opacity:1}.s-loading-state.s-loading-state--fullscreen>.loader{left:0;position:fixed;top:0;z-index:1005}::ng-deep .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.loader{opacity:0;visibility:hidden}::ng-deep .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.state-contents{z-index:0!important}\n"] }]
+            args: [{ selector: 's-loading-state', encapsulation: ViewEncapsulation.None, template: "<div\n    [id]=\"id\"\n    class=\"s-loading-state\"\n    [ngClass]=\"{\n        's-loading-state--loading': loading,\n        's-loading-state--blocking': blocking,\n        's-loading-state--fullscreen': blockWindow\n    }\"\n>\n    <div\n        [id]=\"id + '-loader'\"\n        class=\"loader\"\n    >\n        <div\n            [id]=\"id + '-spinner'\"\n            class=\"spinner\"\n        >\n            @switch (indicator) {\n                @case ('logo') {\n                    <s-logo-indicator></s-logo-indicator>\n                }\n                @case ('dots') {\n                    <s-dots-indicator></s-dots-indicator>\n                }\n            }\n        </div>\n        <div\n            [id]=\"id + '-overlay'\"\n            class=\"overlay\"\n        ></div>\n    </div>\n    <div\n        [id]=\"id + '-contents'\"\n        class=\"state-contents\"\n    >\n        <ng-container *ngTemplateOutlet=\"contents || originalContent\"></ng-container>\n        <ng-template #originalContent>\n            <ng-content></ng-content>\n        </ng-template>\n    </div>\n</div>\n", styles: ["s-loading-state .s-loading-state{position:relative}s-loading-state .s-loading-state .loader{opacity:0;position:absolute;transition:opacity .2s ease-out,display .2s ease-out;visibility:hidden;inset:1px;display:flex;justify-content:center;align-items:center}s-loading-state .s-loading-state .loader .overlay{height:100%;opacity:.8;transition:opacity .2s ease-out,display .2s ease-out;width:100%}s-loading-state .s-loading-state .loader .spinner{display:flex;position:absolute;z-index:2}s-loading-state .s-loading-state.s-loading-state--loading>.loader,s-loading-state .s-loading-state.s-loading-state--blocking>.loader{cursor:wait;visibility:visible;z-index:2}s-loading-state .s-loading-state.s-loading-state--loading>.loader>.overlay,s-loading-state .s-loading-state.s-loading-state--blocking>.loader>.overlay{cursor:wait;z-index:1}s-loading-state .s-loading-state.s-loading-state--loading>.state-contents,s-loading-state .s-loading-state.s-loading-state--blocking>.state-contents{position:relative;z-index:0!important;opacity:.5}s-loading-state .s-loading-state.s-loading-state--fullscreen>.loader{left:0;position:fixed;top:0;z-index:1005}s-loading-state .s-loading-state.s-loading-state--blocking.s-loading-state--loading>.loader{opacity:1}s-loading-state .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.loader{opacity:0;visibility:hidden}s-loading-state .s-loading-state-container.s-loading-state--loading.s-loading-state--blocking s-loading-state .s-loading-state-container>.state-contents{z-index:0!important}\n"] }]
         }], propDecorators: { indicator: [{
                 type: Input
             }], id: [{

package/fesm2022/seniorsistemas-angular-components-loading-state.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"seniorsistemas-angular-components-loading-state.mjs","sources":["../../projects/angular-components/loading-state/src/lib/loading-state/components/dots-indicator/dots-indicator.components.ts","../../projects/angular-components/loading-state/src/lib/loading-state/components/dots-indicator/dots-indicator.component.html","../../projects/angular-components/loading-state/src/lib/loading-state/components/logo-indicator/logo-indicator.component.ts","../../projects/angular-components/loading-state/src/lib/loading-state/components/logo-indicator/logo-indicator.component.html","../../projects/angular-components/loading-state/src/lib/loading-state/components/loading-state-indicators.ts","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.component.ts","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.component.html","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.directive.ts","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.module.ts","../../projects/angular-components/loading-state/src/seniorsistemas-angular-components-loading-state.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n    selector: 's-dots-indicator',\n    templateUrl: './dots-indicator.component.html',\n    styleUrls: ['./dots-indicator.component.scss'],\n})\nexport class DotsIndicatorComponent {}\n","<div class=\"dots-indicator\">\n    <div class=\"bounce bounce--1\"></div>\n    <div class=\"bounce bounce--2\"></div>\n    <div class=\"bounce bounce--3\"></div>\n</div>\n","import { Component } from '@angular/core';\n\n@Component({\n    selector: 's-logo-indicator',\n    templateUrl: './logo-indicator.component.html',\n    styleUrls: ['./logo-indicator.component.scss'],\n})\nexport class LoadingIndicatorComponent {}\n","<div class=\"logo-indicator\">\n    <span *sSVGFactory=\"'senior'\"></span>\n</div>\n","export enum LoadingStateIndicators {\n    Dots = 'dots',\n    Logo = 'logo',\n}\n","import { Component, Input, OnDestroy, TemplateRef } from '@angular/core';\n\nimport { LoadingStateIndicators } from './components/loading-state-indicators';\n\n/**\n * @description Componente de estado de carregamento que exibe um indicador animado enquanto\n * um processo assíncrono está em andamento. Suporta bloqueio da janela inteira\n * e diferentes tipos de indicadores visuais.\n * Também pode ser usado como diretiva estrutural `[sLoadingState]`.\n *\n * @example\n * ```html\n * <s-loading-state [loading]=\"isLoading\" [blockWindow]=\"true\">\n *   <p>Conteúdo carregado!</p>\n * </s-loading-state>\n * ```\n *\n * @category Feedback\n */\n@Component({\n    selector: 's-loading-state',\n    templateUrl: './loading-state.component.html',\n    styleUrls: ['./loading-state.component.scss'],\n})\nexport class LoadingStateComponent implements OnDestroy {\n    public static nextId = 0;\n\n    /**\n     * @description Tipo de indicador visual exibido durante o carregamento.\n     * - `LoadingStateIndicators.Dots`: indicador de pontos animados (padrão).\n     * - `LoadingStateIndicators.Logo`: indicador com logotipo animado.\n     *\n     * @default LoadingStateIndicators.Dots\n     */\n    @Input()\n    public indicator: LoadingStateIndicators = LoadingStateIndicators.Dots;\n\n    /**\n     * @description Identificador único do componente. Gerado automaticamente se não informado.\n     */\n    @Input()\n    public id = `s-loading-state-${LoadingStateComponent.nextId++}`;\n\n    /**\n     * @description Quando `true`, bloqueia a janela inteira durante o carregamento,\n     * sobrepondo todo o conteúdo da página com o indicador.\n     *\n     * @default false\n     */\n    @Input()\n    public blockWindow = false;\n\n    /**\n     * @description Controla o estado de carregamento do componente. Campo obrigatório.\n     * Quando `true`, exibe o indicador de carregamento após um breve delay.\n     * Quando `false`, remove o indicador após um breve delay (evita flash).\n     */\n    @Input({ required: true })\n    public set loading(loading: boolean) {\n        this._loading = loading;\n        loading ? this.block() : this.unblock();\n    }\n\n    public get loading() {\n        return this._loading;\n    }\n\n    public contents: TemplateRef<any> | null = null;\n    public blocking = false;\n\n    private _loading = false;\n    private BLOCK_TIMEOUT_VALUE = 300;\n    private UNBLOCK_TIMEOUT_VALUE = 200;\n    private blockTimeoutId: any;\n    private unblockTimeoutId: any;\n\n    public ngOnDestroy(): void {\n        if (this.blockTimeoutId) {\n            clearTimeout(this.blockTimeoutId);\n        }\n\n        if (this.unblockTimeoutId) {\n            clearTimeout(this.unblockTimeoutId);\n        }\n    }\n\n    public block(): void {\n        if (this.unblockTimeoutId) {\n            clearTimeout(this.unblockTimeoutId);\n            this.unblockTimeoutId = undefined;\n        }\n\n        if (!this.blockTimeoutId) {\n            this.blockTimeoutId = setTimeout(() => {\n                this.blocking = true;\n                this.blockTimeoutId = undefined;\n            }, this.BLOCK_TIMEOUT_VALUE);\n        }\n    }\n\n    public unblock(): void {\n        if (this.blockTimeoutId) {\n            clearTimeout(this.blockTimeoutId);\n            this.blockTimeoutId = undefined;\n        }\n\n        if (!this.unblockTimeoutId) {\n            this.unblockTimeoutId = setTimeout(() => {\n                this.blocking = false;\n                this.unblockTimeoutId = undefined;\n            }, this.UNBLOCK_TIMEOUT_VALUE);\n        }\n    }\n}\n\n","<div\n    [id]=\"id\"\n    class=\"s-loading-state\"\n    [ngClass]=\"{\n        's-loading-state--loading': loading,\n        's-loading-state--blocking': blocking,\n        's-loading-state--fullscreen': blockWindow\n    }\"\n>\n    <div\n        [id]=\"id + '-loader'\"\n        class=\"loader\"\n    >\n        <div\n            [id]=\"id + '-spinner'\"\n            class=\"spinner\"\n        >\n            @switch (indicator) {\n                @case ('logo') {\n                    <s-logo-indicator></s-logo-indicator>\n                }\n                @case ('dots') {\n                    <s-dots-indicator></s-dots-indicator>\n                }\n            }\n        </div>\n        <div\n            [id]=\"id + '-overlay'\"\n            class=\"overlay\"\n        ></div>\n    </div>\n    <div\n        [id]=\"id + '-contents'\"\n        class=\"state-contents\"\n    >\n        <ng-container *ngTemplateOutlet=\"contents || originalContent\"></ng-container>\n        <ng-template #originalContent>\n            <ng-content></ng-content>\n        </ng-template>\n    </div>\n</div>\n","import { AfterViewInit, ChangeDetectorRef, \n// NOSONAR - 'ComponentFactoryResolver' is deprecated.\nComponentFactoryResolver, ComponentRef, Directive, Input, OnDestroy, TemplateRef, ViewContainerRef, inject } from '@angular/core';\n\nimport { LoadingStateComponent } from './loading-state.component';\nimport { LoadingStateIndicators } from './components/loading-state-indicators';\n\n/**\n * @description Diretiva estrutural que envolve o conteúdo da view com um indicador de carregamento.\n * É uma alternativa inline ao `LoadingStateComponent`, podendo ser aplicada diretamente\n * em containers existentes sem a necessidade de criar um wrapper explícito no template.\n *\n * @example\n * ```html\n * <!-- Forma simples (boolean) -->\n * <div *sLoadingState=\"isLoading\">Conteúdo</div>\n *\n * <!-- Forma com configuração -->\n * <div *sLoadingState=\"{ loading: isLoading, indicator: 'logo' }\">Conteúdo</div>\n * ```\n *\n * @category Feedback\n */\n@Directive({\n    selector: '[sLoadingState]',\n})\nexport class LoadingStateDirective implements AfterViewInit, OnDestroy {\n    private readonly target = inject(ViewContainerRef);\n    private readonly template = inject<TemplateRef<any>>(TemplateRef);\n    private readonly componentFactoryResolver = inject(ComponentFactoryResolver);\n    private readonly cdr = inject(ChangeDetectorRef);\n\n    /**\n     * @description Controla o estado de carregamento da diretiva.\n     * Aceita:\n     * - `boolean`: ativa/desativa o carregamento com o indicador padrão (`dots`).\n     * - `{ loading: boolean; indicator?: LoadingStateIndicators }`: permite configurar\n     *   o tipo de indicador junto com o estado de carregamento.\n     */\n    @Input()\n    public set sLoadingState(value: boolean | { loading: boolean; indicator?: LoadingStateIndicators }) {\n        if (typeof value === 'boolean') {\n            this._loading = value;\n            this.indicator = LoadingStateIndicators.Dots;\n        } else if (typeof value === 'object') {\n            this._loading = value.loading;\n            this.indicator = value.indicator ?? LoadingStateIndicators.Dots;\n        }\n\n        if (this.loaderComponent) {\n            this.loaderComponent.instance.loading = this._loading;\n            this.loaderComponent.instance.indicator = this.indicator;\n        }\n    }\n\n    private _loading = false;\n    private indicator = LoadingStateIndicators.Dots;\n    private loaderComponent: ComponentRef<LoadingStateComponent> | null = null;\n\n    public ngAfterViewInit() {\n        this.createComponent();\n    }\n\n    private createComponent() {\n        const factory = this.componentFactoryResolver.resolveComponentFactory(LoadingStateComponent);\n        this.loaderComponent = this.target.createComponent(factory);\n        this.loaderComponent.instance.contents = this.template;\n        this.loaderComponent.instance.loading = this._loading;\n        this.loaderComponent.instance.indicator = this.indicator;\n        this.cdr.detectChanges();\n    }\n\n    public ngOnDestroy() {\n        if (this.loaderComponent) {\n            this.loaderComponent.destroy();\n        }\n    }\n}\n\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DotsIndicatorComponent } from './components/dots-indicator/dots-indicator.components';\nimport { LoadingIndicatorComponent } from './components/logo-indicator/logo-indicator.component';\nimport { LoadingStateComponent } from './loading-state.component';\nimport { LoadingStateDirective } from './loading-state.directive';\nimport { SVGFactoryModule } from '@seniorsistemas/angular-components/common';\n\n@NgModule({\n    imports: [CommonModule, SVGFactoryModule],\n    declarations: [\n        LoadingStateComponent,\n        LoadingStateDirective,\n        DotsIndicatorComponent,\n        LoadingIndicatorComponent,\n    ],\n    exports: [LoadingStateComponent, LoadingStateDirective],\n})\nexport class LoadingStateModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1","i2.DotsIndicatorComponent","i3.LoadingIndicatorComponent"],"mappings":";;;;;;;MAOa,sBAAsB,CAAA;wGAAtB,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,sBAAsB,wDCPnC,8KAKA,EAAA,MAAA,EAAA,CAAA,qcAAA,CAAA,EAAA,CAAA,CAAA;;4FDEa,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBALlC,SAAS;+BACI,kBAAkB,EAAA,QAAA,EAAA,8KAAA,EAAA,MAAA,EAAA,CAAA,qcAAA,CAAA,EAAA,CAAA;;;MEInB,yBAAyB,CAAA;wGAAzB,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAzB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,yBAAyB,wDCPtC,uFAGA,EAAA,MAAA,EAAA,CAAA,mXAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,aAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FDIa,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBALrC,SAAS;+BACI,kBAAkB,EAAA,QAAA,EAAA,uFAAA,EAAA,MAAA,EAAA,CAAA,mXAAA,CAAA,EAAA,CAAA;;;IEHpB,uBAGX;AAHD,CAAA,UAAY,sBAAsB,EAAA;AAC9B,IAAA,sBAAA,CAAA,MAAA,CAAA,GAAA,MAAa,CAAA;AACb,IAAA,sBAAA,CAAA,MAAA,CAAA,GAAA,MAAa,CAAA;AACjB,CAAC,EAHW,sBAAsB,KAAtB,sBAAsB,GAGjC,EAAA,CAAA,CAAA;;ACCD;;;;;;;;;;;;;;AAcG;MAMU,qBAAqB,CAAA;AACvB,IAAA,OAAO,MAAM,GAAG,CAAC,CAAC;AAEzB;;;;;;AAMG;AAEI,IAAA,SAAS,GAA2B,sBAAsB,CAAC,IAAI,CAAC;AAEvE;;AAEG;AAEI,IAAA,EAAE,GAAG,CAAmB,gBAAA,EAAA,qBAAqB,CAAC,MAAM,EAAE,EAAE,CAAC;AAEhE;;;;;AAKG;IAEI,WAAW,GAAG,KAAK,CAAC;AAE3B;;;;AAIG;IACH,IACW,OAAO,CAAC,OAAgB,EAAA;AAC/B,QAAA,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;AACxB,QAAA,OAAO,GAAG,IAAI,CAAC,KAAK,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC;KAC3C;AAED,IAAA,IAAW,OAAO,GAAA;QACd,OAAO,IAAI,CAAC,QAAQ,CAAC;KACxB;IAEM,QAAQ,GAA4B,IAAI,CAAC;IACzC,QAAQ,GAAG,KAAK,CAAC;IAEhB,QAAQ,GAAG,KAAK,CAAC;IACjB,mBAAmB,GAAG,GAAG,CAAC;IAC1B,qBAAqB,GAAG,GAAG,CAAC;AAC5B,IAAA,cAAc,CAAM;AACpB,IAAA,gBAAgB,CAAM;IAEvB,WAAW,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE;AACrB,YAAA,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;SACrC;AAED,QAAA,IAAI,IAAI,CAAC,gBAAgB,EAAE;AACvB,YAAA,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;SACvC;KACJ;IAEM,KAAK,GAAA;AACR,QAAA,IAAI,IAAI,CAAC,gBAAgB,EAAE;AACvB,YAAA,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;AACpC,YAAA,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;SACrC;AAED,QAAA,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;AACtB,YAAA,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC,MAAK;AAClC,gBAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;AACrB,gBAAA,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;AACpC,aAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;SAChC;KACJ;IAEM,OAAO,GAAA;AACV,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE;AACrB,YAAA,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;AAClC,YAAA,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;SACnC;AAED,QAAA,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE;AACxB,YAAA,IAAI,CAAC,gBAAgB,GAAG,UAAU,CAAC,MAAK;AACpC,gBAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;AACtB,gBAAA,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;AACtC,aAAC,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;SAClC;KACJ;wGAxFQ,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qBAAqB,qJCxBlC,+kCAyCA,EAAA,MAAA,EAAA,CAAA,m7CAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAC,sBAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAC,yBAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FDjBa,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBALjC,SAAS;+BACI,iBAAiB,EAAA,QAAA,EAAA,+kCAAA,EAAA,MAAA,EAAA,CAAA,m7CAAA,CAAA,EAAA,CAAA;8BAepB,SAAS,EAAA,CAAA;sBADf,KAAK;gBAOC,EAAE,EAAA,CAAA;sBADR,KAAK;gBAUC,WAAW,EAAA,CAAA;sBADjB,KAAK;gBASK,OAAO,EAAA,CAAA;sBADjB,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAA;;;AElD7B;;;;;;;;;;;;;;;AAeG;MAIU,qBAAqB,CAAA;AACb,IAAA,MAAM,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC;AAClC,IAAA,QAAQ,GAAG,MAAM,CAAmB,WAAW,CAAC,CAAC;AACjD,IAAA,wBAAwB,GAAG,MAAM,CAAC,wBAAwB,CAAC,CAAC;AAC5D,IAAA,GAAG,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC;AAEjD;;;;;;AAMG;IACH,IACW,aAAa,CAAC,KAAyE,EAAA;AAC9F,QAAA,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE;AAC5B,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;AACtB,YAAA,IAAI,CAAC,SAAS,GAAG,sBAAsB,CAAC,IAAI,CAAC;SAChD;AAAM,aAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAClC,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC;YAC9B,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,IAAI,sBAAsB,CAAC,IAAI,CAAC;SACnE;AAED,QAAA,IAAI,IAAI,CAAC,eAAe,EAAE;YACtB,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;YACtD,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;SAC5D;KACJ;IAEO,QAAQ,GAAG,KAAK,CAAC;AACjB,IAAA,SAAS,GAAG,sBAAsB,CAAC,IAAI,CAAC;IACxC,eAAe,GAA+C,IAAI,CAAC;IAEpE,eAAe,GAAA;QAClB,IAAI,CAAC,eAAe,EAAE,CAAC;KAC1B;IAEO,eAAe,GAAA;QACnB,MAAM,OAAO,GAAG,IAAI,CAAC,wBAAwB,CAAC,uBAAuB,CAAC,qBAAqB,CAAC,CAAC;QAC7F,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;QAC5D,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;QACvD,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;QACtD,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;AACzD,QAAA,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC5B;IAEM,WAAW,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,eAAe,EAAE;AACtB,YAAA,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC;SAClC;KACJ;wGAlDQ,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;4FAArB,qBAAqB,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,aAAA,EAAA,eAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAArB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAHjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,iBAAiB;AAC9B,iBAAA,CAAA;8BAec,aAAa,EAAA,CAAA;sBADvB,KAAK;;;MCpBG,kBAAkB,CAAA;wGAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,iBAPvB,qBAAqB;YACrB,qBAAqB;YACrB,sBAAsB;AACtB,YAAA,yBAAyB,aALnB,YAAY,EAAE,gBAAgB,CAO9B,EAAA,OAAA,EAAA,CAAA,qBAAqB,EAAE,qBAAqB,CAAA,EAAA,CAAA,CAAA;yGAE7C,kBAAkB,EAAA,OAAA,EAAA,CATjB,YAAY,EAAE,gBAAgB,CAAA,EAAA,CAAA,CAAA;;4FAS/B,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAV9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,gBAAgB,CAAC;AACzC,oBAAA,YAAY,EAAE;wBACV,qBAAqB;wBACrB,qBAAqB;wBACrB,sBAAsB;wBACtB,yBAAyB;AAC5B,qBAAA;AACD,oBAAA,OAAO,EAAE,CAAC,qBAAqB,EAAE,qBAAqB,CAAC;AAC1D,iBAAA,CAAA;;;AClBD;;AAEG;;;;"}
+{"version":3,"file":"seniorsistemas-angular-components-loading-state.mjs","sources":["../../projects/angular-components/loading-state/src/lib/loading-state/components/dots-indicator/dots-indicator.components.ts","../../projects/angular-components/loading-state/src/lib/loading-state/components/dots-indicator/dots-indicator.component.html","../../projects/angular-components/loading-state/src/lib/loading-state/components/logo-indicator/logo-indicator.component.ts","../../projects/angular-components/loading-state/src/lib/loading-state/components/logo-indicator/logo-indicator.component.html","../../projects/angular-components/loading-state/src/lib/loading-state/components/loading-state-indicators.ts","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.component.ts","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.component.html","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.directive.ts","../../projects/angular-components/loading-state/src/lib/loading-state/loading-state.module.ts","../../projects/angular-components/loading-state/src/seniorsistemas-angular-components-loading-state.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n    selector: 's-dots-indicator',\n    templateUrl: './dots-indicator.component.html',\n    styleUrls: ['./dots-indicator.component.scss'],\n})\nexport class DotsIndicatorComponent {}\n","<div class=\"dots-indicator\">\n    <div class=\"bounce bounce--1\"></div>\n    <div class=\"bounce bounce--2\"></div>\n    <div class=\"bounce bounce--3\"></div>\n</div>\n","import { Component } from '@angular/core';\n\n@Component({\n    selector: 's-logo-indicator',\n    templateUrl: './logo-indicator.component.html',\n    styleUrls: ['./logo-indicator.component.scss'],\n})\nexport class LoadingIndicatorComponent {}\n","<div class=\"logo-indicator\">\n    <span *sSVGFactory=\"'senior'\"></span>\n</div>\n","export enum LoadingStateIndicators {\n    Dots = 'dots',\n    Logo = 'logo',\n}\n","import { Component, Input, OnDestroy, TemplateRef, ViewEncapsulation } from '@angular/core';\n\nimport { LoadingStateIndicators } from './components/loading-state-indicators';\n\n/**\n * @description Componente de estado de carregamento que exibe um indicador animado enquanto\n * um processo assíncrono está em andamento. Suporta bloqueio da janela inteira\n * e diferentes tipos de indicadores visuais.\n * Também pode ser usado como diretiva estrutural `[sLoadingState]`.\n *\n * @example\n * ```html\n * <s-loading-state [loading]=\"isLoading\" [blockWindow]=\"true\">\n *   <p>Conteúdo carregado!</p>\n * </s-loading-state>\n * ```\n *\n * @category Feedback\n */\n@Component({\n    selector: 's-loading-state',\n    templateUrl: './loading-state.component.html',\n    styleUrls: ['./loading-state.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n})\nexport class LoadingStateComponent implements OnDestroy {\n    public static nextId = 0;\n\n    /**\n     * @description Tipo de indicador visual exibido durante o carregamento.\n     * - `LoadingStateIndicators.Dots`: indicador de pontos animados (padrão).\n     * - `LoadingStateIndicators.Logo`: indicador com logotipo animado.\n     *\n     * @default LoadingStateIndicators.Dots\n     */\n    @Input()\n    public indicator: LoadingStateIndicators = LoadingStateIndicators.Dots;\n\n    /**\n     * @description Identificador único do componente. Gerado automaticamente se não informado.\n     */\n    @Input()\n    public id = `s-loading-state-${LoadingStateComponent.nextId++}`;\n\n    /**\n     * @description Quando `true`, bloqueia a janela inteira durante o carregamento,\n     * sobrepondo todo o conteúdo da página com o indicador.\n     *\n     * @default false\n     */\n    @Input()\n    public blockWindow = false;\n\n    /**\n     * @description Controla o estado de carregamento do componente. Campo obrigatório.\n     * Quando `true`, exibe o indicador de carregamento após um breve delay.\n     * Quando `false`, remove o indicador após um breve delay (evita flash).\n     */\n    @Input({ required: true })\n    public set loading(loading: boolean) {\n        this._loading = loading;\n        loading ? this.block() : this.unblock();\n    }\n\n    public get loading() {\n        return this._loading;\n    }\n\n    public contents: TemplateRef<any> | null = null;\n    public blocking = false;\n\n    private _loading = false;\n    private BLOCK_TIMEOUT_VALUE = 300;\n    private UNBLOCK_TIMEOUT_VALUE = 200;\n    private blockTimeoutId: any;\n    private unblockTimeoutId: any;\n\n    public ngOnDestroy(): void {\n        if (this.blockTimeoutId) {\n            clearTimeout(this.blockTimeoutId);\n        }\n\n        if (this.unblockTimeoutId) {\n            clearTimeout(this.unblockTimeoutId);\n        }\n    }\n\n    public block(): void {\n        if (this.unblockTimeoutId) {\n            clearTimeout(this.unblockTimeoutId);\n            this.unblockTimeoutId = undefined;\n        }\n\n        if (!this.blockTimeoutId) {\n            this.blockTimeoutId = setTimeout(() => {\n                this.blocking = true;\n                this.blockTimeoutId = undefined;\n            }, this.BLOCK_TIMEOUT_VALUE);\n        }\n    }\n\n    public unblock(): void {\n        if (this.blockTimeoutId) {\n            clearTimeout(this.blockTimeoutId);\n            this.blockTimeoutId = undefined;\n        }\n\n        if (!this.unblockTimeoutId) {\n            this.unblockTimeoutId = setTimeout(() => {\n                this.blocking = false;\n                this.unblockTimeoutId = undefined;\n            }, this.UNBLOCK_TIMEOUT_VALUE);\n        }\n    }\n}\n\n","<div\n    [id]=\"id\"\n    class=\"s-loading-state\"\n    [ngClass]=\"{\n        's-loading-state--loading': loading,\n        's-loading-state--blocking': blocking,\n        's-loading-state--fullscreen': blockWindow\n    }\"\n>\n    <div\n        [id]=\"id + '-loader'\"\n        class=\"loader\"\n    >\n        <div\n            [id]=\"id + '-spinner'\"\n            class=\"spinner\"\n        >\n            @switch (indicator) {\n                @case ('logo') {\n                    <s-logo-indicator></s-logo-indicator>\n                }\n                @case ('dots') {\n                    <s-dots-indicator></s-dots-indicator>\n                }\n            }\n        </div>\n        <div\n            [id]=\"id + '-overlay'\"\n            class=\"overlay\"\n        ></div>\n    </div>\n    <div\n        [id]=\"id + '-contents'\"\n        class=\"state-contents\"\n    >\n        <ng-container *ngTemplateOutlet=\"contents || originalContent\"></ng-container>\n        <ng-template #originalContent>\n            <ng-content></ng-content>\n        </ng-template>\n    </div>\n</div>\n","import { AfterViewInit, ChangeDetectorRef, \n// NOSONAR - 'ComponentFactoryResolver' is deprecated.\nComponentFactoryResolver, ComponentRef, Directive, Input, OnDestroy, TemplateRef, ViewContainerRef, inject } from '@angular/core';\n\nimport { LoadingStateComponent } from './loading-state.component';\nimport { LoadingStateIndicators } from './components/loading-state-indicators';\n\n/**\n * @description Diretiva estrutural que envolve o conteúdo da view com um indicador de carregamento.\n * É uma alternativa inline ao `LoadingStateComponent`, podendo ser aplicada diretamente\n * em containers existentes sem a necessidade de criar um wrapper explícito no template.\n *\n * @example\n * ```html\n * <!-- Forma simples (boolean) -->\n * <div *sLoadingState=\"isLoading\">Conteúdo</div>\n *\n * <!-- Forma com configuração -->\n * <div *sLoadingState=\"{ loading: isLoading, indicator: 'logo' }\">Conteúdo</div>\n * ```\n *\n * @category Feedback\n */\n@Directive({\n    selector: '[sLoadingState]',\n})\nexport class LoadingStateDirective implements AfterViewInit, OnDestroy {\n    private readonly target = inject(ViewContainerRef);\n    private readonly template = inject<TemplateRef<any>>(TemplateRef);\n    private readonly componentFactoryResolver = inject(ComponentFactoryResolver);\n    private readonly cdr = inject(ChangeDetectorRef);\n\n    /**\n     * @description Controla o estado de carregamento da diretiva.\n     * Aceita:\n     * - `boolean`: ativa/desativa o carregamento com o indicador padrão (`dots`).\n     * - `{ loading: boolean; indicator?: LoadingStateIndicators }`: permite configurar\n     *   o tipo de indicador junto com o estado de carregamento.\n     */\n    @Input()\n    public set sLoadingState(value: boolean | { loading: boolean; indicator?: LoadingStateIndicators }) {\n        if (typeof value === 'boolean') {\n            this._loading = value;\n            this.indicator = LoadingStateIndicators.Dots;\n        } else if (typeof value === 'object') {\n            this._loading = value.loading;\n            this.indicator = value.indicator ?? LoadingStateIndicators.Dots;\n        }\n\n        if (this.loaderComponent) {\n            this.loaderComponent.instance.loading = this._loading;\n            this.loaderComponent.instance.indicator = this.indicator;\n        }\n    }\n\n    private _loading = false;\n    private indicator = LoadingStateIndicators.Dots;\n    private loaderComponent: ComponentRef<LoadingStateComponent> | null = null;\n\n    public ngAfterViewInit() {\n        this.createComponent();\n    }\n\n    private createComponent() {\n        const factory = this.componentFactoryResolver.resolveComponentFactory(LoadingStateComponent);\n        this.loaderComponent = this.target.createComponent(factory);\n        this.loaderComponent.instance.contents = this.template;\n        this.loaderComponent.instance.loading = this._loading;\n        this.loaderComponent.instance.indicator = this.indicator;\n        this.cdr.detectChanges();\n    }\n\n    public ngOnDestroy() {\n        if (this.loaderComponent) {\n            this.loaderComponent.destroy();\n        }\n    }\n}\n\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DotsIndicatorComponent } from './components/dots-indicator/dots-indicator.components';\nimport { LoadingIndicatorComponent } from './components/logo-indicator/logo-indicator.component';\nimport { LoadingStateComponent } from './loading-state.component';\nimport { LoadingStateDirective } from './loading-state.directive';\nimport { SVGFactoryModule } from '@seniorsistemas/angular-components/common';\n\n@NgModule({\n    imports: [CommonModule, SVGFactoryModule],\n    declarations: [\n        LoadingStateComponent,\n        LoadingStateDirective,\n        DotsIndicatorComponent,\n        LoadingIndicatorComponent,\n    ],\n    exports: [LoadingStateComponent, LoadingStateDirective],\n})\nexport class LoadingStateModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1","i2.DotsIndicatorComponent","i3.LoadingIndicatorComponent"],"mappings":"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"}

package/fieldset/README.md

@@ -0,0 +1,135 @@
+# Fieldset
+
+![Status](https://img.shields.io/badge/status-stable-brightgreen)
+
+Componente de agrupamento de campos de formulário com legenda, ícone e suporte a toggle (recolher/expandir) com animação. Aceita template customizado para o cabeçalho via `sTemplate="header"`.
+
+## Quando usar
+
+- Agrupar campos relacionados em formulários longos com separação visual por título
+- Seções opcionais que podem ser recolhidas para reduzir a carga visual
+- Formulários com múltiplas seções que precisam de diferenciação visual
+
+## Quando não usar
+
+- Agrupamentos sem necessidade de título — use `<div>` simples
+- Múltiplos painéis onde apenas um pode estar aberto por vez — use [`Accordion`](../accordion/README.md)
+
+## Instalação
+
+```typescript
+import { FieldsetModule } from '@seniorsistemas/angular-components/fieldset';
+
+@Component({ standalone: true, imports: [FieldsetModule] })
+export class MeuComponent {}
+```
+
+## Uso básico
+
+```html
+<s-fieldset legend="Dados Pessoais">
+  <p>Conteúdo do fieldset</p>
+</s-fieldset>
+```
+
+## API
+
+### Inputs
+
+| Propriedade | Tipo | Padrão | Obrigatório | Descrição |
+|-------------|------|--------|:-----------:|-----------|
+| `legend` | `string` | `''` | — | Texto exibido como título do fieldset |
+| `icon` | `string` | `''` | — | Classe de ícone exibida ao lado da legenda (ex: `'fas fa-cog'`) |
+| `toggleable` | `boolean` | `false` | — | Habilita o botão +/- para recolher e expandir com animação |
+| `destroyOnHide` | `boolean` | `true` | — | Remove o conteúdo do DOM ao recolher. Use `false` para preservar estado de formulários |
+
+### Outputs
+
+| Evento | Tipo | Descrição |
+|--------|------|-----------|
+| `beforeToggle` | `EventEmitter<FieldSetToggle>` | Emitido antes da animação de toggle iniciar |
+| `afterToggle` | `EventEmitter<FieldSetToggle>` | Emitido após a animação de toggle concluir |
+
+### Tipos
+
+```typescript
+type FieldSetToggle = {
+  originalEvent: PointerEvent | KeyboardEvent;
+  collapsed: boolean; // true = estava aberto e vai fechar; false = estava fechado e vai abrir
+};
+```
+
+## Exemplos
+
+### Fieldset básico
+
+```html
+<s-fieldset legend="Dados Pessoais">
+  <div style="display: flex; flex-direction: column; gap: 12px;">
+    <input type="text" placeholder="Nome completo" />
+    <input type="text" placeholder="CPF" />
+  </div>
+</s-fieldset>
+```
+
+### Fieldset colapsável com ícone
+
+```html
+<s-fieldset
+  legend="Informações de Contato"
+  icon="fas fa-phone"
+  [toggleable]="true"
+  (beforeToggle)="onBeforeToggle($event)"
+  (afterToggle)="onAfterToggle($event)"
+>
+  <input type="tel" placeholder="(00) 00000-0000" />
+  <input type="email" placeholder="email@empresa.com" />
+</s-fieldset>
+```
+
+### Colapsável preservando estado do formulário
+
+```html
+<s-fieldset legend="Dados Opcionais" [toggleable]="true" [destroyOnHide]="false">
+  <input formControlName="complemento" placeholder="Complemento" />
+</s-fieldset>
+```
+
+### Com cabeçalho customizado via template
+
+```html
+<s-fieldset [toggleable]="true">
+  <ng-template sTemplate="header">
+    <div style="display: flex; align-items: center; gap: 8px;">
+      <span style="background: #fee2e2; width: 8px; height: 8px; border-radius: 50%;"></span>
+      <span>Dados Bancários</span>
+      <span style="font-size: 0.75rem; color: #dc2626;">(campos obrigatórios)</span>
+    </div>
+  </ng-template>
+  <input type="text" placeholder="Banco" />
+</s-fieldset>
+```
+
+### Múltiplos fieldsets em um formulário
+
+```html
+<div style="display: flex; flex-direction: column; gap: 16px;">
+  <s-fieldset legend="Dados Pessoais" icon="fas fa-user" [toggleable]="true">
+    <!-- campos -->
+  </s-fieldset>
+  <s-fieldset legend="Endereço" icon="fas fa-map-marker-alt" [toggleable]="true">
+    <!-- campos -->
+  </s-fieldset>
+</div>
+```
+
+## Acessibilidade
+
+- O botão de toggle é ativável por teclado (Enter e Space)
+- A animação de recolher/expandir tem duração de 300ms (respeitando `prefers-reduced-motion` via CSS)
+- O ícone decorativo não possui texto alternativo obrigatório
+
+## Componentes relacionados
+
+- [`Accordion`](../accordion/README.md) — painéis expansíveis onde apenas um pode estar aberto por vez
+- [`DynamicForm`](../dynamic-form/README.md) — usa fieldset internamente para estruturar formulários dinâmicos

package/file-picker/README.md

@@ -0,0 +1,162 @@
+# FilePicker
+
+![Status](https://img.shields.io/badge/status-stable-brightgreen)
+
+Componente de upload de arquivos com suporte a seleção múltipla, validação de tipo e tamanho, controle granular de permissões (adicionar, ler, remover), exibição de progresso e cancelamento de uploads em andamento.
+
+## Quando usar
+
+- Upload de anexos em formulários (documentos, imagens, relatórios)
+- Envio de arquivos em processos ou entidades
+- Exibição de arquivos já salvos com possibilidade de download e remoção
+
+## Quando não usar
+
+- Upload de foto de perfil com recorte — use [`ProfilePicturePicker`](../profile-picture-picker/README.md)
+- O seletor `s-file-upload` e o pacote `file-upload` estão descontinuados (remoção na v20.0.0) — use `s-file-picker`
+
+## Instalação
+
+```typescript
+import { FilePickerModule } from '@seniorsistemas/angular-components/file-picker';
+
+@Component({ standalone: true, imports: [FilePickerModule] })
+export class MeuComponent {}
+```
+
+## Uso básico
+
+```html
+<s-file-picker
+  [files]="arquivos"
+  [multiple]="true"
+  (uploadHandler)="onUpload($event)"
+  (removeFile)="onRemove($event)"
+/>
+```
+
+## API
+
+### Inputs
+
+| Propriedade | Tipo | Padrão | Obrigatório | Descrição |
+|-------------|------|--------|:-----------:|-----------|
+| `files` | `FileDto[]` | — | — | Lista de arquivos já enviados a serem exibidos |
+| `multiple` | `boolean` | — | — | Permite selecionar múltiplos arquivos |
+| `accept` | `string` | — | — | Tipos MIME aceitos pelo seletor nativo (ex: `'application/pdf,image/*'`) |
+| `supportedExtensions` | `string[]` | `[]` | — | Extensões aceitas para validação (ex: `['.pdf', '.docx']`) |
+| `maxFileSize` | `number` | — | — | Tamanho máximo por arquivo em bytes |
+| `maxCombinedFileSize` | `number` | — | — | Tamanho máximo combinado de todos os arquivos em bytes |
+| `fileLimit` | `number` | — | — | Número máximo de arquivos que podem ser selecionados |
+| `permissions` | `FilePickerPermissions[]` | `['add', 'read', 'remove']` | — | Permissões habilitadas no componente |
+| `disabled` | `boolean` | `false` | — | Desabilita todas as interações do componente |
+| `showFileUploadDate` | `boolean` | `false` | — | Exibe a data de upload de cada arquivo |
+| `chooseLabel` | `string` | — | — | Rótulo customizado do botão de seleção |
+| `removeLabel` | `string` | — | — | Rótulo customizado do link de remoção |
+| `cancelLabel` | `string` | — | — | Rótulo customizado do botão de cancelamento |
+| `successTooltip` | `string` | — | — | Texto do tooltip após upload bem-sucedido |
+| `ariaLabelFileName` | `string` | — | — | Label ARIA para o nome do arquivo |
+| `ariaLabelProgress` | `string` | — | — | Label ARIA para a barra de progresso |
+| `ariaLabelSuccess` | `string` | — | — | Label ARIA para o ícone de sucesso |
+| `ariaLabelError` | `string` | — | — | Label ARIA para mensagens de erro |
+| `ariaLabelRemove` | `string` | — | — | Label ARIA para o botão de remoção |
+| `formControl` | `FormControl` | — | — | FormControl externo para controle de estado |
+| `id` | `string` | `s-file-picker-{n}` | — | Identificador único do componente |
+
+### Outputs
+
+| Evento | Tipo | Descrição |
+|--------|------|-----------|
+| `uploadHandler` | `EventEmitter<{ files: FileDto[] }>` | Emitido quando arquivos válidos são selecionados para upload |
+| `removeFile` | `EventEmitter<{ file: File }>` | Emitido quando um arquivo é removido da lista |
+| `cancelUpload` | `EventEmitter<number>` | Emitido ao cancelar um upload em andamento (emite o índice) |
+| `downloadFile` | `EventEmitter<{ index: number; anchor: ElementRef }>` | Emitido ao clicar para baixar um arquivo |
+| `validateErrors` | `EventEmitter<UploadError>` | Emitido quando um arquivo não passa na validação |
+
+### Tipos
+
+```typescript
+type FilePickerPermissions = 'add' | 'read' | 'remove';
+// 'add' = exibe o botão de seleção de arquivo
+// 'read' = exibe o nome do arquivo como link para download
+// 'remove' = exibe o link de remoção
+
+interface FileDto extends File {
+  objectId?: string;        // ID do objeto no servidor
+  version?: string;         // Versão do arquivo
+  objectURL?: string;       // URL para preview/download
+  isUploading?: boolean;    // Se está sendo enviado
+  savedFile?: boolean;      // Se já foi salvo no servidor
+  progress?: number;        // Progresso do upload (0-100)
+  error?: HttpErrorResponse;// Erro de upload, se houver
+}
+
+interface UploadError {
+  files: FileDto[];
+  validation: 'maxFileLimit' | 'maxFileSize' | 'maxCombinedFileSize' | 'unsupportedExtension';
+}
+```
+
+## Exemplos
+
+### Upload básico com múltiplos arquivos
+
+```html
+<s-file-picker
+  [files]="arquivos"
+  [multiple]="true"
+  [fileLimit]="5"
+  [maxFileSize]="5242880"
+  [permissions]="['add', 'read', 'remove']"
+  (uploadHandler)="onUpload($event)"
+  (removeFile)="onRemove($event)"
+  (validateErrors)="onErros($event)"
+></s-file-picker>
+```
+
+```typescript
+arquivos: FileDto[] = [];
+
+onUpload(event: { files: FileDto[] }) {
+  event.files.forEach(f => { f.progress = 100; });
+  this.arquivos = [...this.arquivos, ...event.files];
+}
+
+onRemove(event: { file: FileDto }) {
+  this.arquivos = this.arquivos.filter(f => f !== event.file);
+}
+```
+
+### Somente leitura
+
+```html
+<s-file-picker
+  [files]="arquivos"
+  [permissions]="['read']"
+></s-file-picker>
+```
+
+### Com filtro de extensões
+
+```html
+<s-file-picker
+  [files]="arquivos"
+  accept=".pdf,.docx"
+  [supportedExtensions]="['.pdf', '.docx']"
+  [multiple]="true"
+  [fileLimit]="3"
+  (uploadHandler)="onUpload($event)"
+  (validateErrors)="onErros($event)"
+></s-file-picker>
+```
+
+## Acessibilidade
+
+- O botão de seleção de arquivo ativa o seletor nativo do sistema operacional
+- A barra de progresso possui `aria-label` configurável via `ariaLabelProgress`
+- O nome do arquivo exibido é associado ao `ariaLabelFileName` para leitores de tela
+- Drag and drop é suportado como alternativa ao clique
+
+## Componentes relacionados
+
+- [`ProfilePicturePicker`](../profile-picture-picker/README.md) — upload específico para foto de perfil com recorte

package/file-upload/README.md

@@ -1,17 +1,33 @@
-# File Upload (Descontinuado)
+# FileUpload (Descontinuado)
 
-> ⚠️ **Este pacote está descontinuado e será removido na versão 20.0.0.**
+![Status](https://img.shields.io/badge/status-deprecated-red)
 
-Este pacote é um alias de compatibilidade para o componente `FilePicker`.
+> **Este pacote está descontinuado e será removido na versão 20.0.0.**
+
+Este pacote é um alias de compatibilidade para o componente `FilePicker`. O seletor `s-file-upload` também está descontinuado — use `s-file-picker`.
 
 ## Migração
 
-Use `FilePickerModule` e `FilePickerComponent` de `@seniorsistemas/angular-components/file-picker` em novos projetos.
+Substitua as importações de `file-upload` por `file-picker`:
+
+```typescript
+// Antes (descontinuado)
+import { FileUploadModule } from '@seniorsistemas/angular-components/file-upload';
+
+// Depois (correto)
+import { FilePickerModule } from '@seniorsistemas/angular-components/file-picker';
+```
 
-O seletor `s-file-upload` também está descontinuado — use `s-file-picker`.
+```html
+<!-- Antes (descontinuado) -->
+<s-file-upload [files]="arquivos" (uploadHandler)="onUpload($event)" />
+
+<!-- Depois (correto) -->
+<s-file-picker [files]="arquivos" (uploadHandler)="onUpload($event)" />
+```
 
 ## Documentação
 
 Consulte a documentação completa do componente em:
-- **Storybook**: `Components/Base Components/File Picker`
-- **Pacote**: `@seniorsistemas/angular-components/file-picker`
+
+- [`FilePicker`](../file-picker/README.md) — documentação do componente substituto

package/gantt/README.md

@@ -0,0 +1,173 @@
+# Gantt
+
+![Status](https://img.shields.io/badge/status-stable-brightgreen)
+
+Componente de diagrama de Gantt para visualização e gerenciamento de tarefas em linha do tempo. Suporta múltiplos modos de visualização (hora, dia, semana, mês, ano), movimentação de tarefas via drag-and-drop, dependências entre tarefas e popup de detalhes ao clicar.
+
+## Quando usar
+
+- Planejamento e acompanhamento de cronogramas de projetos
+- Visualização de tarefas com dependências e datas de início/fim
+- Roadmaps de produto ou planejamento estratégico
+
+## Quando não usar
+
+- Listas simples de tarefas sem contexto temporal — use uma tabela ou lista
+- Gerenciamento de tarefas sem dimensão de data — use um Kanban
+
+## Instalação
+
+```typescript
+import { GanttModule } from '@seniorsistemas/angular-components/gantt';
+
+@Component({ standalone: true, imports: [GanttModule] })
+export class MeuComponent {}
+```
+
+## Uso básico
+
+```html
+<s-gantt
+  [tasks]="gruposDeTarefas"
+  [viewMode]="viewMode"
+  (taskClicked)="onTaskClicada($event)"
+/>
+```
+
+## API
+
+### Inputs
+
+| Propriedade | Tipo | Padrão | Obrigatório | Descrição |
+|-------------|------|--------|:-----------:|-----------|
+| `tasks` | `TaskGroup[]` | — | Sim | Lista de grupos de tarefas a serem renderizados |
+| `viewMode` | `ViewMode` | `ViewMode.Day` | — | Modo de visualização do gantt |
+| `columnTitle` | `string` | — | — | Título da coluna lateral de identificação das tarefas |
+| `showSideTable` | `boolean` | `true` | — | Exibe a tabela lateral com os nomes das tarefas |
+| `multipleTaskPerLine` | `boolean` | `false` | — | Permite renderizar múltiplas tarefas na mesma linha |
+| `allowMovement` | `boolean` | `true` | — | Habilita o arrastar de tarefas para alterar datas |
+| `hasPopup` | `boolean` | `true` | — | Exibe popup com detalhes ao clicar em uma tarefa |
+| `fullWidth` | `boolean` | `false` | — | Faz o gantt ocupar 100% da largura disponível |
+| `containerWidth` | `number` | — | — | Largura do container em pixels |
+| `marginBeforeStart` | `number` | — | — | Margem em dias antes do início da primeira tarefa |
+| `marginAfterEnd` | `number` | — | — | Margem em dias após o fim da última tarefa |
+| `showOnlyHours` | `boolean` | `false` | — | Exibe apenas horas na linha do tempo |
+| `showOnlyDays` | `boolean` | `false` | — | Exibe apenas dias na linha do tempo |
+
+### Outputs
+
+| Evento | Tipo | Descrição |
+|--------|------|-----------|
+| `taskClicked` | `EventEmitter<Task>` | Emitido quando o usuário clica em uma tarefa |
+| `taskDateChanged` | `EventEmitter<{ task: Task; start: Date; end: Date }>` | Emitido quando as datas de uma tarefa são alteradas por drag |
+| `viewChanged` | `EventEmitter<ViewMode>` | Emitido quando o modo de visualização é alterado |
+
+### Tipos
+
+```typescript
+enum ViewMode {
+  QuarterHour = 'quarterHour',
+  Hour = 'hour',
+  QuarterDay = 'quarterDay',
+  HalfDay = 'halfDay',
+  Day = 'day',
+  Week = 'week',
+  Month = 'month',
+  Year = 'year',
+}
+
+interface Task {
+  id: string;
+  name: string;
+  start: Date;
+  end: Date;             // Deve ser maior que start
+  showTaskName?: boolean;
+  dependencies?: string[]; // IDs de tarefas das quais esta depende
+  color?: string;        // Cor customizada (ex: '#3b82f6')
+  custom_class?: string; // Classe CSS customizada
+}
+
+interface TaskGroup {
+  id: string;
+  title: string;
+  subtitle: string;
+  tasks: Task[];
+}
+```
+
+## Exemplos
+
+### Visualização diária com grupos
+
+```typescript
+const tasks: TaskGroup[] = [
+  {
+    id: 'grupo1',
+    title: 'Desenvolvimento',
+    subtitle: 'Sprint 1',
+    tasks: [
+      {
+        id: 'tarefa1',
+        name: 'Planejamento',
+        start: new Date('2025-06-01'),
+        end: new Date('2025-06-03'),
+        showTaskName: true,
+      },
+      {
+        id: 'tarefa2',
+        name: 'Implementação',
+        start: new Date('2025-06-03'),
+        end: new Date('2025-06-10'),
+        dependencies: ['tarefa1'],
+        color: '#3b82f6',
+        showTaskName: true,
+      },
+    ],
+  },
+];
+```
+
+```html
+<s-gantt
+  [tasks]="tasks"
+  viewMode="day"
+  columnTitle="Equipes"
+  [showSideTable]="true"
+  [allowMovement]="true"
+  [hasPopup]="true"
+  (taskClicked)="onTaskClick($event)"
+  (taskDateChanged)="onDateChange($event)"
+></s-gantt>
+```
+
+### Somente visualização (sem movimentação)
+
+```html
+<s-gantt
+  [tasks]="tasks"
+  viewMode="month"
+  [allowMovement]="false"
+  [hasPopup]="true"
+  columnTitle="Cronograma Aprovado"
+></s-gantt>
+```
+
+### Largura total
+
+```html
+<s-gantt
+  [tasks]="tasks"
+  viewMode="week"
+  [fullWidth]="true"
+></s-gantt>
+```
+
+## Acessibilidade
+
+- O gantt é renderizado via SVG e não possui suporte nativo a teclado para navegação entre tarefas
+- Para acessibilidade plena, forneça uma representação alternativa (tabela) quando necessário
+- Os popups de detalhes aparecem ao clicar/focar nas barras de tarefa
+
+## Componentes relacionados
+
+- [`DynamicForm`](../dynamic-form/README.md) — para edição de dados de tarefas em formulários