@abp/ng.theme.shared 7.2.2 → 7.3.0-rc.2

package/{fesm2020 → fesm2022}/abp-ng.theme.shared.mjs

@@ -19,216 +19,215 @@ import * as i1$2 from '@swimlane/ngx-datatable';
 import { ColumnMode, NgxDatatableModule } from '@swimlane/ngx-datatable';
 import { HttpErrorResponse } from '@angular/common/http';
 
-const bounceIn = animation([
-    style({ opacity: '0', display: '{{ display }}' }),
-    animate('{{ time}} {{ easing }}', keyframes([
-        style({ opacity: '0', transform: '{{ transform }} scale(0.0)', offset: 0 }),
-        style({ opacity: '0', transform: '{{ transform }} scale(0.8)', offset: 0.5 }),
-        style({ opacity: '1', transform: '{{ transform }} scale(1.0)', offset: 1 }),
-    ])),
-], {
-    params: {
-        time: '350ms',
-        easing: 'cubic-bezier(.7,.31,.72,1.47)',
-        display: 'block',
-        transform: 'translate(-50%, -50%)',
-    },
+const bounceIn = animation([
+    style({ opacity: '0', display: '{{ display }}' }),
+    animate('{{ time}} {{ easing }}', keyframes([
+        style({ opacity: '0', transform: '{{ transform }} scale(0.0)', offset: 0 }),
+        style({ opacity: '0', transform: '{{ transform }} scale(0.8)', offset: 0.5 }),
+        style({ opacity: '1', transform: '{{ transform }} scale(1.0)', offset: 1 }),
+    ])),
+], {
+    params: {
+        time: '350ms',
+        easing: 'cubic-bezier(.7,.31,.72,1.47)',
+        display: 'block',
+        transform: 'translate(-50%, -50%)',
+    },
 });
 
-const collapseY = animation([
-    style({ height: '*', overflow: 'hidden', 'box-sizing': 'border-box' }),
-    animate('{{ time }} {{ easing }}', style({ height: '0', padding: '0px' })),
-], { params: { time: '350ms', easing: 'ease' } });
-const collapseYWithMargin = animation([
-    style({ 'margin-top': '0' }),
-    animate('{{ time }} {{ easing }}', style({ 'margin-left': '-100%' })),
-], {
-    params: { time: '500ms', easing: 'ease' },
-});
-const collapseX = animation([
-    style({ width: '*', overflow: 'hidden', 'box-sizing': 'border-box' }),
-    animate('{{ time }} {{ easing }}', style({ width: '0', padding: '0px' })),
-], { params: { time: '350ms', easing: 'ease' } });
-const expandY = animation([
-    style({ height: '0', overflow: 'hidden', 'box-sizing': 'border-box' }),
-    animate('{{ time }} {{ easing }}', style({ height: '*', padding: '*' })),
-], { params: { time: '350ms', easing: 'ease' } });
-const expandYWithMargin = animation([
-    style({ 'margin-top': '-100%' }),
-    animate('{{ time }} {{ easing }}', style({ 'margin-top': '0' })),
-], {
-    params: { time: '500ms', easing: 'ease' },
-});
-const expandX = animation([
-    style({ width: '0', overflow: 'hidden', 'box-sizing': 'border-box' }),
-    animate('{{ time }} {{ easing }}', style({ width: '*', padding: '*' })),
-], { params: { time: '350ms', easing: 'ease' } });
-const collapse = trigger('collapse', [
-    state('collapsed', style({ height: '0', overflow: 'hidden' })),
-    state('expanded', style({ height: '*', overflow: 'hidden' })),
-    transition('expanded => collapsed', useAnimation(collapseY)),
-    transition('collapsed => expanded', useAnimation(expandY)),
-]);
-const collapseWithMargin = trigger('collapseWithMargin', [
-    state('collapsed', style({ 'margin-top': '-100%' })),
-    state('expanded', style({ 'margin-top': '0' })),
-    transition('expanded => collapsed', useAnimation(collapseYWithMargin), {
-        params: { time: '400ms', easing: 'linear' },
-    }),
-    transition('collapsed => expanded', useAnimation(expandYWithMargin)),
-]);
-const collapseLinearWithMargin = trigger('collapseLinearWithMargin', [
-    state('collapsed', style({ 'margin-top': '-100vh' })),
-    state('expanded', style({ 'margin-top': '0' })),
-    transition('expanded => collapsed', useAnimation(collapseYWithMargin, { params: { time: '200ms', easing: 'linear' } })),
-    transition('collapsed => expanded', useAnimation(expandYWithMargin, { params: { time: '250ms', easing: 'linear' } })),
+const collapseY = animation([
+    style({ height: '*', overflow: 'hidden', 'box-sizing': 'border-box' }),
+    animate('{{ time }} {{ easing }}', style({ height: '0', padding: '0px' })),
+], { params: { time: '350ms', easing: 'ease' } });
+const collapseYWithMargin = animation([
+    style({ 'margin-top': '0' }),
+    animate('{{ time }} {{ easing }}', style({ 'margin-left': '-100%' })),
+], {
+    params: { time: '500ms', easing: 'ease' },
+});
+const collapseX = animation([
+    style({ width: '*', overflow: 'hidden', 'box-sizing': 'border-box' }),
+    animate('{{ time }} {{ easing }}', style({ width: '0', padding: '0px' })),
+], { params: { time: '350ms', easing: 'ease' } });
+const expandY = animation([
+    style({ height: '0', overflow: 'hidden', 'box-sizing': 'border-box' }),
+    animate('{{ time }} {{ easing }}', style({ height: '*', padding: '*' })),
+], { params: { time: '350ms', easing: 'ease' } });
+const expandYWithMargin = animation([
+    style({ 'margin-top': '-100%' }),
+    animate('{{ time }} {{ easing }}', style({ 'margin-top': '0' })),
+], {
+    params: { time: '500ms', easing: 'ease' },
+});
+const expandX = animation([
+    style({ width: '0', overflow: 'hidden', 'box-sizing': 'border-box' }),
+    animate('{{ time }} {{ easing }}', style({ width: '*', padding: '*' })),
+], { params: { time: '350ms', easing: 'ease' } });
+const collapse = trigger('collapse', [
+    state('collapsed', style({ height: '0', overflow: 'hidden' })),
+    state('expanded', style({ height: '*', overflow: 'hidden' })),
+    transition('expanded => collapsed', useAnimation(collapseY)),
+    transition('collapsed => expanded', useAnimation(expandY)),
+]);
+const collapseWithMargin = trigger('collapseWithMargin', [
+    state('collapsed', style({ 'margin-top': '-100%' })),
+    state('expanded', style({ 'margin-top': '0' })),
+    transition('expanded => collapsed', useAnimation(collapseYWithMargin), {
+        params: { time: '400ms', easing: 'linear' },
+    }),
+    transition('collapsed => expanded', useAnimation(expandYWithMargin)),
+]);
+const collapseLinearWithMargin = trigger('collapseLinearWithMargin', [
+    state('collapsed', style({ 'margin-top': '-100vh' })),
+    state('expanded', style({ 'margin-top': '0' })),
+    transition('expanded => collapsed', useAnimation(collapseYWithMargin, { params: { time: '200ms', easing: 'linear' } })),
+    transition('collapsed => expanded', useAnimation(expandYWithMargin, { params: { time: '250ms', easing: 'linear' } })),
 ]);
 
-const fadeIn = animation([style({ opacity: '0' }), animate('{{ time}} {{ easing }}', style({ opacity: '1' }))], {
-    params: { time: '350ms', easing: 'ease' },
-});
-const fadeOut = animation([style({ opacity: '1' }), animate('{{ time}} {{ easing }}', style({ opacity: '0' }))], { params: { time: '350ms', easing: 'ease' } });
-const fadeInDown = animation([
-    style({ opacity: '0', transform: '{{ transform }} translateY(-20px)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateY(0)' })),
-], { params: { time: '350ms', easing: 'ease', transform: '' } });
-const fadeInUp = animation([
-    style({ opacity: '0', transform: '{{ transform }} translateY(20px)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateY(0)' })),
-], { params: { time: '350ms', easing: 'ease', transform: '' } });
-const fadeInLeft = animation([
-    style({ opacity: '0', transform: '{{ transform }} translateX(20px)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateX(0)' })),
-], { params: { time: '350ms', easing: 'ease', transform: '' } });
-const fadeInRight = animation([
-    style({ opacity: '0', transform: '{{ transform }} translateX(-20px)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateX(0)' })),
-], { params: { time: '350ms', easing: 'ease', transform: '' } });
-const fadeOutDown = animation([
-    style({ opacity: '1', transform: '{{ transform }} translateY(0)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateY(20px)' })),
-], { params: { time: '350ms', easing: 'ease', transform: '' } });
-const fadeOutUp = animation([
-    style({ opacity: '1', transform: '{{ transform }} translateY(0)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateY(-20px)' })),
-], { params: { time: '350ms', easing: 'ease', transform: '' } });
-const fadeOutLeft = animation([
-    style({ opacity: '1', transform: '{{ transform }} translateX(0)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateX(20px)' })),
-], { params: { time: '350ms', easing: 'ease', transform: '' } });
-const fadeOutRight = animation([
-    style({ opacity: '1', transform: '{{ transform }} translateX(0)' }),
-    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateX(-20px)' })),
+const fadeIn = animation([style({ opacity: '0' }), animate('{{ time}} {{ easing }}', style({ opacity: '1' }))], {
+    params: { time: '350ms', easing: 'ease' },
+});
+const fadeOut = animation([style({ opacity: '1' }), animate('{{ time}} {{ easing }}', style({ opacity: '0' }))], { params: { time: '350ms', easing: 'ease' } });
+const fadeInDown = animation([
+    style({ opacity: '0', transform: '{{ transform }} translateY(-20px)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateY(0)' })),
+], { params: { time: '350ms', easing: 'ease', transform: '' } });
+const fadeInUp = animation([
+    style({ opacity: '0', transform: '{{ transform }} translateY(20px)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateY(0)' })),
+], { params: { time: '350ms', easing: 'ease', transform: '' } });
+const fadeInLeft = animation([
+    style({ opacity: '0', transform: '{{ transform }} translateX(20px)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateX(0)' })),
+], { params: { time: '350ms', easing: 'ease', transform: '' } });
+const fadeInRight = animation([
+    style({ opacity: '0', transform: '{{ transform }} translateX(-20px)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '1', transform: '{{ transform }} translateX(0)' })),
+], { params: { time: '350ms', easing: 'ease', transform: '' } });
+const fadeOutDown = animation([
+    style({ opacity: '1', transform: '{{ transform }} translateY(0)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateY(20px)' })),
+], { params: { time: '350ms', easing: 'ease', transform: '' } });
+const fadeOutUp = animation([
+    style({ opacity: '1', transform: '{{ transform }} translateY(0)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateY(-20px)' })),
+], { params: { time: '350ms', easing: 'ease', transform: '' } });
+const fadeOutLeft = animation([
+    style({ opacity: '1', transform: '{{ transform }} translateX(0)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateX(20px)' })),
+], { params: { time: '350ms', easing: 'ease', transform: '' } });
+const fadeOutRight = animation([
+    style({ opacity: '1', transform: '{{ transform }} translateX(0)' }),
+    animate('{{ time }} {{ easing }}', style({ opacity: '0', transform: '{{ transform }} translateX(-20px)' })),
 ], { params: { time: '350ms', easing: 'ease', transform: '' } });
 
