import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "monkey-style-guide";
import * as i2 from "@angular/common";
import * as i3 from "@ngx-translate/core";
export class AlertsComponent {
    constructor(modalService) {
        this.modalService = modalService;
        this.config = null;
        this._img = '';
        this._title = '';
        this._message = '';
        this._action = null;
        this._hideClose = false;
        // not to do
    }
    ngOnInit() {
        const { config } = this;
        this._img = config?.data?.img;
        this._title = config?.data?.title;
        this._message = config?.data?.message;
        this._action = config?.data?.action;
        this._hideClose = config?.data?.hideClose;
    }
    onClose() {
        this.modalService.close(this.modalRef);
    }
    onAction() {
        const { _action } = this;
        if (_action?.href) {
            window.location.href = _action?.href;
        }
    }
}
AlertsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AlertsComponent, deps: [{ token: i1.MonkeyStyleGuideModalService }], target: i0.ɵɵFactoryTarget.Component });
AlertsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AlertsComponent, selector: "monkeyecx-alerts", inputs: { config: "config", modalRef: "modalRef" }, ngImport: i0, template: "<monkey-modal [config]=\"config\" [modalRef]=\"modalRef\" *ngIf=\"config\">\n  <div class=\"alert-header\">\n    <img [src]=\"_img\">\n  </div>\n  <div class=\"alert-body\">\n    <span class=\"title\">\n      {{ _title | translate }}\n    </span>\n    <span class=\"message\">\n      {{ _message | translate }}\n    </span>\n  </div>\n  <div class=\"alert-footer\">\n    <ng-container *ngIf=\"!_hideClose\">\n      <monkey-button type=\"tertiary\" color=\"theme\" (click)=\"onClose()\">\n        {{ 'BUTTONS.CLOSE' | translate }}\n      </monkey-button>\n    </ng-container>\n    \n    <ng-container *ngIf=\"_action\">\n      <monkey-button type=\"primary\" color=\"theme\" (click)=\"onAction()\">\n        {{ _action.label | translate }}\n      </monkey-button>\n    </ng-container>\n  </div>\n</monkey-modal>", styles: [":host ::ng-deep monkey-modal mecx-monkey-modal{padding:0}:host ::ng-deep monkey-modal mecx-monkey-modal .body{margin-bottom:0}:host ::ng-deep monkey-modal .mecx-monkey-modal__size-md{max-width:448px}:host .alert-header{height:100%;max-height:200px}@media screen and (max-width: 959px){:host .alert-header{min-height:212px}}:host .alert-header img{border-radius:12px 12px 0 0;-o-object-fit:cover;object-fit:cover;width:100%;max-height:280px}@media screen and (max-width: 959px){:host .alert-header img{height:200px}}:host .alert-body{display:flex;flex-direction:column;gap:16px;padding:24px;margin:auto}:host .alert-body .title{font-style:normal;font-weight:700;font-size:32px;line-height:40px;text-align:center;color:#1f2024}:host .alert-body .message{font-style:normal;font-weight:400;font-size:16px;line-height:24px;text-align:center;letter-spacing:.03em;color:#545a63}:host .alert-footer{display:flex;justify-content:space-between;padding:0 24px 24px;position:sticky;bottom:0;background:#fafafa;gap:12px}:host .alert-footer ::ng-deep monkey-button{width:100%}:host .alert-footer ::ng-deep monkey-button button{width:100%}\n"], components: [{ type: i1.MonkeyModalComponent, selector: "monkey-modal", inputs: ["config", "modalRef", "onHandleConfirm"] }, { type: i1.MonkeyButtonComponent, selector: "monkey-button", inputs: ["label", "icon", "iconPosition", "type", "color", "disabled", "size"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i3.TranslatePipe } });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AlertsComponent, decorators: [{
            type: Component,
            args: [{ selector: 'monkeyecx-alerts', template: "<monkey-modal [config]=\"config\" [modalRef]=\"modalRef\" *ngIf=\"config\">\n  <div class=\"alert-header\">\n    <img [src]=\"_img\">\n  </div>\n  <div class=\"alert-body\">\n    <span class=\"title\">\n      {{ _title | translate }}\n    </span>\n    <span class=\"message\">\n      {{ _message | translate }}\n    </span>\n  </div>\n  <div class=\"alert-footer\">\n    <ng-container *ngIf=\"!_hideClose\">\n      <monkey-button type=\"tertiary\" color=\"theme\" (click)=\"onClose()\">\n        {{ 'BUTTONS.CLOSE' | translate }}\n      </monkey-button>\n    </ng-container>\n    \n    <ng-container *ngIf=\"_action\">\n      <monkey-button type=\"primary\" color=\"theme\" (click)=\"onAction()\">\n        {{ _action.label | translate }}\n      </monkey-button>\n    </ng-container>\n  </div>\n</monkey-modal>", styles: [":host ::ng-deep monkey-modal mecx-monkey-modal{padding:0}:host ::ng-deep monkey-modal mecx-monkey-modal .body{margin-bottom:0}:host ::ng-deep monkey-modal .mecx-monkey-modal__size-md{max-width:448px}:host .alert-header{height:100%;max-height:200px}@media screen and (max-width: 959px){:host .alert-header{min-height:212px}}:host .alert-header img{border-radius:12px 12px 0 0;-o-object-fit:cover;object-fit:cover;width:100%;max-height:280px}@media screen and (max-width: 959px){:host .alert-header img{height:200px}}:host .alert-body{display:flex;flex-direction:column;gap:16px;padding:24px;margin:auto}:host .alert-body .title{font-style:normal;font-weight:700;font-size:32px;line-height:40px;text-align:center;color:#1f2024}:host .alert-body .message{font-style:normal;font-weight:400;font-size:16px;line-height:24px;text-align:center;letter-spacing:.03em;color:#545a63}:host .alert-footer{display:flex;justify-content:space-between;padding:0 24px 24px;position:sticky;bottom:0;background:#fafafa;gap:12px}:host .alert-footer ::ng-deep monkey-button{width:100%}:host .alert-footer ::ng-deep monkey-button button{width:100%}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.MonkeyStyleGuideModalService }]; }, propDecorators: { config: [{
                type: Input
            }], modalRef: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 