@ramonbsales/noah-angular 1.0.0

package/fesm2022/ramonbsales-noah-angular.mjs

@@ -0,0 +1,2188 @@
+import * as i0 from '@angular/core';
+import { Injectable, Component, EventEmitter, forwardRef, Output, Input, inject, HostListener, InjectionToken, Optional, Inject } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i3 from '@angular/forms';
+import { ReactiveFormsModule, NG_VALUE_ACCESSOR, NgControl, FormBuilder, Validators } from '@angular/forms';
+import * as i1$1 from '@angular/router';
+import { RouterModule, Router } from '@angular/router';
+import { Subject, BehaviorSubject, Observable, from, throwError } from 'rxjs';
+import { map, takeUntil, switchMap, catchError } from 'rxjs/operators';
+
+class SharedComponentsService {
+    constructor() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SharedComponentsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SharedComponentsService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SharedComponentsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+class SharedComponentsComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SharedComponentsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: SharedComponentsComponent, isStandalone: true, selector: "lib-shared-components", ngImport: i0, template: `
+    <p>
+      shared-components works!
+    </p>
+  `, isInline: true, styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SharedComponentsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-shared-components', imports: [], template: `
+    <p>
+      shared-components works!
+    </p>
+  ` }]
+        }] });
+
+class DropdownComponent {
+    label = 'Nome do campo';
+    placeholder = 'Selecione uma opção';
+    options = [];
+    disabled = false;
+    required = false;
+    errorMessage = 'Campo obrigatório';
+    selectedOption = null;
+    hideLabel = false;
+    valueChange = new EventEmitter();
+    internalValue = null;
+    isOpen = false;
+    // ControlValueAccessor implementation
+    onChange = (value) => { };
+    onTouched = () => { };
+    constructor() { }
+    ngOnInit() {
+        // Se selectedOption foi passado como Input, use-o como valor inicial
+        if (this.selectedOption !== null && this.selectedOption !== undefined) {
+            this.internalValue = this.selectedOption;
+        }
+    }
+    ngOnChanges(changes) {
+        // Detecta mudanças no selectedOption Input
+        if (changes['selectedOption'] && !changes['selectedOption'].firstChange) {
+            const newValue = changes['selectedOption'].currentValue;
+            if (newValue !== this.internalValue) {
+                this.internalValue = newValue;
+            }
+        }
+    }
+    selectOption(option) {
+        this.internalValue = option.value;
+        this.isOpen = false;
+        this.onChange(option.value);
+        this.onTouched();
+        this.valueChange.emit(option.value);
+    }
+    toggleDropdown() {
+        if (!this.disabled) {
+            this.isOpen = !this.isOpen;
+            if (this.isOpen) {
+                this.onTouched();
+            }
+        }
+    }
+    getSelectedLabel() {
+        if (this.internalValue !== null && this.internalValue !== undefined) {
+            const option = this.options.find(opt => opt.value === this.internalValue);
+            return option ? option.label : '';
+        }
+        return this.placeholder;
+    }
+    hasValue() {
+        return this.internalValue !== null && this.internalValue !== undefined;
+    }
+    // ControlValueAccessor methods
+    writeValue(value) {
+        this.internalValue = value;
+        this.valueChange.emit(value);
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: DropdownComponent, isStandalone: true, selector: "lib-dropdown", inputs: { label: "label", placeholder: "placeholder", options: "options", disabled: "disabled", required: "required", errorMessage: "errorMessage", selectedOption: "selectedOption", hideLabel: "hideLabel" }, outputs: { valueChange: "valueChange" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => DropdownComponent),
+                multi: true
+            }
+        ], usesOnChanges: true, ngImport: i0, template: "<label *ngIf=\"!hideLabel\" for=\"\">{{label}}</label>\n<div class=\"dropdown\" tabindex=\"0\" (blur)=\"isOpen = false\">\n    <button class=\"btn btn-light w-100 text-start d-flex justify-content-between align-items-center\" type=\"button\"\n        (click)=\"toggleDropdown()\" [attr.aria-expanded]=\"isOpen\" [disabled]=\"disabled\">\n        <span class=\"select-option-text\" *ngIf=\"hasValue()\">{{ getSelectedLabel() }}</span>\n        <span class=\"placeholder-text\" *ngIf=\"!hasValue()\">{{ getSelectedLabel() }}</span>\n        <span class=\"material-icons\">\n            unfold_more\n        </span>\n    </button>\n    <ul class=\"dropdown-menu w-100 show\" *ngIf=\"isOpen\">\n        <li *ngFor=\"let option of options\">\n            <a class=\"dropdown-item\" (click)=\"selectOption(option)\">{{ option.label }}</a>\n        </li>\n    </ul>\n</div>", styles: ["label{font-family:DM Sans,sans-serif;font-weight:600;font-size:.875rem;line-height:2.5}.dropdown{font-family:DM Sans,sans-serif}.btn{font-family:DM Sans,sans-serif;font-weight:500;font-size:.875rem;border:1px solid #dee2e6;background-color:#fff}.btn .select-option-text{color:#343a40}.btn .placeholder-text{color:#6c757d}.btn .material-icons{font-size:.875rem}.dropdown-item{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-dropdown', imports: [CommonModule, ReactiveFormsModule], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => DropdownComponent),
+                            multi: true
+                        }
+                    ], template: "<label *ngIf=\"!hideLabel\" for=\"\">{{label}}</label>\n<div class=\"dropdown\" tabindex=\"0\" (blur)=\"isOpen = false\">\n    <button class=\"btn btn-light w-100 text-start d-flex justify-content-between align-items-center\" type=\"button\"\n        (click)=\"toggleDropdown()\" [attr.aria-expanded]=\"isOpen\" [disabled]=\"disabled\">\n        <span class=\"select-option-text\" *ngIf=\"hasValue()\">{{ getSelectedLabel() }}</span>\n        <span class=\"placeholder-text\" *ngIf=\"!hasValue()\">{{ getSelectedLabel() }}</span>\n        <span class=\"material-icons\">\n            unfold_more\n        </span>\n    </button>\n    <ul class=\"dropdown-menu w-100 show\" *ngIf=\"isOpen\">\n        <li *ngFor=\"let option of options\">\n            <a class=\"dropdown-item\" (click)=\"selectOption(option)\">{{ option.label }}</a>\n        </li>\n    </ul>\n</div>", styles: ["label{font-family:DM Sans,sans-serif;font-weight:600;font-size:.875rem;line-height:2.5}.dropdown{font-family:DM Sans,sans-serif}.btn{font-family:DM Sans,sans-serif;font-weight:500;font-size:.875rem;border:1px solid #dee2e6;background-color:#fff}.btn .select-option-text{color:#343a40}.btn .placeholder-text{color:#6c757d}.btn .material-icons{font-size:.875rem}.dropdown-item{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem;cursor:pointer}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { label: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], errorMessage: [{
+                type: Input
+            }], selectedOption: [{
+                type: Input
+            }], hideLabel: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }] } });
+
+class InputComponent {
+    injector;
+    label = 'Nome do campo';
+    placeholder = 'Digite aqui...';
+    type = 'text';
+    customErrorMessages = {};
+    // Detects if the field is required based on FormControl validator
+    get isRequired() {
+        if (this.control?.control?.validator) {
+            const validator = this.control.control.validator({});
+            return !!(validator && validator['required']);
+        }
+        return false;
+    }
+    // Detects if the field is disabled
+    get isDisabled() {
+        return (this.control?.control?.disabled ?? false);
+    }
+    value = '';
+    isFocused = false;
+    control;
+    // ControlValueAccessor implementation
+    onChange = (value) => { };
+    onTouched = () => { };
+    // Mapeamento padrão de mensagens de erro
+    defaultErrorMessages = {
+        required: 'Campo obrigatório',
+        email: 'Email inválido',
+        minlength: 'Muito curto',
+        maxlength: 'Muito longo',
+        min: 'Valor muito baixo',
+        max: 'Valor muito alto',
+        pattern: 'Formato inválido'
+    };
+    constructor(injector) {
+        this.injector = injector;
+    }
+    ngOnInit() {
+        // Injeta o NgControl para acessar os erros do FormControl
+        this.control = this.injector.get(NgControl, null) || undefined;
+    }
+    onFocus() {
+        this.isFocused = true;
+        this.onTouched();
+    }
+    onBlur() {
+        this.isFocused = false;
+    }
+    onInput(event) {
+        const target = event.target;
+        let newValue = target.value;
+        // Conversão de tipos
+        if (this.type === 'number') {
+            newValue = newValue === '' ? null : Number(newValue);
+        }
+        this.value = newValue;
+        this.onChange(newValue);
+    }
+    // Verifica se deve mostrar erro
+    get showError() {
+        return !!(this.control?.invalid && (this.control?.dirty || this.control?.touched));
+    }
+    get showRequiredAsterisk() {
+        return !!this.isRequired && !!this.control?.invalid;
+    }
+    // Obtém a mensagem de erro do FormControl
+    get errorMessage() {
+        if (!this.control?.errors) {
+            return '';
+        }
+        const errors = this.control.errors;
+        // Primeiro verifica se há mensagem customizada
+        for (const errorKey in errors) {
+            if (this.customErrorMessages[errorKey]) {
+                const errorValue = errors[errorKey];
+                return this.interpolateErrorMessage(this.customErrorMessages[errorKey], errorValue);
+            }
+        }
+        // Depois verifica mensagens padrão
+        for (const errorKey in errors) {
+            if (this.defaultErrorMessages[errorKey]) {
+                const errorValue = errors[errorKey];
+                return this.interpolateErrorMessage(this.defaultErrorMessages[errorKey], errorValue);
+            }
+        }
+        // Retorna erro genérico se não encontrar mensagem específica
+        return 'Campo inválido';
+    }
+    // Interpola valores dinâmicos na mensagem de erro
+    interpolateErrorMessage(message, errorValue) {
+        if (typeof errorValue === 'object') {
+            // Para erros como minlength, maxlength, min, max
+            if (errorValue.requiredLength) {
+                message = message.replace('{{requiredLength}}', errorValue.requiredLength);
+                message = message.replace('{{actualLength}}', errorValue.actualLength);
+            }
+            if (errorValue.min !== undefined) {
+                message = message.replace('{{min}}', errorValue.min);
+                message = message.replace('{{actual}}', errorValue.actual);
+            }
+            if (errorValue.max !== undefined) {
+                message = message.replace('{{max}}', errorValue.max);
+                message = message.replace('{{actual}}', errorValue.actual);
+            }
+        }
+        return message;
+    }
+    validateField() {
+        // Removido - agora usa a validação do FormControl
+    }
+    hasValue() {
+        return this.value !== null && this.value !== undefined && this.value !== '';
+    }
+    // ControlValueAccessor methods
+    writeValue(value) {
+        this.value = value;
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: InputComponent, isStandalone: true, selector: "lib-input", inputs: { label: "label", placeholder: "placeholder", type: "type", customErrorMessages: "customErrorMessages" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => InputComponent),
+                multi: true
+            }
+        ], ngImport: i0, template: "<div class=\"form-group\">\n\n  <label>{{ label }}\n    <span class=\"required-asterisk\" *ngIf=\"showRequiredAsterisk\">*</span>\n  </label>\n\n  <div class=\"input-container\" [class.focused]=\"isFocused\" [class.has-value]=\"hasValue()\" [class.disabled]=\"isDisabled\"\n    [class.error]=\"showError\">\n\n    <input [type]=\"type\" [placeholder]=\"placeholder\" [value]=\"value || ''\" [disabled]=\"isDisabled\"\n      [required]=\"isRequired\" (input)=\"onInput($event)\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\n      [ngClass]=\"{'error': showError}\" />\n  </div>\n\n  <small class=\"form-text error\" *ngIf=\"showError\">\n    {{ errorMessage }}\n  </small>\n\n</div>", styles: ["label{font-family:DM Sans,sans-serif;font-weight:600;font-size:.875rem;line-height:2.5}.required-asterisk{color:#dc3545;margin-left:.25rem}.input-container{font-family:DM Sans,sans-serif}input{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem;border:1px solid #dee2e6;border-radius:.25rem;display:block;width:100%;padding:.375rem .75rem;line-height:1.5;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-clip:padding-box;outline:none}input::placeholder{color:#6c757d}input:focus{border-color:#b2b9be;box-shadow:none}input:focus.error{border-color:#dc3545}small.error{color:#dc3545}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-input', imports: [CommonModule, ReactiveFormsModule], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => InputComponent),
+                            multi: true
+                        }
+                    ], template: "<div class=\"form-group\">\n\n  <label>{{ label }}\n    <span class=\"required-asterisk\" *ngIf=\"showRequiredAsterisk\">*</span>\n  </label>\n\n  <div class=\"input-container\" [class.focused]=\"isFocused\" [class.has-value]=\"hasValue()\" [class.disabled]=\"isDisabled\"\n    [class.error]=\"showError\">\n\n    <input [type]=\"type\" [placeholder]=\"placeholder\" [value]=\"value || ''\" [disabled]=\"isDisabled\"\n      [required]=\"isRequired\" (input)=\"onInput($event)\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\n      [ngClass]=\"{'error': showError}\" />\n  </div>\n\n  <small class=\"form-text error\" *ngIf=\"showError\">\n    {{ errorMessage }}\n  </small>\n\n</div>", styles: ["label{font-family:DM Sans,sans-serif;font-weight:600;font-size:.875rem;line-height:2.5}.required-asterisk{color:#dc3545;margin-left:.25rem}.input-container{font-family:DM Sans,sans-serif}input{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem;border:1px solid #dee2e6;border-radius:.25rem;display:block;width:100%;padding:.375rem .75rem;line-height:1.5;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-clip:padding-box;outline:none}input::placeholder{color:#6c757d}input:focus{border-color:#b2b9be;box-shadow:none}input:focus.error{border-color:#dc3545}small.error{color:#dc3545}\n"] }]
+        }], ctorParameters: () => [{ type: i0.Injector }], propDecorators: { label: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], customErrorMessages: [{
+                type: Input
+            }] } });
+
+class ButtonComponent {
+    title = 'Salvar informação';
+    backgroundColor = '#007bff';
+    color = '#fff';
+    borderColor = '#007bff';
+    minWidth = '8rem';
+    disabled = false;
+    loading = false;
+    loadingText = 'Carregando...';
+    onClickEvent = new EventEmitter();
+    onClick() {
+        if (!this.loading && !this.disabled) {
+            this.onClickEvent.emit();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ButtonComponent, isStandalone: true, selector: "lib-button", inputs: { title: "title", backgroundColor: "backgroundColor", color: "color", borderColor: "borderColor", minWidth: "minWidth", disabled: "disabled", loading: "loading", loadingText: "loadingText" }, outputs: { onClickEvent: "onClickEvent" }, ngImport: i0, template: "<button type=\"button\" class=\"btn\" [style.background-color]=\"backgroundColor\" [style.color]=\"color\"\n    [style.border-color]=\"borderColor\" [style.min-width]=\"minWidth\" [disabled]=\"disabled || loading\"\n    (click)=\"onClick()\">\n    <span *ngIf=\"loading\" class=\"spinner-border spinner-border-sm me-2\" role=\"status\" aria-hidden=\"true\"></span>\n    <span *ngIf=\"!loading\">{{title}}</span>\n    <span *ngIf=\"loading\">{{loadingText}}</span>\n</button>", styles: ["span{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-button', imports: [CommonModule], template: "<button type=\"button\" class=\"btn\" [style.background-color]=\"backgroundColor\" [style.color]=\"color\"\n    [style.border-color]=\"borderColor\" [style.min-width]=\"minWidth\" [disabled]=\"disabled || loading\"\n    (click)=\"onClick()\">\n    <span *ngIf=\"loading\" class=\"spinner-border spinner-border-sm me-2\" role=\"status\" aria-hidden=\"true\"></span>\n    <span *ngIf=\"!loading\">{{title}}</span>\n    <span *ngIf=\"loading\">{{loadingText}}</span>\n</button>", styles: ["span{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}\n"] }]
+        }], propDecorators: { title: [{
+                type: Input
+            }], backgroundColor: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], borderColor: [{
+                type: Input
+            }], minWidth: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], loading: [{
+                type: Input
+            }], loadingText: [{
+                type: Input
+            }], onClickEvent: [{
+                type: Output
+            }] } });
+
+class CheckboxComponent {
+    /** Array de opções: [{ label: string, value: any }] */
+    options = [];
+    /** Se true, permite múltipla seleção */
+    multiple = false;
+    /** FormControl do Reactive Forms */
+    control;
+    /** Emite valor selecionado ao pai (opcional) */
+    selectedChange = new EventEmitter();
+    get disabled() {
+        return !!this.control?.disabled;
+    }
+    get selected() {
+        return this.control?.value;
+    }
+    isChecked(value) {
+        if (this.multiple) {
+            return Array.isArray(this.selected) && this.selected.includes(value);
+        }
+        return this.selected === value;
+    }
+    onOptionChange(event, value) {
+        if (this.disabled)
+            return;
+        if (this.multiple) {
+            const checked = event.target.checked;
+            let newSelected = Array.isArray(this.selected) ? [...this.selected] : [];
+            if (checked) {
+                if (!newSelected.includes(value))
+                    newSelected.push(value);
+            }
+            else {
+                newSelected = newSelected.filter(v => v !== value);
+            }
+            this.control?.setValue(newSelected);
+            this.control?.markAsDirty();
+            this.selectedChange.emit(newSelected);
+        }
+        else {
+            this.control?.setValue(value);
+            this.control?.markAsDirty();
+            this.selectedChange.emit(value);
+        }
+    }
+    get showError() {
+        return !!this.control && this.control.invalid && (this.control.dirty || this.control.touched);
+    }
+    get errorMessage() {
+        if (!this.control || !this.control.errors)
+            return null;
+        if (this.control.errors['required'])
+            return 'Seleção obrigatória.';
+        // Adicione outras mensagens customizadas conforme necessário
+        return 'Valor inválido.';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CheckboxComponent, isStandalone: true, selector: "lib-checkbox", inputs: { options: "options", multiple: "multiple", control: "control" }, outputs: { selectedChange: "selectedChange" }, ngImport: i0, template: "<div *ngFor=\"let option of options; let i = index\"\n    style=\"display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.25rem;\">\n\n    <input class=\"form-check-input\" [type]=\"multiple ? 'checkbox' : 'radio'\"\n        [name]=\"multiple ? 'checkbox-group' : 'radio-group'\" [value]=\"option.value\" [checked]=\"isChecked(option.value)\"\n        [disabled]=\"disabled\" (change)=\"onOptionChange($event, option.value)\" />\n    <span>{{ option.label }}</span>\n</div>\n<div *ngIf=\"showError\" class=\"text-danger small mt-1\">\n    {{ errorMessage }}\n</div>", styles: ["input{cursor:pointer;margin-top:0}.form-check-input:checked{background-color:#414141;border-color:#414141}.form-check-input:focus{border-color:#b2b9be;outline:0;box-shadow:0 0 0 .25rem #04112440}span{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-checkbox', imports: [CommonModule, ReactiveFormsModule], template: "<div *ngFor=\"let option of options; let i = index\"\n    style=\"display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.25rem;\">\n\n    <input class=\"form-check-input\" [type]=\"multiple ? 'checkbox' : 'radio'\"\n        [name]=\"multiple ? 'checkbox-group' : 'radio-group'\" [value]=\"option.value\" [checked]=\"isChecked(option.value)\"\n        [disabled]=\"disabled\" (change)=\"onOptionChange($event, option.value)\" />\n    <span>{{ option.label }}</span>\n</div>\n<div *ngIf=\"showError\" class=\"text-danger small mt-1\">\n    {{ errorMessage }}\n</div>", styles: ["input{cursor:pointer;margin-top:0}.form-check-input:checked{background-color:#414141;border-color:#414141}.form-check-input:focus{border-color:#b2b9be;outline:0;box-shadow:0 0 0 .25rem #04112440}span{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}\n"] }]
+        }], propDecorators: { options: [{
+                type: Input
+            }], multiple: [{
+                type: Input
+            }], control: [{
+                type: Input
+            }], selectedChange: [{
+                type: Output
+            }] } });
+
+class ToggleComponent {
+    title = '';
+    enableTitle = false;
+    value = false;
+    onChange = (value) => { };
+    onTouched = () => { };
+    writeValue(value) {
+        this.value = value;
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    toggle() {
+        this.value = !this.value;
+        this.onChange(this.value);
+        this.onTouched();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ToggleComponent, isStandalone: true, selector: "lib-toggle", inputs: { title: "title", enableTitle: "enableTitle" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ToggleComponent),
+                multi: true
+            }
+        ], ngImport: i0, template: "<div class=\"form-check form-switch centered-toggle\">\n    <div>\n        <input class=\"form-check-input\" type=\"checkbox\" [checked]=\"value\" (change)=\"toggle()\" />\n    </div>\n    <span *ngIf=\"enableTitle\">{{ title }}</span>\n</div>", styles: [".centered-toggle{display:flex;align-items:anchor-center}input{cursor:pointer;margin-top:0}.form-check-input:checked{background-color:#414141;border-color:#414141}.form-check-input:focus{border-color:#b2b9be;outline:0;box-shadow:0 0 0 .25rem #04112440}span{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ToggleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-toggle', imports: [CommonModule], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ToggleComponent),
+                            multi: true
+                        }
+                    ], template: "<div class=\"form-check form-switch centered-toggle\">\n    <div>\n        <input class=\"form-check-input\" type=\"checkbox\" [checked]=\"value\" (change)=\"toggle()\" />\n    </div>\n    <span *ngIf=\"enableTitle\">{{ title }}</span>\n</div>", styles: [".centered-toggle{display:flex;align-items:anchor-center}input{cursor:pointer;margin-top:0}.form-check-input:checked{background-color:#414141;border-color:#414141}.form-check-input:focus{border-color:#b2b9be;outline:0;box-shadow:0 0 0 .25rem #04112440}span{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}\n"] }]
+        }], propDecorators: { title: [{
+                type: Input
+            }], enableTitle: [{
+                type: Input
+            }] } });
+
+class BreadcrumbComponent {
+    items = [];
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: BreadcrumbComponent, isStandalone: true, selector: "lib-breadcrumb", inputs: { items: "items" }, ngImport: i0, template: "<nav class=\"breadcrumb\">\n    <ol class=\"breadcrumb-list\">\n        <li class=\"breadcrumb-item\" *ngFor=\"let item of items; let last = last\">\n            <a *ngIf=\"!last\" [routerLink]=\"item.url\">{{ item.label }}</a>\n            <span *ngIf=\"last\">{{ item.label }}</span>\n        </li>\n    </ol>\n</nav>", styles: [".breadcrumb{font-family:DM Sans,sans-serif;background:none;padding:.5rem 0;margin-bottom:1rem}.breadcrumb-list{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0}.breadcrumb-item{display:flex;align-items:center;font-size:.875rem;color:#495057;font-weight:500}.breadcrumb-item a{color:#414141;text-decoration:none;padding:.25rem .5rem;border-radius:4px;transition:background .2s,color .2s}.breadcrumb-item a:hover{background:#dee2e6;color:#343a40;text-decoration:underline}.breadcrumb-separator{margin:0 .25rem;color:#b2b9be;font-size:1rem}.breadcrumb-item:last-child{color:#6c757d;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BreadcrumbComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-breadcrumb', imports: [RouterModule, CommonModule], template: "<nav class=\"breadcrumb\">\n    <ol class=\"breadcrumb-list\">\n        <li class=\"breadcrumb-item\" *ngFor=\"let item of items; let last = last\">\n            <a *ngIf=\"!last\" [routerLink]=\"item.url\">{{ item.label }}</a>\n            <span *ngIf=\"last\">{{ item.label }}</span>\n        </li>\n    </ol>\n</nav>", styles: [".breadcrumb{font-family:DM Sans,sans-serif;background:none;padding:.5rem 0;margin-bottom:1rem}.breadcrumb-list{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0}.breadcrumb-item{display:flex;align-items:center;font-size:.875rem;color:#495057;font-weight:500}.breadcrumb-item a{color:#414141;text-decoration:none;padding:.25rem .5rem;border-radius:4px;transition:background .2s,color .2s}.breadcrumb-item a:hover{background:#dee2e6;color:#343a40;text-decoration:underline}.breadcrumb-separator{margin:0 .25rem;color:#b2b9be;font-size:1rem}.breadcrumb-item:last-child{color:#6c757d;font-weight:400}\n"] }]
+        }], propDecorators: { items: [{
+                type: Input
+            }] } });
+
+class TableComponent {
+    columns = [];
+    data = [];
+    columnTypes = {};
+    page = 1;
+    pageSize = 10;
+    totalItems = 0;
+    pageSizeOptions = [
+        { value: 5, label: '5' },
+        { value: 10, label: '10' },
+        { value: 20, label: '20' },
+        { value: 50, label: '50' }
+    ];
+    pageChange = new EventEmitter();
+    pageSizeChange = new EventEmitter();
+    get hasActions() {
+        return this.columns.some(c => !!c.actions && c.actions.length > 0);
+    }
+    get actionsList() {
+        const col = this.columns.find((c) => !!c.actions && c.actions.length > 0);
+        return col?.actions || [];
+    }
+    onPageSizeChange(newSize) {
+        this.pageSizeChange.emit(newSize);
+    }
+    // Paginação
+    get totalPages() {
+        return Math.max(1, Math.ceil(this.totalItems / this.pageSize));
+    }
+    get currentPage() {
+        return this.page;
+    }
+    goToPage(page) {
+        if (page < 1 || page > this.totalPages || page === this.currentPage)
+            return;
+        this.pageChange.emit(page);
+    }
+    getPages() {
+        const pages = [];
+        const total = this.totalPages;
+        const current = this.currentPage;
+        if (total <= 8) {
+            for (let i = 1; i <= total; i++)
+                pages.push(i);
+        }
+        else {
+            if (current <= 4) {
+                for (let i = 1; i <= 5; i++)
+                    pages.push(i);
+                pages.push('...');
+                pages.push(total - 1, total);
+            }
+            else if (current >= total - 3) {
+                pages.push(1, 2);
+                pages.push('...');
+                for (let i = total - 4; i <= total; i++)
+                    pages.push(i);
+            }
+            else {
+                pages.push(1, 2);
+                pages.push('...');
+                for (let i = current - 1; i <= current + 1; i++)
+                    pages.push(i);
+                pages.push('...');
+                pages.push(total - 1, total);
+            }
+        }
+        return pages;
+    }
+    toNumber(val) {
+        return typeof val === 'number' ? val : parseInt(val, 10);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TableComponent, isStandalone: true, selector: "lib-table", inputs: { columns: "columns", data: "data", columnTypes: "columnTypes", page: "page", pageSize: "pageSize", totalItems: "totalItems", pageSizeOptions: "pageSizeOptions" }, outputs: { pageChange: "pageChange", pageSizeChange: "pageSizeChange" }, ngImport: i0, template: "<table class=\"table\">\n    <thead class=\"table-light\">\n        <tr>\n            <ng-container *ngFor=\"let col of columns\">\n                <th [style.width]=\"col.width || null\">\n                    {{ col.title }}\n                </th>\n            </ng-container>\n        </tr>\n    </thead>\n    <tbody>\n        <tr *ngFor=\"let row of data\">\n            <ng-container *ngFor=\"let col of columns\">\n                <td class=\"align-middle\">\n                    <ng-container *ngIf=\"!col.actions\" [ngSwitch]=\"columnTypes[col.prop]\">\n                        <ng-container *ngSwitchCase=\"'date'\">{{ row[col.prop] | date:'dd/MM/yyyy' }}</ng-container>\n                        <ng-container *ngSwitchCase=\"'time'\">{{ row[col.prop] | date:'HH:mm' }}</ng-container>\n                        <ng-container *ngSwitchCase=\"'tag'\">\n                            <span class=\"badge rounded-pill\" [ngClass]=\"row[col.prop + 'Class'] || 'text-bg-dark'\">{{\n                                row[col.prop] }}</span>\n                        </ng-container>\n                        <ng-container *ngSwitchDefault>{{ row[col.prop] }}</ng-container>\n                    </ng-container>\n                    <ng-container *ngIf=\"col.actions\">\n                        <div class=\"dropdown\">\n                            <button class=\"btn btn-light btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\"\n                                aria-expanded=\"false\">\n                                <i class=\"material-icons align-middle\">more_horiz</i>\n                            </button>\n                            <ul class=\"dropdown-menu\">\n                                <li *ngFor=\"let action of col.actions\">\n                                    <a class=\"dropdown-item\" href=\"#\"\n                                        (click)=\"action.callback(row); $event.preventDefault()\">\n                                        <i *ngIf=\"action.icon\" class=\"material-icons align-middle me-2\">{{ action.icon\n                                            }}</i>\n                                        {{ action.title }}\n                                    </a>\n                                </li>\n                            </ul>\n                        </div>\n                    </ng-container>\n                </td>\n            </ng-container>\n        </tr>\n    </tbody>\n</table>\n\n<!-- Paginator -->\n<nav aria-label=\"Tabela pagina\u00E7\u00E3o\" class=\"d-flex justify-content-between mt-3\">\n    <lib-dropdown [options]=\"pageSizeOptions\" placeholder=\"Tamanho da p\u00E1gina\" [selectedOption]=\"pageSize\"\n        [hideLabel]=\"true\" (valueChange)=\"onPageSizeChange($event)\"></lib-dropdown>\n\n    <ul *ngIf=\"totalPages > 1\" class=\"pagination pagination-sm\">\n        <li class=\"page-item\" [class.disabled]=\"currentPage === 1\">\n            <button class=\"page-link\" (click)=\"goToPage(currentPage - 1)\" [disabled]=\"currentPage === 1\">\n                <i class=\"material-icons align-middle\">chevron_left</i>\n            </button>\n        </li>\n        <ng-container *ngFor=\"let page of getPages()\">\n            <li class=\"page-item\" *ngIf=\"page !== '...'\" [class.active]=\"page === currentPage\">\n                <button class=\"page-link\" (click)=\"goToPage(toNumber(page))\" [disabled]=\"page === currentPage\">{{ page\n                    }}</button>\n            </li>\n            <li class=\"page-item disabled\" *ngIf=\"page === '...'\"><span class=\"page-link\">...</span></li>\n        </ng-container>\n        <li class=\"page-item\" [class.disabled]=\"currentPage === totalPages\">\n            <button class=\"page-link\" (click)=\"goToPage(currentPage + 1)\" [disabled]=\"currentPage === totalPages\">\n                <i class=\"material-icons align-middle\">chevron_right</i>\n            </button>\n        </li>\n    </ul>\n</nav>", styles: ["thead{border-top:1px solid #c6c7c8}thead th{font-family:DM Sans,sans-serif;font-weight:600;font-size:.875rem}tbody th,tbody td,tbody .dropdown-menu{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}.pagination i{font-size:20px}.pagination .page-item .page-link{color:#414141;background-color:#fff}.pagination .page-item.active .page-link{color:#fff;background-color:#414141;border-color:#414141}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "component", type: DropdownComponent, selector: "lib-dropdown", inputs: ["label", "placeholder", "options", "disabled", "required", "errorMessage", "selectedOption", "hideLabel"], outputs: ["valueChange"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-table', imports: [CommonModule, DropdownComponent], template: "<table class=\"table\">\n    <thead class=\"table-light\">\n        <tr>\n            <ng-container *ngFor=\"let col of columns\">\n                <th [style.width]=\"col.width || null\">\n                    {{ col.title }}\n                </th>\n            </ng-container>\n        </tr>\n    </thead>\n    <tbody>\n        <tr *ngFor=\"let row of data\">\n            <ng-container *ngFor=\"let col of columns\">\n                <td class=\"align-middle\">\n                    <ng-container *ngIf=\"!col.actions\" [ngSwitch]=\"columnTypes[col.prop]\">\n                        <ng-container *ngSwitchCase=\"'date'\">{{ row[col.prop] | date:'dd/MM/yyyy' }}</ng-container>\n                        <ng-container *ngSwitchCase=\"'time'\">{{ row[col.prop] | date:'HH:mm' }}</ng-container>\n                        <ng-container *ngSwitchCase=\"'tag'\">\n                            <span class=\"badge rounded-pill\" [ngClass]=\"row[col.prop + 'Class'] || 'text-bg-dark'\">{{\n                                row[col.prop] }}</span>\n                        </ng-container>\n                        <ng-container *ngSwitchDefault>{{ row[col.prop] }}</ng-container>\n                    </ng-container>\n                    <ng-container *ngIf=\"col.actions\">\n                        <div class=\"dropdown\">\n                            <button class=\"btn btn-light btn-sm\" type=\"button\" data-bs-toggle=\"dropdown\"\n                                aria-expanded=\"false\">\n                                <i class=\"material-icons align-middle\">more_horiz</i>\n                            </button>\n                            <ul class=\"dropdown-menu\">\n                                <li *ngFor=\"let action of col.actions\">\n                                    <a class=\"dropdown-item\" href=\"#\"\n                                        (click)=\"action.callback(row); $event.preventDefault()\">\n                                        <i *ngIf=\"action.icon\" class=\"material-icons align-middle me-2\">{{ action.icon\n                                            }}</i>\n                                        {{ action.title }}\n                                    </a>\n                                </li>\n                            </ul>\n                        </div>\n                    </ng-container>\n                </td>\n            </ng-container>\n        </tr>\n    </tbody>\n</table>\n\n<!-- Paginator -->\n<nav aria-label=\"Tabela pagina\u00E7\u00E3o\" class=\"d-flex justify-content-between mt-3\">\n    <lib-dropdown [options]=\"pageSizeOptions\" placeholder=\"Tamanho da p\u00E1gina\" [selectedOption]=\"pageSize\"\n        [hideLabel]=\"true\" (valueChange)=\"onPageSizeChange($event)\"></lib-dropdown>\n\n    <ul *ngIf=\"totalPages > 1\" class=\"pagination pagination-sm\">\n        <li class=\"page-item\" [class.disabled]=\"currentPage === 1\">\n            <button class=\"page-link\" (click)=\"goToPage(currentPage - 1)\" [disabled]=\"currentPage === 1\">\n                <i class=\"material-icons align-middle\">chevron_left</i>\n            </button>\n        </li>\n        <ng-container *ngFor=\"let page of getPages()\">\n            <li class=\"page-item\" *ngIf=\"page !== '...'\" [class.active]=\"page === currentPage\">\n                <button class=\"page-link\" (click)=\"goToPage(toNumber(page))\" [disabled]=\"page === currentPage\">{{ page\n                    }}</button>\n            </li>\n            <li class=\"page-item disabled\" *ngIf=\"page === '...'\"><span class=\"page-link\">...</span></li>\n        </ng-container>\n        <li class=\"page-item\" [class.disabled]=\"currentPage === totalPages\">\n            <button class=\"page-link\" (click)=\"goToPage(currentPage + 1)\" [disabled]=\"currentPage === totalPages\">\n                <i class=\"material-icons align-middle\">chevron_right</i>\n            </button>\n        </li>\n    </ul>\n</nav>", styles: ["thead{border-top:1px solid #c6c7c8}thead th{font-family:DM Sans,sans-serif;font-weight:600;font-size:.875rem}tbody th,tbody td,tbody .dropdown-menu{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem}.pagination i{font-size:20px}.pagination .page-item .page-link{color:#414141;background-color:#fff}.pagination .page-item.active .page-link{color:#fff;background-color:#414141;border-color:#414141}\n"] }]
+        }], propDecorators: { columns: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], columnTypes: [{
+                type: Input
+            }], page: [{
+                type: Input
+            }], pageSize: [{
+                type: Input
+            }], totalItems: [{
+                type: Input
+            }], pageSizeOptions: [{
+                type: Input
+            }], pageChange: [{
+                type: Output
+            }], pageSizeChange: [{
+                type: Output
+            }] } });
+
+class SidebarComponent {
+    destroy$ = new Subject();
+    router = inject(Router);
+    // Configuração e dados
+    config = {};
+    menuItems = [];
+    isCollapsed = false;
+    // Eventos
+    itemClick = new EventEmitter();
+    toggle = new EventEmitter();
+    overlayToggle = new EventEmitter();
+    logoClick = new EventEmitter();
+    // Estado interno
+    state$ = new BehaviorSubject({
+        isCollapsed: false,
+        isMobile: false,
+        isOverlayOpen: false,
+        activeItemId: undefined
+    });
+    // Configuração padrão
+    defaultConfig = {
+        width: '280px',
+        collapsedWidth: '64px',
+        position: 'left',
+        collapsible: true,
+        autoCollapse: true,
+        overlay: true,
+        logo: {
+            src: '',
+            alt: 'Logo',
+            route: '/'
+        },
+        theme: 'light',
+        customCssClass: ''
+    };
+    // Getters para o estado
+    get currentState() {
+        return this.state$.value;
+    }
+    get finalConfig() {
+        return { ...this.defaultConfig, ...this.config };
+    }
+    get sidebarWidth() {
+        return this.currentState.isCollapsed ? this.finalConfig.collapsedWidth : this.finalConfig.width;
+    }
+    ngOnInit() {
+        this.initializeState();
+        this.detectActiveRoute();
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    /**
+     * Detecta mudanças de tela
+     */
+    onResize(event) {
+        this.checkMobileState();
+    }
+    /**
+     * Inicializa o estado do sidebar
+     */
+    initializeState() {
+        this.checkMobileState();
+        // Configura estado inicial baseado no input
+        this.updateState({
+            isCollapsed: this.isCollapsed
+        });
+        // Auto-collapse em mobile se configurado
+        if (this.finalConfig.autoCollapse && this.currentState.isMobile) {
+            this.updateState({ isCollapsed: true });
+        }
+    }
+    /**
+     * Verifica se está em modo mobile
+     */
+    checkMobileState() {
+        const isMobile = window.innerWidth < 768; // Breakpoint md
+        this.updateState({ isMobile });
+        if (isMobile && this.finalConfig.autoCollapse) {
+            this.updateState({ isCollapsed: true });
+        }
+    }
+    /**
+     * Detecta rota ativa
+     */
+    detectActiveRoute() {
+        const currentUrl = this.router.url;
+        const activeItem = this.findActiveItem(this.menuItems, currentUrl);
+        if (activeItem) {
+            this.updateState({ activeItemId: activeItem.id });
+        }
+    }
+    /**
+     * Encontra item ativo baseado na URL
+     */
+    findActiveItem(items, url) {
+        for (const item of items) {
+            if (item.route && url.startsWith(item.route)) {
+                return item;
+            }
+            if (item.children) {
+                const childItem = this.findActiveItem(item.children, url);
+                if (childItem)
+                    return childItem;
+            }
+        }
+        return null;
+    }
+    /**
+     * Atualiza o estado
+     */
+    updateState(newState) {
+        const current = this.currentState;
+        this.state$.next({ ...current, ...newState });
+    }
+    /**
+     * Toggle do sidebar
+     */
+    toggleSidebar() {
+        const newCollapsedState = !this.currentState.isCollapsed;
+        this.updateState({ isCollapsed: newCollapsedState });
+        this.toggle.emit(!newCollapsedState);
+    }
+    /**
+     * Toggle do overlay (mobile)
+     */
+    toggleOverlay() {
+        const newOverlayState = !this.currentState.isOverlayOpen;
+        this.updateState({ isOverlayOpen: newOverlayState });
+        this.overlayToggle.emit(newOverlayState);
+    }
+    /**
+     * Clique no item do menu
+     */
+    onItemClick(item, event) {
+        if (item.disabled) {
+            event.preventDefault();
+            return;
+        }
+        // Se tem filhos, toggle expansão
+        if (item.children && item.children.length > 0) {
+            event.preventDefault();
+            this.toggleItemExpansion(item);
+            return;
+        }
+        // Ação personalizada
+        if (item.action) {
+            event.preventDefault();
+            item.action();
+        }
+        // Navegação
+        if (item.route) {
+            this.updateState({ activeItemId: item.id });
+            this.router.navigate([item.route]);
+            // Fecha overlay em mobile após navegação
+            if (this.currentState.isMobile && this.currentState.isOverlayOpen) {
+                this.updateState({ isOverlayOpen: false });
+            }
+        }
+        // Emite evento
+        this.itemClick.emit(item);
+    }
+    /**
+     * Toggle expansão de item com filhos
+     */
+    toggleItemExpansion(item) {
+        item.isExpanded = !item.isExpanded;
+    }
+    /**
+     * Clique no logo
+     */
+    onLogoClick() {
+        if (this.finalConfig.logo.route) {
+            this.router.navigate([this.finalConfig.logo.route]);
+        }
+        this.logoClick.emit();
+    }
+    /**
+     * Fecha overlay ao clicar fora (mobile)
+     */
+    closeOverlay() {
+        if (this.currentState.isMobile && this.currentState.isOverlayOpen) {
+            this.updateState({ isOverlayOpen: false });
+        }
+    }
+    /**
+     * Verifica se item está ativo
+     */
+    isItemActive(item) {
+        return this.currentState.activeItemId === item.id;
+    }
+    /**
+     * Verifica se item tem filhos ativos
+     */
+    hasActiveChild(item) {
+        if (!item.children)
+            return false;
+        return item.children.some(child => this.isItemActive(child) || this.hasActiveChild(child));
+    }
+    /**
+     * TrackBy function para performance
+     */
+    trackByItemId(index, item) {
+        return item.id;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: SidebarComponent, isStandalone: true, selector: "lib-sidebar", inputs: { config: "config", menuItems: "menuItems", isCollapsed: "isCollapsed" }, outputs: { itemClick: "itemClick", toggle: "toggle", overlayToggle: "overlayToggle", logoClick: "logoClick" }, host: { listeners: { "window:resize": "onResize($event)" } }, ngImport: i0, template: "<!-- Overlay para mobile -->\n<div *ngIf=\"currentState.isMobile && currentState.isOverlayOpen\" class=\"sidebar-overlay\" (click)=\"closeOverlay()\">\n</div>\n\n<!-- Sidebar principal -->\n<aside class=\"sidebar\" [class.collapsed]=\"currentState.isCollapsed\" [class.mobile]=\"currentState.isMobile\"\n  [class.overlay-open]=\"currentState.isOverlayOpen\" [class.theme-light]=\"finalConfig.theme === 'light'\"\n  [class.theme-dark]=\"finalConfig.theme === 'dark'\" [class.position-left]=\"finalConfig.position === 'left'\"\n  [class.position-right]=\"finalConfig.position === 'right'\" [ngClass]=\"finalConfig.customCssClass\"\n  [style.width]=\"sidebarWidth\">\n\n  <!-- Header com logo -->\n  <div class=\"sidebar-header\" *ngIf=\"finalConfig.logo.src\">\n    <button class=\"logo-container\" (click)=\"onLogoClick()\" [attr.aria-label]=\"finalConfig.logo.alt\">\n      <img [src]=\"finalConfig.logo.src\" [alt]=\"finalConfig.logo.alt\" class=\"logo-image\">\n\n      <span class=\"logo-text\" *ngIf=\"!currentState.isCollapsed\">\n        {{ finalConfig.logo.alt }}\n      </span>\n    </button>\n\n    <!-- Bot\u00E3o de toggle (se habilitado) -->\n    <button *ngIf=\"finalConfig.collapsible && !currentState.isMobile\" class=\"toggle-btn\" (click)=\"toggleSidebar()\"\n      [attr.aria-label]=\"currentState.isCollapsed ? 'Expandir menu' : 'Recolher menu'\">\n      <i class=\"toggle-icon fa\" [class.fa-angle-left]=\"!currentState.isCollapsed\"\n        [class.fa-angle-right]=\"currentState.isCollapsed\">\n      </i>\n    </button>\n  </div>\n\n  <!-- Navega\u00E7\u00E3o principal -->\n  <nav class=\"sidebar-nav\">\n    <ul class=\"nav-list\">\n      <ng-container *ngFor=\"let item of menuItems; trackBy: trackByItemId\">\n\n        <!-- Divisor -->\n        <li *ngIf=\"item.divider\" class=\"nav-divider\" role=\"separator\"></li>\n\n        <!-- Item do menu -->\n        <li class=\"nav-item\" [class.active]=\"isItemActive(item)\"\n          [class.has-children]=\"item.children && item.children.length > 0\" [class.expanded]=\"item.isExpanded\"\n          [class.disabled]=\"item.disabled\" [class.has-active-child]=\"hasActiveChild(item)\">\n\n          <a class=\"nav-link\" [routerLink]=\"item.route\" [class.no-route]=\"!item.route\"\n            (click)=\"onItemClick(item, $event)\" [attr.aria-label]=\"item.label\"\n            [attr.aria-expanded]=\"item.children ? item.isExpanded : null\" [attr.tabindex]=\"item.disabled ? -1 : 0\">\n\n            <!-- \u00CDcone -->\n            <i class=\"nav-icon\" [ngClass]=\"item.icon\" [attr.aria-hidden]=\"true\">\n            </i>\n\n            <!-- Label -->\n            <span class=\"nav-label\" *ngIf=\"!currentState.isCollapsed\">\n              {{ item.label }}\n            </span>\n\n            <!-- Badge -->\n            <span class=\"nav-badge\" *ngIf=\"item.badge && !currentState.isCollapsed\">\n              {{ item.badge }}\n            </span>\n\n            <!-- Seta para submenu -->\n            <i class=\"nav-arrow fa\" *ngIf=\"item.children && item.children.length > 0 && !currentState.isCollapsed\"\n              [class.fa-chevron-down]=\"item.isExpanded\" [class.fa-chevron-right]=\"!item.isExpanded\"\n              [attr.aria-hidden]=\"true\">\n            </i>\n          </a>\n\n          <!-- Submenu -->\n          <ul class=\"nav-submenu\"\n            *ngIf=\"item.children && item.children.length > 0 && item.isExpanded && !currentState.isCollapsed\">\n            <li class=\"nav-subitem\" *ngFor=\"let subItem of item.children; trackBy: trackByItemId\"\n              [class.active]=\"isItemActive(subItem)\" [class.disabled]=\"subItem.disabled\">\n\n              <a class=\"nav-sublink\" [routerLink]=\"subItem.route\" [class.no-route]=\"!subItem.route\"\n                (click)=\"onItemClick(subItem, $event)\" [attr.aria-label]=\"subItem.label\"\n                [attr.tabindex]=\"subItem.disabled ? -1 : 0\">\n\n                <!-- \u00CDcone do subitem -->\n                <i class=\"nav-subicon\" [ngClass]=\"subItem.icon\" [attr.aria-hidden]=\"true\">\n                </i>\n\n                <!-- Label do subitem -->\n                <span class=\"nav-sublabel\">\n                  {{ subItem.label }}\n                </span>\n\n                <!-- Badge do subitem -->\n                <span class=\"nav-subbadge\" *ngIf=\"subItem.badge\">\n                  {{ subItem.badge }}\n                </span>\n              </a>\n            </li>\n          </ul>\n        </li>\n      </ng-container>\n    </ul>\n  </nav>\n\n  <!-- Footer opcional -->\n  <div class=\"sidebar-footer\" *ngIf=\"!currentState.isCollapsed\">\n    <ng-content select=\"[slot=footer]\"></ng-content>\n  </div>\n</aside>\n\n<!-- Bot\u00E3o mobile para abrir sidebar -->\n<button *ngIf=\"currentState.isMobile && !currentState.isOverlayOpen\" class=\"mobile-toggle-btn\" (click)=\"toggleOverlay()\"\n  [attr.aria-label]=\"'Abrir menu'\">\n  <i class=\"fa fa-bars\" [attr.aria-hidden]=\"true\"></i>\n</button>", styles: [":host{--sidebar-bg: #ffffff;--sidebar-text: #343a40;--sidebar-text-secondary: #495057;--sidebar-border: #dee2e6;--sidebar-hover: #f8f9fa;--sidebar-active: #007bff;--sidebar-active-bg: rgba(0, 123, 255, .1);--sidebar-transition: .3s cubic-bezier(.4, 0, .2, 1);--sidebar-shadow: 0 2px 12px rgba(0, 0, 0, .08)}:host.theme-dark{--sidebar-bg: #343a40;--sidebar-text: #ffffff;--sidebar-text-secondary: #b2b9be;--sidebar-border: #495057;--sidebar-hover: rgba(255, 255, 255, .1);--sidebar-shadow: 0 2px 12px rgba(0, 0, 0, .25)}.sidebar-overlay{position:fixed;inset:0;background:#00000080;z-index:998;backdrop-filter:blur(2px)}.sidebar{position:fixed;top:0;bottom:0;left:0;width:280px;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);box-shadow:var(--sidebar-shadow);transition:var(--sidebar-transition);z-index:999;display:flex;flex-direction:column;overflow:visible}.sidebar.position-right{left:auto;right:0;border-left:1px solid var(--sidebar-border);border-right:none}.sidebar.collapsed{width:64px}.sidebar.collapsed .sidebar-header .logo-text,.sidebar.collapsed .nav-label,.sidebar.collapsed .nav-badge,.sidebar.collapsed .nav-arrow,.sidebar.collapsed .nav-submenu{opacity:0;pointer-events:none}.sidebar.collapsed .nav-link{justify-content:center;padding-left:.5rem;padding-right:.5rem;gap:0}.sidebar.collapsed .nav-icon{margin:0 auto}.sidebar.collapsed .sidebar-header{padding:1rem;justify-content:center!important}.sidebar.collapsed .logo-container{width:100%;display:flex;justify-content:center;align-items:center;gap:0;padding:0;margin:0}.sidebar.collapsed .logo-image{margin:0 auto;display:block;width:32px;height:32px}.sidebar.collapsed .toggle-btn{right:-18px;width:36px;height:36px}.sidebar.mobile{transform:translate(-100%)}.sidebar.mobile.position-right{transform:translate(100%)}.sidebar.mobile.overlay-open{transform:translate(0)}.sidebar-header{padding:1.5rem;border-bottom:1px solid var(--sidebar-border);display:flex;align-items:center;justify-content:space-between;min-height:80px;position:relative}.logo-container{display:flex;align-items:center;gap:1rem;background:none;border:none;padding:0;cursor:pointer;color:inherit;text-decoration:none;transition:var(--sidebar-transition)}.logo-container:hover{opacity:.8}.logo-image{width:32px;height:32px;object-fit:contain;flex-shrink:0}.logo-text{font-family:DM Sans,sans-serif;font-size:1.125rem;font-weight:600;color:var(--sidebar-text);transition:var(--sidebar-transition);white-space:nowrap}.toggle-btn{background:none;border:none;width:32px;height:32px;border-radius:.5rem;display:flex;align-items:center;background:var(--sidebar-bg);border:1px solid rgba(0,0,0,.06);box-shadow:0 6px 14px #0614231f;backdrop-filter:blur(4px);transition:transform .18s var(--sidebar-transition),box-shadow .18s var(--sidebar-transition);position:absolute;top:50%;transform:translateY(-50%);right:-16px;z-index:1000}.toggle-btn:hover{transform:translateY(-50%) translateY(-2px);box-shadow:0 10px 20px #06142329}.toggle-btn:hover{background:var(--sidebar-hover);color:var(--sidebar-text)}.toggle-btn .toggle-icon{font-size:1rem}.sidebar-nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:1rem 0}.sidebar-nav::-webkit-scrollbar{width:4px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:var(--sidebar-border);border-radius:2px}.sidebar-nav::-webkit-scrollbar-thumb:hover{background:var(--sidebar-text-secondary)}.nav-list{list-style:none;margin:0;padding:0}.nav-divider{height:1px;background:var(--sidebar-border);margin:1rem 0}.nav-item{position:relative;margin:0 1rem .25rem}.nav-item.active>.nav-link{background:var(--sidebar-active-bg);color:var(--sidebar-active)}.nav-item.active>.nav-link .nav-icon{color:var(--sidebar-active)}.nav-item.has-active-child>.nav-link{color:var(--sidebar-active)}.nav-item.has-active-child>.nav-link .nav-icon{color:var(--sidebar-active)}.nav-item.disabled{opacity:.5;pointer-events:none}.nav-link{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:.5rem;color:var(--sidebar-text);text-decoration:none;font-family:DM Sans,sans-serif;font-size:.875rem;font-weight:500;line-height:1.5;transition:var(--sidebar-transition);cursor:pointer;position:relative}.nav-link:hover:not(.active){background:var(--sidebar-hover)}.nav-link.no-route{cursor:pointer}.nav-icon{font-size:1.125rem;color:var(--sidebar-text-secondary);flex-shrink:0;width:20px;text-align:center;transition:var(--sidebar-transition)}.nav-label{flex:1;white-space:nowrap;transition:var(--sidebar-transition)}.nav-badge{background:var(--sidebar-active);color:#fff;font-size:.75rem;font-weight:600;padding:2px 6px;border-radius:10px;min-width:18px;text-align:center;transition:var(--sidebar-transition)}.nav-arrow{font-size:.875rem;color:var(--sidebar-text-secondary);transition:var(--sidebar-transition);margin-left:auto}.nav-submenu{list-style:none;margin:.25rem 0 0;padding:0;border-left:2px solid var(--sidebar-border);margin-left:calc(20px + 1rem);transition:var(--sidebar-transition)}.nav-subitem{margin:0 0 .25rem}.nav-subitem.active>.nav-sublink{color:var(--sidebar-active);background:var(--sidebar-active-bg)}.nav-subitem.active>.nav-sublink .nav-subicon{color:var(--sidebar-active)}.nav-subitem.disabled{opacity:.5;pointer-events:none}.nav-subicon{font-size:.875rem;width:16px;text-align:center;flex-shrink:0;transition:var(--sidebar-transition)}.nav-sublabel{flex:1;white-space:nowrap}.nav-subbadge{background:var(--sidebar-active);color:#fff;font-size:10px;font-weight:600;padding:1px 4px;border-radius:8px;min-width:14px;text-align:center}.sidebar-footer{padding:1rem;border-top:1px solid var(--sidebar-border);margin-top:auto}.mobile-toggle-btn{position:fixed;top:1.5rem;left:1.5rem;width:48px;height:48px;background:var(--sidebar-active);color:#fff;border:none;border-radius:.75rem;display:flex;align-items:center;justify-content:center;font-size:1.125rem;box-shadow:var(--sidebar-shadow);z-index:997;cursor:pointer;transition:var(--sidebar-transition)}.mobile-toggle-btn:hover{transform:scale(1.05)}.mobile-toggle-btn:active{transform:scale(.95)}@media (max-width: 768px){.sidebar{width:280px!important}.sidebar.position-right{transform:translate(100%)}.sidebar.position-right.overlay-open{transform:translate(0)}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.sidebar.mobile.overlay-open{animation:slideInLeft .3s ease-out}.sidebar.mobile.overlay-open.position-right{animation:slideInRight .3s ease-out}.nav-link:focus,.nav-sublink:focus,.toggle-btn:focus,.logo-container:focus,.mobile-toggle-btn:focus{outline:2px solid var(--sidebar-active);outline-offset:2px}.collapsed .nav-submenu{display:none!important}.has-children.collapsed .nav-arrow{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SidebarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-sidebar', imports: [CommonModule, RouterModule], template: "<!-- Overlay para mobile -->\n<div *ngIf=\"currentState.isMobile && currentState.isOverlayOpen\" class=\"sidebar-overlay\" (click)=\"closeOverlay()\">\n</div>\n\n<!-- Sidebar principal -->\n<aside class=\"sidebar\" [class.collapsed]=\"currentState.isCollapsed\" [class.mobile]=\"currentState.isMobile\"\n  [class.overlay-open]=\"currentState.isOverlayOpen\" [class.theme-light]=\"finalConfig.theme === 'light'\"\n  [class.theme-dark]=\"finalConfig.theme === 'dark'\" [class.position-left]=\"finalConfig.position === 'left'\"\n  [class.position-right]=\"finalConfig.position === 'right'\" [ngClass]=\"finalConfig.customCssClass\"\n  [style.width]=\"sidebarWidth\">\n\n  <!-- Header com logo -->\n  <div class=\"sidebar-header\" *ngIf=\"finalConfig.logo.src\">\n    <button class=\"logo-container\" (click)=\"onLogoClick()\" [attr.aria-label]=\"finalConfig.logo.alt\">\n      <img [src]=\"finalConfig.logo.src\" [alt]=\"finalConfig.logo.alt\" class=\"logo-image\">\n\n      <span class=\"logo-text\" *ngIf=\"!currentState.isCollapsed\">\n        {{ finalConfig.logo.alt }}\n      </span>\n    </button>\n\n    <!-- Bot\u00E3o de toggle (se habilitado) -->\n    <button *ngIf=\"finalConfig.collapsible && !currentState.isMobile\" class=\"toggle-btn\" (click)=\"toggleSidebar()\"\n      [attr.aria-label]=\"currentState.isCollapsed ? 'Expandir menu' : 'Recolher menu'\">\n      <i class=\"toggle-icon fa\" [class.fa-angle-left]=\"!currentState.isCollapsed\"\n        [class.fa-angle-right]=\"currentState.isCollapsed\">\n      </i>\n    </button>\n  </div>\n\n  <!-- Navega\u00E7\u00E3o principal -->\n  <nav class=\"sidebar-nav\">\n    <ul class=\"nav-list\">\n      <ng-container *ngFor=\"let item of menuItems; trackBy: trackByItemId\">\n\n        <!-- Divisor -->\n        <li *ngIf=\"item.divider\" class=\"nav-divider\" role=\"separator\"></li>\n\n        <!-- Item do menu -->\n        <li class=\"nav-item\" [class.active]=\"isItemActive(item)\"\n          [class.has-children]=\"item.children && item.children.length > 0\" [class.expanded]=\"item.isExpanded\"\n          [class.disabled]=\"item.disabled\" [class.has-active-child]=\"hasActiveChild(item)\">\n\n          <a class=\"nav-link\" [routerLink]=\"item.route\" [class.no-route]=\"!item.route\"\n            (click)=\"onItemClick(item, $event)\" [attr.aria-label]=\"item.label\"\n            [attr.aria-expanded]=\"item.children ? item.isExpanded : null\" [attr.tabindex]=\"item.disabled ? -1 : 0\">\n\n            <!-- \u00CDcone -->\n            <i class=\"nav-icon\" [ngClass]=\"item.icon\" [attr.aria-hidden]=\"true\">\n            </i>\n\n            <!-- Label -->\n            <span class=\"nav-label\" *ngIf=\"!currentState.isCollapsed\">\n              {{ item.label }}\n            </span>\n\n            <!-- Badge -->\n            <span class=\"nav-badge\" *ngIf=\"item.badge && !currentState.isCollapsed\">\n              {{ item.badge }}\n            </span>\n\n            <!-- Seta para submenu -->\n            <i class=\"nav-arrow fa\" *ngIf=\"item.children && item.children.length > 0 && !currentState.isCollapsed\"\n              [class.fa-chevron-down]=\"item.isExpanded\" [class.fa-chevron-right]=\"!item.isExpanded\"\n              [attr.aria-hidden]=\"true\">\n            </i>\n          </a>\n\n          <!-- Submenu -->\n          <ul class=\"nav-submenu\"\n            *ngIf=\"item.children && item.children.length > 0 && item.isExpanded && !currentState.isCollapsed\">\n            <li class=\"nav-subitem\" *ngFor=\"let subItem of item.children; trackBy: trackByItemId\"\n              [class.active]=\"isItemActive(subItem)\" [class.disabled]=\"subItem.disabled\">\n\n              <a class=\"nav-sublink\" [routerLink]=\"subItem.route\" [class.no-route]=\"!subItem.route\"\n                (click)=\"onItemClick(subItem, $event)\" [attr.aria-label]=\"subItem.label\"\n                [attr.tabindex]=\"subItem.disabled ? -1 : 0\">\n\n                <!-- \u00CDcone do subitem -->\n                <i class=\"nav-subicon\" [ngClass]=\"subItem.icon\" [attr.aria-hidden]=\"true\">\n                </i>\n\n                <!-- Label do subitem -->\n                <span class=\"nav-sublabel\">\n                  {{ subItem.label }}\n                </span>\n\n                <!-- Badge do subitem -->\n                <span class=\"nav-subbadge\" *ngIf=\"subItem.badge\">\n                  {{ subItem.badge }}\n                </span>\n              </a>\n            </li>\n          </ul>\n        </li>\n      </ng-container>\n    </ul>\n  </nav>\n\n  <!-- Footer opcional -->\n  <div class=\"sidebar-footer\" *ngIf=\"!currentState.isCollapsed\">\n    <ng-content select=\"[slot=footer]\"></ng-content>\n  </div>\n</aside>\n\n<!-- Bot\u00E3o mobile para abrir sidebar -->\n<button *ngIf=\"currentState.isMobile && !currentState.isOverlayOpen\" class=\"mobile-toggle-btn\" (click)=\"toggleOverlay()\"\n  [attr.aria-label]=\"'Abrir menu'\">\n  <i class=\"fa fa-bars\" [attr.aria-hidden]=\"true\"></i>\n</button>", styles: [":host{--sidebar-bg: #ffffff;--sidebar-text: #343a40;--sidebar-text-secondary: #495057;--sidebar-border: #dee2e6;--sidebar-hover: #f8f9fa;--sidebar-active: #007bff;--sidebar-active-bg: rgba(0, 123, 255, .1);--sidebar-transition: .3s cubic-bezier(.4, 0, .2, 1);--sidebar-shadow: 0 2px 12px rgba(0, 0, 0, .08)}:host.theme-dark{--sidebar-bg: #343a40;--sidebar-text: #ffffff;--sidebar-text-secondary: #b2b9be;--sidebar-border: #495057;--sidebar-hover: rgba(255, 255, 255, .1);--sidebar-shadow: 0 2px 12px rgba(0, 0, 0, .25)}.sidebar-overlay{position:fixed;inset:0;background:#00000080;z-index:998;backdrop-filter:blur(2px)}.sidebar{position:fixed;top:0;bottom:0;left:0;width:280px;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);box-shadow:var(--sidebar-shadow);transition:var(--sidebar-transition);z-index:999;display:flex;flex-direction:column;overflow:visible}.sidebar.position-right{left:auto;right:0;border-left:1px solid var(--sidebar-border);border-right:none}.sidebar.collapsed{width:64px}.sidebar.collapsed .sidebar-header .logo-text,.sidebar.collapsed .nav-label,.sidebar.collapsed .nav-badge,.sidebar.collapsed .nav-arrow,.sidebar.collapsed .nav-submenu{opacity:0;pointer-events:none}.sidebar.collapsed .nav-link{justify-content:center;padding-left:.5rem;padding-right:.5rem;gap:0}.sidebar.collapsed .nav-icon{margin:0 auto}.sidebar.collapsed .sidebar-header{padding:1rem;justify-content:center!important}.sidebar.collapsed .logo-container{width:100%;display:flex;justify-content:center;align-items:center;gap:0;padding:0;margin:0}.sidebar.collapsed .logo-image{margin:0 auto;display:block;width:32px;height:32px}.sidebar.collapsed .toggle-btn{right:-18px;width:36px;height:36px}.sidebar.mobile{transform:translate(-100%)}.sidebar.mobile.position-right{transform:translate(100%)}.sidebar.mobile.overlay-open{transform:translate(0)}.sidebar-header{padding:1.5rem;border-bottom:1px solid var(--sidebar-border);display:flex;align-items:center;justify-content:space-between;min-height:80px;position:relative}.logo-container{display:flex;align-items:center;gap:1rem;background:none;border:none;padding:0;cursor:pointer;color:inherit;text-decoration:none;transition:var(--sidebar-transition)}.logo-container:hover{opacity:.8}.logo-image{width:32px;height:32px;object-fit:contain;flex-shrink:0}.logo-text{font-family:DM Sans,sans-serif;font-size:1.125rem;font-weight:600;color:var(--sidebar-text);transition:var(--sidebar-transition);white-space:nowrap}.toggle-btn{background:none;border:none;width:32px;height:32px;border-radius:.5rem;display:flex;align-items:center;background:var(--sidebar-bg);border:1px solid rgba(0,0,0,.06);box-shadow:0 6px 14px #0614231f;backdrop-filter:blur(4px);transition:transform .18s var(--sidebar-transition),box-shadow .18s var(--sidebar-transition);position:absolute;top:50%;transform:translateY(-50%);right:-16px;z-index:1000}.toggle-btn:hover{transform:translateY(-50%) translateY(-2px);box-shadow:0 10px 20px #06142329}.toggle-btn:hover{background:var(--sidebar-hover);color:var(--sidebar-text)}.toggle-btn .toggle-icon{font-size:1rem}.sidebar-nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:1rem 0}.sidebar-nav::-webkit-scrollbar{width:4px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:var(--sidebar-border);border-radius:2px}.sidebar-nav::-webkit-scrollbar-thumb:hover{background:var(--sidebar-text-secondary)}.nav-list{list-style:none;margin:0;padding:0}.nav-divider{height:1px;background:var(--sidebar-border);margin:1rem 0}.nav-item{position:relative;margin:0 1rem .25rem}.nav-item.active>.nav-link{background:var(--sidebar-active-bg);color:var(--sidebar-active)}.nav-item.active>.nav-link .nav-icon{color:var(--sidebar-active)}.nav-item.has-active-child>.nav-link{color:var(--sidebar-active)}.nav-item.has-active-child>.nav-link .nav-icon{color:var(--sidebar-active)}.nav-item.disabled{opacity:.5;pointer-events:none}.nav-link{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:.5rem;color:var(--sidebar-text);text-decoration:none;font-family:DM Sans,sans-serif;font-size:.875rem;font-weight:500;line-height:1.5;transition:var(--sidebar-transition);cursor:pointer;position:relative}.nav-link:hover:not(.active){background:var(--sidebar-hover)}.nav-link.no-route{cursor:pointer}.nav-icon{font-size:1.125rem;color:var(--sidebar-text-secondary);flex-shrink:0;width:20px;text-align:center;transition:var(--sidebar-transition)}.nav-label{flex:1;white-space:nowrap;transition:var(--sidebar-transition)}.nav-badge{background:var(--sidebar-active);color:#fff;font-size:.75rem;font-weight:600;padding:2px 6px;border-radius:10px;min-width:18px;text-align:center;transition:var(--sidebar-transition)}.nav-arrow{font-size:.875rem;color:var(--sidebar-text-secondary);transition:var(--sidebar-transition);margin-left:auto}.nav-submenu{list-style:none;margin:.25rem 0 0;padding:0;border-left:2px solid var(--sidebar-border);margin-left:calc(20px + 1rem);transition:var(--sidebar-transition)}.nav-subitem{margin:0 0 .25rem}.nav-subitem.active>.nav-sublink{color:var(--sidebar-active);background:var(--sidebar-active-bg)}.nav-subitem.active>.nav-sublink .nav-subicon{color:var(--sidebar-active)}.nav-subitem.disabled{opacity:.5;pointer-events:none}.nav-subicon{font-size:.875rem;width:16px;text-align:center;flex-shrink:0;transition:var(--sidebar-transition)}.nav-sublabel{flex:1;white-space:nowrap}.nav-subbadge{background:var(--sidebar-active);color:#fff;font-size:10px;font-weight:600;padding:1px 4px;border-radius:8px;min-width:14px;text-align:center}.sidebar-footer{padding:1rem;border-top:1px solid var(--sidebar-border);margin-top:auto}.mobile-toggle-btn{position:fixed;top:1.5rem;left:1.5rem;width:48px;height:48px;background:var(--sidebar-active);color:#fff;border:none;border-radius:.75rem;display:flex;align-items:center;justify-content:center;font-size:1.125rem;box-shadow:var(--sidebar-shadow);z-index:997;cursor:pointer;transition:var(--sidebar-transition)}.mobile-toggle-btn:hover{transform:scale(1.05)}.mobile-toggle-btn:active{transform:scale(.95)}@media (max-width: 768px){.sidebar{width:280px!important}.sidebar.position-right{transform:translate(100%)}.sidebar.position-right.overlay-open{transform:translate(0)}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.sidebar.mobile.overlay-open{animation:slideInLeft .3s ease-out}.sidebar.mobile.overlay-open.position-right{animation:slideInRight .3s ease-out}.nav-link:focus,.nav-sublink:focus,.toggle-btn:focus,.logo-container:focus,.mobile-toggle-btn:focus{outline:2px solid var(--sidebar-active);outline-offset:2px}.collapsed .nav-submenu{display:none!important}.has-children.collapsed .nav-arrow{display:none}\n"] }]
+        }], propDecorators: { config: [{
+                type: Input
+            }], menuItems: [{
+                type: Input
+            }], isCollapsed: [{
+                type: Input
+            }], itemClick: [{
+                type: Output
+            }], toggle: [{
+                type: Output
+            }], overlayToggle: [{
+                type: Output
+            }], logoClick: [{
+                type: Output
+            }], onResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
+            }] } });
+
+/**
+ * Tipos e interfaces para autenticação
+ */
+/**
+ * Estados do processo de login
+ */
+var LoginStatus;
+(function (LoginStatus) {
+    LoginStatus["IDLE"] = "IDLE";
+    LoginStatus["LOADING"] = "LOADING";
+    LoginStatus["SUCCESS"] = "SUCCESS";
+    LoginStatus["ERROR"] = "ERROR";
+})(LoginStatus || (LoginStatus = {}));
+
+class LocalStorageService {
+    storageAvailable = new BehaviorSubject(this.isStorageAvailable());
+    // Observable para monitorar disponibilidade do storage
+    get storageAvailable$() {
+        return this.storageAvailable.asObservable();
+    }
+    /**
+     * Salva item no storage com validação básica
+     */
+    async setItem(key, value, storageType = 'localStorage', options) {
+        if (!this.isStorageAvailable(storageType)) {
+            console.warn(`${storageType} não está disponível`);
+            return false;
+        }
+        if (!this.validateKey(key)) {
+            console.error('Chave inválida fornecida');
+            return false;
+        }
+        try {
+            const storage = this.getStorage(storageType);
+            let serializedValue = this.safeJsonStringify(value);
+            if (!serializedValue) {
+                console.error('Falha na serialização segura dos dados');
+                return false;
+            }
+            // Aplicar criptografia REAL se solicitada
+            if (options?.encrypt) {
+                serializedValue = await this.encryptData(serializedValue);
+                if (!serializedValue) {
+                    console.error('Falha na criptografia dos dados');
+                    return false;
+                }
+            }
+            // Validação de tamanho (localStorage tem limite ~5MB)
+            if (serializedValue.length > 5000000) {
+                console.error('Dados muito grandes para o storage');
+                return false;
+            }
+            storage.setItem(this.sanitizeKey(key), serializedValue);
+            return true;
+        }
+        catch (error) {
+            console.error(`Erro ao salvar no ${storageType}:`, error);
+            return false;
+        }
+    }
+    /**
+     * Recupera item do storage com tipo seguro
+     */
+    async getItem(key, storageType = 'localStorage', options) {
+        if (!this.isStorageAvailable(storageType)) {
+            return null;
+        }
+        try {
+            const storage = this.getStorage(storageType);
+            let item = storage.getItem(this.sanitizeKey(key));
+            if (!item)
+                return null;
+            // Aplicar descriptografia REAL se necessário
+            if (options?.encrypt && item) {
+                item = await this.decryptData(item);
+                if (!item) {
+                    console.error('Falha ao descriptografar item');
+                    return null;
+                }
+            }
+            return item ? this.safeJsonParse(item) : null;
+        }
+        catch (error) {
+            console.error(`Erro ao recuperar do ${storageType}:`, error);
+            return null;
+        }
+    }
+    /**
+     * Remove item específico
+     */
+    removeItem(key, storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return false;
+        }
+        try {
+            const storage = this.getStorage(storageType);
+            storage.removeItem(this.sanitizeKey(key));
+            return true;
+        }
+        catch (error) {
+            console.error(`Erro ao remover do ${storageType}:`, error);
+            return false;
+        }
+    }
+    /**
+     * Limpa todo o storage
+     */
+    clear(storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return false;
+        }
+        try {
+            const storage = this.getStorage(storageType);
+            storage.clear();
+            return true;
+        }
+        catch (error) {
+            console.error(`Erro ao limpar ${storageType}:`, error);
+            return false;
+        }
+    }
+    /**
+     * Verifica se item existe
+     */
+    hasItem(key, storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return false;
+        }
+        const storage = this.getStorage(storageType);
+        return storage.getItem(this.sanitizeKey(key)) !== null;
+    }
+    /**
+     * Salva item com expiração
+     */
+    async setItemWithExpiry(key, value, expiryInMinutes, storageType = 'localStorage') {
+        const now = new Date();
+        const item = {
+            value: value,
+            expiry: now.getTime() + (expiryInMinutes * 60 * 1000)
+        };
+        return await this.setItem(key, item, storageType);
+    }
+    /**
+     * Recupera item com verificação de expiração
+     */
+    async getItemWithExpiry(key, storageType = 'localStorage') {
+        const itemStr = await this.getItem(key, storageType);
+        if (!itemStr) {
+            return null;
+        }
+        const now = new Date();
+        if (now.getTime() > itemStr.expiry) {
+            this.removeItem(key, storageType);
+            return null;
+        }
+        return itemStr.value;
+    }
+    /**
+     * Obtém todas as chaves do storage
+     */
+    getAllKeys(storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return [];
+        }
+        const storage = this.getStorage(storageType);
+        const keys = [];
+        for (let i = 0; i < storage.length; i++) {
+            const key = storage.key(i);
+            if (key)
+                keys.push(key);
+        }
+        return keys;
+    }
+    /**
+     * Obtém tamanho ocupado do storage em bytes (aproximado)
+     */
+    getStorageSize(storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return 0;
+        }
+        const storage = this.getStorage(storageType);
+        let total = 0;
+        for (let key in storage) {
+            if (storage.hasOwnProperty(key)) {
+                total += storage[key].length + key.length;
+            }
+        }
+        return total;
+    }
+    /**
+     * Monitor de eventos de storage
+     */
+    monitorStorageEvents() {
+        return new Observable(observer => {
+            const handler = (event) => {
+                // Validação básica de segurança
+                if (this.validateStorageEvent(event)) {
+                    observer.next(event);
+                }
+            };
+            window.addEventListener('storage', handler);
+            return () => {
+                window.removeEventListener('storage', handler);
+            };
+        });
+    }
+    /**
+     * Limpa itens expirados do storage
+     */
+    async cleanExpiredItems(storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return 0;
+        }
+        const keys = this.getAllKeys(storageType);
+        let cleanedCount = 0;
+        for (const key of keys) {
+            try {
+                const item = await this.getItem(key, storageType);
+                if (item && item.expiry) {
+                    const now = new Date().getTime();
+                    if (now > item.expiry) {
+                        this.removeItem(key, storageType);
+                        cleanedCount++;
+                    }
+                }
+            }
+            catch (error) {
+                // Ignora erros de parsing - pode não ser um item com expiração
+            }
+        }
+        return cleanedCount;
+    }
+    /**
+     * Backup de todos os dados do storage
+     */
+    backup(storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return {};
+        }
+        const storage = this.getStorage(storageType);
+        const backup = {};
+        for (let i = 0; i < storage.length; i++) {
+            const key = storage.key(i);
+            if (key) {
+                backup[key] = storage.getItem(key);
+            }
+        }
+        return backup;
+    }
+    /**
+     * Restaura backup para o storage
+     */
+    restore(backup, storageType = 'localStorage') {
+        if (!this.isStorageAvailable(storageType)) {
+            return false;
+        }
+        // Validação rigorosa do backup
+        if (!backup || typeof backup !== 'object' || Array.isArray(backup)) {
+            console.error('Backup inválido fornecido');
+            return false;
+        }
+        try {
+            const storage = this.getStorage(storageType);
+            const keys = Object.keys(backup);
+            // Limita número de itens para evitar DoS
+            if (keys.length > 100) {
+                console.error('Backup muito grande - máximo 100 itens');
+                return false;
+            }
+            for (const key of keys) {
+                // Validação rigorosa de cada chave
+                if (!this.validateKey(key)) {
+                    console.warn(`Chave inválida ignorada no backup: ${key}`);
+                    continue;
+                }
+                const value = backup[key];
+                // Validação do valor
+                if (typeof value !== 'string') {
+                    console.warn(`Valor inválido ignorado para chave: ${key}`);
+                    continue;
+                }
+                // Validação de tamanho
+                if (value.length > 50000) { // 50KB por item
+                    console.warn(`Valor muito grande ignorado para chave: ${key}`);
+                    continue;
+                }
+                storage.setItem(key, value);
+            }
+            return true;
+        }
+        catch (error) {
+            console.error('Erro ao restaurar backup:', error);
+            return false;
+        }
+    }
+    /**
+     * MÉTODOS PRIVADOS SIMPLIFICADOS
+     */
+    isStorageAvailable(storageType = 'localStorage') {
+        try {
+            const storage = this.getStorage(storageType);
+            const test = '__storage_test__';
+            storage.setItem(test, test);
+            storage.removeItem(test);
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+    getStorage(storageType) {
+        return storageType === 'localStorage' ? localStorage : sessionStorage;
+    }
+    sanitizeKey(key) {
+        if (!key || typeof key !== 'string') {
+            return '';
+        }
+        return key
+            .replace(/[^a-zA-Z0-9_.-]/g, '') // Remove caracteres especiais
+            .substring(0, 50); // Limita tamanho
+    }
+    validateKey(key) {
+        if (!key || typeof key !== 'string') {
+            return false;
+        }
+        // Bloqueia chaves perigosas para prototype pollution
+        const dangerousKeys = ['__proto__', 'constructor', 'prototype', 'toString', 'valueOf'];
+        if (dangerousKeys.includes(key)) {
+            return false;
+        }
+        // Validação de tamanho e caracteres
+        if (key.length > 30 || key.length === 0) {
+            return false;
+        }
+        // Apenas alfanumérico e underscore
+        if (!/^[a-zA-Z0-9_]+$/.test(key)) {
+            return false;
+        }
+        return true;
+    }
+    safeJsonStringify(obj) {
+        try {
+            // Verifica se não é função ou undefined
+            if (typeof obj === 'function' || obj === undefined) {
+                return null;
+            }
+            // Limita profundidade para evitar referências circulares
+            const seen = new WeakSet();
+            const replacer = (key, value) => {
+                // Bloqueia chaves perigosas
+                if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+                    return undefined;
+                }
+                // Evita referências circulares
+                if (typeof value === 'object' && value !== null) {
+                    if (seen.has(value)) {
+                        return '[Circular Reference]';
+                    }
+                    seen.add(value);
+                }
+                return value;
+            };
+            return JSON.stringify(obj, replacer);
+        }
+        catch (error) {
+            console.error('Erro na serialização segura:', error);
+            return null;
+        }
+    }
+    safeJsonParse(text) {
+        try {
+            return JSON.parse(text, (key, value) => {
+                // Bloqueia prototype pollution
+                if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+                    return undefined;
+                }
+                return value;
+            });
+        }
+        catch (error) {
+            console.error('Erro no parsing seguro:', error);
+            return null;
+        }
+    }
+    async encryptData(text) {
+        try {
+            // Gera chave simples baseada no contexto da aplicação
+            const keyMaterial = await crypto.subtle.importKey('raw', new TextEncoder().encode(window.location.hostname + '_secure_key'), 'PBKDF2', false, ['deriveKey']);
+            // Gera salt fixo baseado no hostname (para poder descriptografar)
+            const salt = new TextEncoder().encode(window.location.hostname.padEnd(16, '0').substring(0, 16));
+            const key = await crypto.subtle.deriveKey({
+                name: 'PBKDF2',
+                salt: salt,
+                iterations: 10000,
+                hash: 'SHA-256'
+            }, keyMaterial, { name: 'AES-GCM', length: 256 }, false, ['encrypt']);
+            const iv = crypto.getRandomValues(new Uint8Array(12));
+            const encoded = new TextEncoder().encode(text);
+            const encrypted = await crypto.subtle.encrypt({ name: 'AES-GCM', iv: iv }, key, encoded);
+            // Combina IV + dados criptografados em base64
+            const combined = new Uint8Array(iv.length + encrypted.byteLength);
+            combined.set(iv);
+            combined.set(new Uint8Array(encrypted), iv.length);
+            return btoa(String.fromCharCode(...combined));
+        }
+        catch (error) {
+            console.error('Erro na criptografia:', error);
+            return null;
+        }
+    }
+    async decryptData(encryptedText) {
+        try {
+            // Mesmo processo para gerar a chave
+            const keyMaterial = await crypto.subtle.importKey('raw', new TextEncoder().encode(window.location.hostname + '_secure_key'), 'PBKDF2', false, ['deriveKey']);
+            const salt = new TextEncoder().encode(window.location.hostname.padEnd(16, '0').substring(0, 16));
+            const key = await crypto.subtle.deriveKey({
+                name: 'PBKDF2',
+                salt: salt,
+                iterations: 10000,
+                hash: 'SHA-256'
+            }, keyMaterial, { name: 'AES-GCM', length: 256 }, false, ['decrypt']);
+            // Decodifica base64 e separa IV dos dados
+            const combined = new Uint8Array(atob(encryptedText).split('').map(c => c.charCodeAt(0)));
+            const iv = combined.slice(0, 12);
+            const encrypted = combined.slice(12);
+            const decrypted = await crypto.subtle.decrypt({ name: 'AES-GCM', iv: iv }, key, encrypted);
+            return new TextDecoder().decode(decrypted);
+        }
+        catch (error) {
+            console.error('Erro na descriptografia:', error);
+            return null;
+        }
+    }
+    validateStorageEvent(event) {
+        // Validação rigorosa de origem
+        if (!event.url || event.url.trim() === '') {
+            return false;
+        }
+        try {
+            const eventOrigin = new URL(event.url).origin;
+            const currentOrigin = window.location.origin;
+            if (eventOrigin !== currentOrigin) {
+                return false;
+            }
+        }
+        catch {
+            return false;
+        }
+        // Validação rigorosa de chave
+        if (event.key && !this.validateKey(event.key)) {
+            return false;
+        }
+        // Verificação adicional de integridade temporal
+        const now = Date.now();
+        if (!this.lastEventTime) {
+            this.lastEventTime = now;
+            return true;
+        }
+        // Rate limiting básico
+        if (now - this.lastEventTime < 50) { // Máximo 20 eventos/segundo
+            return false;
+        }
+        this.lastEventTime = now;
+        return true;
+    }
+    lastEventTime = 0;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LocalStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LocalStorageService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LocalStorageService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class AuthStorageService {
+    storage;
+    TOKEN_KEY = 'access_token';
+    USER_DATA_KEY = 'user_data';
+    // Observable para monitorar estado de autenticação
+    isAuthenticated$ = new BehaviorSubject(false);
+    get authState$() {
+        return this.isAuthenticated$.asObservable();
+    }
+    constructor(storage) {
+        this.storage = storage;
+        // Inicializa o estado de autenticação de forma assíncrona
+        this.initAuthState();
+    }
+    async initAuthState() {
+        const hasToken = await this.hasToken();
+        this.isAuthenticated$.next(hasToken);
+    }
+    /**
+     * Salva Access Token COM CRIPTOGRAFIA (backend fará todas as validações)
+     */
+    async setToken(token, expiryInMinutes = 60) {
+        if (!token || token.trim().length === 0) {
+            return false;
+        }
+        // 🔐 SEMPRE criptografar tokens para máxima segurança
+        // Criamos estrutura com expiração manualmente para usar criptografia
+        const now = new Date();
+        const item = {
+            value: token,
+            expiry: now.getTime() + (expiryInMinutes * 60 * 1000)
+        };
+        const success = await this.storage.setItem(this.TOKEN_KEY, item, 'sessionStorage', { encrypt: true });
+        if (success) {
+            this.isAuthenticated$.next(true);
+        }
+        return success;
+    }
+    /**
+     * Recupera Access Token COM DESCRIPTOGRAFIA e validação de expiração
+     */
+    async getToken() {
+        try {
+            // 🔓 SEMPRE descriptografar tokens
+            const item = await this.storage.getItem(this.TOKEN_KEY, 'sessionStorage', { encrypt: true });
+            if (!item || !item.value) {
+                this.isAuthenticated$.next(false);
+                return null;
+            }
+            // Verificar expiração
+            const now = Date.now();
+            if (item.expiry && now > item.expiry) {
+                // Token expirado - remover
+                this.storage.removeItem(this.TOKEN_KEY, 'sessionStorage');
+                this.isAuthenticated$.next(false);
+                return null;
+            }
+            return item.value;
+        }
+        catch (error) {
+            console.warn('Erro ao recuperar token criptografado:', error);
+            this.isAuthenticated$.next(false);
+            return null;
+        }
+    }
+    // REMOVIDO: Refresh Token methods - ficam no servidor
+    // O backend gerencia refresh automaticamente via interceptors
+    /**
+     * Salva dados do usuário COM CRIPTOGRAFIA e validação básica
+     */
+    async setUserData(userData) {
+        if (!userData || typeof userData !== 'object') {
+            return false;
+        }
+        // Validação básica de tamanho
+        try {
+            const serialized = JSON.stringify(userData);
+            if (serialized.length > 100000) { // 100KB limite
+                return false;
+            }
+        }
+        catch {
+            return false;
+        }
+        // 🔐 SEMPRE criptografar dados do usuário também
+        return await this.storage.setItem(this.USER_DATA_KEY, userData, 'sessionStorage', { encrypt: true });
+    }
+    /**
+     * Recupera dados do usuário COM DESCRIPTOGRAFIA
+     */
+    async getUserData() {
+        try {
+            // 🔓 SEMPRE descriptografar dados do usuário
+            return await this.storage.getItem(this.USER_DATA_KEY, 'sessionStorage', { encrypt: true });
+        }
+        catch (error) {
+            console.warn('Erro ao recuperar dados do usuário criptografados:', error);
+            return null;
+        }
+    }
+    /**
+     * Verifica apenas se possui token (backend validará se é válido)
+     */
+    async hasToken() {
+        const token = await this.getToken();
+        return !!token && token.length > 0;
+    }
+    /**
+     * Verifica se está "aparentemente" autenticado (token existe)
+     */
+    async isAuthenticated() {
+        return await this.hasToken();
+    }
+    /**
+     * Limpa APENAS dados do cliente (não afeta refresh token no servidor)
+     */
+    clearAuthData() {
+        this.storage.removeItem(this.TOKEN_KEY, 'sessionStorage');
+        this.storage.removeItem(this.USER_DATA_KEY, 'sessionStorage');
+        this.isAuthenticated$.next(false);
+    }
+    /**
+     * Decodifica payload do JWT (SEM validação - apenas para UI)
+     * IMPORTANTE: Use apenas para exibição, nunca para lógica de segurança
+     *
+     * ⚠️ ATENÇÃO: Agora requer token como parâmetro ou uso assíncrono
+     */
+    decodeTokenPayload(token) {
+        try {
+            // Se não foi passado token, não podemos usar getTokenSync (descontinuado)
+            if (!token) {
+                console.warn('⚠️ decodeTokenPayload(): Passe o token como parâmetro ou use ' +
+                    'await getToken() primeiro, pois tokens são criptografados.');
+                return null;
+            }
+            const jwt = token;
+            if (!jwt || typeof jwt !== 'string')
+                return null;
+            // Validação básica do formato JWT
+            const parts = jwt.split('.');
+            if (parts.length !== 3)
+                return null;
+            // Validação base64url
+            const base64UrlPattern = /^[A-Za-z0-9_-]+$/;
+            if (!base64UrlPattern.test(parts[1]))
+                return null;
+            // Validação de tamanho razoável
+            if (parts[1].length > 10000)
+                return null;
+            const payload = parts[1];
+            const decoded = atob(payload.replace(/-/g, '+').replace(/_/g, '/'));
+            // Parse seguro com proteção contra prototype pollution
+            return JSON.parse(decoded, (key, value) => {
+                if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+                    return undefined;
+                }
+                return value;
+            });
+        }
+        catch (error) {
+            console.warn('Erro ao decodificar token para UI:', error);
+            return null;
+        }
+    }
+    /**
+     * Versão síncrona DESATUALIZADA (tokens agora são criptografados)
+     * ⚠️ AVISO: Esta versão não funciona mais com tokens criptografados
+     * Use getToken() async para acessar tokens de forma segura
+     */
+    getTokenSync() {
+        console.warn('⚠️ getTokenSync() DESCONTINUADO: Tokens agora são criptografados. ' +
+            'Use getToken() async para descriptografia segura.');
+        // Não é possível descriptografar sincronamente
+        // A criptografia AES-GCM requer operações assíncronas
+        return null;
+    }
+    /**
+     * Verifica se token está próximo de expirar (para UI)
+     * ⚠️ ATENÇÃO: Agora é assíncrono devido à criptografia
+     */
+    async isTokenExpiringSoon(minutesThreshold = 5) {
+        try {
+            const token = await this.getToken();
+            if (!token)
+                return true;
+            const tokenData = this.decodeTokenPayload(token);
+            if (!tokenData || !tokenData.exp)
+                return true;
+            const now = Math.floor(Date.now() / 1000);
+            const timeUntilExpiry = tokenData.exp - now;
+            return timeUntilExpiry < (minutesThreshold * 60);
+        }
+        catch (error) {
+            console.warn('Erro ao verificar expiração do token:', error);
+            return true; // Em caso de erro, assumir que está expirando
+        }
+    }
+    /**
+     * Método utilitário: Obtém e decodifica token em uma operação
+     * Ideal para componentes que precisam dos dados do token para UI
+     */
+    async getDecodedTokenData() {
+        try {
+            const token = await this.getToken();
+            if (!token)
+                return null;
+            return this.decodeTokenPayload(token);
+        }
+        catch (error) {
+            console.warn('Erro ao obter dados decodificados do token:', error);
+            return null;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AuthStorageService, deps: [{ token: LocalStorageService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AuthStorageService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AuthStorageService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: LocalStorageService }] });
+
+/**
+ * Token de injeção para o AuthProvider
+ */
+const AUTH_PROVIDER = new InjectionToken('AuthProvider');
+class LoginService {
+    authStorage;
+    authProvider;
+    DEFAULT_OPTIONS = {
+        // Configurações visuais
+        title: 'Login',
+        subtitle: 'Entre na sua conta',
+        logoUrl: '',
+        backgroundUrl: '',
+        footerText: '',
+        // Funcionalidades
+        redirectUrl: '/dashboard',
+        showForgotPassword: true,
+        showRegisterLink: true,
+        passwordMinLength: 6,
+        // Links personalizados
+        links: {
+            forgotPassword: '/forgot-password',
+            register: '/register',
+            termsOfService: '/terms',
+            privacyPolicy: '/privacy'
+        },
+        // Personalização visual
+        theme: 'light',
+        primaryColor: '#3b82f6'
+    };
+    // Estado reativo do login
+    loginState$ = new BehaviorSubject({
+        status: LoginStatus.IDLE,
+        user: null,
+        isAuthenticated: false,
+        errors: {},
+        lastAttempt: null
+    });
+    // Configurações atuais
+    currentOptions = { ...this.DEFAULT_OPTIONS };
+    constructor(authStorage, authProvider) {
+        this.authStorage = authStorage;
+        this.authProvider = authProvider;
+        this.initializeService();
+    }
+    /**
+     * Observable do estado completo do login
+     */
+    get state$() {
+        return this.loginState$.asObservable();
+    }
+    /**
+     * Observable apenas do status de loading
+     */
+    get isLoading$() {
+        return this.loginState$.pipe(map(state => state.status === LoginStatus.LOADING));
+    }
+    /**
+     * Observable apenas do status de autenticação
+     */
+    get isAuthenticated$() {
+        return this.loginState$.pipe(map(state => state.isAuthenticated));
+    }
+    /**
+     * Observable apenas dos erros
+     */
+    get errors$() {
+        return this.loginState$.pipe(map(state => state.errors));
+    }
+    /**
+     * Observable do usuário atual
+     */
+    get currentUser$() {
+        return this.loginState$.pipe(map(state => state.user));
+    }
+    /**
+     * Configura opções do serviço de login
+     */
+    configure(options) {
+        this.currentOptions = { ...this.currentOptions, ...options };
+    }
+    /**
+     * Realiza login com as credenciais fornecidas
+     */
+    async login(credentials) {
+        // Valida credenciais básicas
+        const validationErrors = this.validateCredentials(credentials);
+        if (Object.keys(validationErrors).length > 0) {
+            this.updateState({
+                status: LoginStatus.ERROR,
+                errors: validationErrors
+            });
+            return { success: false, message: 'Dados inválidos', errors: Object.values(validationErrors).flat() };
+        }
+        // Inicia processo de login
+        this.updateState({
+            status: LoginStatus.LOADING,
+            errors: {}
+        });
+        try {
+            let response;
+            // if (this.authProvider) {
+            //   // Usa provider customizado da aplicação
+            //   response = await this.authProvider.login(credentials);
+            // } else {
+            //   // Simula resposta (para desenvolvimento/demo)
+            //   response = await this.simulateLogin(credentials);
+            // }
+            response = await this.simulateLogin(credentials);
+            if (response.success && response.accessToken && response.user) {
+                // Login bem-sucedido
+                await this.handleSuccessfulLogin(response);
+                this.updateState({
+                    status: LoginStatus.SUCCESS,
+                    user: response.user,
+                    isAuthenticated: true,
+                    errors: {}
+                });
+                // Login bem-sucedido
+                return response;
+            }
+            else {
+                // Login falhou
+                await this.handleFailedLogin();
+                this.updateState({
+                    status: LoginStatus.ERROR,
+                    errors: { general: [response.message || 'Credenciais inválidas'] }
+                });
+                return response;
+            }
+        }
+        catch (error) {
+            console.error('Erro durante login:', error);
+            await this.handleFailedLogin();
+            const errorMessage = error instanceof Error ? error.message : 'Erro interno do servidor';
+            this.updateState({
+                status: LoginStatus.ERROR,
+                errors: { general: [errorMessage] }
+            });
+            return { success: false, message: errorMessage };
+        }
+    }
+    /**
+     * Realiza logout
+     */
+    async logout() {
+        this.updateState({ status: LoginStatus.LOADING });
+        try {
+            let response = { success: true };
+            if (this.authProvider?.logout) {
+                // Notifica o backend
+                response = await this.authProvider.logout();
+            }
+            // Limpa dados locais independente da resposta do backend
+            this.authStorage.clearAuthData();
+            this.updateState({
+                status: LoginStatus.IDLE,
+                user: null,
+                isAuthenticated: false,
+                errors: {},
+                lastAttempt: null
+            });
+            return response;
+        }
+        catch (error) {
+            console.error('Erro durante logout:', error);
+            // Mesmo com erro, limpa dados locais
+            this.authStorage.clearAuthData();
+            this.updateState({
+                status: LoginStatus.IDLE,
+                user: null,
+                isAuthenticated: false,
+                errors: {}
+            });
+            return { success: true }; // Sempre considera logout como sucesso localmente
+        }
+    }
+    /**
+     * Verifica se o usuário atual está autenticado
+     */
+    async checkAuthenticationStatus() {
+        try {
+            const hasToken = await this.authStorage.hasToken();
+            if (!hasToken) {
+                this.updateState({
+                    status: LoginStatus.IDLE,
+                    isAuthenticated: false,
+                    user: null
+                });
+                return false;
+            }
+            // Carrega dados do usuário se autenticado
+            const userData = await this.authStorage.getUserData();
+            if (userData) {
+                this.updateState({
+                    status: LoginStatus.SUCCESS,
+                    isAuthenticated: true,
+                    user: userData
+                });
+                return true;
+            }
+            return false;
+        }
+        catch (error) {
+            console.error('Erro ao verificar autenticação:', error);
+            return false;
+        }
+    }
+    /**
+     * Obtém informações do usuário atual
+     */
+    async getCurrentUser() {
+        return await this.authStorage.getUserData();
+    }
+    /**
+     * Verifica se token está expirando em breve
+     * ⚠️ ATENÇÃO: Agora é assíncrono devido à criptografia
+     */
+    async isTokenExpiringSoon(minutesThreshold = 5) {
+        return await this.authStorage.isTokenExpiringSoon(minutesThreshold);
+    }
+    /**
+     * Limpa erros do estado atual
+     */
+    clearErrors() {
+        this.updateState({ errors: {} });
+    }
+    /**
+     * Reseta estado do login
+     */
+    async resetLoginState() {
+        this.updateState({
+            status: LoginStatus.IDLE,
+            errors: {}
+        });
+    }
+    // ========== MÉTODOS PRIVADOS ==========
+    /**
+     * Inicializa o serviço
+     */
+    async initializeService() {
+        // Inicialização simples sem controle de tentativas
+        // Verifica autenticação atual
+        await this.checkAuthenticationStatus();
+        // Monitora mudanças de autenticação
+        this.authStorage.authState$.subscribe(isAuthenticated => {
+            if (!isAuthenticated && this.loginState$.value.isAuthenticated) {
+                // Usuário perdeu autenticação
+                this.updateState({
+                    status: LoginStatus.IDLE,
+                    user: null,
+                    isAuthenticated: false
+                });
+            }
+        });
+    }
+    /**
+     * Atualiza estado reativo
+     */
+    updateState(updates) {
+        const currentState = this.loginState$.value;
+        this.loginState$.next({
+            ...currentState,
+            ...updates,
+            lastAttempt: updates.status === LoginStatus.LOADING ? new Date() : currentState.lastAttempt
+        });
+    }
+    /**
+     * Valida credenciais do formulário
+     */
+    validateCredentials(credentials) {
+        const errors = {};
+        // Validação de email
+        if (!credentials.email) {
+            errors.email = ['Email é obrigatório'];
+        }
+        else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(credentials.email)) {
+            errors.email = ['Email deve ter um formato válido'];
+        }
+        // Validação de senha
+        if (!credentials.password) {
+            errors.password = ['Senha é obrigatória'];
+        }
+        else if (credentials.password.length < 3) {
+            errors.password = ['Senha deve ter pelo menos 3 caracteres'];
+        }
+        return errors;
+    }
+    /**
+     * Trata login bem-sucedido
+     */
+    async handleSuccessfulLogin(response) {
+        if (!response.accessToken || !response.user) {
+            throw new Error('Resposta de login inválida');
+        }
+        // Salva token
+        const expiryMinutes = response.expiresIn || 60; // Default 1 hora
+        await this.authStorage.setToken(response.accessToken, expiryMinutes);
+        // Salva dados do usuário
+        await this.authStorage.setUserData(response.user);
+        // Credenciais salvas com sucesso
+    }
+    /**
+     * Trata falha de login
+     */
+    async handleFailedLogin() {
+        // Registra falha de login
+        console.warn('Tentativa de login falhou');
+    }
+    /**
+     * Simula resposta de login para desenvolvimento/demo
+     */
+    async simulateLogin(credentials) {
+        // Simula delay da rede
+        await new Promise(resolve => setTimeout(resolve, 1000));
+        // Credenciais de demo
+        const demoUsers = [
+            {
+                email: 'admin@demo.com',
+                password: 'admin',
+                user: {
+                    id: '1',
+                    nome: 'Administrador',
+                    email: 'admin@demo.com',
+                    perfil: 'ADMIN',
+                    permissoes: ['TODAS'],
+                    avatar: 'https://via.placeholder.com/100'
+                }
+            },
+            {
+                email: 'professor@demo.com',
+                password: 'professor',
+                user: {
+                    id: '2',
+                    nome: 'Professor Demo',
+                    email: 'professor@demo.com',
+                    perfil: 'PROFESSOR',
+                    permissoes: ['CRIAR_PROVA', 'VER_RESULTADOS'],
+                    avatar: 'https://via.placeholder.com/100'
+                }
+            },
+            {
+                email: 'aluno@demo.com',
+                password: 'aluno',
+                user: {
+                    id: '3',
+                    nome: 'Aluno Demo',
+                    email: 'aluno@demo.com',
+                    perfil: 'ALUNO',
+                    permissoes: ['RESPONDER_PROVA'],
+                    avatar: 'https://via.placeholder.com/100'
+                }
+            }
+        ];
+        const validUser = demoUsers.find(user => user.email === credentials.email && user.password === credentials.password);
+        if (validUser) {
+            // Gera token fake
+            const header = btoa(JSON.stringify({ alg: 'HS256', typ: 'JWT' }));
+            const payload = btoa(JSON.stringify({
+                sub: validUser.user.id,
+                email: validUser.user.email,
+                name: validUser.user.nome,
+                roles: validUser.user.permissoes,
+                iat: Math.floor(Date.now() / 1000),
+                exp: Math.floor(Date.now() / 1000) + (60 * 60) // 1 hora
+            }));
+            const fakeToken = `${header}.${payload}.fake-signature`;
+            return {
+                success: true,
+                accessToken: fakeToken,
+                user: validUser.user,
+                expiresIn: 60,
+                message: 'Login realizado com sucesso'
+            };
+        }
+        return {
+            success: false,
+            message: 'Email ou senha incorretos'
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LoginService, deps: [{ token: AuthStorageService }, { token: AUTH_PROVIDER, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LoginService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LoginService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: AuthStorageService }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [AUTH_PROVIDER]
+                }] }] });
+
+class LoginComponent {
+    loginService;
+    destroy$ = new Subject();
+    fb = inject(FormBuilder);
+    // Configurações do componente
+    options = {};
+    showHeader = true;
+    showFooter = true;
+    logoUrl;
+    backgroundImageUrl;
+    customCssClass;
+    // Eventos
+    loginSuccess = new EventEmitter();
+    loginError = new EventEmitter();
+    formChange = new EventEmitter();
+    // Estado do componente
+    loginForm;
+    loginState$;
+    isLoading$;
+    errors$;
+    // Estados locais
+    showPassword = false;
+    LoginStatus = LoginStatus; // Para usar no template
+    constructor(loginService) {
+        this.loginService = loginService;
+        this.createForm();
+        this.initializeObservables();
+    }
+    /**
+     * Inicializa os observables
+     */
+    initializeObservables() {
+        this.loginState$ = this.loginService.state$;
+        this.isLoading$ = this.loginService.isLoading$;
+        this.errors$ = this.loginService.errors$;
+    }
+    ngOnInit() {
+        // Configura opções do serviço
+        if (this.options) {
+            this.loginService.configure(this.options);
+        }
+        // Monitora mudanças do estado
+        this.loginState$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(state => this.handleStateChange(state));
+        // Monitora mudanças do formulário
+        this.loginForm.valueChanges
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(value => {
+            this.formChange.emit(value);
+        });
+        // Limpa erros quando usuário começa a digitar
+        this.loginForm.get('email')?.valueChanges
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(() => this.loginService.clearErrors());
+        this.loginForm.get('password')?.valueChanges
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(() => this.loginService.clearErrors());
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    /**
+     * Cria o formulário reativo
+     */
+    createForm() {
+        this.loginForm = this.fb.group({
+            email: ['', [
+                    Validators.required,
+                    Validators.email,
+                    Validators.maxLength(255)
+                ]],
+            password: ['', [
+                    Validators.required,
+                    Validators.minLength(3),
+                    Validators.maxLength(100)
+                ]],
+            rememberMe: [false]
+        });
+    }
+    /**
+     * Manipula mudanças de estado do login
+     */
+    handleStateChange(state) {
+        if (state.status === LoginStatus.SUCCESS && state.user) {
+            this.loginSuccess.emit({
+                success: true,
+                user: state.user,
+                accessToken: '', // Não expor token no evento
+                message: 'Login realizado com sucesso'
+            });
+        }
+        if (state.status === LoginStatus.ERROR && state.errors.general) {
+            this.loginError.emit(state.errors.general[0]);
+        }
+    }
+    /**
+     * Submete o formulário de login
+     */
+    async onSubmit() {
+        if (this.loginForm.invalid) {
+            this.markFormGroupTouched();
+            return;
+        }
+        const credentials = this.loginForm.value;
+        try {
+            const response = await this.loginService.login(credentials);
+            if (!response.success) {
+                // Erro já tratado pelo serviço via observable
+                console.warn('Login falhou:', response.message);
+            }
+        }
+        catch (error) {
+            console.error('Erro no componente de login:', error);
+        }
+    }
+    /**
+     * Alterna visibilidade da senha
+     */
+    togglePasswordVisibility() {
+        this.showPassword = !this.showPassword;
+    }
+    /**
+     * Marca todos os campos como tocados para mostrar erros
+     */
+    markFormGroupTouched() {
+        Object.keys(this.loginForm.controls).forEach(key => {
+            const control = this.loginForm.get(key);
+            control?.markAsTouched();
+        });
+    }
+    /**
+     * Verifica se campo tem erro específico
+     */
+    hasFieldError(fieldName, errorType) {
+        const field = this.loginForm.get(fieldName);
+        return !!(field?.hasError(errorType) && (field?.dirty || field?.touched));
+    }
+    /**
+     * Obtém mensagem de erro do campo
+     */
+    getFieldErrorMessage(fieldName) {
+        const field = this.loginForm.get(fieldName);
+        if (!field || !field.errors || (!field.dirty && !field.touched)) {
+            return '';
+        }
+        const errors = field.errors;
+        if (errors['required']) {
+            return `${this.getFieldLabel(fieldName)} é obrigatório`;
+        }
+        if (errors['email']) {
+            return 'Email deve ter um formato válido';
+        }
+        if (errors['minlength']) {
+            return `${this.getFieldLabel(fieldName)} deve ter pelo menos ${errors['minlength'].requiredLength} caracteres`;
+        }
+        if (errors['maxlength']) {
+            return `${this.getFieldLabel(fieldName)} deve ter no máximo ${errors['maxlength'].requiredLength} caracteres`;
+        }
+        return 'Campo inválido';
+    }
+    /**
+     * Obtém label do campo
+     */
+    getFieldLabel(fieldName) {
+        const labels = {
+            email: 'Email',
+            password: 'Senha'
+        };
+        return labels[fieldName] || fieldName;
+    }
+    /**
+     * Reseta o formulário
+     */
+    resetForm() {
+        this.loginForm.reset();
+        this.showPassword = false;
+        this.loginService.clearErrors();
+    }
+    /**
+     * Tenta fazer login com credenciais de demonstração
+     */
+    async loginWithDemo(userType) {
+        const demoCredentials = {
+            admin: {
+                email: 'admin@demo.com',
+                password: 'admin'
+            },
+            professor: {
+                email: 'professor@demo.com',
+                password: 'professor'
+            },
+            aluno: {
+                email: 'aluno@demo.com',
+                password: 'aluno'
+            }
+        };
+        const credentials = demoCredentials[userType];
+        if (credentials) {
+            // Preenche formulário
+            this.loginForm.patchValue(credentials);
+            // Executa login
+            await this.onSubmit();
+        }
+    }
+    /**
+     * Manipula esqueci minha senha
+     */
+    onForgotPassword() {
+        // Implementação específica da aplicação
+        console.log('Forgot password clicked');
+    }
+    /**
+     * Manipula criação de conta
+     */
+    onCreateAccount() {
+        // Implementação específica da aplicação
+        console.log('Create account clicked');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LoginComponent, deps: [{ token: LoginService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: LoginComponent, isStandalone: true, selector: "lib-login", inputs: { options: "options", showHeader: "showHeader", showFooter: "showFooter", logoUrl: "logoUrl", backgroundImageUrl: "backgroundImageUrl", customCssClass: "customCssClass" }, outputs: { loginSuccess: "loginSuccess", loginError: "loginError", formChange: "formChange" }, ngImport: i0, template: "<!-- Container principal do login -->\n<div class=\"login-container\" [ngClass]=\"customCssClass\"\n    [style.background-image]=\"options.backgroundUrl ? 'url(' + options.backgroundUrl + ')' : null\">\n\n    <!-- Card de login -->\n    <div class=\"login-card\">\n\n        <!-- Header -->\n        <div class=\"login-header\">\n            <img *ngIf=\"options.logoUrl\" [src]=\"options.logoUrl\" alt=\"Logo\" class=\"login-logo\">\n\n            <h1 class=\"login-title\">{{ options.title || 'Entrar' }}</h1>\n            <p class=\"login-subtitle\">{{ options.subtitle || 'Acesse sua conta' }}</p>\n        </div>\n\n        <!-- Indicador de loading -->\n        <div *ngIf=\"isLoading$ | async\" class=\"loading-overlay\">\n            <div class=\"loading-spinner\"></div>\n            <span class=\"loading-text\">Entrando...</span>\n        </div>\n\n        <!-- Estado de bloqueio removido conforme solicita\u00E7\u00E3o -->\n\n        <!-- Formul\u00E1rio de login -->\n        <form [formGroup]=\"loginForm\" (ngSubmit)=\"onSubmit()\" class=\"login-form\"\n            [class.disabled]=\"(isLoading$ | async)\">\n\n            <!-- Campo Email -->\n            <div class=\"form-group\">\n                <label for=\"email\" class=\"form-label\">\n                    Email <span class=\"required\">*</span>\n                </label>\n\n                <div class=\"input-wrapper\">\n                    <input id=\"email\" type=\"email\" formControlName=\"email\" class=\"form-input\"\n                        [class.error]=\"hasFieldError('email', 'required') || hasFieldError('email', 'email')\"\n                        placeholder=\"Digite seu email\" autocomplete=\"email\" autocapitalize=\"off\">\n\n                    <i class=\"input-icon icon-email\"></i>\n                </div>\n\n                <!-- Erro do campo email -->\n                <div *ngIf=\"getFieldErrorMessage('email')\" class=\"field-error\">\n                    {{ getFieldErrorMessage('email') }}\n                </div>\n            </div>\n\n            <!-- Campo Senha -->\n            <div class=\"form-group\">\n                <label for=\"password\" class=\"form-label\">\n                    Senha <span class=\"required\">*</span>\n                </label>\n\n                <div class=\"input-wrapper\">\n                    <input id=\"password\" [type]=\"showPassword ? 'text' : 'password'\" formControlName=\"password\"\n                        class=\"form-input\"\n                        [class.error]=\"hasFieldError('password', 'required') || hasFieldError('password', 'minlength')\"\n                        placeholder=\"Digite sua senha\" autocomplete=\"current-password\">\n\n                    <button type=\"button\" class=\"password-toggle\" (click)=\"togglePasswordVisibility()\"\n                        [attr.aria-label]=\"showPassword ? 'Ocultar senha' : 'Mostrar senha'\">\n                        <i [class]=\"showPassword ? 'icon-eye-off' : 'icon-eye'\"></i>\n                    </button>\n                </div>\n\n                <!-- Erro do campo senha -->\n                <div *ngIf=\"getFieldErrorMessage('password')\" class=\"field-error\">\n                    {{ getFieldErrorMessage('password') }}\n                </div>\n            </div>\n\n            <!-- Checkbox removido conforme solicita\u00E7\u00E3o -->\n\n            <!-- Erros gerais -->\n            <div *ngIf=\"(errors$ | async)?.general\" class=\"alert alert-error\">\n                <i class=\"icon-error\"></i>\n                <div>\n                    <div *ngFor=\"let error of (errors$ | async)?.general\">\n                        {{ error }}\n                    </div>\n                </div>\n            </div>\n\n            <!-- Bot\u00E3o de submit -->\n            <button type=\"submit\" class=\"login-button\" [disabled]=\"loginForm.invalid || (isLoading$ | async)\">\n\n                <span *ngIf=\"!(isLoading$ | async)\">Entrar</span>\n                <span *ngIf=\"isLoading$ | async\" class=\"loading-content\">\n                    <i class=\"icon-spinner spin\"></i>\n                    Entrando...\n                </span>\n            </button>\n\n            <!-- Contador de tentativas removido conforme solicita\u00E7\u00E3o -->\n        </form>\n\n        <!-- Links adicionais -->\n        <div class=\"login-links\">\n            <a href=\"#\" (click)=\"onForgotPassword(); $event.preventDefault()\" class=\"link\">\n                Esqueci minha senha\n            </a>\n\n            <span class=\"separator\">\u2022</span>\n\n            <a href=\"#\" (click)=\"onCreateAccount(); $event.preventDefault()\" class=\"link\">\n                Criar conta\n            </a>\n        </div>\n\n        <!-- Se\u00E7\u00E3o de demonstra\u00E7\u00E3o removida conforme solicita\u00E7\u00E3o -->\n\n        <!-- Footer -->\n        <div *ngIf=\"options.footerText\" class=\"login-footer\">\n            <p class=\"footer-text\">\n                {{ options.footerText }}\n            </p>\n        </div>\n    </div>\n</div>", styles: ["@charset \"UTF-8\";:host{--login-primary-color: #007bff;--login-primary-hover: #0056b3;--login-secondary-color: #6c757d;--login-background: #f8f9fa;--login-card-background: #ffffff;--login-border-color: #dee2e6;--login-text-color: #343a40;--login-error-color: #dc3545;--login-success-color: #28a745;--login-warning-color: #ffc107;--login-shadow: 0 10px 25px rgba(0, 0, 0, .1);--login-border-radius: .75rem;--login-transition: all .3s ease}.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:1rem;background:var(--login-background);background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;font-family:DM Sans,sans-serif}.login-container:before{content:\"\";position:absolute;inset:0;background:#0000004d;z-index:1;opacity:0;transition:opacity .3s ease}.login-container[style*=background-image]:before{opacity:1}.login-card{background:var(--login-card-background);border-radius:var(--login-border-radius);box-shadow:var(--login-shadow);padding:2rem;width:100%;max-width:420px;position:relative;border:1px solid var(--login-border-color);z-index:2}@media (max-width: 480px){.login-card{padding:1.5rem;margin:.5rem}}.login-header{text-align:center;margin-bottom:2rem}.login-header .login-logo{max-width:80px;height:auto;margin-bottom:1rem}.login-header .login-title{font-family:DM Sans,sans-serif;font-size:1.75rem;font-weight:700;color:var(--login-text-color);margin:0 0 .5rem;line-height:1.2}.login-header .login-subtitle{font-size:.875rem;color:var(--login-secondary-color);margin:0;font-weight:400}.loading-overlay{position:absolute;inset:0;background:#fffffff2;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--login-border-radius);z-index:10}.loading-overlay .loading-spinner{width:40px;height:40px;border:3px solid var(--login-border-color);border-top:3px solid var(--login-primary-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.loading-overlay .loading-text{color:var(--login-secondary-color);font-size:.9rem;font-weight:500}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.login-form.disabled{pointer-events:none;opacity:.7}.form-group{margin-bottom:1.5rem}.form-label{display:block;font-family:DM Sans,sans-serif;font-size:.875rem;font-weight:600;color:var(--login-text-color);margin-bottom:.5rem;line-height:2.5}.form-label .required{color:var(--login-error-color);margin-left:.25rem}.input-wrapper{position:relative;display:flex;align-items:center}.form-input{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem;border:1px solid var(--login-border-color);border-radius:.25rem;display:block;width:100%;padding:.375rem 2.75rem .375rem .75rem;line-height:1.5;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-clip:padding-box;color:var(--login-text-color);transition:var(--login-transition);outline:none}.form-input::placeholder{color:#6c757d}.form-input:focus{border-color:#b2b9be;box-shadow:none}.form-input:focus.error{border-color:var(--login-error-color)}.form-input.error{border-color:var(--login-error-color)}.form-input:disabled{background:#f8f9fa;color:#6c757d;cursor:not-allowed}.input-icon{position:absolute;right:1rem;color:var(--login-secondary-color);font-size:1.1rem;pointer-events:none}.password-toggle{position:absolute;right:.75rem;background:none;border:none;padding:.25rem;cursor:pointer;color:var(--login-secondary-color);transition:var(--login-transition);border-radius:4px}.password-toggle:hover{color:var(--login-primary-color);background:#3b82f61a}.password-toggle:focus{outline:none;box-shadow:0 0 0 2px #3b82f64d}.field-error{margin-top:.5rem;font-size:.75rem;color:var(--login-error-color);font-family:DM Sans,sans-serif}.field-error:before{content:\"\\26a0  \";font-size:.75rem}.alert{padding:1rem;border-radius:8px;margin-bottom:1rem;display:flex;align-items:flex-start;gap:.75rem;font-size:.9rem}.alert.alert-error{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}.alert.alert-error i{color:var(--login-error-color);font-size:1.1rem;margin-top:.1rem}.alert.alert-warning{background:#fffbeb;border:1px solid #fed7aa;color:#92400e}.alert.alert-warning i{color:var(--login-warning-color);font-size:1.1rem;margin-top:.1rem}.lockout-message{margin-bottom:1.5rem}.lockout-message strong{display:block;margin-bottom:.5rem}.lockout-message p{margin:.25rem 0}.login-button{width:100%;padding:.375rem .75rem;background:var(--login-primary-color);color:#fff;border:none;border-radius:.25rem;font-family:DM Sans,sans-serif;font-size:.875rem;font-weight:600;cursor:pointer;transition:var(--login-transition);position:relative;display:flex;align-items:center;justify-content:center;gap:.5rem;line-height:1.5}.login-button:hover:not(:disabled){background:var(--login-primary-hover)}.login-button:focus{outline:none;box-shadow:0 0 0 .2rem #007bff40}.login-button:disabled{background:#6c757d;cursor:not-allowed}.login-button .loading-content{display:flex;align-items:center;gap:.5rem}.login-button .icon-spinner{animation:spin 1s linear infinite}.login-links{margin-top:1.5rem;text-align:center;display:flex;align-items:center;justify-content:center;gap:.75rem;flex-wrap:wrap}.login-links .link{color:var(--login-primary-color);text-decoration:none;font-size:.875rem;font-weight:500;transition:var(--login-transition)}.login-links .link:hover{color:var(--login-primary-hover);text-decoration:underline}.login-links .link:focus{outline:2px solid var(--login-primary-color);outline-offset:2px;border-radius:4px}.login-links .separator{color:var(--login-secondary-color);font-size:.875rem}.login-footer{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--login-border-color);text-align:center}.login-footer .footer-text{font-family:DM Sans,sans-serif;font-size:.75rem;color:var(--login-secondary-color);margin:0;font-weight:400}@media (max-width: 640px){.login-container{padding:.5rem}.login-card{padding:1.5rem}.login-header .login-title{font-size:1.5rem}.demo-buttons{grid-template-columns:1fr}.login-links{flex-direction:column;gap:.5rem}.login-links .separator{display:none}}@media (max-width: 480px){.form-input{padding:.75rem;font-size:.9rem}.login-button{padding:.8rem;font-size:.9rem}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.login-card{animation:fadeIn .5s ease-out}@media (prefers-color-scheme: dark){:host{--login-background: #0f172a;--login-card-background: #1e293b;--login-border-color: #334155;--login-text-color: #f1f5f9;--login-secondary-color: #94a3b8}}@media (prefers-contrast: high){:host{--login-border-color: #000000;--login-text-color: #000000;--login-background: #ffffff}.form-input:focus{border-width:3px}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media print{.login-container{min-height:auto;background:#fff}.demo-section,.loading-overlay{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LoginComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-login', standalone: true, imports: [CommonModule, ReactiveFormsModule], template: "<!-- Container principal do login -->\n<div class=\"login-container\" [ngClass]=\"customCssClass\"\n    [style.background-image]=\"options.backgroundUrl ? 'url(' + options.backgroundUrl + ')' : null\">\n\n    <!-- Card de login -->\n    <div class=\"login-card\">\n\n        <!-- Header -->\n        <div class=\"login-header\">\n            <img *ngIf=\"options.logoUrl\" [src]=\"options.logoUrl\" alt=\"Logo\" class=\"login-logo\">\n\n            <h1 class=\"login-title\">{{ options.title || 'Entrar' }}</h1>\n            <p class=\"login-subtitle\">{{ options.subtitle || 'Acesse sua conta' }}</p>\n        </div>\n\n        <!-- Indicador de loading -->\n        <div *ngIf=\"isLoading$ | async\" class=\"loading-overlay\">\n            <div class=\"loading-spinner\"></div>\n            <span class=\"loading-text\">Entrando...</span>\n        </div>\n\n        <!-- Estado de bloqueio removido conforme solicita\u00E7\u00E3o -->\n\n        <!-- Formul\u00E1rio de login -->\n        <form [formGroup]=\"loginForm\" (ngSubmit)=\"onSubmit()\" class=\"login-form\"\n            [class.disabled]=\"(isLoading$ | async)\">\n\n            <!-- Campo Email -->\n            <div class=\"form-group\">\n                <label for=\"email\" class=\"form-label\">\n                    Email <span class=\"required\">*</span>\n                </label>\n\n                <div class=\"input-wrapper\">\n                    <input id=\"email\" type=\"email\" formControlName=\"email\" class=\"form-input\"\n                        [class.error]=\"hasFieldError('email', 'required') || hasFieldError('email', 'email')\"\n                        placeholder=\"Digite seu email\" autocomplete=\"email\" autocapitalize=\"off\">\n\n                    <i class=\"input-icon icon-email\"></i>\n                </div>\n\n                <!-- Erro do campo email -->\n                <div *ngIf=\"getFieldErrorMessage('email')\" class=\"field-error\">\n                    {{ getFieldErrorMessage('email') }}\n                </div>\n            </div>\n\n            <!-- Campo Senha -->\n            <div class=\"form-group\">\n                <label for=\"password\" class=\"form-label\">\n                    Senha <span class=\"required\">*</span>\n                </label>\n\n                <div class=\"input-wrapper\">\n                    <input id=\"password\" [type]=\"showPassword ? 'text' : 'password'\" formControlName=\"password\"\n                        class=\"form-input\"\n                        [class.error]=\"hasFieldError('password', 'required') || hasFieldError('password', 'minlength')\"\n                        placeholder=\"Digite sua senha\" autocomplete=\"current-password\">\n\n                    <button type=\"button\" class=\"password-toggle\" (click)=\"togglePasswordVisibility()\"\n                        [attr.aria-label]=\"showPassword ? 'Ocultar senha' : 'Mostrar senha'\">\n                        <i [class]=\"showPassword ? 'icon-eye-off' : 'icon-eye'\"></i>\n                    </button>\n                </div>\n\n                <!-- Erro do campo senha -->\n                <div *ngIf=\"getFieldErrorMessage('password')\" class=\"field-error\">\n                    {{ getFieldErrorMessage('password') }}\n                </div>\n            </div>\n\n            <!-- Checkbox removido conforme solicita\u00E7\u00E3o -->\n\n            <!-- Erros gerais -->\n            <div *ngIf=\"(errors$ | async)?.general\" class=\"alert alert-error\">\n                <i class=\"icon-error\"></i>\n                <div>\n                    <div *ngFor=\"let error of (errors$ | async)?.general\">\n                        {{ error }}\n                    </div>\n                </div>\n            </div>\n\n            <!-- Bot\u00E3o de submit -->\n            <button type=\"submit\" class=\"login-button\" [disabled]=\"loginForm.invalid || (isLoading$ | async)\">\n\n                <span *ngIf=\"!(isLoading$ | async)\">Entrar</span>\n                <span *ngIf=\"isLoading$ | async\" class=\"loading-content\">\n                    <i class=\"icon-spinner spin\"></i>\n                    Entrando...\n                </span>\n            </button>\n\n            <!-- Contador de tentativas removido conforme solicita\u00E7\u00E3o -->\n        </form>\n\n        <!-- Links adicionais -->\n        <div class=\"login-links\">\n            <a href=\"#\" (click)=\"onForgotPassword(); $event.preventDefault()\" class=\"link\">\n                Esqueci minha senha\n            </a>\n\n            <span class=\"separator\">\u2022</span>\n\n            <a href=\"#\" (click)=\"onCreateAccount(); $event.preventDefault()\" class=\"link\">\n                Criar conta\n            </a>\n        </div>\n\n        <!-- Se\u00E7\u00E3o de demonstra\u00E7\u00E3o removida conforme solicita\u00E7\u00E3o -->\n\n        <!-- Footer -->\n        <div *ngIf=\"options.footerText\" class=\"login-footer\">\n            <p class=\"footer-text\">\n                {{ options.footerText }}\n            </p>\n        </div>\n    </div>\n</div>", styles: ["@charset \"UTF-8\";:host{--login-primary-color: #007bff;--login-primary-hover: #0056b3;--login-secondary-color: #6c757d;--login-background: #f8f9fa;--login-card-background: #ffffff;--login-border-color: #dee2e6;--login-text-color: #343a40;--login-error-color: #dc3545;--login-success-color: #28a745;--login-warning-color: #ffc107;--login-shadow: 0 10px 25px rgba(0, 0, 0, .1);--login-border-radius: .75rem;--login-transition: all .3s ease}.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:1rem;background:var(--login-background);background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;font-family:DM Sans,sans-serif}.login-container:before{content:\"\";position:absolute;inset:0;background:#0000004d;z-index:1;opacity:0;transition:opacity .3s ease}.login-container[style*=background-image]:before{opacity:1}.login-card{background:var(--login-card-background);border-radius:var(--login-border-radius);box-shadow:var(--login-shadow);padding:2rem;width:100%;max-width:420px;position:relative;border:1px solid var(--login-border-color);z-index:2}@media (max-width: 480px){.login-card{padding:1.5rem;margin:.5rem}}.login-header{text-align:center;margin-bottom:2rem}.login-header .login-logo{max-width:80px;height:auto;margin-bottom:1rem}.login-header .login-title{font-family:DM Sans,sans-serif;font-size:1.75rem;font-weight:700;color:var(--login-text-color);margin:0 0 .5rem;line-height:1.2}.login-header .login-subtitle{font-size:.875rem;color:var(--login-secondary-color);margin:0;font-weight:400}.loading-overlay{position:absolute;inset:0;background:#fffffff2;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--login-border-radius);z-index:10}.loading-overlay .loading-spinner{width:40px;height:40px;border:3px solid var(--login-border-color);border-top:3px solid var(--login-primary-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.loading-overlay .loading-text{color:var(--login-secondary-color);font-size:.9rem;font-weight:500}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.login-form.disabled{pointer-events:none;opacity:.7}.form-group{margin-bottom:1.5rem}.form-label{display:block;font-family:DM Sans,sans-serif;font-size:.875rem;font-weight:600;color:var(--login-text-color);margin-bottom:.5rem;line-height:2.5}.form-label .required{color:var(--login-error-color);margin-left:.25rem}.input-wrapper{position:relative;display:flex;align-items:center}.form-input{font-family:DM Sans,sans-serif;font-weight:400;font-size:.875rem;border:1px solid var(--login-border-color);border-radius:.25rem;display:block;width:100%;padding:.375rem 2.75rem .375rem .75rem;line-height:1.5;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-clip:padding-box;color:var(--login-text-color);transition:var(--login-transition);outline:none}.form-input::placeholder{color:#6c757d}.form-input:focus{border-color:#b2b9be;box-shadow:none}.form-input:focus.error{border-color:var(--login-error-color)}.form-input.error{border-color:var(--login-error-color)}.form-input:disabled{background:#f8f9fa;color:#6c757d;cursor:not-allowed}.input-icon{position:absolute;right:1rem;color:var(--login-secondary-color);font-size:1.1rem;pointer-events:none}.password-toggle{position:absolute;right:.75rem;background:none;border:none;padding:.25rem;cursor:pointer;color:var(--login-secondary-color);transition:var(--login-transition);border-radius:4px}.password-toggle:hover{color:var(--login-primary-color);background:#3b82f61a}.password-toggle:focus{outline:none;box-shadow:0 0 0 2px #3b82f64d}.field-error{margin-top:.5rem;font-size:.75rem;color:var(--login-error-color);font-family:DM Sans,sans-serif}.field-error:before{content:\"\\26a0  \";font-size:.75rem}.alert{padding:1rem;border-radius:8px;margin-bottom:1rem;display:flex;align-items:flex-start;gap:.75rem;font-size:.9rem}.alert.alert-error{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}.alert.alert-error i{color:var(--login-error-color);font-size:1.1rem;margin-top:.1rem}.alert.alert-warning{background:#fffbeb;border:1px solid #fed7aa;color:#92400e}.alert.alert-warning i{color:var(--login-warning-color);font-size:1.1rem;margin-top:.1rem}.lockout-message{margin-bottom:1.5rem}.lockout-message strong{display:block;margin-bottom:.5rem}.lockout-message p{margin:.25rem 0}.login-button{width:100%;padding:.375rem .75rem;background:var(--login-primary-color);color:#fff;border:none;border-radius:.25rem;font-family:DM Sans,sans-serif;font-size:.875rem;font-weight:600;cursor:pointer;transition:var(--login-transition);position:relative;display:flex;align-items:center;justify-content:center;gap:.5rem;line-height:1.5}.login-button:hover:not(:disabled){background:var(--login-primary-hover)}.login-button:focus{outline:none;box-shadow:0 0 0 .2rem #007bff40}.login-button:disabled{background:#6c757d;cursor:not-allowed}.login-button .loading-content{display:flex;align-items:center;gap:.5rem}.login-button .icon-spinner{animation:spin 1s linear infinite}.login-links{margin-top:1.5rem;text-align:center;display:flex;align-items:center;justify-content:center;gap:.75rem;flex-wrap:wrap}.login-links .link{color:var(--login-primary-color);text-decoration:none;font-size:.875rem;font-weight:500;transition:var(--login-transition)}.login-links .link:hover{color:var(--login-primary-hover);text-decoration:underline}.login-links .link:focus{outline:2px solid var(--login-primary-color);outline-offset:2px;border-radius:4px}.login-links .separator{color:var(--login-secondary-color);font-size:.875rem}.login-footer{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--login-border-color);text-align:center}.login-footer .footer-text{font-family:DM Sans,sans-serif;font-size:.75rem;color:var(--login-secondary-color);margin:0;font-weight:400}@media (max-width: 640px){.login-container{padding:.5rem}.login-card{padding:1.5rem}.login-header .login-title{font-size:1.5rem}.demo-buttons{grid-template-columns:1fr}.login-links{flex-direction:column;gap:.5rem}.login-links .separator{display:none}}@media (max-width: 480px){.form-input{padding:.75rem;font-size:.9rem}.login-button{padding:.8rem;font-size:.9rem}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.login-card{animation:fadeIn .5s ease-out}@media (prefers-color-scheme: dark){:host{--login-background: #0f172a;--login-card-background: #1e293b;--login-border-color: #334155;--login-text-color: #f1f5f9;--login-secondary-color: #94a3b8}}@media (prefers-contrast: high){:host{--login-border-color: #000000;--login-text-color: #000000;--login-background: #ffffff}.form-input:focus{border-width:3px}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media print{.login-container{min-height:auto;background:#fff}.demo-section,.loading-overlay{display:none}}\n"] }]
+        }], ctorParameters: () => [{ type: LoginService }], propDecorators: { options: [{
+                type: Input
+            }], showHeader: [{
+                type: Input
+            }], showFooter: [{
+                type: Input
+            }], logoUrl: [{
+                type: Input
+            }], backgroundImageUrl: [{
+                type: Input
+            }], customCssClass: [{
+                type: Input
+            }], loginSuccess: [{
+                type: Output
+            }], loginError: [{
+                type: Output
+            }], formChange: [{
+                type: Output
+            }] } });
+
+/**
+ * Interceptor HTTP para autenticação automática
+ * Adiciona o Access Token nas requisições e trata erros 401
+ */
+class AuthInterceptor {
+    authStorage;
+    constructor(authStorage) {
+        this.authStorage = authStorage;
+    }
+    intercept(req, next) {
+        // Converte para Observable para trabalhar com async
+        return from(this.authStorage.getToken()).pipe(switchMap(token => {
+            // Clona a requisição e adiciona o token se disponível
+            let authReq = req;
+            if (token) {
+                authReq = req.clone({
+                    setHeaders: {
+                        Authorization: `Bearer ${token}`
+                    }
+                });
+            }
+            // Processa a requisição
+            return next.handle(authReq).pipe(catchError((error) => {
+                // Se receber 401, limpa os dados de autenticação
+                // O backend já fez o refresh automaticamente, se falhou é porque não tem mais sessão válida
+                if (error.status === 401) {
+                    this.authStorage.clearAuthData();
+                }
+                // Re-propaga o erro para ser tratado pelos componentes
+                return throwError(() => error);
+            }));
+        }));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AuthInterceptor, deps: [{ token: AuthStorageService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AuthInterceptor });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AuthInterceptor, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: AuthStorageService }] });
+
+// Export dos interceptors para uso público
+
+/*
+ * Public API Surface of shared-components
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AUTH_PROVIDER, AuthInterceptor, AuthStorageService, BreadcrumbComponent, ButtonComponent, CheckboxComponent, DropdownComponent, InputComponent, LocalStorageService, LoginComponent, LoginService, LoginStatus, SharedComponentsComponent, SharedComponentsService, SidebarComponent, TableComponent, ToggleComponent };
+//# sourceMappingURL=ramonbsales-noah-angular.mjs.map