UNPKG

wacom

Version:

Module which has common services and components which can be used on all projects.

675 lines (663 loc) 218 kB
import * as i0 from '@angular/core'; import { InjectionToken, Inject, Optional, Injectable, ViewChild, Component, signal, PLATFORM_ID, inject, ChangeDetectorRef, EventEmitter, HostListener, Output, Directive, Pipe, NgModule } from '@angular/core'; import * as i1 from '@angular/router'; import * as i2 from '@angular/platform-browser'; import * as i1$1 from '@angular/common'; import { CommonModule } from '@angular/common'; import { Subject, firstValueFrom, Observable, ReplaySubject, EMPTY } from 'rxjs'; import * as i2$1 from '@angular/common/http'; import { HttpHeaders, HttpErrorResponse, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; import { first, catchError } from 'rxjs/operators'; import { FormsModule } from '@angular/forms'; const CONFIG_TOKEN = new InjectionToken('config'); const DEFAULT_CONFIG = { meta: { useTitleSuffix: false, warnMissingGuard: true, defaults: {}, }, socket: false, http: { url: '', headers: {}, }, store: { prefix: '', }, }; const DEFAULT_Alert = { alerts: {}, text: '', type: 'info', class: '', progress: true, position: 'bottomRight', timeout: 5000, closable: true, buttons: [], }; const DEFAULT_Modal = { size: 'mid', timeout: 0, timestart: 0, class: '', modals: {}, position: 'tc', closable: true, }; const isDefined = (val) => typeof val !== 'undefined'; class MetaService { router; meta; titleService; config; _meta; constructor(router, meta, titleService, config) { this.router = router; this.meta = meta; this.titleService = titleService; this.config = config; this.config = this.config || DEFAULT_CONFIG; this._meta = this.config.meta || {}; this._warnMissingGuard(); } /** * Sets the default meta tags. * * @param defaults - The default meta tags. */ setDefaults(defaults) { this._meta.defaults = defaults; } /** * Sets the title and optional title suffix. * * @param title - The title to set. * @param titleSuffix - The title suffix to append. * @returns The MetaService instance. */ setTitle(title, titleSuffix) { let titleContent = isDefined(title) ? title : this._meta.defaults['title'] || ''; if (this._meta.useTitleSuffix) { titleContent += isDefined(titleSuffix) ? titleSuffix : this._meta.defaults['titleSuffix'] || ''; } this._updateMetaTag('title', titleContent); this._updateMetaTag('og:title', titleContent); this.titleService.setTitle(titleContent); return this; } /** * Sets link tags. * * @param links - The links to set. * @returns The MetaService instance. */ setLink(links) { Object.keys(links).forEach((rel) => { let link = document.createElement('link'); link.setAttribute('rel', rel); link.setAttribute('href', links[rel]); document.head.appendChild(link); }); return this; } /** * Sets a meta tag. * * @param tag - The meta tag name. * @param value - The meta tag value. * @param prop - The meta tag property. * @returns The MetaService instance. */ setTag(tag, value, prop) { if (tag === 'title' || tag === 'titleSuffix') { throw new Error(`Attempt to set ${tag} through 'setTag': 'title' and 'titleSuffix' are reserved tag names. Please use 'MetaService.setTitle' instead`); } const content = isDefined(value) ? value : this._meta.defaults[tag] || ''; this._updateMetaTag(tag, content, prop); if (tag === 'description') { this._updateMetaTag('og:description', content, prop); this._updateMetaTag('twitter:description', content, prop); } return this; } /** * Updates a meta tag. * * @param tag - The meta tag name. * @param value - The meta tag value. * @param prop - The meta tag property. */ _updateMetaTag(tag, value, prop) { prop = prop || (tag.startsWith('og:') || tag.startsWith('twitter:') ? 'property' : 'name'); this.meta.updateTag({ [prop]: tag, content: value }); } /** * Removes a meta tag. * * @param tag - The meta tag name. * @param prop - The meta tag property. */ removeTag(tag, prop) { prop = prop || (tag.startsWith('og:') || tag.startsWith('twitter:') ? 'property' : 'name'); this.meta.removeTag(`${prop}="${tag}"`); } /** * Warns about missing meta guards in routes. */ _warnMissingGuard() { if (isDefined(this._meta.warnMissingGuard) && !this._meta.warnMissingGuard) { return; } const hasDefaultMeta = !!Object.keys(this._meta.defaults).length; const hasMetaGuardInArr = (it) => it && it.IDENTIFIER === 'MetaGuard'; let hasShownWarnings = false; this.router.config.forEach((route) => { const hasRouteMeta = route.data && route.data['meta']; const showWarning = !isDefined(route.redirectTo) && (hasDefaultMeta || hasRouteMeta) && !(route.canActivate || []).some(hasMetaGuardInArr); if (showWarning) { console.warn(`Route with path "${route.path}" has ${hasRouteMeta ? '' : 'default '}meta tags, but does not use MetaGuard. Please add MetaGuard to the canActivate array in your route configuration`); hasShownWarnings = true; } }); if (hasShownWarnings) { console.warn(`To disable these warnings, set metaConfig.warnMissingGuard: false in your MetaConfig passed to MetaModule.forRoot()`); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MetaService, deps: [{ token: i1.Router }, { token: i2.Meta }, { token: i2.Title }, { token: CONFIG_TOKEN, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MetaService, providedIn: 'root' }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MetaService, decorators: [{ type: Injectable, args: [{ providedIn: 'root', }] }], ctorParameters: () => [{ type: i1.Router }, { type: i2.Meta }, { type: i2.Title }, { type: undefined, decorators: [{ type: Inject, args: [CONFIG_TOKEN] }, { type: Optional }] }] }); class MetaGuard { metaService; config; static IDENTIFIER = 'MetaGuard'; _meta; constructor(metaService, config) { this.metaService = metaService; this.config = config; this._meta = config.meta; if (!this.config) this.config = DEFAULT_CONFIG; } canActivate(route, state) { this._processRouteMetaTags(route.data && route.data['meta']); return true; } _processRouteMetaTags(meta = {}) { if (meta.disableUpdate) { return; } if (meta.title) { this.metaService.setTitle(meta.title, meta.titleSuffix); } if (Array.isArray(meta.links)) { this.metaService.setLink(meta.links); } else if (typeof meta.links === 'string') { this.metaService.setLink(meta.links.split(' ')); } if (Array.isArray(this._meta.defaults?.links)) { this.metaService.setLink(this._meta.defaults?.links); } else if (typeof this._meta.defaults?.links === 'string') { this.metaService.setLink(this._meta.defaults?.links.split(' ')); } Object.keys(meta).forEach((prop) => { if (prop === 'title' || prop === 'titleSuffix' || prop === 'links') { return; } Object.keys(meta[prop]).forEach((key) => { this.metaService.setTag(key, meta[prop][key], prop); }); }); Object.keys(this._meta.defaults).forEach((key) => { if (key in meta || key === 'title' || key === 'titleSuffix' || key === 'links') { return; } this.metaService.setTag(key, this._meta.defaults[key]); }); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MetaGuard, deps: [{ token: MetaService }, { token: CONFIG_TOKEN, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MetaGuard }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MetaGuard, decorators: [{ type: Injectable }], ctorParameters: () => [{ type: MetaService }, { type: undefined, decorators: [{ type: Inject, args: [CONFIG_TOKEN] }, { type: Optional }] }] }); class AlertComponent { alert; component; text = ''; class = ''; type = 'info'; progress = true; position = 'bottomRight'; // [bottomRight, bottomLeft, topRight, topLeft, topCenter, bottomCenter or center] icon = ''; timeout = 5000; close; closable = true; buttons = []; /*[{text, callback}]*/ constructor() { setTimeout(() => { if (this.timeout) { let remaining = JSON.parse(JSON.stringify(this.timeout)); let timer = setTimeout(() => { this.remove(); }, remaining); let start = new Date(); this.alert.nativeElement.addEventListener('mouseenter', () => { clearTimeout(timer); remaining -= new Date().getTime() - start.getTime(); }, false); this.alert.nativeElement.addEventListener('mouseleave', () => { start = new Date(); clearTimeout(timer); timer = window.setTimeout(() => { this.remove(); }, remaining); }, false); } }); } delete_animation = false; remove() { this.delete_animation = true; setTimeout(() => { this.close(); this.delete_animation = false; }, 350); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: AlertComponent, isStandalone: false, selector: "alert", viewQueries: [{ propertyName: "alert", first: true, predicate: ["alert"], descendants: true }], ngImport: i0, template: "<div\n\t*ngIf=\"text\"\n\t[ngClass]=\"class\"\n\tclass=\"waw-alert-container height\"\n\t[class._close]=\"delete_animation\"\n>\n\t<div\n\t\t[class.waw-alert-color-blue]=\"type == 'info'\"\n\t\t[class.waw-alert-color-red]=\"type == 'error'\"\n\t\t[class.waw-alert-color-green]=\"type == 'success'\"\n\t\t[class.waw-alert-color-orange]=\"type == 'warning'\"\n\t\t[class.waw-alert-color-yellow]=\"type == 'question'\"\n\t\tclass=\"waw-alert bounceInUp waw-alert-theme-light waw-alert-animateInside waw-alert-opened\"\n\t\t#alert\n\t>\n\t\t<div class=\"waw-alert__progress\" *ngIf=\"progress\">\n\t\t\t<span\n\t\t\t\t[ngStyle]=\"{\n\t\t\t\t\t'animation-duration': (timeout + 350) / 1000 + 's'\n\t\t\t\t}\"\n\t\t\t></span>\n\t\t</div>\n\t\t<div class=\"waw-alert-body\">\n\t\t\t<div *ngIf=\"!component\" class=\"waw-alert-texts\">\n\t\t\t\t<div *ngIf=\"icon\" class=\"{{ icon }}\"></div>\n\t\t\t\t<div class=\"waw-alert-message slideIn\">{{ text }}</div>\n\t\t\t</div>\n\t\t\t<div *ngIf=\"!component && type == 'question'\">\n\t\t\t\t<button\n\t\t\t\t\tclass=\"alert-btn\"\n\t\t\t\t\t*ngFor=\"let b of buttons\"\n\t\t\t\t\t(click)=\"remove(); b.callback && b.callback()\"\n\t\t\t\t>\n\t\t\t\t\t{{ b.text }}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclass=\"waw-alert__close\"\n\t\t\t\t*ngIf=\"closable\"\n\t\t\t\t(click)=\"remove()\"\n\t\t\t></div>\n\t\t</div>\n\t</div>\n</div>\n", styles: ["@keyframes iziT-bounceInUp{0%{opacity:0;transform:translateY(200px)}50%{opacity:1;transform:translateY(-10px)}70%{transform:translateY(5px)}to{transform:translateY(0)}}@keyframes iziT-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes iziT-fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes iziT-fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes iziT-bounceInLeft{0%{opacity:0;transform:translate(280px)}50%{opacity:1;transform:translate(-20px)}70%{transform:translate(10px)}to{transform:translate(0)}}@keyframes iziT-bounceInDown{0%{opacity:0;transform:translateY(-200px)}50%{opacity:1;transform:translateY(10px)}70%{transform:translateY(-5px)}to{transform:translateY(0)}}.alert-wrapper{position:fixed;bottom:50px;left:0;width:100%;height:60px;overflow:hidden}.alert{display:flex;-webkit-box-align:center;align-items:center;width:auto;background:#3aed92;color:#fff;max-width:700px;margin:0 auto;transform:translateY(300px) scale(0);transition:.3s all ease-in-out}.alert._show{transform:translateY(0) scale(1);transition:.3s all ease-in-out}.alert-icon{min-width:60px;min-height:60px;position:relative;display:flex;justify-content:center;align-items:center;background-color:#2bd17d}.alert-icon:before{content:\"\";position:absolute;width:25px;height:25px;border-radius:50%;border:2px solid #fff}.alert-icon:after{content:\"\";position:absolute;top:22px;width:7px;height:11px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.alert-text{padding:0 20px;word-break:break-all;overflow:auto;height:60px}.alert-text .text-block{width:99%}.alert-text .text-block__text{text-overflow:ellipsis;overflow:hidden;white-space:pre}.alert-close{min-width:50px;margin-left:auto;font-size:25px;display:flex;justify-content:center;align-items:center}.font-bold{font-weight:700}.waw-alert__progress{bottom:0;position:absolute;width:100%;margin-bottom:0;border-radius:50px}.waw-alert__progress:hover span{animation-play-state:paused}.waw-alert__progress span{display:block;width:100%;height:2px;background-color:#a5a5a5ed;animation-name:waw-alert-progress;animation-duration:10s;border-radius:50px}.waw-alert__progress span._red{background-color:#ffafb4}.waw-alert__progress span._green{background-color:#a6efb8}.waw-alert__progress span._yellow{background-color:#fff9b2}.waw-alert__progress span._orange,.waw-alert__progress span._blue{background-color:#ffcfa5}.waw-alert__progress span._white{background-color:#fff}.waw-alert__progress span._black{background-color:#000}.waw-alert:hover .waw-alert__progress>span{animation-play-state:paused}.waw-alert__close{width:15px;height:15px;opacity:.3;position:relative;order:2}.waw-alert__close:hover{opacity:1}.waw-alert__close:before,.waw-alert__close:after{cursor:pointer;position:absolute;left:15px;content:\" \";height:12px;width:2px;background-color:#47525d}.waw-alert__close:before{transform:rotate(45deg)}.waw-alert__close:after{transform:rotate(-45deg)}@keyframes waw-alert-progress{0%{width:100%}to{width:0%}}.waw-alert-container{font-size:0;height:100px;width:100%;transform:translateZ(0);backface-visibility:hidden;transition:.3s all ease-in-out;opacity:1}.waw-alert-container._close{opacity:0;transition:.3s all ease-in-out}.waw-alert{display:inline-block;clear:both;position:relative;font-family:Lato,Tahoma,Arial;font-size:14px;padding:8px 25px 9px 0;background:#eeeeeee6;border-color:#eeeeeee6;width:100%;pointer-events:all;cursor:default;transform:translate(0);-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;min-height:54px}.waw-alert>.waw-alert-progressbar{position:absolute;left:0;bottom:0;width:100%;z-index:1;background:#fff3}.waw-alert>.waw-alert-progressbar>div{height:2px;width:100%;background:#0000004d;border-radius:0 0 3px 3px}.waw-alert>.waw-alert-close{position:absolute;right:0;top:0;border:0;padding:0;opacity:.6;width:42px;height:100%;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAJPAAACTwBcGfW0QAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAD3SURBVFiF1ZdtDoMgDEBfdi4PwAX8vLFn0qT7wxantojKupmQmCi8R4tSACpgjC2ICCUbEBa8ingjsU1AXRBeR8aLN64FiknswN8CYefBBDQ3whuFESy7WyQMeC0ipEI0A+0FeBvHUFN8xPaUhAH/iKoWsnXHGegy4J0yxialOfaHJAz4bhRzQzgDvdGnz4GbAonZbCQMuBm1K/kcFu8Mp1N2cFFpsxsMuJqqbIGExGl4loARajU1twskJLLhIsID7+tvUoDnIjTg5T9DPH9EBrz8rxjPzciAl9+O8SxI8CzJ8CxKFfh3ynK8Dyb8wNHM/XDqejx/AtNyPO87tNybAAAAAElFTkSuQmCC) no-repeat 50% 50%;background-size:8px;cursor:pointer;outline:none}.waw-alert>.waw-alert-close:hover{opacity:1}.waw-alert>.waw-alert-body{position:relative;padding:0 0 0 10px;height:auto;min-height:36px;margin:0 0 0 15px;text-align:left;display:flex;justify-content:space-between;align-items:center}.waw-alert>.waw-alert-body:after{content:\"\";display:table;clear:both}.waw-alert>.waw-alert-body .waw-alert-texts{margin:10px 0 0;padding-right:2px;display:inline-block;float:left;display:flex;justify-content:space-between;align-items:center}.waw-alert>.waw-alert-body .waw-alert-icon{height:100%;position:absolute;left:0;top:50%;display:table;font-size:23px;line-height:24px;margin-top:-12px;color:#000;width:24px;height:24px}.waw-alert>.waw-alert-body .waw-alert-title{padding:0;margin:0 10px 0 0;line-height:16px;font-size:14px;text-align:left;float:left;color:#000;white-space:normal;font-weight:700}.waw-alert>.waw-alert-body .waw-alert-message{padding:0;font-size:14px;line-height:16px;text-align:left;float:left;color:#0009;white-space:normal}@media only screen and (min-width: 568px){.waw-alert-wrapper{padding:10px 15px}.waw-alert{margin:5px;border-radius:3px;width:auto}.waw-alert:after{content:\"\";z-index:-1;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:3px;box-shadow:inset 0 -10px 20px -10px #0003,inset 0 0 5px #0000001a,0 8px 8px -5px #00000040}.waw-alert:not(.waw-alert-rtl) .waw-alert-cover{border-radius:3px 0 0 3px}.waw-alert.waw-alert-rtl .waw-alert-cover{border-radius:0 3px 3px 0}.waw-alert.waw-alert-color-dark:after{box-shadow:inset 0 -10px 20px -10px #ffffff4d,0 10px 10px -5px #00000040}.waw-alert.waw-alert-balloon .waw-alert-progressbar{background:transparent}.waw-alert.waw-alert-balloon:after{box-shadow:0 10px 10px -5px #00000040,inset 0 10px 20px -5px #00000040}.waw-alert-target .waw-alert:after{box-shadow:inset 0 -10px 20px -10px #0003,inset 0 0 5px #0000001a}}.waw-alert.waw-alert-theme-dark{background:#565c70;border-color:#565c70}.waw-alert.waw-alert-theme-dark .waw-alert-title{color:#fff}.waw-alert.waw-alert-theme-dark .waw-alert-message{color:#ffffffb3;font-weight:300}.waw-alert.waw-alert-theme-dark .waw-alert-icon{color:#fff}.waw-alert.waw-alert-color-red{background:#ffafb4e6;border-color:#ffafb4e6}.waw-alert.waw-alert-color-orange{background:#ffcfa5e6;border-color:#ffcfa5e6}.waw-alert.waw-alert-color-yellow{background:#fff9b2e6;border-color:#fff9b2e6}.waw-alert.waw-alert-color-blue{background:#9ddeffe6;border-color:#9ddeffe6}.waw-alert.waw-alert-color-green{background:#a6efb8e6;border-color:#a6efb8e6}.waw-alert.slideIn,.waw-alert .slideIn{-webkit-animation:iziT-slideIn 1s cubic-bezier(.16,.81,.32,1) both;-moz-animation:iziT-slideIn 1s cubic-bezier(.16,.81,.32,1) both;animation:iziT-slideIn 1s cubic-bezier(.16,.81,.32,1) both}.waw-alert.bounceInLeft{-webkit-animation:iziT-bounceInLeft .7s ease-in-out both;animation:iziT-bounceInLeft .7s ease-in-out both}.waw-alert.bounceInRight{-webkit-animation:iziT-bounceInRight .85s ease-in-out both;animation:iziT-bounceInRight .85s ease-in-out both}.waw-alert.bounceInDown{-webkit-animation:iziT-bounceInDown .7s ease-in-out both;animation:iziT-bounceInDown .7s ease-in-out both}.waw-alert.bounceInUp{-webkit-animation:iziT-bounceInUp .7s ease-in-out both;animation:iziT-bounceInUp .7s ease-in-out both}.height{height:auto!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AlertComponent, decorators: [{ type: Component, args: [{ selector: 'alert', standalone: false, template: "<div\n\t*ngIf=\"text\"\n\t[ngClass]=\"class\"\n\tclass=\"waw-alert-container height\"\n\t[class._close]=\"delete_animation\"\n>\n\t<div\n\t\t[class.waw-alert-color-blue]=\"type == 'info'\"\n\t\t[class.waw-alert-color-red]=\"type == 'error'\"\n\t\t[class.waw-alert-color-green]=\"type == 'success'\"\n\t\t[class.waw-alert-color-orange]=\"type == 'warning'\"\n\t\t[class.waw-alert-color-yellow]=\"type == 'question'\"\n\t\tclass=\"waw-alert bounceInUp waw-alert-theme-light waw-alert-animateInside waw-alert-opened\"\n\t\t#alert\n\t>\n\t\t<div class=\"waw-alert__progress\" *ngIf=\"progress\">\n\t\t\t<span\n\t\t\t\t[ngStyle]=\"{\n\t\t\t\t\t'animation-duration': (timeout + 350) / 1000 + 's'\n\t\t\t\t}\"\n\t\t\t></span>\n\t\t</div>\n\t\t<div class=\"waw-alert-body\">\n\t\t\t<div *ngIf=\"!component\" class=\"waw-alert-texts\">\n\t\t\t\t<div *ngIf=\"icon\" class=\"{{ icon }}\"></div>\n\t\t\t\t<div class=\"waw-alert-message slideIn\">{{ text }}</div>\n\t\t\t</div>\n\t\t\t<div *ngIf=\"!component && type == 'question'\">\n\t\t\t\t<button\n\t\t\t\t\tclass=\"alert-btn\"\n\t\t\t\t\t*ngFor=\"let b of buttons\"\n\t\t\t\t\t(click)=\"remove(); b.callback && b.callback()\"\n\t\t\t\t>\n\t\t\t\t\t{{ b.text }}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclass=\"waw-alert__close\"\n\t\t\t\t*ngIf=\"closable\"\n\t\t\t\t(click)=\"remove()\"\n\t\t\t></div>\n\t\t</div>\n\t</div>\n</div>\n", styles: ["@keyframes iziT-bounceInUp{0%{opacity:0;transform:translateY(200px)}50%{opacity:1;transform:translateY(-10px)}70%{transform:translateY(5px)}to{transform:translateY(0)}}@keyframes iziT-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes iziT-fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes iziT-fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes iziT-bounceInLeft{0%{opacity:0;transform:translate(280px)}50%{opacity:1;transform:translate(-20px)}70%{transform:translate(10px)}to{transform:translate(0)}}@keyframes iziT-bounceInDown{0%{opacity:0;transform:translateY(-200px)}50%{opacity:1;transform:translateY(10px)}70%{transform:translateY(-5px)}to{transform:translateY(0)}}.alert-wrapper{position:fixed;bottom:50px;left:0;width:100%;height:60px;overflow:hidden}.alert{display:flex;-webkit-box-align:center;align-items:center;width:auto;background:#3aed92;color:#fff;max-width:700px;margin:0 auto;transform:translateY(300px) scale(0);transition:.3s all ease-in-out}.alert._show{transform:translateY(0) scale(1);transition:.3s all ease-in-out}.alert-icon{min-width:60px;min-height:60px;position:relative;display:flex;justify-content:center;align-items:center;background-color:#2bd17d}.alert-icon:before{content:\"\";position:absolute;width:25px;height:25px;border-radius:50%;border:2px solid #fff}.alert-icon:after{content:\"\";position:absolute;top:22px;width:7px;height:11px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.alert-text{padding:0 20px;word-break:break-all;overflow:auto;height:60px}.alert-text .text-block{width:99%}.alert-text .text-block__text{text-overflow:ellipsis;overflow:hidden;white-space:pre}.alert-close{min-width:50px;margin-left:auto;font-size:25px;display:flex;justify-content:center;align-items:center}.font-bold{font-weight:700}.waw-alert__progress{bottom:0;position:absolute;width:100%;margin-bottom:0;border-radius:50px}.waw-alert__progress:hover span{animation-play-state:paused}.waw-alert__progress span{display:block;width:100%;height:2px;background-color:#a5a5a5ed;animation-name:waw-alert-progress;animation-duration:10s;border-radius:50px}.waw-alert__progress span._red{background-color:#ffafb4}.waw-alert__progress span._green{background-color:#a6efb8}.waw-alert__progress span._yellow{background-color:#fff9b2}.waw-alert__progress span._orange,.waw-alert__progress span._blue{background-color:#ffcfa5}.waw-alert__progress span._white{background-color:#fff}.waw-alert__progress span._black{background-color:#000}.waw-alert:hover .waw-alert__progress>span{animation-play-state:paused}.waw-alert__close{width:15px;height:15px;opacity:.3;position:relative;order:2}.waw-alert__close:hover{opacity:1}.waw-alert__close:before,.waw-alert__close:after{cursor:pointer;position:absolute;left:15px;content:\" \";height:12px;width:2px;background-color:#47525d}.waw-alert__close:before{transform:rotate(45deg)}.waw-alert__close:after{transform:rotate(-45deg)}@keyframes waw-alert-progress{0%{width:100%}to{width:0%}}.waw-alert-container{font-size:0;height:100px;width:100%;transform:translateZ(0);backface-visibility:hidden;transition:.3s all ease-in-out;opacity:1}.waw-alert-container._close{opacity:0;transition:.3s all ease-in-out}.waw-alert{display:inline-block;clear:both;position:relative;font-family:Lato,Tahoma,Arial;font-size:14px;padding:8px 25px 9px 0;background:#eeeeeee6;border-color:#eeeeeee6;width:100%;pointer-events:all;cursor:default;transform:translate(0);-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;min-height:54px}.waw-alert>.waw-alert-progressbar{position:absolute;left:0;bottom:0;width:100%;z-index:1;background:#fff3}.waw-alert>.waw-alert-progressbar>div{height:2px;width:100%;background:#0000004d;border-radius:0 0 3px 3px}.waw-alert>.waw-alert-close{position:absolute;right:0;top:0;border:0;padding:0;opacity:.6;width:42px;height:100%;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAJPAAACTwBcGfW0QAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAD3SURBVFiF1ZdtDoMgDEBfdi4PwAX8vLFn0qT7wxantojKupmQmCi8R4tSACpgjC2ICCUbEBa8ingjsU1AXRBeR8aLN64FiknswN8CYefBBDQ3whuFESy7WyQMeC0ipEI0A+0FeBvHUFN8xPaUhAH/iKoWsnXHGegy4J0yxialOfaHJAz4bhRzQzgDvdGnz4GbAonZbCQMuBm1K/kcFu8Mp1N2cFFpsxsMuJqqbIGExGl4loARajU1twskJLLhIsID7+tvUoDnIjTg5T9DPH9EBrz8rxjPzciAl9+O8SxI8CzJ8CxKFfh3ynK8Dyb8wNHM/XDqejx/AtNyPO87tNybAAAAAElFTkSuQmCC) no-repeat 50% 50%;background-size:8px;cursor:pointer;outline:none}.waw-alert>.waw-alert-close:hover{opacity:1}.waw-alert>.waw-alert-body{position:relative;padding:0 0 0 10px;height:auto;min-height:36px;margin:0 0 0 15px;text-align:left;display:flex;justify-content:space-between;align-items:center}.waw-alert>.waw-alert-body:after{content:\"\";display:table;clear:both}.waw-alert>.waw-alert-body .waw-alert-texts{margin:10px 0 0;padding-right:2px;display:inline-block;float:left;display:flex;justify-content:space-between;align-items:center}.waw-alert>.waw-alert-body .waw-alert-icon{height:100%;position:absolute;left:0;top:50%;display:table;font-size:23px;line-height:24px;margin-top:-12px;color:#000;width:24px;height:24px}.waw-alert>.waw-alert-body .waw-alert-title{padding:0;margin:0 10px 0 0;line-height:16px;font-size:14px;text-align:left;float:left;color:#000;white-space:normal;font-weight:700}.waw-alert>.waw-alert-body .waw-alert-message{padding:0;font-size:14px;line-height:16px;text-align:left;float:left;color:#0009;white-space:normal}@media only screen and (min-width: 568px){.waw-alert-wrapper{padding:10px 15px}.waw-alert{margin:5px;border-radius:3px;width:auto}.waw-alert:after{content:\"\";z-index:-1;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:3px;box-shadow:inset 0 -10px 20px -10px #0003,inset 0 0 5px #0000001a,0 8px 8px -5px #00000040}.waw-alert:not(.waw-alert-rtl) .waw-alert-cover{border-radius:3px 0 0 3px}.waw-alert.waw-alert-rtl .waw-alert-cover{border-radius:0 3px 3px 0}.waw-alert.waw-alert-color-dark:after{box-shadow:inset 0 -10px 20px -10px #ffffff4d,0 10px 10px -5px #00000040}.waw-alert.waw-alert-balloon .waw-alert-progressbar{background:transparent}.waw-alert.waw-alert-balloon:after{box-shadow:0 10px 10px -5px #00000040,inset 0 10px 20px -5px #00000040}.waw-alert-target .waw-alert:after{box-shadow:inset 0 -10px 20px -10px #0003,inset 0 0 5px #0000001a}}.waw-alert.waw-alert-theme-dark{background:#565c70;border-color:#565c70}.waw-alert.waw-alert-theme-dark .waw-alert-title{color:#fff}.waw-alert.waw-alert-theme-dark .waw-alert-message{color:#ffffffb3;font-weight:300}.waw-alert.waw-alert-theme-dark .waw-alert-icon{color:#fff}.waw-alert.waw-alert-color-red{background:#ffafb4e6;border-color:#ffafb4e6}.waw-alert.waw-alert-color-orange{background:#ffcfa5e6;border-color:#ffcfa5e6}.waw-alert.waw-alert-color-yellow{background:#fff9b2e6;border-color:#fff9b2e6}.waw-alert.waw-alert-color-blue{background:#9ddeffe6;border-color:#9ddeffe6}.waw-alert.waw-alert-color-green{background:#a6efb8e6;border-color:#a6efb8e6}.waw-alert.slideIn,.waw-alert .slideIn{-webkit-animation:iziT-slideIn 1s cubic-bezier(.16,.81,.32,1) both;-moz-animation:iziT-slideIn 1s cubic-bezier(.16,.81,.32,1) both;animation:iziT-slideIn 1s cubic-bezier(.16,.81,.32,1) both}.waw-alert.bounceInLeft{-webkit-animation:iziT-bounceInLeft .7s ease-in-out both;animation:iziT-bounceInLeft .7s ease-in-out both}.waw-alert.bounceInRight{-webkit-animation:iziT-bounceInRight .85s ease-in-out both;animation:iziT-bounceInRight .85s ease-in-out both}.waw-alert.bounceInDown{-webkit-animation:iziT-bounceInDown .7s ease-in-out both;animation:iziT-bounceInDown .7s ease-in-out both}.waw-alert.bounceInUp{-webkit-animation:iziT-bounceInUp .7s ease-in-out both;animation:iziT-bounceInUp .7s ease-in-out both}.height{height:auto!important}\n"] }] }], ctorParameters: () => [], propDecorators: { alert: [{ type: ViewChild, args: ['alert', { static: false }] }] } }); class ModalComponent { class = ''; size = 'flex'; closable = true; close; onOpen; timestart; timeout; showModal = false; allowClose = true; onClickOutside; ngOnInit() { if (typeof this.onClickOutside !== 'function') { this.onClickOutside = this.close; // this.onClickOutside = () => { // if (this.allowClose) { // this.close(); // } // this.allowClose = true; // }; } if (typeof this.onOpen == 'function') this.onOpen(); window.addEventListener('popstate', this.popStateListener.bind(this)); } ngAfterViewInit() { setTimeout(() => { this.showModal = true; }, this.timestart || 0); } ngOnDestroy() { window.removeEventListener('popstate', this.popStateListener.bind(this)); } popStateListener(e) { this.close(); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: ModalComponent, isStandalone: false, selector: "lib-modal", ngImport: i0, template: "<div\n\t[hidden]=\"!showModal\"\n\tclass=\"modal\"\n\t[ngClass]=\"class + ' ' + size\"\n\t(click)=\"onClickOutside()\"\n>\n\t<!-- (click)=\"$event.stopPropagation()\" -->\n\t<!-- <div class=\"modal-content\" (mousedown)=\"allowClose = false\"> -->\n\t<div class=\"modal-content\" (click)=\"$event.stopPropagation()\">\n\t\t<div><!-- Content Will Drop Here --></div>\n\t\t<span class=\"close\" (click)=\"close()\" *ngIf=\"closable\">&times;</span>\n\t</div>\n</div>\n", styles: [".modal{position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;overflow-y:auto;background-color:#000;background-color:#00000080}.modal-content{position:relative;background-color:#fff;margin:15% auto;padding:20px;border:1px solid #888;min-width:20%;max-width:80%}.close{color:#aaa;position:absolute;right:10px;top:3px;font-size:32px;line-height:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ModalComponent, decorators: [{ type: Component, args: [{ selector: 'lib-modal', standalone: false, template: "<div\n\t[hidden]=\"!showModal\"\n\tclass=\"modal\"\n\t[ngClass]=\"class + ' ' + size\"\n\t(click)=\"onClickOutside()\"\n>\n\t<!-- (click)=\"$event.stopPropagation()\" -->\n\t<!-- <div class=\"modal-content\" (mousedown)=\"allowClose = false\"> -->\n\t<div class=\"modal-content\" (click)=\"$event.stopPropagation()\">\n\t\t<div><!-- Content Will Drop Here --></div>\n\t\t<span class=\"close\" (click)=\"close()\" *ngIf=\"closable\">&times;</span>\n\t</div>\n</div>\n", styles: [".modal{position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;overflow-y:auto;background-color:#000;background-color:#00000080}.modal-content{position:relative;background-color:#fff;margin:15% auto;padding:20px;border:1px solid #888;min-width:20%;max-width:80%}.close{color:#aaa;position:absolute;right:10px;top:3px;font-size:32px;line-height:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}\n"] }] }] }); class LoaderComponent { loader; text = 'Loading'; class = ''; progress = true; timeout = 5000; close; closable = true; constructor() { } ngOnInit() { if (this.timeout) { setTimeout(() => { this.close(); }, this.timeout); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: LoaderComponent, isStandalone: false, selector: "lib-loader", viewQueries: [{ propertyName: "loader", first: true, predicate: ["loader"], descendants: true }], ngImport: i0, template: "<div\n\tstyle=\"\n\t\tposition: fixed;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\tbackground-color: #334d6e;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tz-index: 999999;\n\t\"\n\t#loader\n>\n\t<span class=\"close\" (click)=\"close()\" *ngIf=\"closable\">&times;</span>\n\t<span style=\"font-size: 30px; color: white\">\n\t\t{{ text }}\n\t</span>\n</div>\n", styles: [".close{color:#aaa;position:absolute;right:20px;top:20px;font-size:32px;line-height:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LoaderComponent, decorators: [{ type: Component, args: [{ selector: 'lib-loader', standalone: false, template: "<div\n\tstyle=\"\n\t\tposition: fixed;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\tbackground-color: #334d6e;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tz-index: 999999;\n\t\"\n\t#loader\n>\n\t<span class=\"close\" (click)=\"close()\" *ngIf=\"closable\">&times;</span>\n\t<span style=\"font-size: 30px; color: white\">\n\t\t{{ text }}\n\t</span>\n</div>\n", styles: [".close{color:#aaa;position:absolute;right:20px;top:20px;font-size:32px;line-height:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}\n"] }] }], ctorParameters: () => [], propDecorators: { loader: [{ type: ViewChild, args: ['loader', { static: false }] }] } }); /** * BaseComponent is an abstract class that provides basic functionality for managing the current timestamp. */ class BaseComponent { /** * The current timestamp in milliseconds since the Unix epoch. */ now = new Date().getTime(); /** * Refreshes the `now` property with the current timestamp. */ refreshNow() { this.now = new Date().getTime(); } } class WrapperComponent { constructor() { } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: WrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: WrapperComponent, isStandalone: false, selector: "lib-wrapper", ngImport: i0, template: "<div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-bottomRight\"\n\t\tid=\"bottomRight\"\n\t></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-bottomLeft\"\n\t\tid=\"bottomLeft\"\n\t></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-topRight\"\n\t\tid=\"topRight\"\n\t></div>\n\t<div class=\"waw-alert-wrapper waw-alert-wrapper-topLeft\" id=\"topLeft\"></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-topCenter\"\n\t\tid=\"topCenter\"\n\t></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-bottomCenter\"\n\t\tid=\"bottomCenter\"\n\t></div>\n\t<div class=\"waw-alert-wrapper waw-alert-wrapper-center\" id=\"center\"></div>\n</div>\n", styles: [".waw-alert-wrapper{z-index:99999;position:fixed;width:100%;pointer-events:none;display:flex;flex-direction:column}.waw-alert-wrapper-bottomLeft{left:0;bottom:0;text-align:left}.waw-alert-wrapper-bottomRight{right:0;bottom:0;text-align:right}.waw-alert-wrapper-topLeft{left:0;top:0;text-align:left}.waw-alert-wrapper-topRight{top:0;right:0;text-align:right}.waw-alert-wrapper-topCenter{top:0;left:0;right:0;text-align:center}.waw-alert-wrapper-bottomCenter{bottom:0;left:0;right:0;text-align:center}.waw-alert-wrapper-center{inset:0;text-align:center;justify-content:center;flex-flow:column;align-items:center}\n"] }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: WrapperComponent, decorators: [{ type: Component, args: [{ selector: 'lib-wrapper', standalone: false, template: "<div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-bottomRight\"\n\t\tid=\"bottomRight\"\n\t></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-bottomLeft\"\n\t\tid=\"bottomLeft\"\n\t></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-topRight\"\n\t\tid=\"topRight\"\n\t></div>\n\t<div class=\"waw-alert-wrapper waw-alert-wrapper-topLeft\" id=\"topLeft\"></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-topCenter\"\n\t\tid=\"topCenter\"\n\t></div>\n\t<div\n\t\tclass=\"waw-alert-wrapper waw-alert-wrapper-bottomCenter\"\n\t\tid=\"bottomCenter\"\n\t></div>\n\t<div class=\"waw-alert-wrapper waw-alert-wrapper-center\" id=\"center\"></div>\n</div>\n", styles: [".waw-alert-wrapper{z-index:99999;position:fixed;width:100%;pointer-events:none;display:flex;flex-direction:column}.waw-alert-wrapper-bottomLeft{left:0;bottom:0;text-align:left}.waw-alert-wrapper-bottomRight{right:0;bottom:0;text-align:right}.waw-alert-wrapper-topLeft{left:0;top:0;text-align:left}.waw-alert-wrapper-topRight{top:0;right:0;text-align:right}.waw-alert-wrapper-topCenter{top:0;left:0;right:0;text-align:center}.waw-alert-wrapper-bottomCenter{bottom:0;left:0;right:0;text-align:center}.waw-alert-wrapper-center{inset:0;text-align:center;justify-content:center;flex-flow:column;align-items:center}\n"] }] }], ctorParameters: () => [] }); class DomService { componentFactoryResolver; appRef; injector; providedIn = {}; constructor(componentFactoryResolver, appRef, injector) { this.componentFactoryResolver = componentFactoryResolver; this.appRef = appRef; this.injector = injector; } /** * Appends a component to a specified element by ID. * * @param component - The component to append. * @param options - The options to project into the component. * @param id - The ID of the element to append the component to. * @returns An object containing the native element and the component reference. */ appendById(component, options = {}, id) { const componentRef = this.componentFactoryResolver .resolveComponentFactory(component) .create(this.injector); this.projectComponentInputs(componentRef, options); this.appRef.attachView(componentRef.hostView); const domElem = componentRef.hostView .rootNodes[0]; const element = document.getElementById(id); if (element && typeof element.appendChild === 'function') { element.appendChild(domElem); } return { nativeElement: domElem, componentRef: componentRef, }; } /** * Appends a component to a specified element or to the body. * * @param component - The component to append. * @param options - The options to project into the component. * @param element - The element to append the component to. Defaults to body. * @returns An object containing the native element and the component reference. */ appendComponent(component, options = {}, element = document.body) { if (options.providedIn) { if (this.providedIn[options.providedIn]) { return; } this.providedIn[options.providedIn] = true; } const componentRef = this.componentFactoryResolver .resolveComponentFactory(component) .create(this.injector); this.projectComponentInputs(componentRef, options); this.appRef.attachView(componentRef.hostView); const domElem = componentRef.hostView .rootNodes[0]; if (element && typeof element.appendChild === 'function') { element.appendChild(domElem); } return { nativeElement: domElem, componentRef: componentRef, }; } /** * Gets a reference to a dynamically created component. * * @param component - The component to create. * @param options - The options to project into the component. * @returns The component reference. */ getComponentRef(component, options = {}) { const componentRef = this.componentFactoryResolver .resolveComponentFactory(component) .create(this.injector); this.projectComponentInputs(componentRef, options); this.appRef.attachView(componentRef.hostView); return componentRef; } /** * Projects the inputs onto the component. * * @param component - The component reference. * @param options - The options to project into the component. * @returns The component reference with the projected inputs. */ projectComponentInputs(component, options) { if (options) { const props = Object.getOwnPropertyNames(options); for (const prop of props) { component.instance[prop] = options[prop]; } } return component; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DomService, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DomService, providedIn: 'root' }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DomService, decorators: [{ type: Injectable, args: [{ providedIn: 'root', }] }], ctorParameters: () => [{ type: i0.ComponentFactoryResolver }, { type: i0.ApplicationRef }, { type: i0.Injector }] }); class AlertService { dom; config; alert; _container; constructor(dom, config) { this.dom = dom; this.config = config; if (!this.config) this.config = DEFAULT_CONFIG; this.alert = this.config.alert; if (!this.alert) { this.alert = DEFAULT_Alert; } else { for (let each in DEFAULT_Alert) { if (this.alert[each]) continue; this.alert[each] = DEFAULT_Alert[each]; } } this._container = this.dom.appendComponent(WrapperComponent); } uniques = {}; shortcuts = { tl: 'topLeft', tc: 'topCenter', tr: 'topRight', r: 'right', br: 'bottomRight', bc: 'bottomCenter', bl: 'bottomLeft', l: 'left', c: 'center', }; positionNumber = { topLeft: 3, topCenter: 4, topRight: 2, right: '', bottomRight: 0, bottomCenter: 5, bottomLeft: 1, left: '', center: 6, }; show(opts) { if (typeof opts === 'string') { opts = { text: opts, }; } if (!opts) opts = {}; if (!opts['type']) opts['type'] = 'info'; for (let each in this.alert) { if (each == 'class') opts[each] = opts[each] + ' ' + this.alert[each]; else if (typeof opts[each] == 'undefined') opts[each] = this.alert[each]; } if (this.shortcuts[opts.position]) opts.position = this.shortcuts[opts.position]; if (!opts.position) opts.position = 'bottomRight'; var content; opts.close = () => { if (content) content.componentRef.destroy(); opts.component.nativeElement.remove(); if (typeof opts.onClose == 'function') opts.onClose(); }; // let component = this.dom.appendById(AlertComponent, opts, opts.position); let customElement = false; if (typeof opts.component == 'string' && this.alert.alerts[opts.component]) { opts.component = this.alert.alerts[opts.component]; customElement = true; } else { opts.component = this.dom.appendById(AlertComponent, opts, opts.position); } if (typeof opts.component === 'function') { content = this.dom.appendComponent(opts.component, opts, this._container.nativeElement.children[0].children[this.positionNumber[opts.position] || 0] // component.nativeElement.children[0].children[0].children[0] as HTMLElement ); } if (opts.unique) { if (this.uniques[opts.unique]) this.uniques[opts.unique].remove(); this.uniques[opts.unique] = opts.component.nativeElement; } if (typeof opts.timeout !== 'number') { opts.timeout = 2000; } if (opts.timeout) { setTimeout(() => { opts.close(); }, opts.timeout); } return opts.component.nativeElement; } open(opts) { this.show(opts); } info(opts) { opts['type'] = 'info'; this.show(opts); } success(opts) { opts['type'] = 'success'; this.show(opts); } warning(opts) { opts['type'] = 'warning'; this.show(opts); } error(opts) { opts['type'] = 'error'; this.show(opts); } question(opts) { opts['type'] = 'question'; this.show(opts); } destroy() { [ 'bottomRight', 'bottomLeft', 'bottomCenter', 'topRight', 'topLeft', 'topCenter', 'center', ].forEach((id) => { const el = document.getElementById(id); if (el) el.innerHTML = ''; }); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AlertService, deps: [{ token: DomService }, { token: CONFIG_TOKEN, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AlertService, providedIn: 'root' }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AlertService, decorators: [{ type: Injectable, args: [{ prov