-const fadeAnimation = trigger('fade', [
-    transition(':enter', useAnimation(fadeIn)),
-    transition(':leave', useAnimation(fadeOut)),
-]);
-const dialogAnimation = trigger('dialog', [
-    transition(':enter', useAnimation(fadeInDown)),
-    transition(':leave', useAnimation(fadeOut)),
+const fadeAnimation = trigger('fade', [
+    transition(':enter', useAnimation(fadeIn)),
+    transition(':leave', useAnimation(fadeOut)),
+]);
+const dialogAnimation = trigger('dialog', [
+    transition(':enter', useAnimation(fadeInDown)),
+    transition(':leave', useAnimation(fadeOut)),
 ]);
 
-const slideFromBottom = trigger('slideFromBottom', [
-    transition('* <=> *', [
-        style({ 'margin-top': '20px', opacity: '0' }),
-        animate('0.2s ease-out', style({ opacity: '1', 'margin-top': '0px' })),
-    ]),
+const slideFromBottom = trigger('slideFromBottom', [
+    transition('* <=> *', [
+        style({ 'margin-top': '20px', opacity: '0' }),
+        animate('0.2s ease-out', style({ opacity: '1', 'margin-top': '0px' })),
+    ]),
 ]);
 
-const toastInOut = trigger('toastInOut', [
-    transition('* <=> *', [
-        query(':enter', [
-            style({ opacity: 0, transform: 'translateY(20px)' }),
-            animate('350ms ease', style({ opacity: 1, transform: 'translateY(0)' })),
-        ], { optional: true }),
-        query(':leave', animate('450ms ease', style({ opacity: 0 })), {
-            optional: true,
-        }),
-    ]),
+const toastInOut = trigger('toastInOut', [
+    transition('* <=> *', [
+        query(':enter', [
+            style({ opacity: 0, transform: 'translateY(20px)' }),
+            animate('350ms ease', style({ opacity: 1, transform: 'translateY(0)' })),
+        ], { optional: true }),
+        query(':leave', animate('450ms ease', style({ opacity: 0 })), {
+            optional: true,
+        }),
+    ]),
 ]);
 
-class BreadcrumbItemsComponent {
-    constructor() {
-        this.items = [];
-    }
-}
-BreadcrumbItemsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BreadcrumbItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbItemsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", 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", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BreadcrumbItemsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-breadcrumb-items', 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" }]
-        }], propDecorators: { items: [{
-                type: Input
+class BreadcrumbItemsComponent {
+    constructor() {
+        this.items = [];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BreadcrumbItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", 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\" aria-hidden=\"true\"></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", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BreadcrumbItemsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-breadcrumb-items', template: "<ol class=\"breadcrumb\" *ngIf=\"items.length\">\r\n  <li class=\"breadcrumb-item\">\r\n    <a routerLink=\"/\"><i class=\"fa fa-home\" aria-hidden=\"true\"></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" }]
+        }], propDecorators: { items: [{
+                type: Input
             }] } });
 
-class BreadcrumbComponent {
-    constructor(cdRef, router, routes, subscription, routerEvents) {
-        this.cdRef = cdRef;
-        this.router = router;
-        this.routes = routes;
-        this.subscription = subscription;
-        this.routerEvents = routerEvents;
-        this.segments = [];
-    }
-    ngOnInit() {
-        this.subscription.addOne(this.routerEvents.getNavigationEvents('End').pipe(startWith(null), map(() => this.routes.search({ path: getRoutePath(this.router) }))), route => {
-            this.segments = [];
-            if (route) {
-                let node = { parent: route };
-                while (node.parent) {
-                    node = node.parent;
-                    const { parent, children, isLeaf, path, ...segment } = node;
-                    if (!isAdministration(segment))
-                        this.segments.unshift(segment);
-                }
-                this.cdRef.detectChanges();
-            }
-        });
-    }
-}
-BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", 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: "14.0.0", version: "15.0.4", type: BreadcrumbComponent, selector: "abp-breadcrumb", providers: [SubscriptionService], ngImport: i0, template: "<abp-breadcrumb-items [items]=\"segments\"></abp-breadcrumb-items>\r\n", dependencies: [{ kind: "component", type: BreadcrumbItemsComponent, selector: "abp-breadcrumb-items", inputs: ["items"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BreadcrumbComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, providers: [SubscriptionService], template: "<abp-breadcrumb-items [items]=\"segments\"></abp-breadcrumb-items>\r\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$1.Router }, { type: i2.RoutesService }, { type: i2.SubscriptionService }, { type: i2.RouterEvents }]; } });
-function isAdministration(route) {
-    return route.name === "AbpUiNavigation::Menu:Administration" /* eThemeSharedRouteNames.Administration */;
+class BreadcrumbComponent {
+    constructor(cdRef, router, routes, subscription, routerEvents) {
+        this.cdRef = cdRef;
+        this.router = router;
+        this.routes = routes;
+        this.subscription = subscription;
+        this.routerEvents = routerEvents;
+        this.segments = [];
+    }
+    ngOnInit() {
+        this.subscription.addOne(this.routerEvents.getNavigationEvents('End').pipe(startWith(null), map(() => this.routes.search({ path: getRoutePath(this.router) }))), route => {
+            this.segments = [];
+            if (route) {
+                let node = { parent: route };
+                while (node.parent) {
+                    node = node.parent;
+                    const { parent, children, isLeaf, path, ...segment } = node;
+                    if (!isAdministration(segment))
+                        this.segments.unshift(segment);
+                }
+                this.cdRef.detectChanges();
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", 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 }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: BreadcrumbComponent, selector: "abp-breadcrumb", providers: [SubscriptionService], ngImport: i0, template: "<abp-breadcrumb-items [items]=\"segments\"></abp-breadcrumb-items>\r\n", dependencies: [{ kind: "component", type: BreadcrumbItemsComponent, selector: "abp-breadcrumb-items", inputs: ["items"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BreadcrumbComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, providers: [SubscriptionService], template: "<abp-breadcrumb-items [items]=\"segments\"></abp-breadcrumb-items>\r\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$1.Router }, { type: i2.RoutesService }, { type: i2.SubscriptionService }, { type: i2.RouterEvents }]; } });
+function isAdministration(route) {
+    return route.name === "AbpUiNavigation::Menu:Administration" /* eThemeSharedRouteNames.Administration */;
 }
 
-class ButtonComponent {
-    constructor(renderer) {
-        this.renderer = renderer;
-        this.buttonId = '';
-        this.buttonClass = 'btn btn-primary';
-        this.buttonType = 'button';
-        this.formName = undefined;
-        this.loading = false;
-        this.disabled = false;
-        this.click = new EventEmitter();
-        this.focus = new EventEmitter();
-        this.blur = new EventEmitter();
-        this.abpClick = new EventEmitter();
-        this.abpFocus = new EventEmitter();
-        this.abpBlur = new EventEmitter();
-    }
-    get icon() {
-        return `${this.loading ? 'fa fa-spinner fa-spin' : this.iconClass || 'd-none'}`;
-    }
-    ngOnInit() {
-        if (this.attributes) {
-            Object.keys(this.attributes).forEach(key => {
-                if (this.attributes?.[key]) {
-                    this.renderer.setAttribute(this.buttonRef.nativeElement, key, this.attributes[key]);
-                }
-            });
-        }
-    }
-}
-ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ButtonComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ButtonComponent, selector: "abp-button", inputs: { buttonId: "buttonId", buttonClass: "buttonClass", buttonType: "buttonType", formName: "formName", 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: `
+class ButtonComponent {
+    get icon() {
+        return `${this.loading ? 'fa fa-spinner fa-spin' : this.iconClass || 'd-none'}`;
+    }
+    constructor(renderer) {
+        this.renderer = renderer;
+        this.buttonId = '';
+        this.buttonClass = 'btn btn-primary';
+        this.buttonType = 'button';
+        this.formName = undefined;
+        this.loading = false;
+        this.disabled = false;
+        this.click = new EventEmitter();
+        this.focus = new EventEmitter();
+        this.blur = new EventEmitter();
+        this.abpClick = new EventEmitter();
+        this.abpFocus = new EventEmitter();
+        this.abpBlur = new EventEmitter();
+    }
+    ngOnInit() {
+        if (this.attributes) {
+            Object.keys(this.attributes).forEach(key => {
+                if (this.attributes?.[key]) {
+                    this.renderer.setAttribute(this.buttonRef.nativeElement, key, this.attributes[key]);
+                }
+            });
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ButtonComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: ButtonComponent, selector: "abp-button", inputs: { buttonId: "buttonId", buttonClass: "buttonClass", buttonType: "buttonType", formName: "formName", 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"
@@ -240,13 +239,14 @@ ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
       (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>
+      <i [ngClass]="icon" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
     </button>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ButtonComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'abp-button',
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'abp-button',
                     template: `
     <button
       #button
@@ -259,231 +259,230 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
       (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>
+      <i [ngClass]="icon" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
     </button>
-  `,
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { buttonId: [{
-                type: Input
-            }], buttonClass: [{
-                type: Input
-            }], buttonType: [{
-                type: Input
-            }], formName: [{
-                type: Input
-            }], iconClass: [{
-                type: Input
-            }], loading: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], attributes: [{
-                type: Input
-            }], click: [{
-                type: Output
-            }], focus: [{
-                type: Output
-            }], blur: [{
-                type: Output
-            }], abpClick: [{
-                type: Output
-            }], abpFocus: [{
-                type: Output
-            }], abpBlur: [{
-                type: Output
-            }], buttonRef: [{
-                type: ViewChild,
-                args: ['button', { static: true }]
+  `,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { buttonId: [{
+                type: Input
+            }], buttonClass: [{
+                type: Input
+            }], buttonType: [{
+                type: Input
+            }], formName: [{
+                type: Input
+            }], iconClass: [{
+                type: Input
+            }], loading: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], attributes: [{
+                type: Input
+            }], click: [{
+                type: Output
+            }], focus: [{
+                type: Output
+            }], blur: [{
+                type: Output
+            }], abpClick: [{
+                type: Output
+            }], abpFocus: [{
+                type: Output
+            }], abpBlur: [{
+                type: Output
+            }], buttonRef: [{
+                type: ViewChild,
+                args: ['button', { static: true }]
             }] } });
 
-var Confirmation;
-(function (Confirmation) {
-    let Status;
-    (function (Status) {
-        Status["confirm"] = "confirm";
-        Status["reject"] = "reject";
-        Status["dismiss"] = "dismiss";
-    })(Status = Confirmation.Status || (Confirmation.Status = {}));
+var Confirmation;
+(function (Confirmation) {
+    let Status;
+    (function (Status) {
+        Status["confirm"] = "confirm";
+        Status["reject"] = "reject";
+        Status["dismiss"] = "dismiss";
+    })(Status = Confirmation.Status || (Confirmation.Status = {}));
 })(Confirmation || (Confirmation = {}));
 
-const CONFIRMATION_ICONS = new InjectionToken('CONFIRMATION_ICONS');
-const DEFAULT_CONFIRMATION_ICONS = {
-    info: 'fa fa-info-circle',
-    success: 'fa fa-check-circle',
-    warning: 'fa fa-exclamation-triangle',
-    error: 'fa fa-times-circle',
-    default: 'fa fa-question-circle',
-    neutral: '',
+const CONFIRMATION_ICONS = new InjectionToken('CONFIRMATION_ICONS');
+const DEFAULT_CONFIRMATION_ICONS = {
+    info: 'fa fa-info-circle',
+    success: 'fa fa-check-circle',
+    warning: 'fa fa-exclamation-triangle',
+    error: 'fa fa-times-circle',
+    default: 'fa fa-question-circle',
+    neutral: '',
 };
 
-class ConfirmationComponent {
-    constructor(icons) {
-        this.icons = icons;
-        this.confirm = Confirmation.Status.confirm;
-        this.reject = Confirmation.Status.reject;
-        this.dismiss = Confirmation.Status.dismiss;
-    }
-    close(status) {
-        this.clear(status);
-    }
-    getIconClass({ severity, options }) {
-        if (options && options.icon) {
-            return options.icon;
-        }
-        if (!this.icons) {
-            return '';
-        }
-        if (severity) {
-            return this.icons[severity];
-        }
-        return this.icons.default;
-    }
-    isCustomIconExists({ options }) {
-        return !!(options && (options.iconTemplate || options.icon));
-    }
-    isIconTemplateExits({ options }) {
-        return !!(options && options.iconTemplate);
-    }
-}
-ConfirmationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ConfirmationComponent, deps: [{ token: CONFIRMATION_ICONS }], target: i0.ɵɵFactoryTarget.Component });
-ConfirmationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", 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 || isCustomIconExists(data)\">\r\n      <div  [outerHTML]=\"data.options.iconTemplate\" *ngIf=\"isIconTemplateExits(data); else iconHolder\" ></div>\r\n       <ng-template #iconHolder>\r\n         <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n       </ng-template>\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;inset: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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ConfirmationComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-confirmation', 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 || isCustomIconExists(data)\">\r\n      <div  [outerHTML]=\"data.options.iconTemplate\" *ngIf=\"isIconTemplateExits(data); else iconHolder\" ></div>\r\n       <ng-template #iconHolder>\r\n         <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n       </ng-template>\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;inset: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"] }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [CONFIRMATION_ICONS]
+class ConfirmationComponent {
+    constructor(icons) {
+        this.icons = icons;
+        this.confirm = Confirmation.Status.confirm;
+        this.reject = Confirmation.Status.reject;
+        this.dismiss = Confirmation.Status.dismiss;
+    }
+    close(status) {
+        this.clear(status);
+    }
+    getIconClass({ severity, options }) {
+        if (options && options.icon) {
+            return options.icon;
+        }
+        if (!this.icons) {
+            return '';
+        }
+        if (severity) {
+            return this.icons[severity];
+        }
+        return this.icons.default;
+    }
+    isCustomIconExists({ options }) {
+        return !!(options && (options.iconTemplate || options.icon));
+    }
+    isIconTemplateExits({ options }) {
+        return !!(options && options.iconTemplate);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ConfirmationComponent, deps: [{ token: CONFIRMATION_ICONS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", 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 || isCustomIconExists(data)\">\r\n      <div  [outerHTML]=\"data.options.iconTemplate\" *ngIf=\"isIconTemplateExits(data); else iconHolder\" ></div>\r\n       <ng-template #iconHolder>\r\n         <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n       </ng-template>\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;inset: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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ConfirmationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-confirmation', 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 || isCustomIconExists(data)\">\r\n      <div  [outerHTML]=\"data.options.iconTemplate\" *ngIf=\"isIconTemplateExits(data); else iconHolder\" ></div>\r\n       <ng-template #iconHolder>\r\n         <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n       </ng-template>\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;inset: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"] }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [CONFIRMATION_ICONS]
                 }] }]; } });
 
-class HttpErrorWrapperComponent {
-    constructor(subscription) {
-        this.subscription = subscription;
-        this.status = 0;
-        this.title = 'Oops!';
-        this.details = 'Sorry, an error has occured.';
-        this.customComponent = undefined;
-        this.hideCloseIcon = false;
-        this.isHomeShow = true;
-    }
-    get statusText() {
-        return this.status ? `[${this.status}]` : '';
-    }
-    ngOnInit() {
-        this.backgroundColor =
-            window.getComputedStyle(document.body)?.getPropertyValue('background-color') || '#fff';
-    }
-    ngAfterViewInit() {
-        if (this.customComponent) {
-            const customComponentRef = this.cfRes
-                .resolveComponentFactory(this.customComponent)
-                .create(this.injector);
-            customComponentRef.instance.errorStatus = this.status;
-            customComponentRef.instance.destroy$ = this.destroy$;
-            this.appRef.attachView(customComponentRef.hostView);
-            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'));
-        this.subscription.addOne(keyup$, () => this.destroy());
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    destroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-}
-HttpErrorWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: HttpErrorWrapperComponent, deps: [{ token: i2.SubscriptionService }], target: i0.ɵɵFactoryTarget.Component });
-HttpErrorWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", 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"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: HttpErrorWrapperComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-http-error-wrapper', providers: [SubscriptionService], 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"] }]
-        }], ctorParameters: function () { return [{ type: i2.SubscriptionService }]; }, propDecorators: { containerRef: [{
-                type: ViewChild,
-                args: ['container', { static: false }]
+class HttpErrorWrapperComponent {
+    get statusText() {
+        return this.status ? `[${this.status}]` : '';
+    }
+    constructor(subscription) {
+        this.subscription = subscription;
+        this.status = 0;
+        this.title = 'Oops!';
+        this.details = 'Sorry, an error has occured.';
+        this.customComponent = undefined;
+        this.hideCloseIcon = false;
+        this.isHomeShow = true;
+    }
+    ngOnInit() {
+        this.backgroundColor =
+            window.getComputedStyle(document.body)?.getPropertyValue('background-color') || '#fff';
+    }
+    ngAfterViewInit() {
+        if (this.customComponent) {
+            const customComponentRef = this.cfRes
+                .resolveComponentFactory(this.customComponent)
+                .create(this.injector);
+            customComponentRef.instance.errorStatus = this.status;
+            customComponentRef.instance.destroy$ = this.destroy$;
+            this.appRef.attachView(customComponentRef.hostView);
+            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'));
+        this.subscription.addOne(keyup$, () => this.destroy());
+    }
+    ngOnDestroy() {
+        this.destroy();
+    }
+    destroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: HttpErrorWrapperComponent, deps: [{ token: i2.SubscriptionService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", 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"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: HttpErrorWrapperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-http-error-wrapper', providers: [SubscriptionService], 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"] }]
+        }], ctorParameters: function () { return [{ type: i2.SubscriptionService }]; }, propDecorators: { containerRef: [{
+                type: ViewChild,
+                args: ['container', { static: false }]
             }] } });
 
-class LoaderBarComponent {
-    constructor(router, cdRef, subscription, httpWaitService, routerWaitService) {
-        this.router = router;
-        this.cdRef = cdRef;
-        this.subscription = subscription;
-        this.httpWaitService = httpWaitService;
-        this.routerWaitService = routerWaitService;
-        this.containerClass = 'abp-loader-bar';
-        this.color = '#77b6ff';
-        this.progressLevel = 0;
-        this.interval = new Subscription();
-        this.timer = new Subscription();
-        this.intervalPeriod = 350;
-        this.stopDelay = 800;
-        this.clearProgress = () => {
-            this.progressLevel = 0;
-            this.cdRef.detectChanges();
-        };
-        this.reportProgress = () => {
-            if (this.progressLevel < 75) {
-                this.progressLevel += 1 + Math.random() * 9;
-            }
-            else if (this.progressLevel < 90) {
-                this.progressLevel += 0.4;
-            }
-            else if (this.progressLevel < 100) {
-                this.progressLevel += 0.1;
-            }
-            else {
-                this.interval.unsubscribe();
-            }
-            this.cdRef.detectChanges();
-        };
-    }
-    set isLoading(value) {
-        this._isLoading = value;
-        this.cdRef.detectChanges();
-    }
-    get isLoading() {
-        return this._isLoading;
-    }
-    get boxShadow() {
-        return `0 0 10px rgba(${this.color}, 0.5)`;
-    }
-    ngOnInit() {
-        this.subscribeLoading();
-    }
-    subscribeLoading() {
-        this.subscription.addOne(combineLatest([this.httpWaitService.getLoading$(), this.routerWaitService.getLoading$()]), ([httpLoading, routerLoading]) => {
-            if (httpLoading || routerLoading)
-                this.startLoading();
-            else
-                this.stopLoading();
-        });
-    }
-    ngOnDestroy() {
-        this.interval.unsubscribe();
-    }
-    startLoading() {
-        if (this.isLoading || !this.interval.closed)
-            return;
-        this.isLoading = true;
-        this.progressLevel = 0;
-        this.cdRef.detectChanges();
-        this.interval = timer(0, this.intervalPeriod).subscribe(this.reportProgress);
-        this.timer.unsubscribe();
-    }
-    stopLoading() {
-        this.interval.unsubscribe();
-        this.progressLevel = 100;
-        this.isLoading = false;
-        if (!this.timer.closed)
-            return;
-        this.timer = timer(this.stopDelay).subscribe(this.clearProgress);
-    }
-}
-LoaderBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", 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: "14.0.0", version: "15.0.4", type: LoaderBarComponent, selector: "abp-loader-bar", inputs: { isLoading: "isLoading", containerClass: "containerClass", color: "color" }, providers: [SubscriptionService], ngImport: i0, template: `
+class LoaderBarComponent {
+    set isLoading(value) {
+        this._isLoading = value;
+        this.cdRef.detectChanges();
+    }
+    get isLoading() {
+        return this._isLoading;
+    }
+    get boxShadow() {
+        return `0 0 10px rgba(${this.color}, 0.5)`;
+    }
+    constructor(router, cdRef, subscription, httpWaitService, routerWaitService) {
+        this.router = router;
+        this.cdRef = cdRef;
+        this.subscription = subscription;
+        this.httpWaitService = httpWaitService;
+        this.routerWaitService = routerWaitService;
+        this.containerClass = 'abp-loader-bar';
+        this.color = '#77b6ff';
+        this.progressLevel = 0;
+        this.interval = new Subscription();
+        this.timer = new Subscription();
+        this.intervalPeriod = 350;
+        this.stopDelay = 800;
+        this.clearProgress = () => {
+            this.progressLevel = 0;
+            this.cdRef.detectChanges();
+        };
+        this.reportProgress = () => {
+            if (this.progressLevel < 75) {
+                this.progressLevel += 1 + Math.random() * 9;
+            }
+            else if (this.progressLevel < 90) {
+                this.progressLevel += 0.4;
+            }
+            else if (this.progressLevel < 100) {
+                this.progressLevel += 0.1;
+            }
+            else {
+                this.interval.unsubscribe();
+            }
+            this.cdRef.detectChanges();
+        };
+    }
+    ngOnInit() {
+        this.subscribeLoading();
+    }
+    subscribeLoading() {
+        this.subscription.addOne(combineLatest([this.httpWaitService.getLoading$(), this.routerWaitService.getLoading$()]), ([httpLoading, routerLoading]) => {
+            if (httpLoading || routerLoading)
+                this.startLoading();
+            else
+                this.stopLoading();
+        });
+    }
+    ngOnDestroy() {
+        this.interval.unsubscribe();
+    }
+    startLoading() {
+        if (this.isLoading || !this.interval.closed)
+            return;
+        this.isLoading = true;
+        this.progressLevel = 0;
+        this.cdRef.detectChanges();
+        this.interval = timer(0, this.intervalPeriod).subscribe(this.reportProgress);
+        this.timer.unsubscribe();
+    }
+    stopLoading() {
+        this.interval.unsubscribe();
+        this.progressLevel = 100;
+        this.isLoading = false;
+        if (!this.timer.closed)
+            return;
+        this.timer = timer(this.stopDelay).subscribe(this.clearProgress);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", 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 }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", 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"
@@ -495,9 +494,10 @@ LoaderBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
         }"
       ></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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LoaderBarComponent, decorators: [{
-            type: Component,
+  `, 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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", 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
@@ -510,673 +510,672 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
         }"
       ></div>
     </div>
-  `, providers: [SubscriptionService], 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"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i0.ChangeDetectorRef }, { type: i2.SubscriptionService }, { type: i2.HttpWaitService }, { type: i2.RouterWaitService }]; }, propDecorators: { isLoading: [{
-                type: Input
-            }], containerClass: [{
-                type: Input
-            }], color: [{
-                type: Input
+  `, providers: [SubscriptionService], 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"] }]
+        }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i0.ChangeDetectorRef }, { type: i2.SubscriptionService }, { type: i2.HttpWaitService }, { type: i2.RouterWaitService }]; }, propDecorators: { isLoading: [{
+                type: Input
+            }], containerClass: [{
+                type: Input
+            }], color: [{
+                type: Input
             }] } });
 
-class LoadingComponent {
-}
-LoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: LoadingComponent, selector: "abp-loading", ngImport: i0, template: `
+class LoadingComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: LoadingComponent, selector: "abp-loading", ngImport: i0, template: `
     <div class="abp-loading">
-      <i class="fa fa-spinner fa-pulse abp-spinner"></i>
+      <i class="fa fa-spinner fa-pulse abp-spinner" aria-hidden="true"></i>
     </div>
-  `, isInline: true, 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;transform:translate(-50%) translateY(-50%)}\n"], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LoadingComponent, decorators: [{
-            type: Component,
+  `, isInline: true, 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;transform:translate(-50%) translateY(-50%)}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", 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>
+      <i class="fa fa-spinner fa-pulse abp-spinner" aria-hidden="true"></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;transform:translate(-50%) translateY(-50%)}\n"] }]
+  `, 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;transform:translate(-50%) translateY(-50%)}\n"] }]
         }] });
 
-class ConfirmationService {
-    constructor(contentProjectionService) {
-        this.contentProjectionService = contentProjectionService;
-        this.confirmation$ = new ReplaySubject(1);
-        this.clear = (status = Confirmation.Status.dismiss) => {
-            this.confirmation$.next(null);
-            this.status$.next(status);
-        };
-    }
-    setContainer() {
-        this.containerComponentRef = this.contentProjectionService.projectContent(PROJECTION_STRATEGY.AppendComponentToBody(ConfirmationComponent, {
-            confirmation$: this.confirmation$,
-            clear: this.clear,
-        }));
-        setTimeout(() => {
-            this.containerComponentRef.changeDetectorRef.detectChanges();
-        }, 0);
-    }
-    info(message, title, options) {
-        return this.show(message, title, 'info', options);
-    }
-    success(message, title, options) {
-        return this.show(message, title, 'success', options);
-    }
-    warn(message, title, options) {
-        return this.show(message, title, 'warning', options);
-    }
-    error(message, title, options) {
-        return this.show(message, title, 'error', options);
-    }
-    show(message, title, severity, options = {}) {
-        if (!this.containerComponentRef)
-            this.setContainer();
-        this.confirmation$.next({
-            message,
-            title,
-            severity: severity || 'neutral',
-            options,
-        });
-        this.status$ = new Subject();
-        const { dismissible = true } = options;
-        if (dismissible)
-            this.listenToEscape();
-        return this.status$;
-    }
-    listenToEscape() {
-        fromEvent(document, 'keyup')
-            .pipe(takeUntil(this.status$), debounceTime(150), filter((key) => key && key.key === 'Escape'))
-            .subscribe(() => {
-            this.clear();
-        });
-    }
-}
-ConfirmationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ConfirmationService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable });
-ConfirmationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ConfirmationService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ConfirmationService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
+class ConfirmationService {
+    constructor(contentProjectionService) {
+        this.contentProjectionService = contentProjectionService;
+        this.confirmation$ = new ReplaySubject(1);
+        this.clear = (status = Confirmation.Status.dismiss) => {
+            this.confirmation$.next(null);
+            this.status$.next(status);
+        };
+    }
+    setContainer() {
+        this.containerComponentRef = this.contentProjectionService.projectContent(PROJECTION_STRATEGY.AppendComponentToBody(ConfirmationComponent, {
+            confirmation$: this.confirmation$,
+            clear: this.clear,
+        }));
+        setTimeout(() => {
+            this.containerComponentRef.changeDetectorRef.detectChanges();
+        }, 0);
+    }
+    info(message, title, options) {
+        return this.show(message, title, 'info', options);
+    }
+    success(message, title, options) {
+        return this.show(message, title, 'success', options);
+    }
+    warn(message, title, options) {
+        return this.show(message, title, 'warning', options);
+    }
+    error(message, title, options) {
+        return this.show(message, title, 'error', options);
+    }
+    show(message, title, severity, options = {}) {
+        if (!this.containerComponentRef)
+            this.setContainer();
+        this.confirmation$.next({
+            message,
+            title,
+            severity: severity || 'neutral',
+            options,
+        });
+        this.status$ = new Subject();
+        const { dismissible = true } = options;
+        if (dismissible)
+            this.listenToEscape();
+        return this.status$;
+    }
+    listenToEscape() {
+        fromEvent(document, 'keyup')
+            .pipe(takeUntil(this.status$), debounceTime(150), filter((key) => key && key.key === 'Escape'))
+            .subscribe(() => {
+            this.clear();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ConfirmationService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ConfirmationService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ConfirmationService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i2.ContentProjectionService }]; } });
 
 const SUPPRESS_UNSAVED_CHANGES_WARNING = new InjectionToken('SUPPRESS_UNSAVED_CHANGES_WARNING');
 
-class ModalRefService {
-    constructor() {
-        this.modalRefs = [];
-    }
-    register(modal) {
-        this.modalRefs.push(modal);
-    }
-    unregister(modal) {
-        const index = this.modalRefs.indexOf(modal);
-        if (index > -1) {
-            this.modalRefs.splice(index, 1);
-        }
-    }
-    dismissAll(mode) {
-        this.modalRefs.forEach(modal => modal.dismiss(mode));
-    }
-}
-ModalRefService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalRefService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ModalRefService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalRefService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalRefService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
+class ModalRefService {
+    constructor() {
+        this.modalRefs = [];
+    }
+    register(modal) {
+        this.modalRefs.push(modal);
+    }
+    unregister(modal) {
+        const index = this.modalRefs.indexOf(modal);
+        if (index > -1) {
+            this.modalRefs.splice(index, 1);
+        }
+    }
+    dismissAll(mode) {
+        this.modalRefs.forEach(modal => modal.dismiss(mode));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ModalRefService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ModalRefService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ModalRefService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }] });
 
-class ModalComponent {
-    constructor(confirmationService, subscription, suppressUnsavedChangesWarningToken, modal, modalRefService) {
-        this.confirmationService = confirmationService;
-        this.subscription = subscription;
-        this.suppressUnsavedChangesWarningToken = suppressUnsavedChangesWarningToken;
-        this.modal = modal;
-        this.modalRefService = modalRefService;
-        this.options = {};
-        this.suppressUnsavedChangesWarning = this.suppressUnsavedChangesWarningToken;
-        this.visibleChange = new EventEmitter();
-        this.init = new EventEmitter();
-        this.appear = new EventEmitter();
-        this.disappear = new EventEmitter();
-        this._visible = false;
-        this._busy = false;
-        this.isConfirmationOpen = false;
-        this.destroy$ = new Subject();
-        this.modalIdentifier = `modal-${uuid()}`;
-        this.toggle$ = new Subject();
-        this.initToggleStream();
-    }
-    get visible() {
-        return this._visible;
-    }
-    set visible(value) {
-        if (typeof value !== 'boolean')
-            return;
-        this.toggle$.next(value);
-    }
-    get busy() {
-        return this._busy;
-    }
-    set busy(value) {
-        if (this.abpSubmit && this.abpSubmit instanceof ButtonComponent) {
-            this.abpSubmit.loading = value;
-        }
-        this._busy = value;
-    }
-    get modalWindowRef() {
-        return document.querySelector(`ngb-modal-window.${this.modalIdentifier}`);
-    }
-    get isFormDirty() {
-        return Boolean(this.modalWindowRef?.querySelector('.ng-dirty'));
-    }
-    ngOnInit() {
-        this.modalRefService.register(this);
-    }
-    dismiss(mode) {
-        switch (mode) {
-            case 'hard':
-                this.visible = false;
-                break;
-            case 'soft':
-                this.close();
-                break;
-            default:
-                break;
-        }
-    }
-    initToggleStream() {
-        this.subscription.addOne(this.toggle$.pipe(debounceTime(0), distinctUntilChanged()), value => this.toggle(value));
-    }
-    toggle(value) {
-        this._visible = value;
-        this.visibleChange.emit(value);
-        if (!value) {
-            this.modalRef?.dismiss();
-            this.disappear.emit();
-            this.destroy$.next();
-            return;
-        }
-        setTimeout(() => this.listen(), 0);
-        this.modalRef = this.modal.open(this.modalContent, {
-            size: 'md',
-            centered: false,
-            keyboard: false,
-            scrollable: true,
-            beforeDismiss: () => {
-                if (!this.visible)
-                    return true;
-                this.close();
-                return !this.visible;
-            },
-            ...this.options,
-            windowClass: `${this.options.windowClass || ''} ${this.modalIdentifier}`,
-        });
-        this.appear.emit();
-    }
-    ngOnDestroy() {
-        this.modalRefService.unregister(this);
-        this.toggle(false);
-        this.destroy$.next();
-    }
-    close() {
-        if (this.busy)
-            return;
-        if (this.isFormDirty && !this.suppressUnsavedChangesWarning) {
-            if (this.isConfirmationOpen)
-                return;
-            this.isConfirmationOpen = true;
-            this.confirmationService
-                .warn('AbpUi::AreYouSureYouWantToCancelEditingWarningMessage', 'AbpUi::AreYouSure', { dismissible: false })
-                .subscribe((status) => {
-                this.isConfirmationOpen = false;
-                if (status === Confirmation.Status.confirm) {
-                    this.visible = false;
-                }
-            });
-        }
-        else {
-            this.visible = false;
-        }
-    }
-    listen() {
-        if (this.modalWindowRef) {
-            fromEvent(this.modalWindowRef, 'keyup')
-                .pipe(takeUntil(this.destroy$), debounceTime(150), filter((key) => key && key.key === 'Escape' && this.options.keyboard))
-                .subscribe(() => this.close());
-        }
-        fromEvent(window, 'beforeunload')
-            .pipe(takeUntil(this.destroy$))
-            .subscribe(event => {
-            // TODO: check this
-            if (!this.isFormDirty || this.suppressUnsavedChangesWarning) {
-                event.preventDefault();
-            }
-        });
-        this.init.emit();
-    }
-}
-ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", 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: "14.0.0", version: "15.0.4", 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 abp-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"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-modal', providers: [SubscriptionService], 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 abp-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"] }]
-        }], ctorParameters: function () { return [{ type: ConfirmationService }, { type: i2.SubscriptionService }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [SUPPRESS_UNSAVED_CHANGES_WARNING]
-                }] }, { type: i3.NgbModal }, { type: ModalRefService }]; }, propDecorators: { visible: [{
-                type: Input
-            }], busy: [{
-                type: Input
-            }], options: [{
-                type: Input
-            }], suppressUnsavedChangesWarning: [{
-                type: Input
-            }], modalContent: [{
-                type: ViewChild,
-                args: ['modalContent']
-            }], abpHeader: [{
-                type: ContentChild,
-                args: ['abpHeader', { static: false }]
-            }], abpBody: [{
-                type: ContentChild,
-                args: ['abpBody', { static: false }]
-            }], abpFooter: [{
-                type: ContentChild,
-                args: ['abpFooter', { static: false }]
-            }], abpSubmit: [{
-                type: ContentChild,
-                args: [ButtonComponent, { static: false, read: ButtonComponent }]
-            }], visibleChange: [{
-                type: Output
-            }], init: [{
-                type: Output
-            }], appear: [{
-                type: Output
-            }], disappear: [{
-                type: Output
+class ModalComponent {
+    get visible() {
+        return this._visible;
+    }
+    set visible(value) {
+        if (typeof value !== 'boolean')
+            return;
+        this.toggle$.next(value);
+    }
+    get busy() {
+        return this._busy;
+    }
+    set busy(value) {
+        if (this.abpSubmit && this.abpSubmit instanceof ButtonComponent) {
+            this.abpSubmit.loading = value;
+        }
+        this._busy = value;
+    }
+    get modalWindowRef() {
+        return document.querySelector(`ngb-modal-window.${this.modalIdentifier}`);
+    }
+    get isFormDirty() {
+        return Boolean(this.modalWindowRef?.querySelector('.ng-dirty'));
+    }
+    constructor(confirmationService, subscription, suppressUnsavedChangesWarningToken, modal, modalRefService) {
+        this.confirmationService = confirmationService;
+        this.subscription = subscription;
+        this.suppressUnsavedChangesWarningToken = suppressUnsavedChangesWarningToken;
+        this.modal = modal;
+        this.modalRefService = modalRefService;
+        this.options = {};
+        this.suppressUnsavedChangesWarning = this.suppressUnsavedChangesWarningToken;
+        this.visibleChange = new EventEmitter();
+        this.init = new EventEmitter();
+        this.appear = new EventEmitter();
+        this.disappear = new EventEmitter();
+        this._visible = false;
+        this._busy = false;
+        this.isConfirmationOpen = false;
+        this.destroy$ = new Subject();
+        this.modalIdentifier = `modal-${uuid()}`;
+        this.toggle$ = new Subject();
+        this.initToggleStream();
+    }
+    ngOnInit() {
+        this.modalRefService.register(this);
+    }
+    dismiss(mode) {
+        switch (mode) {
+            case 'hard':
+                this.visible = false;
+                break;
+            case 'soft':
+                this.close();
+                break;
+            default:
+                break;
+        }
+    }
+    initToggleStream() {
+        this.subscription.addOne(this.toggle$.pipe(debounceTime(0), distinctUntilChanged()), value => this.toggle(value));
+    }
+    toggle(value) {
+        this._visible = value;
+        this.visibleChange.emit(value);
+        if (!value) {
+            this.modalRef?.dismiss();
+            this.disappear.emit();
+            this.destroy$.next();
+            return;
+        }
+        setTimeout(() => this.listen(), 0);
+        this.modalRef = this.modal.open(this.modalContent, {
+            size: 'md',
+            centered: false,
+            keyboard: false,
+            scrollable: true,
+            beforeDismiss: () => {
+                if (!this.visible)
+                    return true;
+                this.close();
+                return !this.visible;
+            },
+            ...this.options,
+            windowClass: `${this.options.windowClass || ''} ${this.modalIdentifier}`,
+        });
+        this.appear.emit();
+    }
+    ngOnDestroy() {
+        this.modalRefService.unregister(this);
+        this.toggle(false);
+        this.destroy$.next();
+    }
+    close() {
+        if (this.busy)
+            return;
+        if (this.isFormDirty && !this.suppressUnsavedChangesWarning) {
+            if (this.isConfirmationOpen)
+                return;
+            this.isConfirmationOpen = true;
+            this.confirmationService
+                .warn('AbpUi::AreYouSureYouWantToCancelEditingWarningMessage', 'AbpUi::AreYouSure', { dismissible: false })
+                .subscribe((status) => {
+                this.isConfirmationOpen = false;
+                if (status === Confirmation.Status.confirm) {
+                    this.visible = false;
+                }
+            });
+        }
+        else {
+            this.visible = false;
+        }
+    }
+    listen() {
+        if (this.modalWindowRef) {
+            fromEvent(this.modalWindowRef, 'keyup')
+                .pipe(takeUntil(this.destroy$), debounceTime(150), filter((key) => key && key.key === 'Escape' && this.options.keyboard))
+                .subscribe(() => this.close());
+        }
+        fromEvent(window, 'beforeunload')
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(event => {
+            // TODO: check this
+            if (!this.isFormDirty || this.suppressUnsavedChangesWarning) {
+                event.preventDefault();
+            }
+        });
+        this.init.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", 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 }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", 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 abp-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"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-modal', providers: [SubscriptionService], 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 abp-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"] }]
+        }], ctorParameters: function () { return [{ type: ConfirmationService }, { type: i2.SubscriptionService }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [SUPPRESS_UNSAVED_CHANGES_WARNING]
+                }] }, { type: i3.NgbModal }, { type: ModalRefService }]; }, propDecorators: { visible: [{
+                type: Input
+            }], busy: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], suppressUnsavedChangesWarning: [{
+                type: Input
+            }], modalContent: [{
+                type: ViewChild,
+                args: ['modalContent']
+            }], abpHeader: [{
+                type: ContentChild,
+                args: ['abpHeader', { static: false }]
+            }], abpBody: [{
+                type: ContentChild,
+                args: ['abpBody', { static: false }]
+            }], abpFooter: [{
+                type: ContentChild,
+                args: ['abpFooter', { static: false }]
+            }], abpSubmit: [{
+                type: ContentChild,
+                args: [ButtonComponent, { static: false, read: ButtonComponent }]
+            }], visibleChange: [{
+                type: Output
+            }], init: [{
+                type: Output
+            }], appear: [{
+                type: Output
+            }], disappear: [{
+                type: Output
             }] } });
 
