@abp/ng.theme.shared 5.0.0-beta.2 → 5.0.0-rc.2

package/fesm2015/abp-ng.theme.shared.js

@@ -1,15 +1,15 @@
 import { animation, style, animate, keyframes, trigger, state, transition, useAnimation, query } from '@angular/animations';
 import * as i0 from '@angular/core';
-import { Component, Input, ChangeDetectionStrategy, EventEmitter, Output, ViewChild, ViewEncapsulation, Injectable, InjectionToken, Optional, Inject, ContentChild, Directive, HostListener, HostBinding, NgModule, ComponentFactoryResolver, RendererFactory2, ApplicationRef, APP_INITIALIZER, inject, LOCALE_ID, Injector } from '@angular/core';
+import { Component, Input, ChangeDetectionStrategy, EventEmitter, Output, ViewChild, ViewEncapsulation, Injectable, InjectionToken, Optional, Inject, ContentChild, Directive, HostListener, HostBinding, NgModule, ComponentFactoryResolver, RendererFactory2, ApplicationRef, APP_INITIALIZER, inject, LOCALE_ID } from '@angular/core';
 import * as i1 from '@angular/common';
 import { DOCUMENT, formatDate, DatePipe } from '@angular/common';
 import * as i1$1 from '@angular/router';
 import { ResolveEnd } from '@angular/router';
 import * as i2 from '@abp/ng.core';
-import { getRoutePath, SubscriptionService, PROJECTION_STRATEGY, uuid, HttpErrorReporterService, RouterEvents, AuthService, LocalizationService, getLocaleDirection, LazyLoadService, LOADING_STRATEGY, RoutesService, InternalStore, DomInsertionService, CONTENT_STRATEGY, CoreModule, noop, ConfigStateService } from '@abp/ng.core';
+import { getRoutePath, SubscriptionService, PROJECTION_STRATEGY, uuid, LocalizationService, getLocaleDirection, HttpErrorReporterService, RouterEvents, AuthService, RoutesService, InternalStore, DomInsertionService, CONTENT_STRATEGY, CoreModule, noop, ConfigStateService } from '@abp/ng.core';
 import { __rest } from 'tslib';
 import { startWith, map, debounceTime, filter, takeUntil, distinctUntilChanged, take, catchError, switchMap } from 'rxjs/operators';
-import { fromEvent, Subscription, combineLatest, timer, ReplaySubject, Subject, throwError, Observable, of, BehaviorSubject } from 'rxjs';
+import { fromEvent, Subscription, combineLatest, timer, ReplaySubject, Subject, BehaviorSubject, throwError, Observable, of } from 'rxjs';
 import * as i3 from '@ng-bootstrap/ng-bootstrap';
 import { NgbInputDatepickerConfig, NgbTypeaheadConfig, NgbDateParserFormatter, NgbPaginationModule } from '@ng-bootstrap/ng-bootstrap';
 import * as i1$2 from '@swimlane/ngx-datatable';
@@ -153,9 +153,9 @@ class BreadcrumbItemsComponent {
         this.items = [];
     }
 }
-BreadcrumbItemsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BreadcrumbItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbItemsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: BreadcrumbItemsComponent, selector: "abp-breadcrumb-items", inputs: { items: "items" }, ngImport: i0, template: "<ol class=\"breadcrumb\" *ngIf=\"items.length\">\n  <li class=\"breadcrumb-item\">\n    <a routerLink=\"/\"><i class=\"fa fa-home\"></i> </a>\n  </li>\n  <li\n    *ngFor=\"let item of items; let last = last\"\n    class=\"breadcrumb-item\"\n    [class.active]=\"last\"\n    aria-current=\"page\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"item.path ? linkTemplate : textTemplate; context: { $implicit: item }\"\n    ></ng-container>\n  </li>\n</ol>\n\n<ng-template #linkTemplate let-item>\n  <a [routerLink]=\"item.path\"> {{ item.name | abpLocalization }}</a>\n</ng-template>\n\n<ng-template #textTemplate let-item>\n  {{ item.name | abpLocalization }}\n</ng-template>\n", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "abpLocalization": i2.LocalizationPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BreadcrumbItemsComponent, decorators: [{
+BreadcrumbItemsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BreadcrumbItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+BreadcrumbItemsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: BreadcrumbItemsComponent, selector: "abp-breadcrumb-items", inputs: { items: "items" }, ngImport: i0, template: "<ol class=\"breadcrumb\" *ngIf=\"items.length\">\r\n  <li class=\"breadcrumb-item\">\r\n    <a routerLink=\"/\"><i class=\"fa fa-home\"></i> </a>\r\n  </li>\r\n  <li\r\n    *ngFor=\"let item of items; let last = last\"\r\n    class=\"breadcrumb-item\"\r\n    [class.active]=\"last\"\r\n    aria-current=\"page\"\r\n  >\r\n    <ng-container\r\n      *ngTemplateOutlet=\"item.path ? linkTemplate : textTemplate; context: { $implicit: item }\"\r\n    ></ng-container>\r\n  </li>\r\n</ol>\r\n\r\n<ng-template #linkTemplate let-item>\r\n  <a [routerLink]=\"item.path\"> {{ item.name | abpLocalization }}</a>\r\n</ng-template>\r\n\r\n<ng-template #textTemplate let-item>\r\n  {{ item.name | abpLocalization }}\r\n</ng-template>\r\n", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "abpLocalization": i2.LocalizationPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BreadcrumbItemsComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-breadcrumb-items',
@@ -190,9 +190,9 @@ class BreadcrumbComponent {
         });
     }
 }
-BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Router }, { token: i2.RoutesService }, { token: i2.SubscriptionService }, { token: i2.RouterEvents }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: BreadcrumbComponent, selector: "abp-breadcrumb", providers: [SubscriptionService], ngImport: i0, template: "<abp-breadcrumb-items [items]=\"segments\"></abp-breadcrumb-items>\n", components: [{ type: BreadcrumbItemsComponent, selector: "abp-breadcrumb-items", inputs: ["items"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BreadcrumbComponent, decorators: [{
+BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Router }, { token: i2.RoutesService }, { token: i2.SubscriptionService }, { token: i2.RouterEvents }], target: i0.ɵɵFactoryTarget.Component });
+BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: BreadcrumbComponent, selector: "abp-breadcrumb", providers: [SubscriptionService], ngImport: i0, template: "<abp-breadcrumb-items [items]=\"segments\"></abp-breadcrumb-items>\r\n", components: [{ type: BreadcrumbItemsComponent, selector: "abp-breadcrumb-items", inputs: ["items"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-breadcrumb',
@@ -226,43 +226,46 @@ class ButtonComponent {
     ngOnInit() {
         if (this.attributes) {
             Object.keys(this.attributes).forEach(key => {
-                this.renderer.setAttribute(this.buttonRef.nativeElement, key, this.attributes[key]);
+                var _a;
+                if ((_a = this.attributes) === null || _a === void 0 ? void 0 : _a[key]) {
+                    this.renderer.setAttribute(this.buttonRef.nativeElement, key, this.attributes[key]);
+                }
             });
         }
     }
 }
-ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ButtonComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ButtonComponent, selector: "abp-button", inputs: { buttonId: "buttonId", buttonClass: "buttonClass", buttonType: "buttonType", iconClass: "iconClass", loading: "loading", disabled: "disabled", attributes: "attributes" }, outputs: { click: "click", focus: "focus", blur: "blur", abpClick: "abpClick", abpFocus: "abpFocus", abpBlur: "abpBlur" }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["button"], descendants: true, static: true }], ngImport: i0, template: `
-    <button
-      #button
-      [id]="buttonId"
-      [attr.type]="buttonType"
-      [ngClass]="buttonClass"
-      [disabled]="loading || disabled"
-      (click.stop)="click.next($event); abpClick.next($event)"
-      (focus)="focus.next($event); abpFocus.next($event)"
-      (blur)="blur.next($event); abpBlur.next($event)"
-    >
-      <i [ngClass]="icon" class="mr-1"></i><ng-content></ng-content>
-    </button>
+ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ButtonComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: ButtonComponent, selector: "abp-button", inputs: { buttonId: "buttonId", buttonClass: "buttonClass", buttonType: "buttonType", iconClass: "iconClass", loading: "loading", disabled: "disabled", attributes: "attributes" }, outputs: { click: "click", focus: "focus", blur: "blur", abpClick: "abpClick", abpFocus: "abpFocus", abpBlur: "abpBlur" }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["button"], descendants: true, static: true }], ngImport: i0, template: `
+    <button
+      #button
+      [id]="buttonId"
+      [attr.type]="buttonType"
+      [ngClass]="buttonClass"
+      [disabled]="loading || disabled"
+      (click.stop)="click.next($event); abpClick.next($event)"
+      (focus)="focus.next($event); abpFocus.next($event)"
+      (blur)="blur.next($event); abpBlur.next($event)"
+    >
+      <i [ngClass]="icon" class="me-1"></i><ng-content></ng-content>
+    </button>
   `, isInline: true, directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-button',
-                    template: `
-    <button
-      #button
-      [id]="buttonId"
-      [attr.type]="buttonType"
-      [ngClass]="buttonClass"
-      [disabled]="loading || disabled"
-      (click.stop)="click.next($event); abpClick.next($event)"
-      (focus)="focus.next($event); abpFocus.next($event)"
-      (blur)="blur.next($event); abpBlur.next($event)"
-    >
-      <i [ngClass]="icon" class="mr-1"></i><ng-content></ng-content>
-    </button>
+                    template: `
+    <button
+      #button
+      [id]="buttonId"
+      [attr.type]="buttonType"
+      [ngClass]="buttonClass"
+      [disabled]="loading || disabled"
+      (click.stop)="click.next($event); abpClick.next($event)"
+      (focus)="focus.next($event); abpFocus.next($event)"
+      (blur)="blur.next($event); abpBlur.next($event)"
+    >
+      <i [ngClass]="icon" class="me-1"></i><ng-content></ng-content>
+    </button>
   `,
                 }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { buttonId: [{
@@ -330,9 +333,9 @@ class ConfirmationComponent {
         }
     }
 }
-ConfirmationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ConfirmationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ConfirmationComponent, selector: "abp-confirmation", ngImport: i0, template: "<div class=\"confirmation\" *ngIf=\"confirmation$ | async as data\">\n  <div\n    class=\"confirmation-backdrop\"\n    (click)=\"data.options?.dismissible ? close(dismiss) : null\"\n  ></div>\n  <div class=\"confirmation-dialog\">\n    <div class=\"icon-container\" [ngClass]=\"data.severity\" *ngIf=\"data.severity\">\n      <i class=\"fa icon\" [ngClass]=\"getIconClass(data)\"></i>\n    </div>\n    <div class=\"content\">\n      <h1\n        class=\"title\"\n        *ngIf=\"data.title\"\n        [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"\n      ></h1>\n      <p\n        class=\"message\"\n        *ngIf=\"data.message\"\n        [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"\n      ></p>\n    </div>\n    <div class=\"footer\">\n      <button\n        id=\"cancel\"\n        class=\"confirmation-button confirmation-button--reject\"\n        [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\"\n        *ngIf=\"!data?.options?.hideCancelBtn\"\n        (click)=\"close(reject)\"\n      ></button>\n      <button\n        id=\"confirm\"\n        class=\"confirmation-button confirmation-button--approve\"\n        [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\n        *ngIf=\"!data?.options?.hideYesBtn\"\n        (click)=\"close(confirm)\"\n      ></button>\n    </div>\n  </div>\n</div>\n", styles: [".confirmation{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:1060}.confirmation .confirmation-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1061!important}.confirmation .confirmation-dialog{display:flex;flex-direction:column;margin:20px auto;padding:0;width:450px;min-height:300px;z-index:1062!important}@media screen and (max-width: 500px){.confirmation .confirmation-dialog{width:90vw}}.confirmation .confirmation-dialog .icon-container{display:flex;align-items:center;justify-content:center;margin:0 0 10px;padding:20px}.confirmation .confirmation-dialog .icon-container .icon{width:100px;height:100px;stroke-width:1;font-size:80px;text-align:center}.confirmation .confirmation-dialog .content{flex-grow:1;display:block}.confirmation .confirmation-dialog .content .title{display:block;margin:0;padding:0;font-size:27px;font-weight:600;text-align:center}.confirmation .confirmation-dialog .content .message{display:block;margin:10px auto;padding:20px;font-size:16px;font-weight:400;text-align:center}.confirmation .confirmation-dialog .footer{display:flex;align-items:center;justify-content:flex-end;margin:10px 0 0;padding:20px;width:100%}.confirmation .confirmation-dialog .footer .confirmation-button{display:inline-block;margin:0 5px;padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1.AsyncPipe, "abpLocalization": i2.LocalizationPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ConfirmationComponent, decorators: [{
+ConfirmationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ConfirmationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: ConfirmationComponent, selector: "abp-confirmation", ngImport: i0, template: "<div class=\"confirmation\" *ngIf=\"confirmation$ | async as data\">\r\n  <div\r\n    class=\"confirmation-backdrop\"\r\n    (click)=\"data.options?.dismissible ? close(dismiss) : null\"\r\n  ></div>\r\n  <div class=\"confirmation-dialog\">\r\n    <div class=\"icon-container\" [ngClass]=\"data.severity\" *ngIf=\"data.severity\">\r\n      <i class=\"fa icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n    </div>\r\n    <div class=\"content\">\r\n      <h1\r\n        class=\"title\"\r\n        *ngIf=\"data.title\"\r\n        [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"\r\n      ></h1>\r\n      <p\r\n        class=\"message\"\r\n        *ngIf=\"data.message\"\r\n        [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"\r\n      ></p>\r\n    </div>\r\n    <div class=\"footer\">\r\n      <button\r\n        id=\"cancel\"\r\n        class=\"confirmation-button confirmation-button--reject\"\r\n        [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\"\r\n        *ngIf=\"!data?.options?.hideCancelBtn\"\r\n        (click)=\"close(reject)\"\r\n      ></button>\r\n      <button\r\n        id=\"confirm\"\r\n        class=\"confirmation-button confirmation-button--approve\"\r\n        [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\r\n        *ngIf=\"!data?.options?.hideYesBtn\"\r\n        (click)=\"close(confirm)\"\r\n      ></button>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".confirmation{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:1060}.confirmation .confirmation-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1061!important}.confirmation .confirmation-dialog{display:flex;flex-direction:column;margin:20px auto;padding:0;width:450px;min-height:300px;z-index:1062!important}@media screen and (max-width: 500px){.confirmation .confirmation-dialog{width:90vw}}.confirmation .confirmation-dialog .icon-container{display:flex;align-items:center;justify-content:center;margin:0 0 10px;padding:20px}.confirmation .confirmation-dialog .icon-container .icon{width:100px;height:100px;stroke-width:1;font-size:80px;text-align:center}.confirmation .confirmation-dialog .content{flex-grow:1;display:block}.confirmation .confirmation-dialog .content .title{display:block;margin:0;padding:0;font-size:27px;font-weight:600;text-align:center}.confirmation .confirmation-dialog .content .message{display:block;margin:10px auto;padding:20px;font-size:16px;font-weight:400;text-align:center}.confirmation .confirmation-dialog .footer{display:flex;align-items:center;justify-content:flex-end;margin:10px 0 0;padding:20px;width:100%}.confirmation .confirmation-dialog .footer .confirmation-button{display:inline-block;margin:0 5px;padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1.AsyncPipe, "abpLocalization": i2.LocalizationPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ConfirmationComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-confirmation',
@@ -347,7 +350,7 @@ class HttpErrorWrapperComponent {
         this.status = 0;
         this.title = 'Oops!';
         this.details = 'Sorry, an error has occured.';
-        this.customComponent = null;
+        this.customComponent = undefined;
         this.hideCloseIcon = false;
         this.isHomeShow = true;
     }
@@ -367,7 +370,9 @@ class HttpErrorWrapperComponent {
             customComponentRef.instance.errorStatus = this.status;
             customComponentRef.instance.destroy$ = this.destroy$;
             this.appRef.attachView(customComponentRef.hostView);
-            this.containerRef.nativeElement.appendChild(customComponentRef.hostView.rootNodes[0]);
+            if (this.containerRef) {
+                this.containerRef.nativeElement.appendChild(customComponentRef.hostView.rootNodes[0]);
+            }
             customComponentRef.changeDetectorRef.detectChanges();
         }
         const keyup$ = fromEvent(document, 'keyup').pipe(debounceTime(150), filter((key) => key && key.key === 'Escape'));
@@ -381,9 +386,9 @@ class HttpErrorWrapperComponent {
         this.destroy$.complete();
     }
 }
-HttpErrorWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: HttpErrorWrapperComponent, deps: [{ token: i2.SubscriptionService }], target: i0.ɵɵFactoryTarget.Component });
-HttpErrorWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: HttpErrorWrapperComponent, selector: "abp-http-error-wrapper", providers: [SubscriptionService], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div\n  #container\n  id=\"abp-http-error-container\"\n  class=\"error\"\n  [style.backgroundColor]=\"backgroundColor\"\n>\n  <button\n    *ngIf=\"!hideCloseIcon\"\n    id=\"abp-close-button\"\n    type=\"button\"\n    class=\"close mr-2\"\n    (click)=\"destroy()\"\n  >\n    <span aria-hidden=\"true\">&times;</span>\n  </button>\n\n  <div *ngIf=\"!customComponent\" class=\"row centered\">\n    <div class=\"col-md-12\">\n      <div class=\"error-template\">\n        <h1>{{ statusText }} {{ title | abpLocalization }}</h1>\n        <div class=\"error-details\">\n          {{ details | abpLocalization }}\n        </div>\n        <div class=\"error-actions\">\n          <a\n            *ngIf=\"isHomeShow\"\n            (click)=\"destroy()\"\n            routerLink=\"/\"\n            class=\"btn btn-primary btn-md mt-2\"\n            ><span class=\"glyphicon glyphicon-home\"></span>\n            {{ { key: '::Menu:Home', defaultValue: 'Home' } | abpLocalization }}\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".error{position:fixed;top:0;width:100vw;height:100vh;z-index:999999}.centered{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], pipes: { "abpLocalization": i2.LocalizationPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: HttpErrorWrapperComponent, decorators: [{
+HttpErrorWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: HttpErrorWrapperComponent, deps: [{ token: i2.SubscriptionService }], target: i0.ɵɵFactoryTarget.Component });
+HttpErrorWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: HttpErrorWrapperComponent, selector: "abp-http-error-wrapper", providers: [SubscriptionService], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div\r\n  #container\r\n  id=\"abp-http-error-container\"\r\n  class=\"error\"\r\n  [style.backgroundColor]=\"backgroundColor\"\r\n>\r\n  <button\r\n    *ngIf=\"!hideCloseIcon\"\r\n    id=\"abp-close-button\"\r\n    type=\"button\"\r\n    class=\"btn-close me-2\"\r\n    (click)=\"destroy()\"\r\n  ></button>\r\n\r\n  <div *ngIf=\"!customComponent\" class=\"row centered\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"error-template\">\r\n        <h1>{{ statusText }} {{ title | abpLocalization }}</h1>\r\n        <div class=\"error-details\">\r\n          {{ details | abpLocalization }}\r\n        </div>\r\n        <div class=\"error-actions\">\r\n          <a\r\n            *ngIf=\"isHomeShow\"\r\n            (click)=\"destroy()\"\r\n            routerLink=\"/\"\r\n            class=\"btn btn-primary btn-md mt-2\"\r\n            ><span class=\"glyphicon glyphicon-home\"></span>\r\n            {{ { key: '::Menu:Home', defaultValue: 'Home' } | abpLocalization }}\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".error{position:fixed;top:0;width:100vw;height:100vh;z-index:999999}.centered{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], pipes: { "abpLocalization": i2.LocalizationPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: HttpErrorWrapperComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-http-error-wrapper',
@@ -472,36 +477,36 @@ class LoaderBarComponent {
         this.timer = timer(this.stopDelay).subscribe(this.clearProgress);
     }
 }
-LoaderBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LoaderBarComponent, deps: [{ token: i1$1.Router }, { token: i0.ChangeDetectorRef }, { token: i2.SubscriptionService }, { token: i2.HttpWaitService }, { token: i2.RouterWaitService }], target: i0.ɵɵFactoryTarget.Component });
-LoaderBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: LoaderBarComponent, selector: "abp-loader-bar", inputs: { isLoading: "isLoading", containerClass: "containerClass", color: "color" }, providers: [SubscriptionService], ngImport: i0, template: `
-    <div id="abp-loader-bar" [ngClass]="containerClass" [class.is-loading]="isLoading">
-      <div
-        class="abp-progress"
-        [class.progressing]="progressLevel"
-        [style.width.vw]="progressLevel"
-        [ngStyle]="{
-          'background-color': color,
-          'box-shadow': boxShadow
-        }"
-      ></div>
-    </div>
+LoaderBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: LoaderBarComponent, deps: [{ token: i1$1.Router }, { token: i0.ChangeDetectorRef }, { token: i2.SubscriptionService }, { token: i2.HttpWaitService }, { token: i2.RouterWaitService }], target: i0.ɵɵFactoryTarget.Component });
+LoaderBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: LoaderBarComponent, selector: "abp-loader-bar", inputs: { isLoading: "isLoading", containerClass: "containerClass", color: "color" }, providers: [SubscriptionService], ngImport: i0, template: `
+    <div id="abp-loader-bar" [ngClass]="containerClass" [class.is-loading]="isLoading">
+      <div
+        class="abp-progress"
+        [class.progressing]="progressLevel"
+        [style.width.vw]="progressLevel"
+        [ngStyle]="{
+          'background-color': color,
+          'box-shadow': boxShadow
+        }"
+      ></div>
+    </div>
   `, isInline: true, styles: [".abp-loader-bar{left:0;opacity:0;position:fixed;top:0;transition:opacity .4s linear .4s;z-index:99999}.abp-loader-bar.is-loading{opacity:1;transition:none}.abp-loader-bar .abp-progress{height:3px;left:0;position:fixed;top:0}.abp-loader-bar .abp-progress.progressing{transition:width .4s ease}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LoaderBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: LoaderBarComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-loader-bar',
-                    template: `
-    <div id="abp-loader-bar" [ngClass]="containerClass" [class.is-loading]="isLoading">
-      <div
-        class="abp-progress"
-        [class.progressing]="progressLevel"
-        [style.width.vw]="progressLevel"
-        [ngStyle]="{
-          'background-color': color,
-          'box-shadow': boxShadow
-        }"
-      ></div>
-    </div>
+                    template: `
+    <div id="abp-loader-bar" [ngClass]="containerClass" [class.is-loading]="isLoading">
+      <div
+        class="abp-progress"
+        [class.progressing]="progressLevel"
+        [style.width.vw]="progressLevel"
+        [ngStyle]="{
+          'background-color': color,
+          'box-shadow': boxShadow
+        }"
+      ></div>
+    </div>
   `,
                     styleUrls: ['./loader-bar.component.scss'],
                     providers: [SubscriptionService],
@@ -516,44 +521,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImpor
 
 class LoadingComponent {
 }
-LoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: LoadingComponent, selector: "abp-loading", ngImport: i0, template: `
-    <div class="abp-loading">
-      <i class="fa fa-spinner fa-pulse abp-spinner"></i>
-    </div>
+LoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: LoadingComponent, selector: "abp-loading", ngImport: i0, template: `
+    <div class="abp-loading">
+      <i class="fa fa-spinner fa-pulse abp-spinner"></i>
+    </div>
   `, isInline: true, styles: ["\n      .abp-loading {\n        position: absolute;\n        width: 100%;\n        height: 100%;\n        top: 0;\n        left: 0;\n        z-index: 1040;\n      }\n\n      .abp-loading .abp-spinner {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        font-size: 14px;\n        -moz-transform: translateX(-50%) translateY(-50%);\n        -o-transform: translateX(-50%) translateY(-50%);\n        -ms-transform: translateX(-50%) translateY(-50%);\n        -webkit-transform: translateX(-50%) translateY(-50%);\n        transform: translateX(-50%) translateY(-50%);\n      }\n    "], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LoadingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: LoadingComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-loading',
-                    template: `
-    <div class="abp-loading">
-      <i class="fa fa-spinner fa-pulse abp-spinner"></i>
-    </div>
+                    template: `
+    <div class="abp-loading">
+      <i class="fa fa-spinner fa-pulse abp-spinner"></i>
+    </div>
   `,
                     encapsulation: ViewEncapsulation.None,
                     styles: [
-                        `
-      .abp-loading {
-        position: absolute;
-        width: 100%;
-        height: 100%;
-        top: 0;
-        left: 0;
-        z-index: 1040;
-      }
-
-      .abp-loading .abp-spinner {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        font-size: 14px;
-        -moz-transform: translateX(-50%) translateY(-50%);
-        -o-transform: translateX(-50%) translateY(-50%);
-        -ms-transform: translateX(-50%) translateY(-50%);
-        -webkit-transform: translateX(-50%) translateY(-50%);
-        transform: translateX(-50%) translateY(-50%);
-      }
+                        `
+      .abp-loading {
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        top: 0;
+        left: 0;
+        z-index: 1040;
+      }
+
+      .abp-loading .abp-spinner {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        font-size: 14px;
+        -moz-transform: translateX(-50%) translateY(-50%);
+        -o-transform: translateX(-50%) translateY(-50%);
+        -ms-transform: translateX(-50%) translateY(-50%);
+        -webkit-transform: translateX(-50%) translateY(-50%);
+        transform: translateX(-50%) translateY(-50%);
+      }
     `,
                     ],
                 }]
@@ -612,9 +617,9 @@ class ConfirmationService {
         });
     }
 }
-ConfirmationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ConfirmationService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable });
-ConfirmationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ConfirmationService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ConfirmationService, decorators: [{
+ConfirmationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ConfirmationService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable });
+ConfirmationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ConfirmationService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ConfirmationService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i2.ContentProjectionService }]; } });
@@ -638,9 +643,9 @@ class ModalRefService {
         this.modalRefs.forEach(modal => modal.dismiss(mode));
     }
 }
-ModalRefService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ModalRefService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ModalRefService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ModalRefService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ModalRefService, decorators: [{
+ModalRefService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ModalRefService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ModalRefService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ModalRefService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ModalRefService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -687,7 +692,8 @@ class ModalComponent {
         return document.querySelector(`ngb-modal-window.${this.modalIdentifier}`);
     }
     get isFormDirty() {
-        return Boolean(this.modalWindowRef.querySelector('.ng-dirty'));
+        var _a;
+        return Boolean((_a = this.modalWindowRef) === null || _a === void 0 ? void 0 : _a.querySelector('.ng-dirty'));
     }
     ngOnInit() {
         this.modalRefService.register(this);
@@ -752,26 +758,25 @@ class ModalComponent {
         }
     }
     listen() {
-        fromEvent(this.modalWindowRef, 'keyup')
-            .pipe(takeUntil(this.destroy$), debounceTime(150), filter((key) => key && key.key === 'Escape'))
-            .subscribe(() => this.close());
+        if (this.modalWindowRef) {
+            fromEvent(this.modalWindowRef, 'keyup')
+                .pipe(takeUntil(this.destroy$), debounceTime(150), filter((key) => key && key.key === 'Escape'))
+                .subscribe(() => this.close());
+        }
         fromEvent(window, 'beforeunload')
             .pipe(takeUntil(this.destroy$))
             .subscribe(event => {
-            event.preventDefault();
-            if (this.isFormDirty && !this.suppressUnsavedChangesWarning) {
-                event.returnValue = true;
-            }
-            else {
-                delete event.returnValue;
+            // TODO: check this
+            if (!this.isFormDirty || this.suppressUnsavedChangesWarning) {
+                event.preventDefault();
             }
         });
         this.init.emit();
     }
 }
-ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ModalComponent, deps: [{ token: ConfirmationService }, { token: i2.SubscriptionService }, { token: SUPPRESS_UNSAVED_CHANGES_WARNING, optional: true }, { token: i3.NgbModal }, { token: ModalRefService }], target: i0.ɵɵFactoryTarget.Component });
-ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ModalComponent, selector: "abp-modal", inputs: { visible: "visible", busy: "busy", options: "options", suppressUnsavedChangesWarning: "suppressUnsavedChangesWarning" }, outputs: { visibleChange: "visibleChange", init: "init", appear: "appear", disappear: "disappear" }, providers: [SubscriptionService], queries: [{ propertyName: "abpHeader", first: true, predicate: ["abpHeader"], descendants: true }, { propertyName: "abpBody", first: true, predicate: ["abpBody"], descendants: true }, { propertyName: "abpFooter", first: true, predicate: ["abpFooter"], descendants: true }, { propertyName: "abpSubmit", first: true, predicate: ButtonComponent, descendants: true, read: ButtonComponent }], viewQueries: [{ propertyName: "modalContent", first: true, predicate: ["modalContent"], descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n\n<ng-template #modalContent let-modal>\n  <div id=\"abp-modal-header\" class=\"modal-header\">\n    <ng-container *ngTemplateOutlet=\"abpHeader\"></ng-container>\n    \u200B\n    <button\n      id=\"abp-modal-close-button\"\n      type=\"button\"\n      class=\"close\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\"\n    >\n      <span aria-hidden=\"true\">&times;</span>\n    </button>\n  </div>\n  <div id=\"abp-modal-body\" class=\"modal-body\">\n    <ng-container *ngTemplateOutlet=\"abpBody\"></ng-container>\n  </div>\n  <div *ngIf=\"abpFooter\" id=\"abp-modal-footer\" class=\"modal-footer\">\n    <ng-container *ngTemplateOutlet=\"abpFooter\"></ng-container>\n  </div>\n</ng-template>\n", styles: [".modal.show{display:block!important}.modal-backdrop{opacity:.8}.modal::-webkit-scrollbar{width:7px}.modal::-webkit-scrollbar-track{background:#ddd}.modal::-webkit-scrollbar-thumb{background:#8a8686}.modal-dialog{z-index:1050}\n"], directives: [{ type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ModalComponent, decorators: [{
+ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ModalComponent, deps: [{ token: ConfirmationService }, { token: i2.SubscriptionService }, { token: SUPPRESS_UNSAVED_CHANGES_WARNING, optional: true }, { token: i3.NgbModal }, { token: ModalRefService }], target: i0.ɵɵFactoryTarget.Component });
+ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: ModalComponent, selector: "abp-modal", inputs: { visible: "visible", busy: "busy", options: "options", suppressUnsavedChangesWarning: "suppressUnsavedChangesWarning" }, outputs: { visibleChange: "visibleChange", init: "init", appear: "appear", disappear: "disappear" }, providers: [SubscriptionService], queries: [{ propertyName: "abpHeader", first: true, predicate: ["abpHeader"], descendants: true }, { propertyName: "abpBody", first: true, predicate: ["abpBody"], descendants: true }, { propertyName: "abpFooter", first: true, predicate: ["abpFooter"], descendants: true }, { propertyName: "abpSubmit", first: true, predicate: ButtonComponent, descendants: true, read: ButtonComponent }], viewQueries: [{ propertyName: "modalContent", first: true, predicate: ["modalContent"], descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\r\n\r\n<ng-template #modalContent let-modal>\r\n  <div *ngIf=\"abpHeader\" id=\"abp-modal-header\" class=\"modal-header\">\r\n    <ng-container *ngTemplateOutlet=\"abpHeader\"></ng-container>\r\n    \u200B\r\n    <button\r\n      id=\"abp-modal-close-button\"\r\n      type=\"button\"\r\n      class=\"btn-sm btn-close\"\r\n      aria-label=\"Close\"\r\n      (click)=\"modal.dismiss()\"\r\n    ></button>\r\n  </div>\r\n  <div *ngIf=\"abpBody\" id=\"abp-modal-body\" class=\"modal-body\">\r\n    <ng-container *ngTemplateOutlet=\"abpBody\"></ng-container>\r\n  </div>\r\n  <div *ngIf=\"abpFooter\" id=\"abp-modal-footer\" class=\"modal-footer\">\r\n    <ng-container *ngTemplateOutlet=\"abpFooter\"></ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: [".modal.show{display:block!important}.modal-backdrop{opacity:.8}.modal::-webkit-scrollbar{width:7px}.modal::-webkit-scrollbar-track{background:#ddd}.modal::-webkit-scrollbar-thumb{background:#8a8686}.modal-dialog{z-index:1050}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ModalComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-modal',
@@ -829,9 +834,9 @@ class ModalCloseDirective {
         (_a = this.modal) === null || _a === void 0 ? void 0 : _a.close();
     }
 }
-ModalCloseDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ModalCloseDirective, deps: [{ token: ModalComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-ModalCloseDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.6", type: ModalCloseDirective, selector: "[abpClose]", host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ModalCloseDirective, decorators: [{
+ModalCloseDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ModalCloseDirective, deps: [{ token: ModalComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+ModalCloseDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.13", type: ModalCloseDirective, selector: "[abpClose]", host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ModalCloseDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[abpClose]' }]
         }], ctorParameters: function () { return [{ type: ModalComponent, decorators: [{
@@ -874,7 +879,8 @@ class ToastComponent {
         }, timeout);
     }
     close() {
-        this.remove.emit(this.toast.options.id);
+        var _a;
+        this.remove.emit((_a = this.toast.options) === null || _a === void 0 ? void 0 : _a.id);
     }
     tap() {
         var _a;
@@ -882,9 +888,9 @@ class ToastComponent {
             this.close();
     }
 }
-ToastComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ToastComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ToastComponent, selector: "abp-toast", inputs: { toast: "toast" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div class=\"abp-toast\" [ngClass]=\"severityClass\" (click)=\"tap()\">\n  <div class=\"abp-toast-icon\">\n    <i class=\"fa icon\" [ngClass]=\"iconClass\"></i>\n  </div>\n  <div class=\"abp-toast-content\">\n    <button class=\"abp-toast-close-button\" (click)=\"close()\" *ngIf=\"toast.options.closable\">\n      <i class=\"fa fa-times\"></i>\n    </button>\n    <div class=\"abp-toast-title\">\n      {{ toast.title | abpLocalization: toast.options?.titleLocalizationParams }}\n    </div>\n    <p\n      class=\"abp-toast-message\"\n      [innerHTML]=\"toast.message | abpLocalization: toast.options?.messageLocalizationParams\"\n    ></p>\n  </div>\n</div>\n", styles: [".abp-toast{display:grid;grid-template-columns:50px 1fr;grid-gap:10px;gap:10px;margin:5px 0;padding:10px;border-radius:0;width:350px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:9999;border:2px solid #f0f0f0;background-color:#f0f0f0;color:#000;box-shadow:0 0 10px -5px #0006;opacity:1}.abp-toast:hover{border:2px solid #e3e3e3;background-color:#e3e3e3;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-success{border:2px solid #51a351;background-color:#51a351;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-success:hover{border:2px solid #499249;background-color:#499249;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-info{border:2px solid #2f96b4;background-color:#2f96b4;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-info:hover{border:2px solid #2a85a0;background-color:#2a85a0;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-warning{border:2px solid #f89406;background-color:#f89406;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-warning:hover{border:2px solid #df8505;background-color:#df8505;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-error{border:2px solid #bd362f;background-color:#bd362f;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-error:hover{border:2px solid #a9302a;background-color:#a9302a;box-shadow:0 0 15px -5px #0006}.abp-toast .abp-toast-icon{display:flex;align-items:center;justify-content:center}.abp-toast .abp-toast-icon .icon{font-size:36px}.abp-toast .abp-toast-content{position:relative}.abp-toast .abp-toast-content .abp-toast-close-button{position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0 5px 0 0;width:25px;height:25px;border:none;border-radius:50%;background:transparent;color:inherit}.abp-toast .abp-toast-content .abp-toast-close-button:focus{outline:none}.abp-toast .abp-toast-content .abp-toast-title{margin:0;padding:0;font-size:1rem;font-weight:600}.abp-toast .abp-toast-content .abp-toast-message{margin:0;padding:0;max-width:240px}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "abpLocalization": i2.LocalizationPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ToastComponent, decorators: [{
+ToastComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ToastComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: ToastComponent, selector: "abp-toast", inputs: { toast: "toast" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div class=\"abp-toast\" [ngClass]=\"severityClass\" (click)=\"tap()\">\r\n  <div class=\"abp-toast-icon\">\r\n    <i class=\"fa icon\" [ngClass]=\"iconClass\"></i>\r\n  </div>\r\n  <div class=\"abp-toast-content\">\r\n    <button class=\"abp-toast-close-button\" (click)=\"close()\" *ngIf=\"toast.options?.closable\">\r\n      <i class=\"fa fa-times\"></i>\r\n    </button>\r\n    <div class=\"abp-toast-title\">\r\n      {{ toast.title | abpLocalization: toast.options?.titleLocalizationParams }}\r\n    </div>\r\n    <p\r\n      class=\"abp-toast-message\"\r\n      [innerHTML]=\"toast.message | abpLocalization: toast.options?.messageLocalizationParams\"\r\n    ></p>\r\n  </div>\r\n</div>\r\n", styles: [".abp-toast{display:grid;grid-template-columns:50px 1fr;grid-gap:10px;gap:10px;margin:5px 0;padding:10px;border-radius:0;width:350px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:9999;border:2px solid #f0f0f0;background-color:#f0f0f0;color:#000;box-shadow:0 0 10px -5px #0006;opacity:1}.abp-toast:hover{border:2px solid #e3e3e3;background-color:#e3e3e3;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-success{border:2px solid #51a351;background-color:#51a351;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-success:hover{border:2px solid #499249;background-color:#499249;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-info{border:2px solid #2f96b4;background-color:#2f96b4;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-info:hover{border:2px solid #2a85a0;background-color:#2a85a0;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-warning{border:2px solid #f89406;background-color:#f89406;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-warning:hover{border:2px solid #df8505;background-color:#df8505;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-error{border:2px solid #bd362f;background-color:#bd362f;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-error:hover{border:2px solid #a9302a;background-color:#a9302a;box-shadow:0 0 15px -5px #0006}.abp-toast .abp-toast-icon{display:flex;align-items:center;justify-content:center}.abp-toast .abp-toast-icon .icon{font-size:36px}.abp-toast .abp-toast-content{position:relative}.abp-toast .abp-toast-content .abp-toast-close-button{position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0 5px 0 0;width:25px;height:25px;border:none;border-radius:50%;background:transparent;color:inherit}.abp-toast .abp-toast-content .abp-toast-close-button:focus{outline:none}.abp-toast .abp-toast-content .abp-toast-title{margin:0;padding:0;font-size:1rem;font-weight:600}.abp-toast .abp-toast-content .abp-toast-message{margin:0;padding:0;max-width:240px}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "abpLocalization": i2.LocalizationPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ToastComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-toast',
@@ -913,14 +919,15 @@ class ToastContainerComponent {
         });
     }
     trackByFunc(index, toast) {
+        var _a;
         if (!toast)
             return null;
-        return toast.options.id;
+        return (_a = toast.options) === null || _a === void 0 ? void 0 : _a.id;
     }
 }
-ToastContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ToastContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ToastContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ToastContainerComponent, selector: "abp-toast-container", inputs: { top: "top", right: "right", bottom: "bottom", left: "left", toastKey: "toastKey" }, ngImport: i0, template: "<div\n  class=\"abp-toast-container\"\n  [style.top]=\"top || 'auto'\"\n  [style.right]=\"right || 'auto'\"\n  [style.bottom]=\"bottom || 'auto'\"\n  [style.left]=\"left || 'auto'\"\n  [style.display]=\"toasts.length ? 'flex' : 'none'\"\n  [@toastInOut]=\"toasts.length\"\n>\n  <abp-toast\n    [toast]=\"toast\"\n    *ngFor=\"let toast of toasts; trackBy: trackByFunc\"\n    (remove)=\"remove($event)\"\n  ></abp-toast>\n</div>\n", styles: [".abp-toast-container{position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:350px;min-height:80px;z-index:1900}.abp-toast-container.new-on-top{flex-direction:column-reverse}\n"], components: [{ type: ToastComponent, selector: "abp-toast", inputs: ["toast"], outputs: ["remove"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], animations: [toastInOut] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ToastContainerComponent, decorators: [{
+ToastContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ToastContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ToastContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: ToastContainerComponent, selector: "abp-toast-container", inputs: { top: "top", right: "right", bottom: "bottom", left: "left", toastKey: "toastKey" }, ngImport: i0, template: "<div\r\n  class=\"abp-toast-container\"\r\n  [style.top]=\"top || 'auto'\"\r\n  [style.right]=\"right || 'auto'\"\r\n  [style.bottom]=\"bottom || 'auto'\"\r\n  [style.left]=\"left || 'auto'\"\r\n  [style.display]=\"toasts.length ? 'flex' : 'none'\"\r\n  [@toastInOut]=\"toasts.length\"\r\n>\r\n  <abp-toast\r\n    [toast]=\"toast\"\r\n    *ngFor=\"let toast of toasts; trackBy: trackByFunc\"\r\n    (remove)=\"remove($event)\"\r\n  ></abp-toast>\r\n</div>\r\n", styles: [".abp-toast-container{position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:350px;min-height:80px;z-index:1900}.abp-toast-container.new-on-top{flex-direction:column-reverse}\n"], components: [{ type: ToastComponent, selector: "abp-toast", inputs: ["toast"], outputs: ["remove"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], animations: [toastInOut] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ToastContainerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'abp-toast-container',
@@ -940,187 +947,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImpor
                 type: Input
             }] } });
 
-var styles = `
-.is-invalid .form-control {
-  border-color: #dc3545;
-  border-style: solid !important;
-  padding-right: calc(1.5em + .75rem);
-  background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e);
-  background-repeat: no-repeat;
-  background-position: right calc(.375em + .1875rem) center;
-  background-size: calc(.75em + .375rem) calc(.75em + .375rem);
-}
-
-.is-invalid .invalid-feedback,
-.is-invalid + * .invalid-feedback {
-  display: block;
-}
-
-.data-tables-filter {
-  text-align: right;
-}
-
-[dir=rtl] .data-tables-filter {
-  text-align: left;
-}
-
-.pointer {
-  cursor: pointer;
-}
-
-.navbar .dropdown-submenu a::after {
-  transform: rotate(-90deg);
-  position: absolute;
-  right: 16px;
-  top: 18px;
-}
-
-.navbar .dropdown-menu {
-  min-width: 215px;
-}
-
-.datatable-scroll {
-  margin-bottom: 5px !important;
-  width: unset !important;
-}
-
-.ui-table-scrollable-body::-webkit-scrollbar {
-  height: 5px !important;
-  width: 5px !important;
-}
-
-.ui-table-scrollable-body::-webkit-scrollbar-track {
-  background: #ddd;
-}
-
-.ui-table-scrollable-body::-webkit-scrollbar-thumb {
-  background: #8a8686;
-}
-
-.abp-ellipsis-inline {
-  display: inline-block;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.abp-ellipsis {
-  overflow: hidden !important;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.ui-widget-overlay {
-  z-index: 1000;
-}
-
-.color-white {
-  color: #FFF !important;
-}
-
-.custom-checkbox > label {
-  cursor: pointer;
-}
-
-/* <animations */
-
-.fade-in-top {
-  animation: fadeInTop 0.2s ease-in-out;
-}
-
-.fade-out-top {
-  animation: fadeOutTop 0.2s ease-in-out;
-}
-
-.abp-collapsed-height {
-  -moz-transition: max-height linear 0.35s;
-  -ms-transition: max-height linear 0.35s;
-  -o-transition: max-height linear 0.35s;
-  -webkit-transition: max-height linear 0.35s;
-  overflow:hidden;
-  transition:max-height 0.35s linear;
-  height:auto;
-  max-height: 0;
-}
-
-.abp-mh-25 {
-  max-height: 25vh;
-}
-
-.abp-mh-50 {
-  transition:max-height 0.65s linear;
-  max-height: 50vh;
-}
-
-.abp-mh-75 {
-  transition:max-height 0.85s linear;
-  max-height: 75vh;
-}
-
-.abp-mh-100 {
-  transition:max-height 1s linear;
-  max-height: 100vh;
-}
-
-[class^="sorting"] {
-  opacity: .3;
-  cursor: pointer;
-}
-[class^="sorting"]:before {
-  right: 0.5rem;
-  content: "↑";
-}
-[class^="sorting"]:after {
-  right: 0.5rem;
-  content: "↓";
-}
-
-.sorting_desc {
-  opacity: 1;
-}
-.sorting_desc:before {
-  opacity: .3;
-}
-
-.sorting_asc {
-  opacity: 1;
-}
-.sorting_asc:after {
-  opacity: .3;
-}
-.ngx-datatable.material {
-  box-shadow: none;
-}
-ngb-typeahead-window, ngb-typeahead-window.dropdown-menu {
-  max-height: 25em;
-  overflow-y: scroll !important;
-  z-index: 1050;
-}
-
-@keyframes fadeInTop {
-  from {
-    transform: translateY(-5px);
-    opacity: 0;
-  }
-
-  to {
-    transform: translateY(0px);
-    opacity: 1;
-  }
-}
-
-@keyframes fadeOutTop {
-  to {
-    transform: translateY(-5px);
-    opacity: 0;
-  }
-}
-
-/* </animations */
-
-`;
-const BOOTSTRAP = 'bootstrap-{{dir}}.min.css';
-
 const DEFAULT_VALIDATION_BLUEPRINTS = {
     creditCard: 'AbpValidation::ThisFieldIsNotAValidCreditCardNumber.',
     email: 'AbpValidation::ThisFieldIsNotAValidEmailAddress.',
@@ -1156,9 +982,9 @@ class EllipsisDirective {
         this.cdRef.detectChanges();
     }
 }
-EllipsisDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: EllipsisDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-EllipsisDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.6", type: EllipsisDirective, selector: "[abpEllipsis]", inputs: { width: ["abpEllipsis", "width"], title: "title", enabled: ["abpEllipsisEnabled", "enabled"] }, host: { properties: { "title": "this.title", "class.abp-ellipsis-inline": "this.inlineClass", "class.abp-ellipsis": "this.class", "style.max-width": "this.maxWidth" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: EllipsisDirective, decorators: [{
+EllipsisDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: EllipsisDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+EllipsisDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.13", type: EllipsisDirective, selector: "[abpEllipsis]", inputs: { width: ["abpEllipsis", "width"], title: "title", enabled: ["abpEllipsisEnabled", "enabled"] }, host: { properties: { "title": "this.title", "class.abp-ellipsis-inline": "this.inlineClass", "class.abp-ellipsis": "this.class", "style.max-width": "this.maxWidth" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: EllipsisDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[abpEllipsis]',
@@ -1186,10 +1012,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImpor
             }] } });
 class EllipsisModule {
 }
-EllipsisModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: EllipsisModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-EllipsisModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: EllipsisModule, declarations: [EllipsisDirective], exports: [EllipsisDirective] });
-EllipsisModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: EllipsisModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: EllipsisModule, decorators: [{
+EllipsisModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: EllipsisModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+EllipsisModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: EllipsisModule, declarations: [EllipsisDirective], exports: [EllipsisDirective] });
+EllipsisModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: EllipsisModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: EllipsisModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [EllipsisDirective],
@@ -1206,6 +1032,8 @@ class LoadingDirective {
         this.renderer = renderer;
         this.position = 'relative';
         this.delay = 0;
+        this.rootNode = null;
+        this.timerSubscription = null;
     }
     get loading() {
         return this._loading;
@@ -1225,6 +1053,7 @@ class LoadingDirective {
             this.timerSubscription = timer(this.delay)
                 .pipe(take(1))
                 .subscribe(() => {
+                var _a;
                 if (!this.componentRef) {
                     this.componentRef = this.cdRes
                         .resolveComponentFactory(LoadingComponent)
@@ -1232,7 +1061,7 @@ class LoadingDirective {
                 }
                 if (newValue && !this.rootNode) {
                     this.rootNode = this.componentRef.hostView.rootNodes[0];
-                    this.targetElement.appendChild(this.rootNode);
+                    (_a = this.targetElement) === null || _a === void 0 ? void 0 : _a.appendChild(this.rootNode);
                 }
                 else if (this.rootNode) {
                     this.renderer.removeChild(this.rootNode.parentElement, this.rootNode);
@@ -1260,9 +1089,9 @@ class LoadingDirective {
         }
     }
 }
-LoadingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LoadingDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
-LoadingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.6", type: LoadingDirective, selector: "[abpLoading]", inputs: { loading: ["abpLoading", "loading"], targetElement: ["abpLoadingTargetElement", "targetElement"], delay: ["abpLoadingDelay", "delay"] }, host: { properties: { "style.position": "this.position" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LoadingDirective, decorators: [{
+LoadingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: LoadingDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+LoadingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.13", type: LoadingDirective, selector: "[abpLoading]", inputs: { loading: ["abpLoading", "loading"], targetElement: ["abpLoadingTargetElement", "targetElement"], delay: ["abpLoadingDelay", "delay"] }, host: { properties: { "style.position": "this.position" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: LoadingDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[abpLoading]' }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.Renderer2 }]; }, propDecorators: { position: [{
@@ -1328,9 +1157,9 @@ class NgxDatatableDefaultDirective {
         this.subscription.unsubscribe();
     }
 }
-NgxDatatableDefaultDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: NgxDatatableDefaultDirective, deps: [{ token: i1$2.DatatableComponent }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
-NgxDatatableDefaultDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.6", type: NgxDatatableDefaultDirective, selector: "ngx-datatable[default]", inputs: { class: "class" }, host: { properties: { "class": "this.classes" } }, exportAs: ["ngxDatatableDefault"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: NgxDatatableDefaultDirective, decorators: [{
+NgxDatatableDefaultDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: NgxDatatableDefaultDirective, deps: [{ token: i1$2.DatatableComponent }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
+NgxDatatableDefaultDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.13", type: NgxDatatableDefaultDirective, selector: "ngx-datatable[default]", inputs: { class: "class" }, host: { properties: { "class": "this.classes" } }, exportAs: ["ngxDatatableDefault"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: NgxDatatableDefaultDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -1422,9 +1251,9 @@ class NgxDatatableListDirective {
         this.subscribeToSort();
     }
 }
-NgxDatatableListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: NgxDatatableListDirective, deps: [{ token: i1$2.DatatableComponent }, { token: i0.ChangeDetectorRef }, { token: i2.LocalizationService }, { token: NGX_DATATABLE_MESSAGES, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-NgxDatatableListDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.6", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: { list: "list" }, exportAs: ["ngxDatatableList"], usesOnChanges: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: NgxDatatableListDirective, decorators: [{
+NgxDatatableListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: NgxDatatableListDirective, deps: [{ token: i1$2.DatatableComponent }, { token: i0.ChangeDetectorRef }, { token: i2.LocalizationService }, { token: NGX_DATATABLE_MESSAGES, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+NgxDatatableListDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.13", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: { list: "list" }, exportAs: ["ngxDatatableList"], usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: NgxDatatableListDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -1440,6 +1269,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImpor
                 type: Input
             }] } });
 
+class DocumentDirHandlerService {
+    constructor(injector) {
+        this.injector = injector;
+        this.dir = new BehaviorSubject('ltr');
+        this.dir$ = this.dir.asObservable();
+        this.listenToLanguageChanges();
+    }
+    listenToLanguageChanges() {
+        const l10n = this.injector.get(LocalizationService);
+        // will always listen, no need to unsubscribe
+        l10n.languageChange$
+            .pipe(startWith(l10n.currentLang), map(locale => getLocaleDirection(locale)))
+            .subscribe(dir => {
+            this.dir.next(dir);
+            this.setBodyDir(dir);
+        });
+    }
+    setBodyDir(dir) {
+        document.body.dir = dir;
+        document.dir = dir;
+    }
+}
+DocumentDirHandlerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: DocumentDirHandlerService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
+DocumentDirHandlerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: DocumentDirHandlerService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: DocumentDirHandlerService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
+
 function httpErrorConfigFactory(config = {}) {
     if (config.errorScreen && config.errorScreen.component && !config.errorScreen.forWhichErrors) {
         config.errorScreen.forWhichErrors = [401, 403, 404, 500];
@@ -1496,8 +1353,9 @@ const DEFAULT_ERROR_LOCALIZATIONS = {
 class ErrorHandler {
     constructor(injector) {
         this.injector = injector;
+        this.componentRef = null;
         this.httpErrorHandler = this.injector.get(HTTP_ERROR_HANDLER, (_, err) => throwError(err));
-        this.executeErrorHandler = error => {
+        this.executeErrorHandler = (error) => {
             const returnValue = this.httpErrorHandler(this.injector, error);
             return (returnValue instanceof Observable ? returnValue : of(null)).pipe(catchError(err => {
                 this.handleError(err);
@@ -1507,11 +1365,13 @@ class ErrorHandler {
         this.filterRestErrors = ({ status }) => {
             if (typeof status !== 'number')
                 return false;
-            return this.httpErrorConfig.skipHandledErrorCodes.findIndex(code => code === status) < 0;
+            return (!!this.httpErrorConfig.skipHandledErrorCodes &&
+                this.httpErrorConfig.skipHandledErrorCodes.findIndex(code => code === status) < 0);
         };
         this.filterRouteErrors = (navigationError) => {
             var _a, _b;
             return (((_b = (_a = navigationError.error) === null || _a === void 0 ? void 0 : _a.message) === null || _b === void 0 ? void 0 : _b.indexOf('Cannot match')) > -1 &&
+                !!this.httpErrorConfig.skipHandledErrorCodes &&
                 this.httpErrorConfig.skipHandledErrorCodes.findIndex(code => code === 404) < 0);
         };
         this.httpErrorReporter = injector.get(HttpErrorReporterService);
@@ -1535,7 +1395,8 @@ class ErrorHandler {
             .getEvents(ResolveEnd)
             .pipe(filter(() => !!this.componentRef))
             .subscribe(() => {
-            this.componentRef.destroy();
+            var _a;
+            (_a = this.componentRef) === null || _a === void 0 ? void 0 : _a.destroy();
             this.componentRef = null;
         });
     }
@@ -1551,7 +1412,7 @@ class ErrorHandler {
             defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
         };
         if (err instanceof HttpErrorResponse && err.headers.get('_AbpErrorFormat')) {
-            const confirmation$ = this.showError(null, null, body);
+            const confirmation$ = this.showErrorWithRequestBody(body);
             if (err.status === 401) {
                 confirmation$.subscribe(() => {
                     this.navigateToLogin();
@@ -1650,26 +1511,30 @@ class ErrorHandler {
             status: 404,
         });
     }
-    showError(message, title, body) {
-        if (body) {
-            if (body.details) {
-                message = body.details;
-                title = body.message;
-            }
-            else if (body.message) {
-                title = {
-                    key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
-                    defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
-                };
-                message = body.message;
-            }
-            else {
-                message = body.message || {
-                    key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
-                    defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
-                };
-            }
+    showErrorWithRequestBody(body) {
+        let message;
+        let title;
+        if (body.details) {
+            message = body.details;
+            title = body.message;
+        }
+        else if (body.message) {
+            title = {
+                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
+                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
+            };
+            message = body.message;
         }
+        else {
+            message = body.message || {
+                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
+                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
+            };
+            title = '';
+        }
+        return this.showError(message, title);
+    }
+    showError(message, title) {
         return this.confirmationService.error(message, title, {
             hideCancelBtn: true,
             yesText: 'AbpAccount::Close',
@@ -1679,6 +1544,7 @@ class ErrorHandler {
         this.injector.get(AuthService).navigateToLogin();
     }
     createErrorComponent(instance) {
+        var _a, _b;
         const renderer = this.rendererFactory.createRenderer(null, null);
         const host = renderer.selectRootElement(document.body, true);
         this.componentRef = this.cfRes
@@ -1690,121 +1556,38 @@ class ErrorHandler {
                 this.componentRef.instance[key] = instance[key];
             }
         }
-        this.componentRef.instance.hideCloseIcon = this.httpErrorConfig.errorScreen.hideCloseIcon;
+        this.componentRef.instance.hideCloseIcon = !!((_a = this.httpErrorConfig.errorScreen) === null || _a === void 0 ? void 0 : _a.hideCloseIcon);
         const appRef = this.injector.get(ApplicationRef);
         if (this.canCreateCustomError(instance.status)) {
             this.componentRef.instance.cfRes = this.cfRes;
             this.componentRef.instance.appRef = appRef;
             this.componentRef.instance.injector = this.injector;
-            this.componentRef.instance.customComponent = this.httpErrorConfig.errorScreen.component;
+            this.componentRef.instance.customComponent = (_b = this.httpErrorConfig.errorScreen) === null || _b === void 0 ? void 0 : _b.component;
         }
         appRef.attachView(this.componentRef.hostView);
         renderer.appendChild(host, this.componentRef.hostView.rootNodes[0]);
         const destroy$ = new Subject();
         this.componentRef.instance.destroy$ = destroy$;
         destroy$.subscribe(() => {
-            this.componentRef.destroy();
+            var _a;
+            (_a = this.componentRef) === null || _a === void 0 ? void 0 : _a.destroy();
             this.componentRef = null;
         });
     }
     canCreateCustomError(status) {
-        var _a, _b, _c, _d, _e;
-        return (((_b = (_a = this.httpErrorConfig) === null || _a === void 0 ? void 0 : _a.errorScreen) === null || _b === void 0 ? void 0 : _b.component) &&
-            ((_e = (_d = (_c = this.httpErrorConfig) === null || _c === void 0 ? void 0 : _c.errorScreen) === null || _d === void 0 ? void 0 : _d.forWhichErrors) === null || _e === void 0 ? void 0 : _e.indexOf(status)) > -1);
+        var _a, _b, _c, _d, _e, _f;
+        return !!(((_b = (_a = this.httpErrorConfig) === null || _a === void 0 ? void 0 : _a.errorScreen) === null || _b === void 0 ? void 0 : _b.component) &&
+            ((_d = (_c = this.httpErrorConfig) === null || _c === void 0 ? void 0 : _c.errorScreen) === null || _d === void 0 ? void 0 : _d.forWhichErrors) &&
+            ((_f = (_e = this.httpErrorConfig) === null || _e === void 0 ? void 0 : _e.errorScreen) === null || _f === void 0 ? void 0 : _f.forWhichErrors.indexOf(status)) > -1);
     }
 }
-ErrorHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ErrorHandler, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
-ErrorHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ErrorHandler, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ErrorHandler, decorators: [{
+ErrorHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ErrorHandler, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
+ErrorHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ErrorHandler, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ErrorHandler, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
 
-const LAZY_STYLES = new InjectionToken('LAZY_STYLES');
-
-class LazyStyleHandler {
-    constructor(injector) {
-        this._dir = 'ltr';
-        this.loaded = new Map();
-        this.setStyles(injector);
-        this.setLazyLoad(injector);
-        this.listenToLanguageChanges(injector);
-    }
-    set dir(dir) {
-        if (dir === this._dir)
-            return;
-        this.switchCSS(dir);
-        this.setBodyDir(dir);
-        this._dir = dir;
-    }
-    get dir() {
-        return this._dir;
-    }
-    getHrefFromLink(link) {
-        if (!link)
-            return '';
-        const a = document.createElement('a');
-        a.href = link.href;
-        return a.pathname.replace(/^\//, '');
-    }
-    getLoadedBootstrap() {
-        const href = createLazyStyleHref(BOOTSTRAP, this.dir);
-        const selector = `[href*="${href.replace(/\.css$/, '')}"]`;
-        const link = document.querySelector(selector);
-        return { href, link };
-    }
-    listenToLanguageChanges(injector) {
-        const l10n = injector.get(LocalizationService);
-        // will always listen, no need to unsubscribe
-        l10n.languageChange$.pipe(startWith(l10n.currentLang)).subscribe(locale => {
-            this.dir = getLocaleDirection(locale);
-        });
-    }
-    setBodyDir(dir) {
-        document.body.dir = dir;
-    }
-    setLazyLoad(injector) {
-        this.lazyLoad = injector.get(LazyLoadService);
-        const { href, link } = this.getLoadedBootstrap();
-        this.lazyLoad.loaded.set(href, link);
-    }
-    setStyles(injector) {
-        this.styles = injector.get(LAZY_STYLES, [BOOTSTRAP]);
-    }
-    switchCSS(dir) {
-        this.styles.forEach(style => {
-            const oldHref = createLazyStyleHref(style, this.dir);
-            const newHref = createLazyStyleHref(style, dir);
-            const link = this.loaded.get(newHref);
-            const href = this.getHrefFromLink(link) || newHref;
-            const strategy = LOADING_STRATEGY.PrependAnonymousStyleToHead(href);
-            this.lazyLoad.load(strategy).subscribe(() => {
-                const oldLink = this.lazyLoad.loaded.get(oldHref);
-                this.loaded.delete(newHref);
-                this.loaded.set(oldHref, oldLink);
-                const newLink = this.lazyLoad.loaded.get(href);
-                this.lazyLoad.loaded.delete(href);
-                this.lazyLoad.loaded.set(newHref, newLink);
-                this.lazyLoad.remove(oldHref);
-            });
-        });
-    }
-}
-LazyStyleHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LazyStyleHandler, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
-LazyStyleHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LazyStyleHandler, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: LazyStyleHandler, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
-function createLazyStyleHref(style, dir) {
-    return style.replace(/{{\s*dir\s*}}/g, dir);
-}
-function initLazyStyleHandler(injector) {
-    return () => new LazyStyleHandler(injector);
-}
-
 class NavItem {
     constructor(props) {
         props = Object.assign(Object.assign({}, props), { visible: props.visible || (() => true) });
@@ -1876,9 +1659,9 @@ class NavItemsService {
         this._items$.next(items);
     }
 }
-NavItemsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: NavItemsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-NavItemsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: NavItemsService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: NavItemsService, decorators: [{
+NavItemsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: NavItemsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+NavItemsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: NavItemsService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: NavItemsService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1906,9 +1689,9 @@ class PageAlertService {
         this.alerts.set(alerts);
     }
 }
-PageAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: PageAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-PageAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: PageAlertService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: PageAlertService, decorators: [{
+PageAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: PageAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+PageAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: PageAlertService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: PageAlertService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return []; } });
@@ -1978,7 +1761,7 @@ class ToasterService {
      * @param severity Sets color of the toast. "success", "warning" etc.
      * @param options Spesific style or structural options for individual toast
      */
-    show(message, title = null, severity = 'neutral', options = {}) {
+    show(message, title = undefined, severity = 'neutral', options = {}) {
         if (!this.containerComponentRef)
             this.setContainer();
         const id = ++this.lastId;
@@ -2001,15 +1784,197 @@ class ToasterService {
         this.toasts$.next(this.toasts);
     }
 }
-ToasterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ToasterService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable });
-ToasterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ToasterService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ToasterService, decorators: [{
+ToasterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ToasterService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable });
+ToasterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ToasterService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ToasterService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
         }], ctorParameters: function () { return [{ type: i2.ContentProjectionService }]; } });
 
+var styles = `
+.is-invalid .form-control {
+  border-color: #dc3545;
+  border-style: solid !important;
+  padding-right: calc(1.5em + .75rem);
+  background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e);
+  background-repeat: no-repeat;
+  background-position: right calc(.375em + .1875rem) center;
+  background-size: calc(.75em + .375rem) calc(.75em + .375rem);
+}
+
+.is-invalid .invalid-feedback,
+.is-invalid + * .invalid-feedback {
+  display: block;
+}
+
+.data-tables-filter {
+  text-align: right;
+}
+
+[dir=rtl] .data-tables-filter {
+  text-align: left;
+}
+
+.pointer {
+  cursor: pointer;
+}
+
+.navbar .dropdown-submenu a::after {
+  transform: rotate(-90deg);
+  position: absolute;
+  right: 16px;
+  top: 18px;
+}
+
+.navbar .dropdown-menu {
+  min-width: 215px;
+}
+
+.datatable-scroll {
+  margin-bottom: 5px !important;
+  width: unset !important;
+}
+
+.ui-table-scrollable-body::-webkit-scrollbar {
+  height: 5px !important;
+  width: 5px !important;
+}
+
+.ui-table-scrollable-body::-webkit-scrollbar-track {
+  background: #ddd;
+}
+
+.ui-table-scrollable-body::-webkit-scrollbar-thumb {
+  background: #8a8686;
+}
+
+.abp-ellipsis-inline {
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.abp-ellipsis {
+  overflow: hidden !important;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ui-widget-overlay {
+  z-index: 1000;
+}
+
+.color-white {
+  color: #FFF !important;
+}
+
+.custom-checkbox > label {
+  cursor: pointer;
+}
+
+/* <animations */
+
+.fade-in-top {
+  animation: fadeInTop 0.2s ease-in-out;
+}
+
+.fade-out-top {
+  animation: fadeOutTop 0.2s ease-in-out;
+}
+
+.abp-collapsed-height {
+  -moz-transition: max-height linear 0.35s;
+  -ms-transition: max-height linear 0.35s;
+  -o-transition: max-height linear 0.35s;
+  -webkit-transition: max-height linear 0.35s;
+  overflow:hidden;
+  transition:max-height 0.35s linear;
+  height:auto;
+  max-height: 0;
+}
+
+.abp-mh-25 {
+  max-height: 25vh;
+}
+
+.abp-mh-50 {
+  transition:max-height 0.65s linear;
+  max-height: 50vh;
+}
+
+.abp-mh-75 {
+  transition:max-height 0.85s linear;
+  max-height: 75vh;
+}
+
+.abp-mh-100 {
+  transition:max-height 1s linear;
+  max-height: 100vh;
+}
+
+[class^="sorting"] {
+  opacity: .3;
+  cursor: pointer;
+}
+[class^="sorting"]:before {
+  right: 0.5rem;
+  content: "↑";
+}
+[class^="sorting"]:after {
+  right: 0.5rem;
+  content: "↓";
+}
+
+.sorting_desc {
+  opacity: 1;
+}
+.sorting_desc:before {
+  opacity: .3;
+}
+
+.sorting_asc {
+  opacity: 1;
+}
+.sorting_asc:after {
+  opacity: .3;
+}
+.ngx-datatable.material {
+  box-shadow: none;
+}
+ngb-typeahead-window, ngb-typeahead-window.dropdown-menu {
+  max-height: 25em;
+  overflow-y: scroll !important;
+  z-index: 1050;
+}
+
+@keyframes fadeInTop {
+  from {
+    transform: translateY(-5px);
+    opacity: 0;
+  }
+
+  to {
+    transform: translateY(0px);
+    opacity: 1;
+  }
+}
+
+@keyframes fadeOutTop {
+  to {
+    transform: translateY(-5px);
+    opacity: 0;
+  }
+}
+
+/* </animations */
+.ngb-dp-body {
+  z-index: 1055 !important;
+}
+`;
+
 const THEME_SHARED_APPEND_CONTENT = new InjectionToken('THEME_SHARED_APPEND_CONTENT', {
     providedIn: 'root',
     factory: () => {
@@ -2033,11 +1998,12 @@ class DateParserFormatter extends NgbDateParserFormatter {
     parse(value) {
         if (value) {
             const dateParts = value.trim().split('-');
+            // TODO: CHANGED
             if (dateParts.length === 1 && isNumber(dateParts[0])) {
-                return { year: toInteger(dateParts[0]), month: null, day: null };
+                return { year: toInteger(dateParts[0]), month: -1, day: -1 };
             }
             else if (dateParts.length === 2 && isNumber(dateParts[0]) && isNumber(dateParts[1])) {
-                return { year: toInteger(dateParts[0]), month: toInteger(dateParts[1]), day: null };
+                return { year: toInteger(dateParts[0]), month: toInteger(dateParts[1]), day: -1 };
             }
             else if (dateParts.length === 3 &&
                 isNumber(dateParts[0]) &&
@@ -2061,9 +2027,9 @@ class DateParserFormatter extends NgbDateParserFormatter {
         return formatDate(new Date(date.year, date.month - 1, date.day), dateFormat, this.locale);
     }
 }
-DateParserFormatter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: DateParserFormatter, deps: [{ token: i2.ConfigStateService }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable });
-DateParserFormatter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: DateParserFormatter });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: DateParserFormatter, decorators: [{
+DateParserFormatter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: DateParserFormatter, deps: [{ token: i2.ConfigStateService }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable });
+DateParserFormatter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: DateParserFormatter });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: DateParserFormatter, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.ConfigStateService }, { type: undefined, decorators: [{
                     type: Inject,
@@ -2087,8 +2053,8 @@ const declarationsWithExports = [
 ];
 class BaseThemeSharedModule {
 }
-BaseThemeSharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BaseThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BaseThemeSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BaseThemeSharedModule, declarations: [BreadcrumbComponent,
+BaseThemeSharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BaseThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BaseThemeSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BaseThemeSharedModule, declarations: [BreadcrumbComponent,
         BreadcrumbItemsComponent,
         ButtonComponent,
         ConfirmationComponent,
@@ -2117,14 +2083,14 @@ BaseThemeSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", v
         NgxDatatableListDirective,
         LoadingDirective,
         ModalCloseDirective] });
-BaseThemeSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BaseThemeSharedModule, providers: [DatePipe], imports: [[
+BaseThemeSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BaseThemeSharedModule, providers: [DatePipe], imports: [[
             CoreModule,
             NgxDatatableModule,
             NgxValidateCoreModule,
             NgbPaginationModule,
             EllipsisModule,
         ], NgxDatatableModule, EllipsisModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: BaseThemeSharedModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: BaseThemeSharedModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -2163,12 +2129,6 @@ class ThemeSharedModule {
                     deps: [THEME_SHARED_APPEND_CONTENT],
                     useFactory: noop,
                 },
-                {
-                    provide: APP_INITIALIZER,
-                    multi: true,
-                    deps: [Injector],
-                    useFactory: initLazyStyleHandler,
-                },
                 { provide: HTTP_ERROR_CONFIG, useValue: httpErrorConfig },
                 {
                     provide: 'HTTP_ERROR_CONFIG',
@@ -2189,14 +2149,21 @@ class ThemeSharedModule {
                     provide: VALIDATION_VALIDATE_ON_SUBMIT,
                     useValue: validation.validateOnSubmit,
                 },
+                DocumentDirHandlerService,
+                {
+                    provide: APP_INITIALIZER,
+                    useFactory: noop,
+                    multi: true,
+                    deps: [DocumentDirHandlerService],
+                },
             ],
         };
     }
 }
-ThemeSharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ThemeSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ThemeSharedModule, imports: [BaseThemeSharedModule], exports: [BaseThemeSharedModule] });
-ThemeSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ThemeSharedModule, imports: [[BaseThemeSharedModule], BaseThemeSharedModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0, type: ThemeSharedModule, decorators: [{
+ThemeSharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ThemeSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ThemeSharedModule, imports: [BaseThemeSharedModule], exports: [BaseThemeSharedModule] });
+ThemeSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ThemeSharedModule, imports: [[BaseThemeSharedModule], BaseThemeSharedModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0, type: ThemeSharedModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [BaseThemeSharedModule],
@@ -2242,5 +2209,5 @@ function getRuleFn(injector) {
  * Generated bundle index. Do not edit.
  */
 
-export { BOOTSTRAP, BaseThemeSharedModule, BreadcrumbComponent, BreadcrumbItemsComponent, ButtonComponent, Confirmation, ConfirmationComponent, ConfirmationService, DEFAULT_ERROR_LOCALIZATIONS, DEFAULT_ERROR_MESSAGES, DEFAULT_VALIDATION_BLUEPRINTS, DateParserFormatter, EllipsisDirective, EllipsisModule, ErrorHandler, HTTP_ERROR_CONFIG, HTTP_ERROR_HANDLER, HttpErrorWrapperComponent, LAZY_STYLES, LazyStyleHandler, LoaderBarComponent, LoadingComponent, LoadingDirective, ModalCloseDirective, ModalComponent, ModalRefService, NGX_DATATABLE_MESSAGES, NG_BOOTSTRAP_CONFIG_PROVIDERS, NavItem, NavItemsService, NgxDatatableDefaultDirective, NgxDatatableListDirective, PageAlertService, SUPPRESS_UNSAVED_CHANGES_WARNING, THEME_SHARED_APPEND_CONTENT, THEME_SHARED_ROUTE_PROVIDERS, ThemeSharedModule, ToastComponent, ToastContainerComponent, ToasterService, bounceIn, collapse, collapseLinearWithMargin, collapseWithMargin, collapseX, collapseY, collapseYWithMargin, configureNgBootstrap, configureRoutes, createLazyStyleHref, defaultNgxDatatableMessages, dialogAnimation, expandX, expandY, expandYWithMargin, fadeAnimation, fadeIn, fadeInDown, fadeInLeft, fadeInRight, fadeInUp, fadeOut, fadeOutDown, fadeOutLeft, fadeOutRight, fadeOutUp, getPasswordValidators, httpErrorConfigFactory, initLazyStyleHandler, slideFromBottom, toastInOut };
+export { BaseThemeSharedModule, BreadcrumbComponent, BreadcrumbItemsComponent, ButtonComponent, Confirmation, ConfirmationComponent, ConfirmationService, DEFAULT_ERROR_LOCALIZATIONS, DEFAULT_ERROR_MESSAGES, DEFAULT_VALIDATION_BLUEPRINTS, DateParserFormatter, DocumentDirHandlerService, EllipsisDirective, EllipsisModule, ErrorHandler, HTTP_ERROR_CONFIG, HTTP_ERROR_HANDLER, HttpErrorWrapperComponent, LoaderBarComponent, LoadingComponent, LoadingDirective, ModalCloseDirective, ModalComponent, ModalRefService, NGX_DATATABLE_MESSAGES, NG_BOOTSTRAP_CONFIG_PROVIDERS, NavItem, NavItemsService, NgxDatatableDefaultDirective, NgxDatatableListDirective, PageAlertService, SUPPRESS_UNSAVED_CHANGES_WARNING, THEME_SHARED_APPEND_CONTENT, THEME_SHARED_ROUTE_PROVIDERS, ThemeSharedModule, ToastComponent, ToastContainerComponent, ToasterService, bounceIn, collapse, collapseLinearWithMargin, collapseWithMargin, collapseX, collapseY, collapseYWithMargin, configureNgBootstrap, configureRoutes, defaultNgxDatatableMessages, dialogAnimation, expandX, expandY, expandYWithMargin, fadeAnimation, fadeIn, fadeInDown, fadeInLeft, fadeInRight, fadeInUp, fadeOut, fadeOutDown, fadeOutLeft, fadeOutRight, fadeOutUp, getPasswordValidators, httpErrorConfigFactory, slideFromBottom, toastInOut };
 //# sourceMappingURL=abp-ng.theme.shared.js.map