UNPKG

ngx-bootstrap

Version:
75 lines 3.2 kB
import { __decorate, __metadata } from "tslib"; import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, Output } from '@angular/core'; import { AlertConfig } from './alert.config'; import { OnChange } from 'ngx-bootstrap/utils'; export class AlertComponent { constructor(_config, changeDetection) { this.changeDetection = changeDetection; /** Alert type. * Provides one of four bootstrap supported contextual classes: * `success`, `info`, `warning` and `danger` */ this.type = 'warning'; /** If set, displays an inline "Close" button */ this.dismissible = false; /** Is alert visible */ this.isOpen = true; /** This event fires immediately after close instance method is called, * $event is an instance of Alert component. */ this.onClose = new EventEmitter(); /** This event fires when alert closed, $event is an instance of Alert component */ this.onClosed = new EventEmitter(); this.classes = ''; this.dismissibleChange = new EventEmitter(); Object.assign(this, _config); this.dismissibleChange.subscribe(( /*dismissible: boolean*/) => { this.classes = this.dismissible ? 'alert-dismissible' : ''; this.changeDetection.markForCheck(); }); } ngOnInit() { if (this.dismissOnTimeout) { // if dismissOnTimeout used as attr without binding, it will be a string setTimeout(() => this.close(), parseInt(this.dismissOnTimeout, 10)); } } // todo: animation ` If the .fade and .in classes are present on the element, // the alert will fade out before it is removed` /** * Closes an alert by removing it from the DOM. */ close() { if (!this.isOpen) { return; } this.onClose.emit(this); this.isOpen = false; this.changeDetection.markForCheck(); this.onClosed.emit(this); } } AlertComponent.decorators = [ { type: Component, args: [{ selector: 'alert,bs-alert', template: "<ng-template [ngIf]=\"isOpen\">\n <div [class]=\"'alert alert-' + type\" role=\"alert\" [ngClass]=\"classes\">\n <ng-template [ngIf]=\"dismissible\">\n <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"close()\">\n <span aria-hidden=\"true\">&times;</span>\n <span class=\"sr-only\">Close</span>\n </button>\n </ng-template>\n <ng-content></ng-content>\n </div>\n</ng-template>\n", changeDetection: ChangeDetectionStrategy.OnPush },] } ]; AlertComponent.ctorParameters = () => [ { type: AlertConfig }, { type: ChangeDetectorRef } ]; AlertComponent.propDecorators = { type: [{ type: Input }], dismissible: [{ type: Input }], dismissOnTimeout: [{ type: Input }], isOpen: [{ type: Input }], onClose: [{ type: Output }], onClosed: [{ type: Output }] }; __decorate([ OnChange(), __metadata("design:type", Object) ], AlertComponent.prototype, "dismissible", void 0); //# sourceMappingURL=alert.component.js.map