-class ModalCloseDirective {
-    constructor(modal) {
-        this.modal = modal;
-        if (!modal) {
-            console.error('Please use abpClose within an abp-modal');
-        }
-    }
-    onClick() {
-        this.modal?.close();
-    }
-}
-ModalCloseDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalCloseDirective, deps: [{ token: ModalComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-ModalCloseDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: ModalCloseDirective, selector: "[abpClose]", host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalCloseDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[abpClose]' }]
-        }], ctorParameters: function () { return [{ type: ModalComponent, decorators: [{
-                    type: Optional
-                }] }]; }, propDecorators: { onClick: [{
-                type: HostListener,
-                args: ['click']
+class ModalCloseDirective {
+    constructor(modal) {
+        this.modal = modal;
+        if (!modal) {
+            console.error('Please use abpClose within an abp-modal');
+        }
+    }
+    onClick() {
+        this.modal?.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ModalCloseDirective, deps: [{ token: ModalComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: ModalCloseDirective, selector: "[abpClose]", host: { listeners: { "click": "onClick()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ModalCloseDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[abpClose]' }]
+        }], ctorParameters: function () { return [{ type: ModalComponent, decorators: [{
+                    type: Optional
+                }] }]; }, propDecorators: { onClick: [{
+                type: HostListener,
+                args: ['click']
             }] } });
 
-class ToastComponent {
-    constructor() {
-        this.remove = new EventEmitter();
-    }
-    get severityClass() {
-        if (!this.toast || !this.toast.severity)
-            return '';
-        return `abp-toast-${this.toast.severity}`;
-    }
-    get iconClass() {
-        switch (this.toast.severity) {
-            case 'success':
-                return 'fa-check-circle';
-            case 'info':
-                return 'fa-info-circle';
-            case 'warning':
-                return 'fa-exclamation-triangle';
-            case 'error':
-                return 'fa-times-circle';
-            default:
-                return 'fa-exclamation-circle';
-        }
-    }
-    ngOnInit() {
-        const { sticky, life } = this.toast.options || {};
-        if (sticky)
-            return;
-        const timeout = life || 5000;
-        setTimeout(() => {
-            this.close();
-        }, timeout);
-    }
-    close() {
-        this.remove.emit(this.toast.options?.id);
-    }
-    tap() {
-        if (this.toast.options?.tapToDismiss)
-            this.close();
-    }
-}
-ToastComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ToastComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", 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;gap:10px;margin:5px 0;padding:10px;border-radius:0;width:350px;-webkit-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;display:flex;align-self:center;word-break:break-word}.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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ToastComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-toast', 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;gap:10px;margin:5px 0;padding:10px;border-radius:0;width:350px;-webkit-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;display:flex;align-self:center;word-break:break-word}.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"] }]
-        }], propDecorators: { toast: [{
-                type: Input
-            }], remove: [{
-                type: Output
+class ToastComponent {
+    constructor() {
+        this.remove = new EventEmitter();
+    }
+    get severityClass() {
+        if (!this.toast || !this.toast.severity)
+            return '';
+        return `abp-toast-${this.toast.severity}`;
+    }
+    get iconClass() {
+        switch (this.toast.severity) {
+            case 'success':
+                return 'fa-check-circle';
+            case 'info':
+                return 'fa-info-circle';
+            case 'warning':
+                return 'fa-exclamation-triangle';
+            case 'error':
+                return 'fa-times-circle';
+            default:
+                return 'fa-exclamation-circle';
+        }
+    }
+    ngOnInit() {
+        const { sticky, life } = this.toast.options || {};
+        if (sticky)
+            return;
+        const timeout = life || 5000;
+        setTimeout(() => {
+            this.close();
+        }, timeout);
+    }
+    close() {
+        this.remove.emit(this.toast.options?.id);
+    }
+    tap() {
+        if (this.toast.options?.tapToDismiss)
+            this.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", 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\" aria-hidden=\"true\"></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\" aria-hidden=\"true\"></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;gap:10px;margin:5px 0;padding:10px;border-radius:0;width:350px;-webkit-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;display:flex;align-self:center;word-break:break-word}.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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-toast', template: "<div class=\"abp-toast\" [ngClass]=\"severityClass\" (click)=\"tap()\">\r\n  <div class=\"abp-toast-icon\">\r\n    <i class=\"fa icon\" [ngClass]=\"iconClass\" aria-hidden=\"true\"></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\" aria-hidden=\"true\"></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;gap:10px;margin:5px 0;padding:10px;border-radius:0;width:350px;-webkit-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;display:flex;align-self:center;word-break:break-word}.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"] }]
+        }], propDecorators: { toast: [{
+                type: Input
+            }], remove: [{
+                type: Output
             }] } });
 
-class ToastContainerComponent {
-    constructor() {
-        this.toasts = [];
-        this.right = '30px';
-        this.defaultRight = '30px';
-        this.defaultMobileRight = '0';
-        this.bottom = '30px';
-    }
-    ngOnInit() {
-        this.setDefaultRight();
-        this.toasts$.subscribe(toasts => {
-            this.toasts = this.toastKey
-                ? toasts.filter(t => {
-                    return t.options && t.options.containerKey !== this.toastKey;
-                })
-                : toasts;
-        });
-    }
-    onWindowResize() {
-        this.setDefaultRight();
-    }
-    setDefaultRight() {
-        const screenWidth = window.innerWidth;
-        if (screenWidth < 768 && this.right == this.defaultRight) {
-            this.right = this.defaultMobileRight;
-        }
-    }
-    trackByFunc(index, toast) {
-        if (!toast)
-            return null;
-        return toast.options?.id;
-    }
-}
-ToastContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ToastContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ToastContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ToastContainerComponent, selector: "abp-toast-container", inputs: { top: "top", right: "right", bottom: "bottom", left: "left", toastKey: "toastKey" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, 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}@media only screen and (max-width: 768px){.abp-toast-container{min-width:100%}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ToastComponent, selector: "abp-toast", inputs: ["toast"], outputs: ["remove"] }], animations: [toastInOut] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ToastContainerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-toast-container', animations: [toastInOut], 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}@media only screen and (max-width: 768px){.abp-toast-container{min-width:100%}}\n"] }]
-        }], propDecorators: { top: [{
-                type: Input
-            }], right: [{
-                type: Input
-            }], bottom: [{
-                type: Input
-            }], left: [{
-                type: Input
-            }], toastKey: [{
-                type: Input
-            }], onWindowResize: [{
-                type: HostListener,
-                args: ['window:resize', ['$event']]
+class ToastContainerComponent {
+    constructor() {
+        this.toasts = [];
+        this.right = '30px';
+        this.defaultRight = '30px';
+        this.defaultMobileRight = '0';
+        this.bottom = '30px';
+    }
+    ngOnInit() {
+        this.setDefaultRight();
+        this.toasts$.subscribe(toasts => {
+            this.toasts = this.toastKey
+                ? toasts.filter(t => {
+                    return t.options && t.options.containerKey !== this.toastKey;
+                })
+                : toasts;
+        });
+    }
+    onWindowResize() {
+        this.setDefaultRight();
+    }
+    setDefaultRight() {
+        const screenWidth = window.innerWidth;
+        if (screenWidth < 768 && this.right == this.defaultRight) {
+            this.right = this.defaultMobileRight;
+        }
+    }
+    trackByFunc(index, toast) {
+        if (!toast)
+            return null;
+        return toast.options?.id;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: ToastContainerComponent, selector: "abp-toast-container", inputs: { top: "top", right: "right", bottom: "bottom", left: "left", toastKey: "toastKey" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, 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}@media only screen and (max-width: 768px){.abp-toast-container{min-width:100%}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ToastComponent, selector: "abp-toast", inputs: ["toast"], outputs: ["remove"] }], animations: [toastInOut] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-toast-container', animations: [toastInOut], 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}@media only screen and (max-width: 768px){.abp-toast-container{min-width:100%}}\n"] }]
+        }], propDecorators: { top: [{
+                type: Input
+            }], right: [{
+                type: Input
+            }], bottom: [{
+                type: Input
+            }], left: [{
+                type: Input
+            }], toastKey: [{
+                type: Input
+            }], onWindowResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
             }] } });
 
