import * as i0 from '@angular/core';
import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';

/**
 * @description Componente de alerta que exibe mensagens informativas, de sucesso, aviso ou erro.
 * Suporta fechamento manual pelo usuário e emite um evento ao ser fechado.
 *
 * @example
 * ```html
 * <s-alert
 *   severity="warning"
 *   summary="Atenção"
 *   detail="Verifique os dados antes de continuar."
 *   (closed)="onAlertClosed()"
 * />
 * ```
 *
 * @category Feedback
 */
class AlertComponent {
    /**
     * @description Nível de severidade do alerta, que define a cor e o ícone exibidos.
     * - `'info'`: alerta informativo (padrão).
     * - `'success'`: alerta de sucesso.
     * - `'warning'`: alerta de aviso.
     * - `'error'`: alerta de erro.
     *
     * @default 'info'
     */
    // sonar-ignore: Refactor this union type to have less than 3 elements
    severity = 'info';
    /**
     * @description Título principal do alerta exibido em destaque. Campo obrigatório.
     */
    summary;
    /**
     * @description Mensagem detalhada exibida abaixo do título do alerta. Campo obrigatório.
     */
    detail;
    /**
     * @description Quando `true`, exibe o botão de fechar o alerta.
     * Quando `false`, o alerta não pode ser dispensado pelo usuário.
     *
     * @default true
     */
    closable = true;
    /**
     * @description Emitido quando o usuário fecha o alerta clicando no botão de fechar.
     */
    closed = new EventEmitter();
    get isOpen() {
        return this._isOpen;
    }
    closeAlert() {
        this._isOpen = false;
    }
    showAlert() {
        this._isOpen = true;
    }
    onClose() {
        this.closed.emit();
        this.closeAlert();
    }
    _isOpen = true;
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: AlertComponent, selector: "s-alert", inputs: { severity: "severity", summary: "summary", detail: "detail", closable: "closable" }, outputs: { closed: "closed" }, ngImport: i0, template: "<div\n    class=\"alert\"\n    [ngClass]=\"{\n        'alert--info': severity === 'info',\n        'alert--success': severity === 'success',\n        'alert--warning': severity === 'warning',\n        'alert--error': severity === 'error',\n    }\"\n>\n    <div class=\"content\">\n        <div class=\"icon-container\">\n            <i\n                class=\"fas fa-info\"\n                [ngClass]=\"{\n                    'fa-info': severity === 'info',\n                    'fa-check': severity === 'success',\n                    'fa-exclamation-triangle': severity === 'warning',\n                    'fa-times': severity === 'error',\n                }\"\n            ></i>\n        </div>\n        <div class=\"text-container\">\n            <div class=\"text\">\n                @if (summary) {\n                    <span class=\"summary\">{{ summary }}</span>\n                }\n\n                @if (detail) {\n                    <span class=\"detail\">{{ detail }}</span>\n                }\n            </div>\n        </div>\n    </div>\n    @if (closable) {\n        <button\n            class=\"close-option\"\n            (click)=\"onClose()\"\n        >\n            <i class=\"fas fa-times\"></i>\n        </button>\n    }\n</div>\n", styles: [".alert{align-items:center;background-color:#f1f7f8;border-left:4px solid #428bca;border-radius:4px;box-shadow:1px 1px 2px #0003;display:flex;gap:16px;justify-content:space-between;margin:8px;padding:12px 16px}.alert .content{align-items:center;display:flex;gap:16px}.alert .content .icon-container{align-items:center;background-color:#428bca;border-radius:50%;color:#fff;display:inline-flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.alert .content .text-container{display:flex;flex-direction:column;gap:16px}.alert .content .text-container .text{display:flex;flex-direction:column;justify-content:flex-start}.alert .content .text-container .text .summary,.alert .content .text-container .text .detail{color:#212533;font-family:Open Sans,sans-serif;font-size:14px}.alert .content .text-container .text .summary{font-weight:700}.alert .close-option{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:16px;padding:4px}.alert--info{background-color:#f1f7f8;border-color:#428bca}.alert--info .content .icon-container{background-color:#428bca;color:#fff}.alert--success{background-color:#e0f0f0;border-color:#0c9348}.alert--success .content .icon-container{background-color:#0c9348;color:#fff}.alert--warning{background-color:#fef4e3;border-color:#fcbf10}.alert--warning .content .icon-container{background-color:#fcbf10;color:#212533}.alert--error{background-color:#fef0f0;border-color:#c13018}.alert--error .content .icon-container{background-color:#c13018;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AlertComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-alert', template: "<div\n    class=\"alert\"\n    [ngClass]=\"{\n        'alert--info': severity === 'info',\n        'alert--success': severity === 'success',\n        'alert--warning': severity === 'warning',\n        'alert--error': severity === 'error',\n    }\"\n>\n    <div class=\"content\">\n        <div class=\"icon-container\">\n            <i\n                class=\"fas fa-info\"\n                [ngClass]=\"{\n                    'fa-info': severity === 'info',\n                    'fa-check': severity === 'success',\n                    'fa-exclamation-triangle': severity === 'warning',\n                    'fa-times': severity === 'error',\n                }\"\n            ></i>\n        </div>\n        <div class=\"text-container\">\n            <div class=\"text\">\n                @if (summary) {\n                    <span class=\"summary\">{{ summary }}</span>\n                }\n\n                @if (detail) {\n                    <span class=\"detail\">{{ detail }}</span>\n                }\n            </div>\n        </div>\n    </div>\n    @if (closable) {\n        <button\n            class=\"close-option\"\n            (click)=\"onClose()\"\n        >\n            <i class=\"fas fa-times\"></i>\n        </button>\n    }\n</div>\n", styles: [".alert{align-items:center;background-color:#f1f7f8;border-left:4px solid #428bca;border-radius:4px;box-shadow:1px 1px 2px #0003;display:flex;gap:16px;justify-content:space-between;margin:8px;padding:12px 16px}.alert .content{align-items:center;display:flex;gap:16px}.alert .content .icon-container{align-items:center;background-color:#428bca;border-radius:50%;color:#fff;display:inline-flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.alert .content .text-container{display:flex;flex-direction:column;gap:16px}.alert .content .text-container .text{display:flex;flex-direction:column;justify-content:flex-start}.alert .content .text-container .text .summary,.alert .content .text-container .text .detail{color:#212533;font-family:Open Sans,sans-serif;font-size:14px}.alert .content .text-container .text .summary{font-weight:700}.alert .close-option{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:16px;padding:4px}.alert--info{background-color:#f1f7f8;border-color:#428bca}.alert--info .content .icon-container{background-color:#428bca;color:#fff}.alert--success{background-color:#e0f0f0;border-color:#0c9348}.alert--success .content .icon-container{background-color:#0c9348;color:#fff}.alert--warning{background-color:#fef4e3;border-color:#fcbf10}.alert--warning .content .icon-container{background-color:#fcbf10;color:#212533}.alert--error{background-color:#fef0f0;border-color:#c13018}.alert--error .content .icon-container{background-color:#c13018;color:#fff}\n"] }]
        }], propDecorators: { severity: [{
                type: Input
            }], summary: [{
                type: Input,
                args: [{ required: true }]
            }], detail: [{
                type: Input,
                args: [{ required: true }]
            }], closable: [{
                type: Input
            }], closed: [{
                type: Output
            }] } });

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

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

export { AlertComponent, AlertModule };
//# sourceMappingURL=seniorsistemas-angular-components-alert.mjs.map
