@yoursabhishekabhi7/modal-popup-ng-all
Version:
Reusable Angular modal popup components supporting Angular 14 to 18
50 lines • 8.17 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as $ from 'jquery';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class BootStrapToastsComponent {
TitleText = '';
TimeStamp = '';
ShowTost = false;
SHOW = false;
constructor() { }
ngOnInit() {
}
ngOnChanges(changes) {
for (const propName in changes) {
if (changes.hasOwnProperty(propName)) {
const change = changes[propName];
if (change.currentValue !== undefined) {
this[propName] = change.currentValue;
}
}
}
if (this.ShowTost == true) {
this.OpenModel;
}
}
get OpenModel() {
$('.toast').removeClass('hide');
return $('.toast').addClass('show');
}
get hideModel() {
$('.toast').removeClass('show');
return $('.toast').addClass('hide');
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BootStrapToastsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: BootStrapToastsComponent, selector: "boot-strap-toasts", inputs: { TitleText: "TitleText", TimeStamp: "TimeStamp", ShowTost: "ShowTost" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"position-fixed bottom-0 end-0 p-3\" style=\"z-index: 11\">\r\n <div id=\"liveToast\" class=\"toast\" [ngClass]=\"{'show':this.ShowTost==true,'hide':this.ShowTost==false}\" role=\"alert\"\r\n aria-live=\"assertive\" aria-atomic=\"true\">\r\n <div class=\"toast-header\">\r\n <strong class=\"me-auto\">{{this.TitleText}}</strong>\r\n <small style=\"margin-left: 20px;\">{{this.TimeStamp}}</small>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"toast\" aria-label=\"Close\" (click)=\"hideModel\"></button>\r\n </div>\r\n <div class=\"toast-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>", styles: [".toast{max-width:450px;width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BootStrapToastsComponent, decorators: [{
type: Component,
args: [{ selector: 'boot-strap-toasts', template: "<div class=\"position-fixed bottom-0 end-0 p-3\" style=\"z-index: 11\">\r\n <div id=\"liveToast\" class=\"toast\" [ngClass]=\"{'show':this.ShowTost==true,'hide':this.ShowTost==false}\" role=\"alert\"\r\n aria-live=\"assertive\" aria-atomic=\"true\">\r\n <div class=\"toast-header\">\r\n <strong class=\"me-auto\">{{this.TitleText}}</strong>\r\n <small style=\"margin-left: 20px;\">{{this.TimeStamp}}</small>\r\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"toast\" aria-label=\"Close\" (click)=\"hideModel\"></button>\r\n </div>\r\n <div class=\"toast-body\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>", styles: [".toast{max-width:450px;width:100%}\n"] }]
}], ctorParameters: () => [], propDecorators: { TitleText: [{
type: Input,
args: ["TitleText"]
}], TimeStamp: [{
type: Input,
args: ["TimeStamp"]
}], ShowTost: [{
type: Input,
args: ["ShowTost"]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm9vdC1zdHJhcC10b2FzdHMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbW9kYWwtcG9wdXAtbmcxNC0xOC9zcmMvbGliL2Jvb3Qtc3RhcnAtY29tcG9uZW50cy9ib290LXN0cmFwLXRvYXN0cy9ib290LXN0cmFwLXRvYXN0cy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tb2RhbC1wb3B1cC1uZzE0LTE4L3NyYy9saWIvYm9vdC1zdGFycC1jb21wb25lbnRzL2Jvb3Qtc3RyYXAtdG9hc3RzL2Jvb3Qtc3RyYXAtdG9hc3RzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFvQyxNQUFNLGVBQWUsQ0FBQztBQUNuRixPQUFPLEtBQUssQ0FBQyxNQUFNLFFBQVEsQ0FBQzs7O0FBTzVCLE1BQU0sT0FBTyx3QkFBd0I7SUFDZixTQUFTLEdBQVMsRUFBRSxDQUFBO0lBQ3BCLFNBQVMsR0FBUyxFQUFFLENBQUE7SUFDckIsUUFBUSxHQUFZLEtBQUssQ0FBQTtJQUM1QyxJQUFJLEdBQVksS0FBSyxDQUFDO0lBQ3RCLGdCQUFnQixDQUFDO0lBRWpCLFFBQVE7SUFDUixDQUFDO0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLEtBQUssTUFBTSxRQUFRLElBQUksT0FBTyxFQUFFLENBQUM7WUFDL0IsSUFBSSxPQUFPLENBQUMsY0FBYyxDQUFDLFFBQVEsQ0FBQyxFQUFFLENBQUM7Z0JBQ3JDLE1BQU0sTUFBTSxHQUFHLE9BQU8sQ0FBQyxRQUFRLENBQUMsQ0FBQztnQkFDakMsSUFBSSxNQUFNLENBQUMsWUFBWSxLQUFLLFNBQVMsRUFBRSxDQUFDO29CQUNyQyxJQUFZLENBQUMsUUFBUSxDQUFDLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQztnQkFDaEQsQ0FBQztZQUNILENBQUM7UUFDSCxDQUFDO1FBQ0QsSUFBSSxJQUFJLENBQUMsUUFBUSxJQUFJLElBQUksRUFBRSxDQUFDO1lBQzFCLElBQUksQ0FBQyxTQUFTLENBQUM7UUFDakIsQ0FBQztJQUNILENBQUM7SUFFRCxJQUFJLFNBQVM7UUFDWCxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsV0FBVyxDQUFDLE1BQU0sQ0FBQyxDQUFBO1FBQy9CLE9BQU8sQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsQ0FBQTtJQUNyQyxDQUFDO0lBRUQsSUFBSSxTQUFTO1FBQ1gsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsQ0FBQTtRQUMvQixPQUFPLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUFDLENBQUE7SUFDckMsQ0FBQzt1R0FoQ1Usd0JBQXdCOzJGQUF4Qix3QkFBd0IsZ0tDUnJDLHFxQkFZTTs7MkZESk8sd0JBQXdCO2tCQUxwQyxTQUFTOytCQUNFLG1CQUFtQjt3REFLVCxTQUFTO3NCQUE1QixLQUFLO3VCQUFDLFdBQVc7Z0JBQ0UsU0FBUztzQkFBNUIsS0FBSzt1QkFBQyxXQUFXO2dCQUNDLFFBQVE7c0JBQTFCLEtBQUs7dUJBQUMsVUFBVSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uQ2hhbmdlcywgT25Jbml0LCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCAqIGFzICQgZnJvbSAnanF1ZXJ5JztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnYm9vdC1zdHJhcC10b2FzdHMnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9ib290LXN0cmFwLXRvYXN0cy5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vYm9vdC1zdHJhcC10b2FzdHMuY29tcG9uZW50LnNjc3MnXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgQm9vdFN0cmFwVG9hc3RzQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMge1xyXG4gIEBJbnB1dChcIlRpdGxlVGV4dFwiKSBUaXRsZVRleHQ6IHN0cmluZz0nJ1xyXG4gIEBJbnB1dChcIlRpbWVTdGFtcFwiKSBUaW1lU3RhbXA6IHN0cmluZz0nJ1xyXG4gIEBJbnB1dChcIlNob3dUb3N0XCIpIFNob3dUb3N0OiBib29sZWFuID0gZmFsc2VcclxuICBTSE9XOiBib29sZWFuID0gZmFsc2U7XHJcbiAgY29uc3RydWN0b3IoKSB7IH1cclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgfVxyXG5cclxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XHJcbiAgICBmb3IgKGNvbnN0IHByb3BOYW1lIGluIGNoYW5nZXMpIHtcclxuICAgICAgaWYgKGNoYW5nZXMuaGFzT3duUHJvcGVydHkocHJvcE5hbWUpKSB7XHJcbiAgICAgICAgY29uc3QgY2hhbmdlID0gY2hhbmdlc1twcm9wTmFtZV07XHJcbiAgICAgICAgaWYgKGNoYW5nZS5jdXJyZW50VmFsdWUgIT09IHVuZGVmaW5lZCkge1xyXG4gICAgICAgICAgKHRoaXMgYXMgYW55KVtwcm9wTmFtZV0gPSBjaGFuZ2UuY3VycmVudFZhbHVlO1xyXG4gICAgICAgIH1cclxuICAgICAgfVxyXG4gICAgfVxyXG4gICAgaWYgKHRoaXMuU2hvd1Rvc3QgPT0gdHJ1ZSkge1xyXG4gICAgICB0aGlzLk9wZW5Nb2RlbDtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIGdldCBPcGVuTW9kZWwoKSB7XHJcbiAgICAkKCcudG9hc3QnKS5yZW1vdmVDbGFzcygnaGlkZScpXHJcbiAgICByZXR1cm4gJCgnLnRvYXN0JykuYWRkQ2xhc3MoJ3Nob3cnKVxyXG4gIH1cclxuXHJcbiAgZ2V0IGhpZGVNb2RlbCgpIHtcclxuICAgICQoJy50b2FzdCcpLnJlbW92ZUNsYXNzKCdzaG93JylcclxuICAgIHJldHVybiAkKCcudG9hc3QnKS5hZGRDbGFzcygnaGlkZScpXHJcbiAgfVxyXG5cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwicG9zaXRpb24tZml4ZWQgYm90dG9tLTAgZW5kLTAgcC0zXCIgc3R5bGU9XCJ6LWluZGV4OiAxMVwiPlxyXG4gIDxkaXYgaWQ9XCJsaXZlVG9hc3RcIiBjbGFzcz1cInRvYXN0XCIgW25nQ2xhc3NdPVwieydzaG93Jzp0aGlzLlNob3dUb3N0PT10cnVlLCdoaWRlJzp0aGlzLlNob3dUb3N0PT1mYWxzZX1cIiByb2xlPVwiYWxlcnRcIlxyXG4gICAgYXJpYS1saXZlPVwiYXNzZXJ0aXZlXCIgYXJpYS1hdG9taWM9XCJ0cnVlXCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwidG9hc3QtaGVhZGVyXCI+XHJcbiAgICAgIDxzdHJvbmcgY2xhc3M9XCJtZS1hdXRvXCI+e3t0aGlzLlRpdGxlVGV4dH19PC9zdHJvbmc+XHJcbiAgICAgIDxzbWFsbCBzdHlsZT1cIm1hcmdpbi1sZWZ0OiAyMHB4O1wiPnt7dGhpcy5UaW1lU3RhbXB9fTwvc21hbGw+XHJcbiAgICAgIDxidXR0b24gdHlwZT1cImJ1dHRvblwiIGNsYXNzPVwiYnRuLWNsb3NlXCIgZGF0YS1icy1kaXNtaXNzPVwidG9hc3RcIiBhcmlhLWxhYmVsPVwiQ2xvc2VcIiAoY2xpY2spPVwiaGlkZU1vZGVsXCI+PC9idXR0b24+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJ0b2FzdC1ib2R5XCI+XHJcbiAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG48L2Rpdj4iXX0=