-class PasswordComponent extends AbstractNgModelComponent {
-    constructor(injector) {
-        super(injector);
-    }
-    toggleFieldTextType() {
-        this.fieldTextType = !this.fieldTextType;
-    }
-}
-PasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PasswordComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
-PasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: PasswordComponent, selector: "abp-password", inputs: { inputId: "inputId", formControlName: "formControlName" }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => PasswordComponent),
-            multi: true,
-        },
-    ], usesInheritance: true, ngImport: i0, template: "<div class=\"input-group\" validationTarget>\r\n  <input\r\n    [type]=\"fieldTextType ? 'text' : 'password'\"\r\n    class=\"form-control\"\r\n    [id]=\"inputId\"\r\n    [(ngModel)]=\"value\"\r\n  />\r\n\r\n  <button class=\"btn btn-secondary\" type=\"button\" (click)=\"toggleFieldTextType()\">\r\n    <i\r\n      class=\"fa\"\r\n      [ngClass]=\"{\r\n        'fa-eye-slash': !fieldTextType,\r\n        'fa-eye': fieldTextType\r\n      }\"\r\n    ></i>\r\n  </button>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$1.ValidationTargetDirective, selector: "[validationTarget]", exportAs: ["validationTarget"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PasswordComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-password', providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => PasswordComponent),
-                            multi: true,
-                        },
-                    ], template: "<div class=\"input-group\" validationTarget>\r\n  <input\r\n    [type]=\"fieldTextType ? 'text' : 'password'\"\r\n    class=\"form-control\"\r\n    [id]=\"inputId\"\r\n    [(ngModel)]=\"value\"\r\n  />\r\n\r\n  <button class=\"btn btn-secondary\" type=\"button\" (click)=\"toggleFieldTextType()\">\r\n    <i\r\n      class=\"fa\"\r\n      [ngClass]=\"{\r\n        'fa-eye-slash': !fieldTextType,\r\n        'fa-eye': fieldTextType\r\n      }\"\r\n    ></i>\r\n  </button>\r\n</div>\r\n" }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { inputId: [{
-                type: Input
-            }], formControlName: [{
-                type: Input
+class PasswordComponent extends AbstractNgModelComponent {
+    constructor(injector) {
+        super(injector);
+    }
+    toggleFieldTextType() {
+        this.fieldTextType = !this.fieldTextType;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: PasswordComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: PasswordComponent, selector: "abp-password", inputs: { inputId: "inputId", formControlName: "formControlName" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => PasswordComponent),
+                multi: true,
+            },
+        ], usesInheritance: true, ngImport: i0, template: "<div class=\"input-group\" validationTarget>\r\n  <input\r\n    [type]=\"fieldTextType ? 'text' : 'password'\"\r\n    class=\"form-control\"\r\n    [id]=\"inputId\"\r\n    [(ngModel)]=\"value\"\r\n  />\r\n\r\n  <button class=\"btn btn-secondary\" type=\"button\" (click)=\"toggleFieldTextType()\">\r\n    <i\r\n      class=\"fa\"\r\n      aria-hidden=\"true\"\r\n      [ngClass]=\"{\r\n        'fa-eye-slash': !fieldTextType,\r\n        'fa-eye': fieldTextType\r\n      }\"\r\n    ></i>\r\n  </button>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$1.ValidationTargetDirective, selector: "[validationTarget]", exportAs: ["validationTarget"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: PasswordComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-password', providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => PasswordComponent),
+                            multi: true,
+                        },
+                    ], template: "<div class=\"input-group\" validationTarget>\r\n  <input\r\n    [type]=\"fieldTextType ? 'text' : 'password'\"\r\n    class=\"form-control\"\r\n    [id]=\"inputId\"\r\n    [(ngModel)]=\"value\"\r\n  />\r\n\r\n  <button class=\"btn btn-secondary\" type=\"button\" (click)=\"toggleFieldTextType()\">\r\n    <i\r\n      class=\"fa\"\r\n      aria-hidden=\"true\"\r\n      [ngClass]=\"{\r\n        'fa-eye-slash': !fieldTextType,\r\n        'fa-eye': fieldTextType\r\n      }\"\r\n    ></i>\r\n  </button>\r\n</div>\r\n" }]
+        }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { inputId: [{
+                type: Input
+            }], formControlName: [{
+                type: Input
             }] } });
 
-class CardBodyComponent {
-    constructor() {
-        this.componentClass = 'card-body';
-    }
-}
-CardBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CardBodyComponent, selector: "abp-card-body", inputs: { cardBodyClass: "cardBodyClass", cardBodyStyle: "cardBodyStyle" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: ` <div [ngClass]="cardBodyClass" [ngStyle]="cardBodyStyle">
+class CardBodyComponent {
+    constructor() {
+        this.componentClass = 'card-body';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: CardBodyComponent, selector: "abp-card-body", inputs: { cardBodyClass: "cardBodyClass", cardBodyStyle: "cardBodyStyle" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: ` <div [ngClass]="cardBodyClass" [ngStyle]="cardBodyStyle">
     <ng-content></ng-content>
-  </div>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardBodyComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'abp-card-body',
+  </div>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardBodyComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'abp-card-body',
                     template: ` <div [ngClass]="cardBodyClass" [ngStyle]="cardBodyStyle">
     <ng-content></ng-content>
-  </div>`,
-                }]
-        }], propDecorators: { componentClass: [{
-                type: HostBinding,
-                args: ['class']
-            }], cardBodyClass: [{
-                type: Input
-            }], cardBodyStyle: [{
-                type: Input
+  </div>`,
+                }]
+        }], propDecorators: { componentClass: [{
+                type: HostBinding,
+                args: ['class']
+            }], cardBodyClass: [{
+                type: Input
+            }], cardBodyStyle: [{
+                type: Input
             }] } });
 
-class CardComponent {
-}
-CardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CardComponent, selector: "abp-card", inputs: { cardClass: "cardClass", cardStyle: "cardStyle" }, ngImport: i0, template: ` <div class="card" [ngClass]="cardClass" [ngStyle]="cardStyle">
+class CardComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: CardComponent, selector: "abp-card", inputs: { cardClass: "cardClass", cardStyle: "cardStyle" }, ngImport: i0, template: ` <div class="card" [ngClass]="cardClass" [ngStyle]="cardStyle">
     <ng-content></ng-content>
-  </div>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'abp-card',
+  </div>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'abp-card',
                     template: ` <div class="card" [ngClass]="cardClass" [ngStyle]="cardStyle">
     <ng-content></ng-content>
-  </div>`,
-                }]
-        }], propDecorators: { cardClass: [{
-                type: Input
-            }], cardStyle: [{
-                type: Input
+  </div>`,
+                }]
+        }], propDecorators: { cardClass: [{
+                type: Input
+            }], cardStyle: [{
+                type: Input
             }] } });
 
-class CardHeaderComponent {
-    constructor() {
-        this.componentClass = 'card-header';
-    }
-}
-CardHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CardHeaderComponent, selector: "abp-card-header", inputs: { cardHeaderClass: "cardHeaderClass", cardHeaderStyle: "cardHeaderStyle" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
+class CardHeaderComponent {
+    constructor() {
+        this.componentClass = 'card-header';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: CardHeaderComponent, selector: "abp-card-header", inputs: { cardHeaderClass: "cardHeaderClass", cardHeaderStyle: "cardHeaderStyle" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
     <div [ngClass]="cardHeaderClass" [ngStyle]="cardHeaderStyle">
       <ng-content></ng-content>
     </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardHeaderComponent, decorators: [{
-            type: Component,
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardHeaderComponent, decorators: [{
+            type: Component,
             args: [{ selector: 'abp-card-header', template: `
     <div [ngClass]="cardHeaderClass" [ngStyle]="cardHeaderStyle">
       <ng-content></ng-content>
     </div>
-  ` }]
-        }], propDecorators: { componentClass: [{
-                type: HostBinding,
-                args: ['class']
-            }], cardHeaderClass: [{
-                type: Input
-            }], cardHeaderStyle: [{
-                type: Input
+  ` }]
+        }], propDecorators: { componentClass: [{
+                type: HostBinding,
+                args: ['class']
+            }], cardHeaderClass: [{
+                type: Input
+            }], cardHeaderStyle: [{
+                type: Input
             }] } });
 
-class CardFooterComponent {
-    constructor() {
-        this.componentClass = 'card-footer';
-    }
-}
-CardFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CardFooterComponent, selector: "abp-card-footer", inputs: { cardFooterStyle: "cardFooterStyle", cardFooterClass: "cardFooterClass" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
+class CardFooterComponent {
+    constructor() {
+        this.componentClass = 'card-footer';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: CardFooterComponent, selector: "abp-card-footer", inputs: { cardFooterStyle: "cardFooterStyle", cardFooterClass: "cardFooterClass" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
     <div [ngStyle]="cardFooterStyle" [ngClass]="cardFooterClass">
       <ng-content></ng-content>
     </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardFooterComponent, decorators: [{
-            type: Component,
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardFooterComponent, decorators: [{
+            type: Component,
             args: [{ selector: 'abp-card-footer', template: `
     <div [ngStyle]="cardFooterStyle" [ngClass]="cardFooterClass">
       <ng-content></ng-content>
     </div>
-  ` }]
-        }], propDecorators: { componentClass: [{
-                type: HostBinding,
-                args: ['class']
-            }], cardFooterStyle: [{
-                type: Input
-            }], cardFooterClass: [{
-                type: Input
+  ` }]
+        }], propDecorators: { componentClass: [{
+                type: HostBinding,
+                args: ['class']
+            }], cardFooterStyle: [{
+                type: Input
+            }], cardFooterClass: [{
+                type: Input
             }] } });
 
-class CardTitleDirective {
-    constructor() {
-        this.directiveClass = 'card-title';
-    }
-}
-CardTitleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-CardTitleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: CardTitleDirective, selector: "abp-card-title, [abp-card-title], [abpCardTitle]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardTitleDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: `abp-card-title, [abp-card-title], [abpCardTitle]`,
-                }]
-        }], propDecorators: { directiveClass: [{
-                type: HostBinding,
-                args: ['class']
+class CardTitleDirective {
+    constructor() {
+        this.directiveClass = 'card-title';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: CardTitleDirective, selector: "abp-card-title, [abp-card-title], [abpCardTitle]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardTitleDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `abp-card-title, [abp-card-title], [abpCardTitle]`,
+                }]
+        }], propDecorators: { directiveClass: [{
+                type: HostBinding,
+                args: ['class']
             }] } });
 
-class CardSubtitleDirective {
-    constructor() {
-        this.directiveClass = 'card-subtitle';
-    }
-}
-CardSubtitleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-CardSubtitleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: CardSubtitleDirective, selector: "abp-card-subtitle, [abp-card-subtitle], [abpCardSubtitle]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardSubtitleDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: `abp-card-subtitle, [abp-card-subtitle], [abpCardSubtitle]`,
-                }]
-        }], propDecorators: { directiveClass: [{
-                type: HostBinding,
-                args: ['class']
+class CardSubtitleDirective {
+    constructor() {
+        this.directiveClass = 'card-subtitle';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: CardSubtitleDirective, selector: "abp-card-subtitle, [abp-card-subtitle], [abpCardSubtitle]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardSubtitleDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `abp-card-subtitle, [abp-card-subtitle], [abpCardSubtitle]`,
+                }]
+        }], propDecorators: { directiveClass: [{
+                type: HostBinding,
+                args: ['class']
             }] } });
 
-class CardImgTopDirective {
-    constructor() {
-        this.directiveClass = 'card-img-top';
-    }
-}
-CardImgTopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardImgTopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-CardImgTopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: CardImgTopDirective, selector: "abp-card-img-top, [abp-card-img-top], [abpCardImgTop]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardImgTopDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: `abp-card-img-top, [abp-card-img-top], [abpCardImgTop]`,
-                }]
-        }], propDecorators: { directiveClass: [{
-                type: HostBinding,
-                args: ['class']
+class CardImgTopDirective {
+    constructor() {
+        this.directiveClass = 'card-img-top';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardImgTopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: CardImgTopDirective, selector: "abp-card-img-top, [abp-card-img-top], [abpCardImgTop]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardImgTopDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `abp-card-img-top, [abp-card-img-top], [abpCardImgTop]`,
+                }]
+        }], propDecorators: { directiveClass: [{
+                type: HostBinding,
+                args: ['class']
             }] } });
 
-class CardHeaderDirective {
-    constructor() {
-        this.directiveClass = 'card-header';
-    }
-}
-CardHeaderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-CardHeaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: CardHeaderDirective, selector: "abp-card-header, [abp-card-header], [abpCardHeader]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardHeaderDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: `abp-card-header, [abp-card-header], [abpCardHeader]`,
-                }]
-        }], propDecorators: { directiveClass: [{
-                type: HostBinding,
-                args: ['class']
+class CardHeaderDirective {
+    constructor() {
+        this.directiveClass = 'card-header';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: CardHeaderDirective, selector: "abp-card-header, [abp-card-header], [abpCardHeader]", host: { properties: { "class": "this.directiveClass" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardHeaderDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `abp-card-header, [abp-card-header], [abpCardHeader]`,
+                }]
+        }], propDecorators: { directiveClass: [{
+                type: HostBinding,
+                args: ['class']
             }] } });
 
-const declarationsWithExports$1 = [
-    CardComponent,
-    CardBodyComponent,
-    CardHeaderComponent,
-    CardFooterComponent,
-    CardTitleDirective,
-    CardSubtitleDirective,
-    CardImgTopDirective,
-    CardHeaderDirective,
-];
-class CardModule {
-}
-CardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: CardModule, declarations: [CardComponent,
-        CardBodyComponent,
-        CardHeaderComponent,
-        CardFooterComponent,
-        CardTitleDirective,
-        CardSubtitleDirective,
-        CardImgTopDirective,
-        CardHeaderDirective], imports: [CommonModule], exports: [CardComponent,
-        CardBodyComponent,
-        CardHeaderComponent,
-        CardFooterComponent,
-        CardTitleDirective,
-        CardSubtitleDirective,
-        CardImgTopDirective,
-        CardHeaderDirective] });
-CardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [...declarationsWithExports$1],
-                    imports: [CommonModule],
-                    exports: [...declarationsWithExports$1],
-                }]
+const declarationsWithExports$1 = [
+    CardComponent,
+    CardBodyComponent,
+    CardHeaderComponent,
+    CardFooterComponent,
+    CardTitleDirective,
+    CardSubtitleDirective,
+    CardImgTopDirective,
+    CardHeaderDirective,
+];
+class CardModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: CardModule, declarations: [CardComponent,
+            CardBodyComponent,
+            CardHeaderComponent,
+            CardFooterComponent,
+            CardTitleDirective,
+            CardSubtitleDirective,
+            CardImgTopDirective,
+            CardHeaderDirective], imports: [CommonModule], exports: [CardComponent,
+            CardBodyComponent,
+            CardHeaderComponent,
+            CardFooterComponent,
+            CardTitleDirective,
+            CardSubtitleDirective,
+            CardImgTopDirective,
+            CardHeaderDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardModule, imports: [CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CardModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [...declarationsWithExports$1],
+                    imports: [CommonModule],
+                    exports: [...declarationsWithExports$1],
+                }]
         }] });
 
-class FormCheckboxComponent extends AbstractNgModelComponent {
-    constructor(injector) {
-        super(injector);
-        this.labelClass = 'form-check-label';
-        this.checkboxClass = 'form-check-input';
-        this.checkboxReadonly = false;
-        this.checkboxBlur = new EventEmitter();
-        this.checkboxFocus = new EventEmitter();
-    }
-}
-FormCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: FormCheckboxComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
-FormCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: FormCheckboxComponent, selector: "abp-checkbox", inputs: { label: "label", labelClass: "labelClass", checkboxId: "checkboxId", checkboxStyle: "checkboxStyle", checkboxClass: "checkboxClass", checkboxReadonly: "checkboxReadonly" }, outputs: { checkboxBlur: "checkboxBlur", checkboxFocus: "checkboxFocus" }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => FormCheckboxComponent),
-            multi: true,
-        },
-    ], usesInheritance: true, ngImport: i0, template: `
+class FormCheckboxComponent extends AbstractNgModelComponent {
+    constructor(injector) {
+        super(injector);
+        this.labelClass = 'form-check-label';
+        this.checkboxClass = 'form-check-input';
+        this.checkboxReadonly = false;
+        this.checkboxBlur = new EventEmitter();
+        this.checkboxFocus = new EventEmitter();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: FormCheckboxComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: FormCheckboxComponent, selector: "abp-checkbox", inputs: { label: "label", labelClass: "labelClass", checkboxId: "checkboxId", checkboxStyle: "checkboxStyle", checkboxClass: "checkboxClass", checkboxReadonly: "checkboxReadonly" }, outputs: { checkboxBlur: "checkboxBlur", checkboxFocus: "checkboxFocus" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => FormCheckboxComponent),
+                multi: true,
+            },
+        ], usesInheritance: true, ngImport: i0, template: `
     <div class="mb-3">
       <input
         type="checkbox"
@@ -1192,11 +1191,12 @@ FormCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
         {{ label | abpLocalization }}
       </label>
     </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: FormCheckboxComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'abp-checkbox',
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: FormCheckboxComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'abp-checkbox',
                     template: `
     <div class="mb-3">
       <input
@@ -1213,53 +1213,52 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
         {{ label | abpLocalization }}
       </label>
     </div>
-  `,
-                    providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => FormCheckboxComponent),
-                            multi: true,
-                        },
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { label: [{
-                type: Input
-            }], labelClass: [{
-                type: Input
-            }], checkboxId: [{
-                type: Input
-            }], checkboxStyle: [{
-                type: Input
-            }], checkboxClass: [{
-                type: Input
-            }], checkboxReadonly: [{
-                type: Input
-            }], checkboxBlur: [{
-                type: Output
-            }], checkboxFocus: [{
-                type: Output
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => FormCheckboxComponent),
+                            multi: true,
+                        },
+                    ],
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { label: [{
+                type: Input
+            }], labelClass: [{
+                type: Input
+            }], checkboxId: [{
+                type: Input
+            }], checkboxStyle: [{
+                type: Input
+            }], checkboxClass: [{
+                type: Input
+            }], checkboxReadonly: [{
+                type: Input
+            }], checkboxBlur: [{
+                type: Output
+            }], checkboxFocus: [{
+                type: Output
             }] } });
 
