import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';
import { NotificationStatus, NotificationTypeClass } from '../../../../state/ui/notifications/notifications.model';
import { GlobalInjector } from '../../../../common/services/global-injector';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "ngx-pipes";
import * as i3 from "../../../../common/data-pipes/pipes/calendar.pipe";
export class NotificationItemComponent {
    constructor() {
        this.status = NotificationStatus;
        this.typeClass = NotificationTypeClass;
        this.uiConfig = GlobalInjector.config;
    }
    ngOnInit() {
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NotificationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: NotificationItemComponent, selector: "smz-notification-item", inputs: { item: "item", charactersLimit: "charactersLimit", showDate: "showDate" }, ngImport: i0, template: "<div class=\"grid grid-nogutter flex-row flex-nowrap items-center justify-between relative flex-gap-1 py-2 pl-2 min-h-[90px]\"  [ngClass]=\"uiConfig.rbkUtils.notifications.showTypeIndicators ? typeClass[item.type] : ''\">\r\n\r\n    <div class=\"grid grid-nogutter flex-col items-stretch justify-start relative flex-gap-1\">\r\n        <div class=\"grid grid-nogutter items-center justify-start mb-1\">\r\n            <div class=\"font-medium\" [ngClass]=\"{ 'font-extrabold': item.status === status.NEW || item.status === status.NOTIFIED }\">{{item.title}}</div>\r\n            <div *ngIf=\"item.status === status.NEW\" class=\"rounded bg-blue-500 text-white px-1 py-0.5 ml-2 text-xs\">NOVO</div>\r\n        </div>\r\n        <div class=\"text-sm\" [ngClass]=\"{ 'font-bold': item.status === status.NEW || item.status === status.NOTIFIED }\">{{ charactersLimit != null ? (item.body | shorten : charactersLimit : '...') : item.body}}</div>\r\n    </div>\r\n\r\n    <div *ngIf=\"showDate\">\r\n        <span *ngIf=\"uiConfig.rbkUtils.notifications.date as date\" class=\"text-xs text-right whitespace-nowrap\">\r\n            {{ item.date | calendar : date.recentsMethod : date.recentsDaysCount : date.othersFormat }}\r\n        </span>\r\n    </div>\r\n\r\n</div>\r\n", styles: ["smz-notification-item .success-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-success)}smz-notification-item .info-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-info)}smz-notification-item .warning-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-warning)}smz-notification-item .danger-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-danger)}smz-notification-item .help-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-help)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.ShortenPipe, name: "shorten" }, { kind: "pipe", type: i3.CalendarPipe, name: "calendar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NotificationItemComponent, decorators: [{
            type: Component,
            args: [{ selector: 'smz-notification-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"grid grid-nogutter flex-row flex-nowrap items-center justify-between relative flex-gap-1 py-2 pl-2 min-h-[90px]\"  [ngClass]=\"uiConfig.rbkUtils.notifications.showTypeIndicators ? typeClass[item.type] : ''\">\r\n\r\n    <div class=\"grid grid-nogutter flex-col items-stretch justify-start relative flex-gap-1\">\r\n        <div class=\"grid grid-nogutter items-center justify-start mb-1\">\r\n            <div class=\"font-medium\" [ngClass]=\"{ 'font-extrabold': item.status === status.NEW || item.status === status.NOTIFIED }\">{{item.title}}</div>\r\n            <div *ngIf=\"item.status === status.NEW\" class=\"rounded bg-blue-500 text-white px-1 py-0.5 ml-2 text-xs\">NOVO</div>\r\n        </div>\r\n        <div class=\"text-sm\" [ngClass]=\"{ 'font-bold': item.status === status.NEW || item.status === status.NOTIFIED }\">{{ charactersLimit != null ? (item.body | shorten : charactersLimit : '...') : item.body}}</div>\r\n    </div>\r\n\r\n    <div *ngIf=\"showDate\">\r\n        <span *ngIf=\"uiConfig.rbkUtils.notifications.date as date\" class=\"text-xs text-right whitespace-nowrap\">\r\n            {{ item.date | calendar : date.recentsMethod : date.recentsDaysCount : date.othersFormat }}\r\n        </span>\r\n    </div>\r\n\r\n</div>\r\n", styles: ["smz-notification-item .success-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-success)}smz-notification-item .info-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-info)}smz-notification-item .warning-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-warning)}smz-notification-item .danger-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-danger)}smz-notification-item .help-type:before{content:\"\";position:absolute;top:5px;left:-5px;width:5px;bottom:5px;background-color:var(--color-help)}\n"] }]
        }], ctorParameters: () => [], propDecorators: { item: [{
                type: Input
            }], charactersLimit: [{
                type: Input
            }], showDate: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 