-class FormInputComponent extends AbstractNgModelComponent {
-    constructor(injector) {
-        super(injector);
-        this.inputReadonly = false;
-        this.label = '';
-        this.labelClass = 'form-label';
-        this.inputPlaceholder = '';
-        this.inputClass = 'form-control';
-        this.formBlur = new EventEmitter();
-        this.formFocus = new EventEmitter();
-    }
-}
-FormInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: FormInputComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
-FormInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: FormInputComponent, selector: "abp-form-input", inputs: { inputId: "inputId", inputReadonly: "inputReadonly", label: "label", labelClass: "labelClass", inputPlaceholder: "inputPlaceholder", inputStyle: "inputStyle", inputClass: "inputClass" }, outputs: { formBlur: "formBlur", formFocus: "formFocus" }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => FormInputComponent),
-            multi: true,
-        },
-    ], usesInheritance: true, ngImport: i0, template: `
+class FormInputComponent extends AbstractNgModelComponent {
+    constructor(injector) {
+        super(injector);
+        this.inputReadonly = false;
+        this.label = '';
+        this.labelClass = 'form-label';
+        this.inputPlaceholder = '';
+        this.inputClass = 'form-control';
+        this.formBlur = new EventEmitter();
+        this.formFocus = new EventEmitter();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: FormInputComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: FormInputComponent, selector: "abp-form-input", inputs: { inputId: "inputId", inputReadonly: "inputReadonly", label: "label", labelClass: "labelClass", inputPlaceholder: "inputPlaceholder", inputStyle: "inputStyle", inputClass: "inputClass" }, outputs: { formBlur: "formBlur", formFocus: "formFocus" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => FormInputComponent),
+                multi: true,
+            },
+        ], usesInheritance: true, ngImport: i0, template: `
     <div class="mb-3">
       <label *ngIf="label" [ngClass]="labelClass" [for]="inputId">
         {{ label | abpLocalization }}
@@ -1276,11 +1275,12 @@ FormInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
         [(ngModel)]="value"
       />
     </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: FormInputComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'abp-form-input',
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i2.LocalizationPipe, name: "abpLocalization" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: FormInputComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'abp-form-input',
                     template: `
     <div class="mb-3">
       <label *ngIf="label" [ngClass]="labelClass" [for]="inputId">
@@ -1298,981 +1298,983 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
         [(ngModel)]="value"
       />
     </div>
-  `,
-                    providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => FormInputComponent),
-                            multi: true,
-                        },
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { inputId: [{
-                type: Input
-            }], inputReadonly: [{
-                type: Input
-            }], label: [{
-                type: Input
-            }], labelClass: [{
-                type: Input
-            }], inputPlaceholder: [{
-                type: Input
-            }], inputStyle: [{
-                type: Input
-            }], inputClass: [{
-                type: Input
-            }], formBlur: [{
-                type: Output
-            }], formFocus: [{
-                type: Output
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => FormInputComponent),
+                            multi: true,
+                        },
+                    ],
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { inputId: [{
+                type: Input
+            }], inputReadonly: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], labelClass: [{
+                type: Input
+            }], inputPlaceholder: [{
+                type: Input
+            }], inputStyle: [{
+                type: Input
+            }], inputClass: [{
+                type: Input
+            }], formBlur: [{
+                type: Output
+            }], formFocus: [{
+                type: Output
             }] } });
 
-const DEFAULT_VALIDATION_BLUEPRINTS = {
-    creditCard: 'AbpValidation::ThisFieldIsNotAValidCreditCardNumber.',
-    email: 'AbpValidation::ThisFieldIsNotAValidEmailAddress.',
-    invalid: 'AbpValidation::ThisFieldIsNotValid.',
-    max: 'AbpValidation::ThisFieldMustBeLessOrEqual{0}[{{ max }}]',
-    maxlength: 'AbpValidation::ThisFieldMustBeAStringOrArrayTypeWithAMaximumLengthOf{0}[{{ requiredLength }}]',
-    min: 'AbpValidation::ThisFieldMustBeGreaterThanOrEqual{0}[{{ min }}]',
-    minlength: 'AbpValidation::ThisFieldMustBeAStringOrArrayTypeWithAMinimumLengthOf{0}[{{ requiredLength }}]',
-    ngbDate: 'AbpValidation::ThisFieldIsNotValid.',
-    passwordMismatch: 'AbpIdentity::Volo.Abp.Identity:PasswordConfirmationFailed',
-    range: 'AbpValidation::ThisFieldMustBeBetween{0}And{1}[{{ min }},{{ max }}]',
-    required: 'AbpValidation::ThisFieldIsRequired.',
-    url: 'AbpValidation::ThisFieldIsNotAValidFullyQualifiedHttpHttpsOrFtpUrl',
-    passwordRequiresLower: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresLower',
-    passwordRequiresUpper: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresUpper',
-    passwordRequiresDigit: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresDigit',
-    passwordRequiresNonAlphanumeric: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresNonAlphanumeric',
-    usernamePattern: 'AbpIdentity::Volo.Abp.Identity:InvalidUserName[{{ actualValue }}]',
+const DEFAULT_VALIDATION_BLUEPRINTS = {
+    creditCard: 'AbpValidation::ThisFieldIsNotAValidCreditCardNumber.',
+    email: 'AbpValidation::ThisFieldIsNotAValidEmailAddress.',
+    invalid: 'AbpValidation::ThisFieldIsNotValid.',
+    max: 'AbpValidation::ThisFieldMustBeLessOrEqual{0}[{{ max }}]',
+    maxlength: 'AbpValidation::ThisFieldMustBeAStringOrArrayTypeWithAMaximumLengthOf{0}[{{ requiredLength }}]',
+    min: 'AbpValidation::ThisFieldMustBeGreaterThanOrEqual{0}[{{ min }}]',
+    minlength: 'AbpValidation::ThisFieldMustBeAStringOrArrayTypeWithAMinimumLengthOf{0}[{{ requiredLength }}]',
+    ngbDate: 'AbpValidation::ThisFieldIsNotValid.',
+    passwordMismatch: 'AbpIdentity::Volo.Abp.Identity:PasswordConfirmationFailed',
+    range: 'AbpValidation::ThisFieldMustBeBetween{0}And{1}[{{ min }},{{ max }}]',
+    required: 'AbpValidation::ThisFieldIsRequired.',
+    url: 'AbpValidation::ThisFieldIsNotAValidFullyQualifiedHttpHttpsOrFtpUrl',
+    passwordRequiresLower: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresLower',
+    passwordRequiresUpper: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresUpper',
+    passwordRequiresDigit: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresDigit',
+    passwordRequiresNonAlphanumeric: 'AbpIdentity::Volo.Abp.Identity:PasswordRequiresNonAlphanumeric',
+    usernamePattern: 'AbpIdentity::Volo.Abp.Identity:InvalidUserName[{{ actualValue }}]',
 };
 
-class EllipsisDirective {
-    constructor(cdRef, elRef) {
-        this.cdRef = cdRef;
-        this.elRef = elRef;
-        this.enabled = true;
-    }
-    get inlineClass() {
-        return this.enabled && this.width;
-    }
-    get class() {
-        return this.enabled && !this.width;
-    }
-    get maxWidth() {
-        return this.enabled && this.width ? this.width || '170px' : undefined;
-    }
-    ngAfterViewInit() {
-        this.title = this.title || this.elRef.nativeElement.innerText;
-        this.cdRef.detectChanges();
-    }
-}
-EllipsisDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EllipsisDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-EllipsisDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", 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: "15.0.4", ngImport: i0, type: EllipsisDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[abpEllipsis]',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { width: [{
-                type: Input,
-                args: ['abpEllipsis']
-            }], title: [{
-                type: HostBinding,
-                args: ['title']
-            }, {
-                type: Input
-            }], enabled: [{
-                type: Input,
-                args: ['abpEllipsisEnabled']
-            }], inlineClass: [{
-                type: HostBinding,
-                args: ['class.abp-ellipsis-inline']
-            }], class: [{
-                type: HostBinding,
-                args: ['class.abp-ellipsis']
-            }], maxWidth: [{
-                type: HostBinding,
-                args: ['style.max-width']
-            }] } });
-class EllipsisModule {
-}
-EllipsisModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EllipsisModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-EllipsisModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: EllipsisModule, declarations: [EllipsisDirective], exports: [EllipsisDirective] });
-EllipsisModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EllipsisModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EllipsisModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [EllipsisDirective],
-                    declarations: [EllipsisDirective],
-                }]
+class EllipsisDirective {
+    get inlineClass() {
+        return this.enabled && this.width;
+    }
+    get class() {
+        return this.enabled && !this.width;
+    }
+    get maxWidth() {
+        return this.enabled && this.width ? this.width || '170px' : undefined;
+    }
+    constructor(cdRef, elRef) {
+        this.cdRef = cdRef;
+        this.elRef = elRef;
+        this.enabled = true;
+    }
+    ngAfterViewInit() {
+        this.title = this.title || this.elRef.nativeElement.innerText;
+        this.cdRef.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: EllipsisDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", 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: "16.0.1", ngImport: i0, type: EllipsisDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[abpEllipsis]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { width: [{
+                type: Input,
+                args: ['abpEllipsis']
+            }], title: [{
+                type: HostBinding,
+                args: ['title']
+            }, {
+                type: Input
+            }], enabled: [{
+                type: Input,
+                args: ['abpEllipsisEnabled']
+            }], inlineClass: [{
+                type: HostBinding,
+                args: ['class.abp-ellipsis-inline']
+            }], class: [{
+                type: HostBinding,
+                args: ['class.abp-ellipsis']
+            }], maxWidth: [{
+                type: HostBinding,
+                args: ['style.max-width']
+            }] } });
+class EllipsisModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: EllipsisModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: EllipsisModule, declarations: [EllipsisDirective], exports: [EllipsisDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: EllipsisModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: EllipsisModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    exports: [EllipsisDirective],
+                    declarations: [EllipsisDirective],
+                }]
         }] });
 
-class LoadingDirective {
-    constructor(elRef, vcRef, cdRes, injector, renderer) {
-        this.elRef = elRef;
-        this.vcRef = vcRef;
-        this.cdRes = cdRes;
-        this.injector = injector;
-        this.renderer = renderer;
-        this.position = 'relative';
-        this.delay = 0;
-        this.rootNode = null;
-        this.timerSubscription = null;
-    }
-    get loading() {
-        return this._loading;
-    }
-    set loading(newValue) {
-        setTimeout(() => {
-            if (!newValue && this.timerSubscription) {
-                this.timerSubscription.unsubscribe();
-                this.timerSubscription = null;
-                this._loading = newValue;
-                if (this.rootNode) {
-                    this.renderer.removeChild(this.rootNode.parentElement, this.rootNode);
-                    this.rootNode = null;
-                }
-                return;
-            }
-            this.timerSubscription = timer(this.delay)
-                .pipe(take(1))
-                .subscribe(() => {
-                if (!this.componentRef) {
-                    this.componentRef = this.cdRes
-                        .resolveComponentFactory(LoadingComponent)
-                        .create(this.injector);
-                }
-                if (newValue && !this.rootNode) {
-                    this.rootNode = this.componentRef.hostView.rootNodes[0];
-                    this.targetElement?.appendChild(this.rootNode);
-                }
-                else if (this.rootNode) {
-                    this.renderer.removeChild(this.rootNode.parentElement, this.rootNode);
-                    this.rootNode = null;
-                }
-                this._loading = newValue;
-                this.timerSubscription = null;
-            });
-        }, 0);
-    }
-    ngOnInit() {
-        if (!this.targetElement) {
-            const { offsetHeight, offsetWidth } = this.elRef.nativeElement;
-            if (!offsetHeight && !offsetWidth && this.elRef.nativeElement.children.length) {
-                this.targetElement = this.elRef.nativeElement.children[0];
-            }
-            else {
-                this.targetElement = this.elRef.nativeElement;
-            }
-        }
-    }
-    ngOnDestroy() {
-        if (this.timerSubscription) {
-            this.timerSubscription.unsubscribe();
-        }
-    }
-}
-LoadingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", 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: "14.0.0", version: "15.0.4", 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: "15.0.4", 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: [{
-                type: HostBinding,
-                args: ['style.position']
-            }], loading: [{
-                type: Input,
-                args: ['abpLoading']
-            }], targetElement: [{
-                type: Input,
-                args: ['abpLoadingTargetElement']
-            }], delay: [{
-                type: Input,
-                args: ['abpLoadingDelay']
+class LoadingDirective {
+    get loading() {
+        return this._loading;
+    }
+    set loading(newValue) {
+        setTimeout(() => {
+            if (!newValue && this.timerSubscription) {
+                this.timerSubscription.unsubscribe();
+                this.timerSubscription = null;
+                this._loading = newValue;
+                if (this.rootNode) {
+                    this.renderer.removeChild(this.rootNode.parentElement, this.rootNode);
+                    this.rootNode = null;
+                }
+                return;
+            }
+            this.timerSubscription = timer(this.delay)
+                .pipe(take(1))
+                .subscribe(() => {
+                if (!this.componentRef) {
+                    this.componentRef = this.cdRes
+                        .resolveComponentFactory(LoadingComponent)
+                        .create(this.injector);
+                }
+                if (newValue && !this.rootNode) {
+                    this.rootNode = this.componentRef.hostView.rootNodes[0];
+                    this.targetElement?.appendChild(this.rootNode);
+                }
+                else if (this.rootNode) {
+                    this.renderer.removeChild(this.rootNode.parentElement, this.rootNode);
+                    this.rootNode = null;
+                }
+                this._loading = newValue;
+                this.timerSubscription = null;
+            });
+        }, 0);
+    }
+    constructor(elRef, vcRef, cdRes, injector, renderer) {
+        this.elRef = elRef;
+        this.vcRef = vcRef;
+        this.cdRes = cdRes;
+        this.injector = injector;
+        this.renderer = renderer;
+        this.position = 'relative';
+        this.delay = 0;
+        this.rootNode = null;
+        this.timerSubscription = null;
+    }
+    ngOnInit() {
+        if (!this.targetElement) {
+            const { offsetHeight, offsetWidth } = this.elRef.nativeElement;
+            if (!offsetHeight && !offsetWidth && this.elRef.nativeElement.children.length) {
+                this.targetElement = this.elRef.nativeElement.children[0];
+            }
+            else {
+                this.targetElement = this.elRef.nativeElement;
+            }
+        }
+    }
+    ngOnDestroy() {
+        if (this.timerSubscription) {
+            this.timerSubscription.unsubscribe();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: LoadingDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", 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: "16.0.1", 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: [{
+                type: HostBinding,
+                args: ['style.position']
+            }], loading: [{
+                type: Input,
+                args: ['abpLoading']
+            }], targetElement: [{
+                type: Input,
+                args: ['abpLoadingTargetElement']
+            }], delay: [{
+                type: Input,
+                args: ['abpLoadingDelay']
             }] } });
 
-class NgxDatatableDefaultDirective {
-    constructor(table, document) {
-        this.table = table;
-        this.document = document;
-        this.subscription = new Subscription();
-        this.resizeDiff = 0;
-        this.class = 'material bordered';
-        this.table.columnMode = ColumnMode.force;
-        this.table.footerHeight = 50;
-        this.table.headerHeight = 50;
-        this.table.rowHeight = 'auto';
-        this.table.scrollbarH = true;
-        this.table.virtualization = false;
-    }
-    get classes() {
-        return `ngx-datatable ${this.class}`;
-    }
-    fixHorizontalGap(scroller) {
-        const { body, documentElement } = this.document;
-        if (documentElement.scrollHeight !== documentElement.clientHeight) {
-            if (this.resizeDiff === 0) {
-                this.resizeDiff = window.innerWidth - body.offsetWidth;
-                scroller.scrollWidth -= this.resizeDiff;
-            }
-        }
-        else {
-            scroller.scrollWidth += this.resizeDiff;
-            this.resizeDiff = 0;
-        }
-    }
-    fixStyleOnWindowResize() {
-        // avoided @HostListener('window:resize') in favor of performance
-        const subscription = fromEvent(window, 'resize')
-            .pipe(debounceTime(500))
-            .subscribe(() => {
-            const { scroller } = this.table.bodyComponent;
-            if (!scroller)
-                return;
-            this.fixHorizontalGap(scroller);
-        });
-        this.subscription.add(subscription);
-    }
-    ngAfterViewInit() {
-        this.fixStyleOnWindowResize();
-    }
-    ngOnDestroy() {
-        this.subscription.unsubscribe();
-    }
-}
-NgxDatatableDefaultDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NgxDatatableDefaultDirective, deps: [{ token: i1$2.DatatableComponent }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
-NgxDatatableDefaultDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", 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: "15.0.4", ngImport: i0, type: NgxDatatableDefaultDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/directive-selector
-                    selector: 'ngx-datatable[default]',
-                    exportAs: 'ngxDatatableDefault',
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.DatatableComponent }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }]; }, propDecorators: { class: [{
-                type: Input
-            }], classes: [{
-                type: HostBinding,
-                args: ['class']
+class NgxDatatableDefaultDirective {
+    get classes() {
+        return `ngx-datatable ${this.class}`;
+    }
+    constructor(table, document) {
+        this.table = table;
+        this.document = document;
+        this.subscription = new Subscription();
+        this.resizeDiff = 0;
+        this.class = 'material bordered';
+        this.table.columnMode = ColumnMode.force;
+        this.table.footerHeight = 50;
+        this.table.headerHeight = 50;
+        this.table.rowHeight = 'auto';
+        this.table.scrollbarH = true;
+        this.table.virtualization = false;
+    }
+    fixHorizontalGap(scroller) {
+        const { body, documentElement } = this.document;
+        if (documentElement.scrollHeight !== documentElement.clientHeight) {
+            if (this.resizeDiff === 0) {
+                this.resizeDiff = window.innerWidth - body.offsetWidth;
+                scroller.scrollWidth -= this.resizeDiff;
+            }
+        }
+        else {
+            scroller.scrollWidth += this.resizeDiff;
+            this.resizeDiff = 0;
+        }
+    }
+    fixStyleOnWindowResize() {
+        // avoided @HostListener('window:resize') in favor of performance
+        const subscription = fromEvent(window, 'resize')
+            .pipe(debounceTime(500))
+            .subscribe(() => {
+            const { scroller } = this.table.bodyComponent;
+            if (!scroller)
+                return;
+            this.fixHorizontalGap(scroller);
+        });
+        this.subscription.add(subscription);
+    }
+    ngAfterViewInit() {
+        this.fixStyleOnWindowResize();
+    }
+    ngOnDestroy() {
+        this.subscription.unsubscribe();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NgxDatatableDefaultDirective, deps: [{ token: i1$2.DatatableComponent }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", 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: "16.0.1", ngImport: i0, type: NgxDatatableDefaultDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'ngx-datatable[default]',
+                    exportAs: 'ngxDatatableDefault',
+                }]
+        }], ctorParameters: function () { return [{ type: i1$2.DatatableComponent }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }]; }, propDecorators: { class: [{
+                type: Input
+            }], classes: [{
+                type: HostBinding,
+                args: ['class']
             }] } });
 
-const defaultNgxDatatableMessages = {
-    emptyMessage: 'AbpUi::NoDataAvailableInDatatable',
-    totalMessage: 'AbpUi::Total',
-    selectedMessage: 'AbpUi::Selected',
-};
+const defaultNgxDatatableMessages = {
+    emptyMessage: 'AbpUi::NoDataAvailableInDatatable',
+    totalMessage: 'AbpUi::Total',
+    selectedMessage: 'AbpUi::Selected',
+};
 const NGX_DATATABLE_MESSAGES = new InjectionToken('NGX_DATATABLE_MESSAGES');
 
-class NgxDatatableListDirective {
-    constructor(table, cdRef, localizationService, ngxDatatableMessages) {
-        this.table = table;
-        this.cdRef = cdRef;
-        this.localizationService = localizationService;
-        this.ngxDatatableMessages = ngxDatatableMessages;
-        this.subscription = new Subscription();
-        this.querySubscription = new Subscription();
-        this.setInitialValues();
-    }
-    setInitialValues() {
-        this.table.externalPaging = true;
-        this.table.externalSorting = true;
-        const { emptyMessage, selectedMessage, totalMessage } = this.ngxDatatableMessages || defaultNgxDatatableMessages;
-        this.table.messages = {
-            emptyMessage: this.localizationService.instant(emptyMessage),
-            totalMessage: this.localizationService.instant(totalMessage),
-            selectedMessage: this.localizationService.instant(selectedMessage),
-        };
-    }
-    subscribeToPage() {
-        const sub = this.table.page.subscribe(({ offset }) => {
-            this.list.page = offset;
-            this.table.offset = offset;
-        });
-        this.subscription.add(sub);
-    }
-    subscribeToSort() {
-        const sub = this.table.sort.subscribe(({ sorts: [{ prop, dir }] }) => {
-            if (prop === this.list.sortKey && this.list.sortOrder === 'desc') {
-                this.list.sortKey = '';
-                this.list.sortOrder = '';
-                this.table.sorts = [];
-                this.cdRef.detectChanges();
-            }
-            else {
-                this.list.sortKey = prop;
-                this.list.sortOrder = dir;
-            }
-        });
-        this.subscription.add(sub);
-    }
-    subscribeToQuery() {
-        if (!this.querySubscription.closed)
-            this.querySubscription.unsubscribe();
-        this.querySubscription = this.list.query$.subscribe(() => {
-            const offset = this.list.page;
-            if (this.table.offset !== offset)
-                this.table.offset = offset;
-        });
-    }
-    ngOnChanges({ list }) {
-        this.subscribeToQuery();
-        if (!list.firstChange)
-            return;
-        const { maxResultCount, page } = list.currentValue;
-        this.table.limit = maxResultCount;
-        this.table.offset = page;
-    }
-    ngOnDestroy() {
-        this.subscription.unsubscribe();
-        this.querySubscription.unsubscribe();
-    }
-    ngOnInit() {
-        this.subscribeToPage();
-        this.subscribeToSort();
-    }
-}
-NgxDatatableListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", 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: "14.0.0", version: "15.0.4", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: { list: "list" }, exportAs: ["ngxDatatableList"], usesOnChanges: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NgxDatatableListDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/directive-selector
-                    selector: 'ngx-datatable[list]',
-                    exportAs: 'ngxDatatableList',
-                }]
-        }], ctorParameters: function () { return [{ type: i1$2.DatatableComponent }, { type: i0.ChangeDetectorRef }, { type: i2.LocalizationService }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [NGX_DATATABLE_MESSAGES]
-                }] }]; }, propDecorators: { list: [{
-                type: Input
+class NgxDatatableListDirective {
+    constructor(table, cdRef, localizationService, ngxDatatableMessages) {
+        this.table = table;
+        this.cdRef = cdRef;
+        this.localizationService = localizationService;
+        this.ngxDatatableMessages = ngxDatatableMessages;
+        this.subscription = new Subscription();
+        this.querySubscription = new Subscription();
+        this.setInitialValues();
+    }
+    setInitialValues() {
+        this.table.externalPaging = true;
+        this.table.externalSorting = true;
+        const { emptyMessage, selectedMessage, totalMessage } = this.ngxDatatableMessages || defaultNgxDatatableMessages;
+        this.table.messages = {
+            emptyMessage: this.localizationService.instant(emptyMessage),
+            totalMessage: this.localizationService.instant(totalMessage),
+            selectedMessage: this.localizationService.instant(selectedMessage),
+        };
+    }
+    subscribeToPage() {
+        const sub = this.table.page.subscribe(({ offset }) => {
+            this.list.page = offset;
+            this.table.offset = offset;
+        });
+        this.subscription.add(sub);
+    }
+    subscribeToSort() {
+        const sub = this.table.sort.subscribe(({ sorts: [{ prop, dir }] }) => {
+            if (prop === this.list.sortKey && this.list.sortOrder === 'desc') {
+                this.list.sortKey = '';
+                this.list.sortOrder = '';
+                this.table.sorts = [];
+                this.cdRef.detectChanges();
+            }
+            else {
+                this.list.sortKey = prop;
+                this.list.sortOrder = dir;
+            }
+        });
+        this.subscription.add(sub);
+    }
+    subscribeToQuery() {
+        if (!this.querySubscription.closed)
+            this.querySubscription.unsubscribe();
+        this.querySubscription = this.list.query$.subscribe(() => {
+            const offset = this.list.page;
+            if (this.table.offset !== offset)
+                this.table.offset = offset;
+        });
+    }
+    ngOnChanges({ list }) {
+        this.subscribeToQuery();
+        if (!list.firstChange)
+            return;
+        const { maxResultCount, page } = list.currentValue;
+        this.table.limit = maxResultCount;
+        this.table.offset = page;
+    }
+    ngOnDestroy() {
+        this.subscription.unsubscribe();
+        this.querySubscription.unsubscribe();
+    }
+    ngOnInit() {
+        this.subscribeToPage();
+        this.subscribeToSort();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", 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 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: { list: "list" }, exportAs: ["ngxDatatableList"], usesOnChanges: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NgxDatatableListDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'ngx-datatable[list]',
+                    exportAs: 'ngxDatatableList',
+                }]
+        }], ctorParameters: function () { return [{ type: i1$2.DatatableComponent }, { type: i0.ChangeDetectorRef }, { type: i2.LocalizationService }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [NGX_DATATABLE_MESSAGES]
+                }] }]; }, propDecorators: { list: [{
+                type: Input
             }] } });
 
-class AbpVisibleDirective {
-    constructor(viewContainerRef, templateRef) {
-        this.viewContainerRef = viewContainerRef;
-        this.templateRef = templateRef;
-        this.condition$ = of(false);
-    }
-    set abpVisible(value) {
-        this.condition$ = checkType(value);
-        this.subscribeToCondition();
-    }
-    ngOnInit() {
-        this.updateVisibility();
-    }
-    ngOnDestroy() {
-        this.conditionSubscription?.unsubscribe();
-    }
-    subscribeToCondition() {
-        this.conditionSubscription = this.condition$.subscribe(value => {
-            this.isVisible = value;
-            this.updateVisibility();
-        });
-    }
-    updateVisibility() {
-        this.viewContainerRef.clear();
-        // it should be false not falsy
-        if (this.isVisible === false) {
-            return;
-        }
-        this.viewContainerRef.createEmbeddedView(this.templateRef);
-    }
-}
-AbpVisibleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AbpVisibleDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-AbpVisibleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: AbpVisibleDirective, selector: "[abpVisible]", inputs: { abpVisible: "abpVisible" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AbpVisibleDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[abpVisible]',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }]; }, propDecorators: { abpVisible: [{
-                type: Input
-            }] } });
-function checkType(value) {
-    if (value instanceof Promise) {
-        return from(value);
-    }
-    else if (value instanceof Observable) {
-        return value;
-    }
-    else if (typeof value === 'boolean') {
-        return of(value);
-    }
-    else if (value === undefined || value === null) {
-        return of(true);
-    }
-    else {
-        return EMPTY;
-    }
+class AbpVisibleDirective {
+    set abpVisible(value) {
+        this.condition$ = checkType(value);
+        this.subscribeToCondition();
+    }
+    constructor(viewContainerRef, templateRef) {
+        this.viewContainerRef = viewContainerRef;
+        this.templateRef = templateRef;
+        this.condition$ = of(false);
+    }
+    ngOnInit() {
+        this.updateVisibility();
+    }
+    ngOnDestroy() {
+        this.conditionSubscription?.unsubscribe();
+    }
+    subscribeToCondition() {
+        this.conditionSubscription = this.condition$.subscribe(value => {
+            this.isVisible = value;
+            this.updateVisibility();
+        });
+    }
+    updateVisibility() {
+        this.viewContainerRef.clear();
+        // it should be false not falsy
+        if (this.isVisible === false) {
+            return;
+        }
+        this.viewContainerRef.createEmbeddedView(this.templateRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AbpVisibleDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: AbpVisibleDirective, selector: "[abpVisible]", inputs: { abpVisible: "abpVisible" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AbpVisibleDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[abpVisible]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }]; }, propDecorators: { abpVisible: [{
+                type: Input
+            }] } });
+function checkType(value) {
+    if (value instanceof Promise) {
+        return from(value);
+    }
+    else if (value instanceof Observable) {
+        return value;
+    }
+    else if (typeof value === 'boolean') {
+        return of(value);
+    }
+    else if (value === undefined || value === null) {
+        return of(true);
+    }
+    else {
+        return EMPTY;
+    }
 }
 
-var eFormComponets;
-(function (eFormComponets) {
-    eFormComponets["FormInputComponent"] = "FormInputComponent";
-    eFormComponets["FormCheckboxComponent"] = "FormCheckboxComponent";
+var eFormComponets;
+(function (eFormComponets) {
+    eFormComponets["FormInputComponent"] = "FormInputComponent";
+    eFormComponets["FormCheckboxComponent"] = "FormCheckboxComponent";
 })(eFormComponets || (eFormComponets = {}));
 
-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.currentLang$.pipe(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: "15.0.4", ngImport: i0, type: DocumentDirHandlerService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
-DocumentDirHandlerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DocumentDirHandlerService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DocumentDirHandlerService, decorators: [{
-            type: Injectable
+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.currentLang$.pipe(map(locale => getLocaleDirection(locale))).subscribe(dir => {
+            this.dir.next(dir);
+            this.setBodyDir(dir);
+        });
+    }
+    setBodyDir(dir) {
+        document.body.dir = dir;
+        document.dir = dir;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: DocumentDirHandlerService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: DocumentDirHandlerService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", 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];
-    }
-    return {
-        skipHandledErrorCodes: [],
-        errorScreen: {},
-        ...config,
-    };
-}
-const HTTP_ERROR_CONFIG = new InjectionToken('HTTP_ERROR_CONFIG');
+function httpErrorConfigFactory(config = {}) {
+    if (config.errorScreen && config.errorScreen.component && !config.errorScreen.forWhichErrors) {
+        config.errorScreen.forWhichErrors = [401, 403, 404, 500];
+    }
+    return {
+        skipHandledErrorCodes: [],
+        errorScreen: {},
+        ...config,
+    };
+}
+const HTTP_ERROR_CONFIG = new InjectionToken('HTTP_ERROR_CONFIG');
 const HTTP_ERROR_HANDLER = new InjectionToken('HTTP_ERROR_HANDLER');
 
-const DEFAULT_ERROR_MESSAGES = {
-    defaultError: {
-        title: 'An error has occurred!',
-        details: 'Error detail not sent by server.',
-    },
-    defaultError401: {
-        title: 'You are not authenticated!',
-        details: 'You should be authenticated (sign in) in order to perform this operation.',
-    },
-    defaultError403: {
-        title: 'You are not authorized!',
-        details: 'You are not allowed to perform this operation.',
-    },
-    defaultError404: {
-        title: 'Resource not found!',
-        details: 'The resource requested could not found on the server.',
-    },
-    defaultError500: {
-        title: 'Internal server error',
-        details: 'Error detail not sent by server.',
-    },
-};
-const DEFAULT_ERROR_LOCALIZATIONS = {
-    defaultError: {
-        title: 'AbpUi::DefaultErrorMessage',
-        details: 'AbpUi::DefaultErrorMessageDetail',
-    },
-    defaultError401: {
-        title: 'AbpUi::DefaultErrorMessage401',
-        details: 'AbpUi::DefaultErrorMessage401Detail',
-    },
-    defaultError403: {
-        title: 'AbpUi::DefaultErrorMessage403',
-        details: 'AbpUi::DefaultErrorMessage403Detail',
-    },
-    defaultError404: {
-        title: 'AbpUi::DefaultErrorMessage404',
-        details: 'AbpUi::DefaultErrorMessage404Detail',
-    },
-    defaultError500: {
-        title: 'AbpUi::500Message',
-        details: 'AbpUi::DefaultErrorMessage',
-    },
-};
-class ErrorHandler {
-    constructor(injector) {
-        this.injector = injector;
-        this.componentRef = null;
-        this.httpErrorHandler = this.injector.get(HTTP_ERROR_HANDLER, (_, err) => throwError(err));
-        this.executeErrorHandler = (error) => {
-            const returnValue = this.httpErrorHandler(this.injector, error);
-            return (returnValue instanceof Observable ? returnValue : of(null)).pipe(catchError(err => {
-                this.handleError(err);
-                return of(null);
-            }));
-        };
-        this.filterRestErrors = ({ status }) => {
-            if (typeof status !== 'number')
-                return false;
-            return (!!this.httpErrorConfig.skipHandledErrorCodes &&
-                this.httpErrorConfig.skipHandledErrorCodes.findIndex(code => code === status) < 0);
-        };
-        this.filterRouteErrors = (navigationError) => {
-            return (navigationError.error?.message?.indexOf('Cannot match') > -1 &&
-                !!this.httpErrorConfig.skipHandledErrorCodes &&
-                this.httpErrorConfig.skipHandledErrorCodes.findIndex(code => code === 404) < 0);
-        };
-        this.httpErrorReporter = injector.get(HttpErrorReporterService);
-        this.routerEvents = injector.get(RouterEvents);
-        this.confirmationService = injector.get(ConfirmationService);
-        this.cfRes = injector.get(ComponentFactoryResolver);
-        this.rendererFactory = injector.get(RendererFactory2);
-        this.httpErrorConfig = injector.get('HTTP_ERROR_CONFIG');
-        this.authService = this.injector.get(AuthService);
-        this.listenToRestError();
-        this.listenToRouterError();
-        this.listenToRouterDataResolved();
-    }
-    listenToRouterError() {
-        this.routerEvents
-            .getNavigationEvents('Error')
-            .pipe(filter(this.filterRouteErrors))
-            .subscribe(() => this.show404Page());
-    }
-    listenToRouterDataResolved() {
-        this.routerEvents
-            .getEvents(ResolveEnd)
-            .pipe(filter(() => !!this.componentRef))
-            .subscribe(() => {
-            this.componentRef?.destroy();
-            this.componentRef = null;
-        });
-    }
-    listenToRestError() {
-        this.httpErrorReporter.reporter$
-            .pipe(filter(this.filterRestErrors), switchMap(this.executeErrorHandler))
-            .subscribe();
-    }
-    handleError(err) {
-        const body = err?.error?.error || {
-            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
-            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
-        };
-        if (err instanceof HttpErrorResponse && err.headers.get('_AbpErrorFormat')) {
-            const confirmation$ = this.showErrorWithRequestBody(body);
-            if (err.status === 401) {
-                confirmation$.subscribe(() => {
-                    this.navigateToLogin();
-                });
-            }
-        }
-        if (err instanceof HttpErrorResponse && err.headers.get('Abp-Tenant-Resolve-Error')) {
-            this.authService.logout().subscribe();
-        }
-        else {
-            switch (err.status) {
-                case 401:
-                    this.canCreateCustomError(401)
-                        ? this.show401Page()
-                        : this.showError({
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError401.title,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError401.title,
-                        }, {
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError401.details,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError401.details,
-                        }).subscribe(() => this.navigateToLogin());
-                    break;
-                case 403:
-                    this.createErrorComponent({
-                        title: {
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError403.title,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError403.title,
-                        },
-                        details: {
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError403.details,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError403.details,
-                        },
-                        status: 403,
-                    });
-                    break;
-                case 404: {
-                    this.canCreateCustomError(404)
-                        ? this.show404Page()
-                        : this.showError({
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError404.details,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError404.details,
-                        }, {
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError404.title,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError404.title,
-                        });
-                    break;
-                }
-                case 500:
-                    this.createErrorComponent({
-                        title: {
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError500.title,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError500.title,
-                        },
-                        details: {
-                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError500.details,
-                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError500.details,
-                        },
-                        status: 500,
-                    });
-                    break;
-                case 0:
-                    if (err.statusText === 'Unknown Error') {
-                        this.createErrorComponent({
-                            title: {
-                                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
-                                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
-                            },
-                            details: err.message,
-                            isHomeShow: false,
-                        });
-                    }
-                    break;
-                default:
-                    this.showError({
-                        key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.details,
-                        defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.details,
-                    }, {
-                        key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
-                        defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
-                    });
-                    break;
-            }
-        }
-    }
-    show401Page() {
-        this.createErrorComponent({
-            title: {
-                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError401.title,
-                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError401.title,
-            },
-            status: 401,
-        });
-    }
-    show404Page() {
-        this.createErrorComponent({
-            title: {
-                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError404.title,
-                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError404.title,
-            },
-            status: 404,
-        });
-    }
-    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',
-        });
-    }
-    navigateToLogin() {
-        this.authService.navigateToLogin();
-    }
-    createErrorComponent(instance) {
-        const renderer = this.rendererFactory.createRenderer(null, null);
-        const host = renderer.selectRootElement(document.body, true);
-        this.componentRef = this.cfRes
-            .resolveComponentFactory(HttpErrorWrapperComponent)
-            .create(this.injector);
-        for (const key in instance) {
-            /* istanbul ignore else */
-            if (Object.prototype.hasOwnProperty.call(this.componentRef.instance, key)) {
-                this.componentRef.instance[key] = instance[key];
-            }
-        }
-        this.componentRef.instance.hideCloseIcon = !!this.httpErrorConfig.errorScreen?.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;
-        }
-        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();
-            this.componentRef = null;
-        });
-    }
-    canCreateCustomError(status) {
-        return !!(this.httpErrorConfig?.errorScreen?.component &&
-            this.httpErrorConfig?.errorScreen?.forWhichErrors &&
-            this.httpErrorConfig?.errorScreen?.forWhichErrors.indexOf(status) > -1);
-    }
-}
-ErrorHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ErrorHandler, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
-ErrorHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ErrorHandler, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ErrorHandler, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
+const DEFAULT_ERROR_MESSAGES = {
+    defaultError: {
+        title: 'An error has occurred!',
+        details: 'Error detail not sent by server.',
+    },
+    defaultError401: {
+        title: 'You are not authenticated!',
+        details: 'You should be authenticated (sign in) in order to perform this operation.',
+    },
+    defaultError403: {
+        title: 'You are not authorized!',
+        details: 'You are not allowed to perform this operation.',
+    },
+    defaultError404: {
+        title: 'Resource not found!',
+        details: 'The resource requested could not found on the server.',
+    },
+    defaultError500: {
+        title: 'Internal server error',
+        details: 'Error detail not sent by server.',
+    },
+};
+const DEFAULT_ERROR_LOCALIZATIONS = {
+    defaultError: {
+        title: 'AbpUi::DefaultErrorMessage',
+        details: 'AbpUi::DefaultErrorMessageDetail',
+    },
+    defaultError401: {
+        title: 'AbpUi::DefaultErrorMessage401',
+        details: 'AbpUi::DefaultErrorMessage401Detail',
+    },
+    defaultError403: {
+        title: 'AbpUi::DefaultErrorMessage403',
+        details: 'AbpUi::DefaultErrorMessage403Detail',
+    },
+    defaultError404: {
+        title: 'AbpUi::DefaultErrorMessage404',
+        details: 'AbpUi::DefaultErrorMessage404Detail',
+    },
+    defaultError500: {
+        title: 'AbpUi::500Message',
+        details: 'AbpUi::DefaultErrorMessage',
+    },
+};
+class ErrorHandler {
+    constructor(injector) {
+        this.injector = injector;
+        this.componentRef = null;
+        this.httpErrorHandler = this.injector.get(HTTP_ERROR_HANDLER, (_, err) => throwError(err));
+        this.executeErrorHandler = (error) => {
+            const errHandler = this.httpErrorHandler(this.injector, error);
+            const isObservable = errHandler instanceof Observable;
+            const response = isObservable ? errHandler : of(null);
+            return response.pipe(catchError(err => {
+                this.handleError(err);
+                return of(null);
+            }));
+        };
+        this.filterRestErrors = ({ status }) => {
+            if (typeof status !== 'number')
+                return false;
+            return (!!this.httpErrorConfig.skipHandledErrorCodes &&
+                this.httpErrorConfig.skipHandledErrorCodes.findIndex(code => code === status) < 0);
+        };
+        this.filterRouteErrors = (navigationError) => {
+            return (navigationError.error?.message?.indexOf('Cannot match') > -1 &&
+                !!this.httpErrorConfig.skipHandledErrorCodes &&
+                this.httpErrorConfig.skipHandledErrorCodes.findIndex(code => code === 404) < 0);
+        };
+        this.httpErrorReporter = injector.get(HttpErrorReporterService);
+        this.routerEvents = injector.get(RouterEvents);
+        this.confirmationService = injector.get(ConfirmationService);
+        this.cfRes = injector.get(ComponentFactoryResolver);
+        this.rendererFactory = injector.get(RendererFactory2);
+        this.httpErrorConfig = injector.get('HTTP_ERROR_CONFIG');
+        this.authService = this.injector.get(AuthService);
+        this.listenToRestError();
+        this.listenToRouterError();
+        this.listenToRouterDataResolved();
+    }
+    listenToRouterError() {
+        this.routerEvents
+            .getNavigationEvents('Error')
+            .pipe(filter(this.filterRouteErrors))
+            .subscribe(() => this.show404Page());
+    }
+    listenToRouterDataResolved() {
+        this.routerEvents
+            .getEvents(ResolveEnd)
+            .pipe(filter(() => !!this.componentRef))
+            .subscribe(() => {
+            this.componentRef?.destroy();
+            this.componentRef = null;
+        });
+    }
+    listenToRestError() {
+        this.httpErrorReporter.reporter$
+            .pipe(filter(this.filterRestErrors), switchMap(this.executeErrorHandler))
+            .subscribe();
+    }
+    handleError(err) {
+        const body = err?.error?.error || {
+            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
+            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
+        };
+        if (err instanceof HttpErrorResponse && err.headers.get('Abp-Tenant-Resolve-Error')) {
+            this.authService.logout().subscribe();
+            return;
+        }
+        if (err instanceof HttpErrorResponse && err.headers.get('_AbpErrorFormat')) {
+            const confirmation$ = this.showErrorWithRequestBody(body);
+            if (err.status === 401) {
+                confirmation$.subscribe(() => {
+                    this.navigateToLogin();
+                });
+            }
+        }
+        else {
+            switch (err.status) {
+                case 401:
+                    this.canCreateCustomError(401)
+                        ? this.show401Page()
+                        : this.showError({
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError401.title,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError401.title,
+                        }, {
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError401.details,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError401.details,
+                        }).subscribe(() => this.navigateToLogin());
+                    break;
+                case 403:
+                    this.createErrorComponent({
+                        title: {
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError403.title,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError403.title,
+                        },
+                        details: {
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError403.details,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError403.details,
+                        },
+                        status: 403,
+                    });
+                    break;
+                case 404:
+                    this.canCreateCustomError(404)
+                        ? this.show404Page()
+                        : this.showError({
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError404.details,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError404.details,
+                        }, {
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError404.title,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError404.title,
+                        });
+                    break;
+                case 500:
+                    this.createErrorComponent({
+                        title: {
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError500.title,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError500.title,
+                        },
+                        details: {
+                            key: DEFAULT_ERROR_LOCALIZATIONS.defaultError500.details,
+                            defaultValue: DEFAULT_ERROR_MESSAGES.defaultError500.details,
+                        },
+                        status: 500,
+                    });
+                    break;
+                case 0:
+                    if (err.statusText === 'Unknown Error') {
+                        this.createErrorComponent({
+                            title: {
+                                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
+                                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
+                            },
+                            details: err.message,
+                            isHomeShow: false,
+                        });
+                    }
+                    break;
+                default:
+                    this.showError({
+                        key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.details,
+                        defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.details,
+                    }, {
+                        key: DEFAULT_ERROR_LOCALIZATIONS.defaultError.title,
+                        defaultValue: DEFAULT_ERROR_MESSAGES.defaultError.title,
+                    });
+                    break;
+            }
+        }
+    }
+    show401Page() {
+        this.createErrorComponent({
+            title: {
+                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError401.title,
+                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError401.title,
+            },
+            status: 401,
+        });
+    }
+    show404Page() {
+        this.createErrorComponent({
+            title: {
+                key: DEFAULT_ERROR_LOCALIZATIONS.defaultError404.title,
+                defaultValue: DEFAULT_ERROR_MESSAGES.defaultError404.title,
+            },
+            status: 404,
+        });
+    }
+    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',
+        });
+    }
+    navigateToLogin() {
+        this.authService.navigateToLogin();
+    }
+    createErrorComponent(instance) {
+        const renderer = this.rendererFactory.createRenderer(null, null);
+        const host = renderer.selectRootElement(document.body, true);
+        this.componentRef = this.cfRes
+            .resolveComponentFactory(HttpErrorWrapperComponent)
+            .create(this.injector);
+        for (const key in instance) {
+            /* istanbul ignore else */
+            if (Object.prototype.hasOwnProperty.call(this.componentRef.instance, key)) {
+                this.componentRef.instance[key] = instance[key];
+            }
+        }
+        this.componentRef.instance.hideCloseIcon = !!this.httpErrorConfig.errorScreen?.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;
+        }
+        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();
+            this.componentRef = null;
+        });
+    }
+    canCreateCustomError(status) {
+        return !!(this.httpErrorConfig?.errorScreen?.component &&
+            this.httpErrorConfig?.errorScreen?.forWhichErrors &&
+            this.httpErrorConfig?.errorScreen?.forWhichErrors.indexOf(status) > -1);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ErrorHandler, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ErrorHandler, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ErrorHandler, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
 
-class NavItem {
-    constructor(props) {
-        Object.assign(this, props);
-    }
+class NavItem {
+    constructor(props) {
+        Object.assign(this, props);
+    }
 }
 
-class UserMenu extends NavItem {
+class UserMenu extends NavItem {
 }
 
-const NG_BOOTSTRAP_CONFIG_PROVIDERS = [
-    {
-        provide: APP_INITIALIZER,
-        useFactory: configureNgBootstrap,
-        deps: [NgbInputDatepickerConfig, NgbTypeaheadConfig],
-        multi: true,
-    },
-];
-function configureNgBootstrap(datepicker, typeahead) {
-    return () => {
-        datepicker.container = 'body';
-        typeahead.container = 'body';
-    };
+const NG_BOOTSTRAP_CONFIG_PROVIDERS = [
+    {
+        provide: APP_INITIALIZER,
+        useFactory: configureNgBootstrap,
+        deps: [NgbInputDatepickerConfig, NgbTypeaheadConfig],
+        multi: true,
+    },
+];
+function configureNgBootstrap(datepicker, typeahead) {
+    return () => {
+        datepicker.container = 'body';
+        typeahead.container = 'body';
+    };
 }
 
-const THEME_SHARED_ROUTE_PROVIDERS = [
-    { provide: APP_INITIALIZER, useFactory: configureRoutes, deps: [RoutesService], multi: true },
-];
-function configureRoutes(routesService) {
-    return () => {
-        routesService.add([
-            {
-                path: undefined,
-                name: "AbpUiNavigation::Menu:Administration" /* eThemeSharedRouteNames.Administration */,
-                iconClass: 'fa fa-wrench',
-                order: 100,
-            },
-        ]);
-    };
+const THEME_SHARED_ROUTE_PROVIDERS = [
+    { provide: APP_INITIALIZER, useFactory: configureRoutes, deps: [RoutesService], multi: true },
+];
+function configureRoutes(routesService) {
+    return () => {
+        routesService.add([
+            {
+                path: undefined,
+                name: "AbpUiNavigation::Menu:Administration" /* eThemeSharedRouteNames.Administration */,
+                iconClass: 'fa fa-wrench',
+                order: 100,
+            },
+        ]);
+    };
 }
 
-class AbstractMenuService {
-    constructor() {
-        this._items$ = new BehaviorSubject([]);
-    }
-    get items() {
-        return this._items$.value;
-    }
-    get items$() {
-        return this._items$.asObservable();
-    }
-    addItems(newItems) {
-        const items = [...this.items];
-        newItems.forEach(item => {
-            const index = items.findIndex(i => i.id === item.id);
-            const data = new this.baseClass(item);
-            if (index > -1) {
-                items[index] = data;
-                return;
-            }
-            items.push(data);
-        });
-        items.sort(this.sortItems);
-        this._items$.next(items);
-    }
-    removeItem(id) {
-        const index = this.items.findIndex(item => item.id === id);
-        if (index < 0)
-            return;
-        const items = [...this.items.slice(0, index), ...this.items.slice(index + 1)];
-        this._items$.next(items);
-    }
-    patchItem(id, item) {
-        const index = this.items.findIndex(i => i.id === id);
-        if (index < 0)
-            return;
-        const items = [...this.items];
-        items[index] = new this.baseClass({ ...items[index], ...item });
-        items.sort(this.sortItems);
-        this._items$.next(items);
-    }
-    sortItems(a, b) {
-        if (!a.order)
-            return 1;
-        if (!b.order)
-            return -1;
-        return a.order - b.order;
-    }
+class AbstractMenuService {
+    constructor() {
+        this._items$ = new BehaviorSubject([]);
+    }
+    get items() {
+        return this._items$.value;
+    }
+    get items$() {
+        return this._items$.asObservable();
+    }
+    addItems(newItems) {
+        const items = [...this.items];
+        newItems.forEach(item => {
+            const index = items.findIndex(i => i.id === item.id);
+            const data = new this.baseClass(item);
+            if (index > -1) {
+                items[index] = data;
+                return;
+            }
+            items.push(data);
+        });
+        items.sort(this.sortItems);
+        this._items$.next(items);
+    }
+    removeItem(id) {
+        const index = this.items.findIndex(item => item.id === id);
+        if (index < 0)
+            return;
+        const items = [...this.items.slice(0, index), ...this.items.slice(index + 1)];
+        this._items$.next(items);
+    }
+    patchItem(id, item) {
+        const index = this.items.findIndex(i => i.id === id);
+        if (index < 0)
+            return;
+        const items = [...this.items];
+        items[index] = new this.baseClass({ ...items[index], ...item });
+        items.sort(this.sortItems);
+        this._items$.next(items);
+    }
+    sortItems(a, b) {
+        if (!a.order)
+            return 1;
+        if (!b.order)
+            return -1;
+        return a.order - b.order;
+    }
 }
 
-class NavItemsService extends AbstractMenuService {
-    constructor() {
-        super(...arguments);
-        this.baseClass = NavItem;
-    }
-}
-NavItemsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NavItemsService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-NavItemsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NavItemsService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NavItemsService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
+class NavItemsService extends AbstractMenuService {
+    constructor() {
+        super(...arguments);
+        this.baseClass = NavItem;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NavItemsService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NavItemsService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NavItemsService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }] });
 
-class PageAlertService {
-    constructor() {
-        this.alerts = new InternalStore([]);
-        this.alerts$ = this.alerts.sliceState(state => state);
-    }
-    show(alert) {
-        const newAlert = {
-            ...alert,
-            dismissible: alert.dismissible ?? true,
-        };
-        this.alerts.set([newAlert, ...this.alerts.state]);
-    }
-    remove(index) {
-        const alerts = [...this.alerts.state];
-        alerts.splice(index, 1);
-        this.alerts.set(alerts);
-    }
-}
-PageAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-PageAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageAlertService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageAlertService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
+class PageAlertService {
+    constructor() {
+        this.alerts = new InternalStore([]);
+        this.alerts$ = this.alerts.sliceState(state => state);
+    }
+    show(alert) {
+        const newAlert = {
+            ...alert,
+            dismissible: alert.dismissible ?? true,
+        };
+        this.alerts.set([newAlert, ...this.alerts.state]);
+    }
+    remove(index) {
+        const alerts = [...this.alerts.state];
+        alerts.splice(index, 1);
+        this.alerts.set(alerts);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: PageAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: PageAlertService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: PageAlertService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return []; } });
 
-class ToasterService {
-    constructor(contentProjectionService) {
-        this.contentProjectionService = contentProjectionService;
-        this.toasts$ = new ReplaySubject(1);
-        this.lastId = -1;
-        this.toasts = [];
-        /**
-         * Removes the toast with given id.
-         * @param id ID of the toast to be removed.
-         */
-        this.remove = (id) => {
-            this.toasts = this.toasts.filter(toast => toast.options?.id !== id);
-            this.toasts$.next(this.toasts);
-        };
-    }
-    setContainer() {
-        this.containerComponentRef = this.contentProjectionService.projectContent(PROJECTION_STRATEGY.AppendComponentToBody(ToastContainerComponent, {
-            toasts$: this.toasts$,
-            remove: this.remove,
-        }));
-        this.containerComponentRef.changeDetectorRef.detectChanges();
-    }
-    /**
-     * Creates an info toast with given parameters.
-     * @param message Content of the toast
-     * @param title Title of the toast
-     * @param options Spesific style or structural options for individual toast
-     */
-    info(message, title, options) {
-        return this.show(message, title, 'info', options);
-    }
-    /**
-     * Creates a success toast with given parameters.
-     * @param message Content of the toast
-     * @param title Title of the toast
-     * @param options Spesific style or structural options for individual toast
-     */
-    success(message, title, options) {
-        return this.show(message, title, 'success', options);
-    }
-    /**
-     * Creates a warning toast with given parameters.
-     * @param message Content of the toast
-     * @param title Title of the toast
-     * @param options Spesific style or structural options for individual toast
-     */
-    warn(message, title, options) {
-        return this.show(message, title, 'warning', options);
-    }
-    /**
-     * Creates an error toast with given parameters.
-     * @param message Content of the toast
-     * @param title Title of the toast
-     * @param options Spesific style or structural options for individual toast
-     */
-    error(message, title, options) {
-        return this.show(message, title, 'error', options);
-    }
-    /**
-     * Creates a toast with given parameters.
-     * @param message Content of the toast
-     * @param title Title of the toast
-     * @param severity Sets color of the toast. "success", "warning" etc.
-     * @param options Spesific style or structural options for individual toast
-     */
-    show(message, title = undefined, severity = 'neutral', options = {}) {
-        if (!this.containerComponentRef)
-            this.setContainer();
-        const id = ++this.lastId;
-        this.toasts.push({
-            message,
-            title,
-            severity,
-            options: { closable: true, id, ...options },
-        });
-        this.toasts$.next(this.toasts);
-        return id;
-    }
-    /**
-     * Removes all open toasts at once.
-     */
-    clear(containerKey) {
-        this.toasts = !containerKey
-            ? []
-            : this.toasts.filter(toast => toast.options?.containerKey !== containerKey);
-        this.toasts$.next(this.toasts);
-    }
-}
-ToasterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ToasterService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable });
-ToasterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ToasterService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ToasterService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
+class ToasterService {
+    constructor(contentProjectionService) {
+        this.contentProjectionService = contentProjectionService;
+        this.toasts$ = new ReplaySubject(1);
+        this.lastId = -1;
+        this.toasts = [];
+        /**
+         * Removes the toast with given id.
+         * @param id ID of the toast to be removed.
+         */
+        this.remove = (id) => {
+            this.toasts = this.toasts.filter(toast => toast.options?.id !== id);
+            this.toasts$.next(this.toasts);
+        };
+    }
+    setContainer() {
+        this.containerComponentRef = this.contentProjectionService.projectContent(PROJECTION_STRATEGY.AppendComponentToBody(ToastContainerComponent, {
+            toasts$: this.toasts$,
+            remove: this.remove,
+        }));
+        this.containerComponentRef.changeDetectorRef.detectChanges();
+    }
+    /**
+     * Creates an info toast with given parameters.
+     * @param message Content of the toast
+     * @param title Title of the toast
+     * @param options Spesific style or structural options for individual toast
+     */
+    info(message, title, options) {
+        return this.show(message, title, 'info', options);
+    }
+    /**
+     * Creates a success toast with given parameters.
+     * @param message Content of the toast
+     * @param title Title of the toast
+     * @param options Spesific style or structural options for individual toast
+     */
+    success(message, title, options) {
+        return this.show(message, title, 'success', options);
+    }
+    /**
+     * Creates a warning toast with given parameters.
+     * @param message Content of the toast
+     * @param title Title of the toast
+     * @param options Spesific style or structural options for individual toast
+     */
+    warn(message, title, options) {
+        return this.show(message, title, 'warning', options);
+    }
+    /**
+     * Creates an error toast with given parameters.
+     * @param message Content of the toast
+     * @param title Title of the toast
+     * @param options Spesific style or structural options for individual toast
+     */
+    error(message, title, options) {
+        return this.show(message, title, 'error', options);
+    }
+    /**
+     * Creates a toast with given parameters.
+     * @param message Content of the toast
+     * @param title Title of the toast
+     * @param severity Sets color of the toast. "success", "warning" etc.
+     * @param options Spesific style or structural options for individual toast
+     */
+    show(message, title = undefined, severity = 'neutral', options = {}) {
+        if (!this.containerComponentRef)
+            this.setContainer();
+        const id = ++this.lastId;
+        this.toasts.push({
+            message,
+            title,
+            severity,
+            options: { closable: true, id, ...options },
+        });
+        this.toasts$.next(this.toasts);
+        return id;
+    }
+    /**
+     * Removes all open toasts at once.
+     */
+    clear(containerKey) {
+        this.toasts = !containerKey
+            ? []
+            : this.toasts.filter(toast => toast.options?.containerKey !== containerKey);
+        this.toasts$.next(this.toasts);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToasterService, deps: [{ token: i2.ContentProjectionService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToasterService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToasterService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
         }], ctorParameters: function () { return [{ type: i2.ContentProjectionService }]; } });
 
-class UserMenuService extends AbstractMenuService {
-    constructor() {
-        super(...arguments);
-        this.baseClass = UserMenu;
-    }
-}
-UserMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: UserMenuService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-UserMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: UserMenuService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: UserMenuService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
+class UserMenuService extends AbstractMenuService {
+    constructor() {
+        super(...arguments);
+        this.baseClass = UserMenu;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: UserMenuService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: UserMenuService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: UserMenuService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }] });
 
 var styles = `
@@ -2462,295 +2464,295 @@ ngb-typeahead-window, ngb-typeahead-window.dropdown-menu {
 }
 `;
 
-const THEME_SHARED_APPEND_CONTENT = new InjectionToken('THEME_SHARED_APPEND_CONTENT', {
-    providedIn: 'root',
-    factory: () => {
-        const domInsertion = inject(DomInsertionService);
-        domInsertion.insertContent(CONTENT_STRATEGY.AppendStyleToHead(styles));
-    },
+const THEME_SHARED_APPEND_CONTENT = new InjectionToken('THEME_SHARED_APPEND_CONTENT', {
+    providedIn: 'root',
+    factory: () => {
+        const domInsertion = inject(DomInsertionService);
+        domInsertion.insertContent(CONTENT_STRATEGY.AppendStyleToHead(styles));
+    },
 });
 
-function isNumber(value) {
-    return !isNaN(toInteger(value));
-}
-function toInteger(value) {
-    return parseInt(`${value}`, 10);
-}
-class DateParserFormatter extends NgbDateParserFormatter {
-    constructor(configState, locale) {
-        super();
-        this.configState = configState;
-        this.locale = locale;
-    }
-    parse(value) {
-        if (value) {
-            const dateParts = value.trim().split('-');
-            // TODO: CHANGED
-            if (dateParts.length === 1 && isNumber(dateParts[0])) {
-                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: -1 };
-            }
-            else if (dateParts.length === 3 &&
-                isNumber(dateParts[0]) &&
-                isNumber(dateParts[1]) &&
-                isNumber(dateParts[2])) {
-                return {
-                    year: toInteger(dateParts[0]),
-                    month: toInteger(dateParts[1]),
-                    day: toInteger(dateParts[2]),
-                };
-            }
-        }
-        return null;
-    }
-    format(date) {
-        if (!date)
-            return '';
-        const localization = this.configState.getOne('localization');
-        const dateFormat = localization.currentCulture?.dateTimeFormat?.shortDatePattern || 'yyyy-MM-dd';
-        return formatDate(new Date(date.year, date.month - 1, date.day), dateFormat, this.locale);
-    }
-}
-DateParserFormatter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DateParserFormatter, deps: [{ token: i2.ConfigStateService }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable });
-DateParserFormatter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DateParserFormatter });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DateParserFormatter, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i2.ConfigStateService }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [LOCALE_ID]
+function isNumber(value) {
+    return !isNaN(toInteger(value));
+}
+function toInteger(value) {
+    return parseInt(`${value}`, 10);
+}
+class DateParserFormatter extends NgbDateParserFormatter {
+    constructor(configState, locale) {
+        super();
+        this.configState = configState;
+        this.locale = locale;
+    }
+    parse(value) {
+        if (value) {
+            const dateParts = value.trim().split('-');
+            // TODO: CHANGED
+            if (dateParts.length === 1 && isNumber(dateParts[0])) {
+                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: -1 };
+            }
+            else if (dateParts.length === 3 &&
+                isNumber(dateParts[0]) &&
+                isNumber(dateParts[1]) &&
+                isNumber(dateParts[2])) {
+                return {
+                    year: toInteger(dateParts[0]),
+                    month: toInteger(dateParts[1]),
+                    day: toInteger(dateParts[2]),
+                };
+            }
+        }
+        return null;
+    }
+    format(date) {
+        if (!date)
+            return '';
+        const localization = this.configState.getOne('localization');
+        const dateFormat = localization.currentCulture?.dateTimeFormat?.shortDatePattern || 'yyyy-MM-dd';
+        return formatDate(new Date(date.year, date.month - 1, date.day), dateFormat, this.locale);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: DateParserFormatter, deps: [{ token: i2.ConfigStateService }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: DateParserFormatter }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: DateParserFormatter, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i2.ConfigStateService }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [LOCALE_ID]
                 }] }]; } });
 
-const declarationsWithExports = [
-    BreadcrumbComponent,
-    BreadcrumbItemsComponent,
-    ButtonComponent,
-    ConfirmationComponent,
-    LoaderBarComponent,
-    LoadingComponent,
-    ModalComponent,
-    ToastComponent,
-    ToastContainerComponent,
-    PasswordComponent,
-    NgxDatatableDefaultDirective,
-    NgxDatatableListDirective,
-    LoadingDirective,
-    ModalCloseDirective,
-    AbpVisibleDirective,
-    FormInputComponent,
-    FormCheckboxComponent
-];
-class BaseThemeSharedModule {
-}
-BaseThemeSharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BaseThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BaseThemeSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: BaseThemeSharedModule, declarations: [BreadcrumbComponent,
-        BreadcrumbItemsComponent,
-        ButtonComponent,
-        ConfirmationComponent,
-        LoaderBarComponent,
-        LoadingComponent,
-        ModalComponent,
-        ToastComponent,
-        ToastContainerComponent,
-        PasswordComponent,
-        NgxDatatableDefaultDirective,
-        NgxDatatableListDirective,
-        LoadingDirective,
-        ModalCloseDirective,
-        AbpVisibleDirective,
-        FormInputComponent,
-        FormCheckboxComponent, HttpErrorWrapperComponent], imports: [CoreModule,
-        NgxDatatableModule,
-        NgxValidateCoreModule,
-        NgbPaginationModule,
-        EllipsisModule,
-        CardModule], exports: [NgxDatatableModule,
-        EllipsisModule,
-        NgxValidateCoreModule,
-        CardModule, BreadcrumbComponent,
-        BreadcrumbItemsComponent,
-        ButtonComponent,
-        ConfirmationComponent,
-        LoaderBarComponent,
-        LoadingComponent,
-        ModalComponent,
-        ToastComponent,
-        ToastContainerComponent,
-        PasswordComponent,
-        NgxDatatableDefaultDirective,
-        NgxDatatableListDirective,
-        LoadingDirective,
-        ModalCloseDirective,
-        AbpVisibleDirective,
-        FormInputComponent,
-        FormCheckboxComponent] });
-BaseThemeSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BaseThemeSharedModule, providers: [DatePipe], imports: [CoreModule,
-        NgxDatatableModule,
-        NgxValidateCoreModule,
-        NgbPaginationModule,
-        EllipsisModule,
-        CardModule, NgxDatatableModule,
-        EllipsisModule,
-        NgxValidateCoreModule,
-        CardModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BaseThemeSharedModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CoreModule,
-                        NgxDatatableModule,
-                        NgxValidateCoreModule,
-                        NgbPaginationModule,
-                        EllipsisModule,
-                        CardModule,
-                    ],
-                    declarations: [...declarationsWithExports, HttpErrorWrapperComponent],
-                    exports: [
-                        NgxDatatableModule,
-                        EllipsisModule,
-                        NgxValidateCoreModule,
-                        CardModule,
-                        ...declarationsWithExports
-                    ],
-                    providers: [DatePipe],
-                }]
-        }] });
-class ThemeSharedModule {
-    static forRoot({ httpErrorConfig, validation = {}, confirmationIcons = {} } = {}) {
-        return {
-            ngModule: ThemeSharedModule,
-            providers: [
-                {
-                    provide: APP_INITIALIZER,
-                    multi: true,
-                    deps: [ErrorHandler],
-                    useFactory: noop,
-                },
-                THEME_SHARED_ROUTE_PROVIDERS,
-                {
-                    provide: APP_INITIALIZER,
-                    multi: true,
-                    deps: [THEME_SHARED_APPEND_CONTENT],
-                    useFactory: noop,
-                },
-                { provide: HTTP_ERROR_CONFIG, useValue: httpErrorConfig },
-                {
-                    provide: 'HTTP_ERROR_CONFIG',
-                    useFactory: httpErrorConfigFactory,
-                    deps: [HTTP_ERROR_CONFIG],
-                },
-                { provide: NgbDateParserFormatter, useClass: DateParserFormatter },
-                NG_BOOTSTRAP_CONFIG_PROVIDERS,
-                {
-                    provide: VALIDATION_BLUEPRINTS,
-                    useValue: {
-                        ...DEFAULT_VALIDATION_BLUEPRINTS,
-                        ...(validation.blueprints || {}),
-                    },
-                },
-                {
-                    provide: VALIDATION_MAP_ERRORS_FN,
-                    useValue: validation.mapErrorsFn || defaultMapErrorsFn,
-                },
-                {
-                    provide: VALIDATION_VALIDATE_ON_SUBMIT,
-                    useValue: validation.validateOnSubmit,
-                },
-                DocumentDirHandlerService,
-                {
-                    provide: APP_INITIALIZER,
-                    useFactory: noop,
-                    multi: true,
-                    deps: [DocumentDirHandlerService],
-                },
-                {
-                    provide: CONFIRMATION_ICONS,
-                    useValue: {
-                        ...DEFAULT_CONFIRMATION_ICONS,
-                        ...(confirmationIcons || {}),
-                    },
-                },
-            ],
-        };
-    }
-}
-ThemeSharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ThemeSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: ThemeSharedModule, imports: [BaseThemeSharedModule], exports: [BaseThemeSharedModule] });
-ThemeSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ThemeSharedModule, imports: [BaseThemeSharedModule, BaseThemeSharedModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ThemeSharedModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [BaseThemeSharedModule],
-                    exports: [BaseThemeSharedModule],
-                }]
+const declarationsWithExports = [
+    BreadcrumbComponent,
+    BreadcrumbItemsComponent,
+    ButtonComponent,
+    ConfirmationComponent,
+    LoaderBarComponent,
+    LoadingComponent,
+    ModalComponent,
+    ToastComponent,
+    ToastContainerComponent,
+    PasswordComponent,
+    NgxDatatableDefaultDirective,
+    NgxDatatableListDirective,
+    LoadingDirective,
+    ModalCloseDirective,
+    AbpVisibleDirective,
+    FormInputComponent,
+    FormCheckboxComponent
+];
+class BaseThemeSharedModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BaseThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: BaseThemeSharedModule, declarations: [BreadcrumbComponent,
+            BreadcrumbItemsComponent,
+            ButtonComponent,
+            ConfirmationComponent,
+            LoaderBarComponent,
+            LoadingComponent,
+            ModalComponent,
+            ToastComponent,
+            ToastContainerComponent,
+            PasswordComponent,
+            NgxDatatableDefaultDirective,
+            NgxDatatableListDirective,
+            LoadingDirective,
+            ModalCloseDirective,
+            AbpVisibleDirective,
+            FormInputComponent,
+            FormCheckboxComponent, HttpErrorWrapperComponent], imports: [CoreModule,
+            NgxDatatableModule,
+            NgxValidateCoreModule,
+            NgbPaginationModule,
+            EllipsisModule,
+            CardModule], exports: [NgxDatatableModule,
+            EllipsisModule,
+            NgxValidateCoreModule,
+            CardModule, BreadcrumbComponent,
+            BreadcrumbItemsComponent,
+            ButtonComponent,
+            ConfirmationComponent,
+            LoaderBarComponent,
+            LoadingComponent,
+            ModalComponent,
+            ToastComponent,
+            ToastContainerComponent,
+            PasswordComponent,
+            NgxDatatableDefaultDirective,
+            NgxDatatableListDirective,
+            LoadingDirective,
+            ModalCloseDirective,
+            AbpVisibleDirective,
+            FormInputComponent,
+            FormCheckboxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BaseThemeSharedModule, providers: [DatePipe], imports: [CoreModule,
+            NgxDatatableModule,
+            NgxValidateCoreModule,
+            NgbPaginationModule,
+            EllipsisModule,
+            CardModule, NgxDatatableModule,
+            EllipsisModule,
+            NgxValidateCoreModule,
+            CardModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BaseThemeSharedModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CoreModule,
+                        NgxDatatableModule,
+                        NgxValidateCoreModule,
+                        NgbPaginationModule,
+                        EllipsisModule,
+                        CardModule,
+                    ],
+                    declarations: [...declarationsWithExports, HttpErrorWrapperComponent],
+                    exports: [
+                        NgxDatatableModule,
+                        EllipsisModule,
+                        NgxValidateCoreModule,
+                        CardModule,
+                        ...declarationsWithExports
+                    ],
+                    providers: [DatePipe],
+                }]
+        }] });
+class ThemeSharedModule {
+    static forRoot({ httpErrorConfig, validation = {}, confirmationIcons = {} } = {}) {
+        return {
+            ngModule: ThemeSharedModule,
+            providers: [
+                {
+                    provide: APP_INITIALIZER,
+                    multi: true,
+                    deps: [ErrorHandler],
+                    useFactory: noop,
+                },
+                THEME_SHARED_ROUTE_PROVIDERS,
+                {
+                    provide: APP_INITIALIZER,
+                    multi: true,
+                    deps: [THEME_SHARED_APPEND_CONTENT],
+                    useFactory: noop,
+                },
+                { provide: HTTP_ERROR_CONFIG, useValue: httpErrorConfig },
+                {
+                    provide: 'HTTP_ERROR_CONFIG',
+                    useFactory: httpErrorConfigFactory,
+                    deps: [HTTP_ERROR_CONFIG],
+                },
+                { provide: NgbDateParserFormatter, useClass: DateParserFormatter },
+                NG_BOOTSTRAP_CONFIG_PROVIDERS,
+                {
+                    provide: VALIDATION_BLUEPRINTS,
+                    useValue: {
+                        ...DEFAULT_VALIDATION_BLUEPRINTS,
+                        ...(validation.blueprints || {}),
+                    },
+                },
+                {
+                    provide: VALIDATION_MAP_ERRORS_FN,
+                    useValue: validation.mapErrorsFn || defaultMapErrorsFn,
+                },
+                {
+                    provide: VALIDATION_VALIDATE_ON_SUBMIT,
+                    useValue: validation.validateOnSubmit,
+                },
+                DocumentDirHandlerService,
+                {
+                    provide: APP_INITIALIZER,
+                    useFactory: noop,
+                    multi: true,
+                    deps: [DocumentDirHandlerService],
+                },
+                {
+                    provide: CONFIRMATION_ICONS,
+                    useValue: {
+                        ...DEFAULT_CONFIRMATION_ICONS,
+                        ...(confirmationIcons || {}),
+                    },
+                },
+            ],
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ThemeSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: ThemeSharedModule, imports: [BaseThemeSharedModule], exports: [BaseThemeSharedModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ThemeSharedModule, imports: [BaseThemeSharedModule, BaseThemeSharedModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ThemeSharedModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [BaseThemeSharedModule],
+                    exports: [BaseThemeSharedModule],
+                }]
         }] });
 
-const { minLength, maxLength } = Validators;
-function getPasswordValidators(injector) {
-    const getRule = getRuleFn(injector);
-    const passwordRulesArr = [];
-    let requiredLength = 1;
-    if (getRule('RequireDigit') === 'true') {
-        passwordRulesArr.push('number');
-    }
-    if (getRule('RequireLowercase') === 'true') {
-        passwordRulesArr.push('small');
-    }
-    if (getRule('RequireUppercase') === 'true') {
-        passwordRulesArr.push('capital');
-    }
-    if (getRule('RequireNonAlphanumeric') === 'true') {
-        passwordRulesArr.push('special');
-    }
-    if (Number.isInteger(+getRule('RequiredLength'))) {
-        requiredLength = +getRule('RequiredLength');
-    }
-    const passwordValidators = passwordRulesArr.map(rule => validatePassword(rule));
-    return [...passwordValidators, minLength(requiredLength), maxLength(128)];
-}
-function getRuleFn(injector) {
-    const configState = injector.get(ConfigStateService);
-    return (key) => {
-        const passwordRules = configState.getSettings('Identity.Password');
-        return (passwordRules[`Abp.Identity.Password.${key}`] || '').toLowerCase();
-    };
-}
-const errorMessageMap = {
-    small: 'passwordRequiresLower',
-    capital: 'passwordRequiresUpper',
-    number: 'passwordRequiresDigit',
-    special: 'passwordRequiresNonAlphanumeric',
-};
-function validatePassword(shouldContain) {
-    return (control) => {
-        if (!control.value)
-            return null;
-        const value = normalizeDiacritics(control.value);
-        const regexMap = {
-            small: /.*[a-z].*/,
-            capital: /.*[A-Z].*/,
-            number: /.*[0-9].*/,
-            special: /.*[^0-9a-zA-Z].*/,
-        };
-        const regex = regexMap[shouldContain];
-        const isValid = regex.test(value);
-        if (isValid) {
-            return null;
-        }
-        const error = errorMessageMap[shouldContain];
-        return {
-            [error]: true,
-        };
-    };
+const { minLength, maxLength } = Validators;
+function getPasswordValidators(injector) {
+    const getRule = getRuleFn(injector);
+    const passwordRulesArr = [];
+    let requiredLength = 1;
+    if (getRule('RequireDigit') === 'true') {
+        passwordRulesArr.push('number');
+    }
+    if (getRule('RequireLowercase') === 'true') {
+        passwordRulesArr.push('small');
+    }
+    if (getRule('RequireUppercase') === 'true') {
+        passwordRulesArr.push('capital');
+    }
+    if (getRule('RequireNonAlphanumeric') === 'true') {
+        passwordRulesArr.push('special');
+    }
+    if (Number.isInteger(+getRule('RequiredLength'))) {
+        requiredLength = +getRule('RequiredLength');
+    }
+    const passwordValidators = passwordRulesArr.map(rule => validatePassword(rule));
+    return [...passwordValidators, minLength(requiredLength), maxLength(128)];
+}
+function getRuleFn(injector) {
+    const configState = injector.get(ConfigStateService);
+    return (key) => {
+        const passwordRules = configState.getSettings('Identity.Password');
+        return (passwordRules[`Abp.Identity.Password.${key}`] || '').toLowerCase();
+    };
+}
+const errorMessageMap = {
+    small: 'passwordRequiresLower',
+    capital: 'passwordRequiresUpper',
+    number: 'passwordRequiresDigit',
+    special: 'passwordRequiresNonAlphanumeric',
+};
+function validatePassword(shouldContain) {
+    return (control) => {
+        if (!control.value)
+            return null;
+        const value = normalizeDiacritics(control.value);
+        const regexMap = {
+            small: /.*[a-z].*/,
+            capital: /.*[A-Z].*/,
+            number: /.*[0-9].*/,
+            special: /.*[^0-9a-zA-Z].*/,
+        };
+        const regex = regexMap[shouldContain];
+        const isValid = regex.test(value);
+        if (isValid) {
+            return null;
+        }
+        const error = errorMessageMap[shouldContain];
+        return {
+            [error]: true,
+        };
+    };
 }
 
-/*
- * Public API Surface of theme-shared
+/*
+ * Public API Surface of theme-shared
  */
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { AbpVisibleDirective, BaseThemeSharedModule, BreadcrumbComponent, BreadcrumbItemsComponent, ButtonComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CardHeaderDirective, CardImgTopDirective, CardModule, CardSubtitleDirective, CardTitleDirective, Confirmation, ConfirmationComponent, ConfirmationService, DEFAULT_ERROR_LOCALIZATIONS, DEFAULT_ERROR_MESSAGES, DEFAULT_VALIDATION_BLUEPRINTS, DateParserFormatter, DocumentDirHandlerService, EllipsisDirective, EllipsisModule, ErrorHandler, FormCheckboxComponent, FormInputComponent, 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, PasswordComponent, SUPPRESS_UNSAVED_CHANGES_WARNING, THEME_SHARED_APPEND_CONTENT, THEME_SHARED_ROUTE_PROVIDERS, ThemeSharedModule, ToastComponent, ToastContainerComponent, ToasterService, UserMenu, UserMenuService, bounceIn, collapse, collapseLinearWithMargin, collapseWithMargin, collapseX, collapseY, collapseYWithMargin, configureNgBootstrap, configureRoutes, defaultNgxDatatableMessages, dialogAnimation, eFormComponets, expandX, expandY, expandYWithMargin, fadeAnimation, fadeIn, fadeInDown, fadeInLeft, fadeInRight, fadeInUp, fadeOut, fadeOutDown, fadeOutLeft, fadeOutRight, fadeOutUp, getPasswordValidators, httpErrorConfigFactory, slideFromBottom, toastInOut, validatePassword };