@abp/ng.theme.shared 10.0.0-rc.1 → 10.0.0-rc.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,15 +1,16 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { Injectable, Input, Component, inject, ChangeDetectorRef, ChangeDetectionStrategy, Renderer2, EventEmitter, ViewChild, Output, InjectionToken, DestroyRef, createComponent, ViewEncapsulation, HostListener, RendererFactory2, Injector, EnvironmentInjector, ApplicationRef, model, input, viewChild, contentChild, output, effect, Directive, forwardRef, HostBinding, NgModule, ElementRef, ComponentFactoryResolver, PLATFORM_ID, ViewContainerRef, TemplateRef, provideAppInitializer, LOCALE_ID, makeEnvironmentProviders } from '@angular/core';
3
- import { formatDate, NgTemplateOutlet, NgClass, AsyncPipe, DOCUMENT, CommonModule, NgStyle, isPlatformBrowser } from '@angular/common';
3
+ import * as i1 from '@angular/common';
4
+ import { formatDate, NgTemplateOutlet, CommonModule, NgClass, AsyncPipe, DOCUMENT, NgStyle, isPlatformBrowser } from '@angular/common';
4
5
  import { NgbDateAdapter, NgbTimeAdapter, NgbModal, NgbTooltip, NgbInputDatepickerConfig, NgbTypeaheadConfig, NgbDateParserFormatter } from '@ng-bootstrap/ng-bootstrap';
5
6
  import { animation, style, animate, keyframes, trigger, state, transition, useAnimation, query } from '@angular/animations';
6
7
  import { RouterLink, Router, ResolveEnd } from '@angular/router';
7
- import { LocalizationPipe, RoutesService, SubscriptionService, RouterEvents, getRoutePath, HttpWaitService, RouterWaitService, ContentProjectionService, PROJECTION_STRATEGY, SORT_COMPARE_FUNC, InternalStore, AuthService, SessionStateService, DomInsertionService, CONTENT_STRATEGY, ConfigStateService, uuid, AbstractNgModelComponent, InternetConnectionService, LocalizationService, getLocaleDirection, HttpErrorReporterService, TENANT_NOT_FOUND_BY_NAME } from '@abp/ng.core';
8
+ import { LocalizationPipe, RoutesService, SubscriptionService, RouterEvents, getRoutePath, StopPropagationDirective, HttpWaitService, RouterWaitService, ContentProjectionService, PROJECTION_STRATEGY, SORT_COMPARE_FUNC, InternalStore, AuthService, SessionStateService, DomInsertionService, CONTENT_STRATEGY, ConfigStateService, uuid, AbstractNgModelComponent, InternetConnectionService, LocalizationService, getLocaleDirection, HttpErrorReporterService, TENANT_NOT_FOUND_BY_NAME } from '@abp/ng.core';
8
9
  import { startWith, map, debounceTime, filter, takeUntil, take, switchMap } from 'rxjs/operators';
9
10
  import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
10
11
  import { fromEvent, Subscription, combineLatest, timer, ReplaySubject, Subject, BehaviorSubject, distinctUntilChanged, of, from, Observable, EMPTY } from 'rxjs';
11
12
  import { HttpErrorResponse } from '@angular/common/http';
12
- import * as i1 from '@angular/forms';
13
+ import * as i1$1 from '@angular/forms';
13
14
  import { FormsModule, NG_VALUE_ACCESSOR, NgControl, Validators } from '@angular/forms';
14
15
  import * as i2 from '@ngx-validate/core';
15
16
  import { NgxValidateCoreModule, normalizeDiacritics, VALIDATION_BLUEPRINTS, defaultMapErrorsFn, VALIDATION_MAP_ERRORS_FN, VALIDATION_VALIDATE_ON_SUBMIT } from '@ngx-validate/core';
@@ -352,7 +353,7 @@ class ButtonComponent {
352
353
  >
353
354
  <i [ngClass]="icon" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
354
355
  </button>
355
- `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
356
+ `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] }); }
356
357
  }
357
358
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: ButtonComponent, decorators: [{
358
359
  type: Component,
@@ -373,7 +374,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImpor
373
374
  <i [ngClass]="icon" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
374
375
  </button>
375
376
  `,
376
- imports: [NgClass],
377
+ imports: [CommonModule, StopPropagationDirective],
377
378
  }]
378
379
  }], propDecorators: { buttonId: [{
379
380
  type: Input
@@ -457,11 +458,11 @@ class ConfirmationComponent {
457
458
  return !!(options && options.iconTemplate);
458
459
  }
459
460
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: ConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
460
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: ConfirmationComponent, isStandalone: true, selector: "abp-confirmation", ngImport: i0, template: "@if (confirmation$ | async; as data) {\r\n <div class=\"confirmation\">\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 @if (data.severity || isCustomIconExists(data)) {\r\n <div class=\"icon-container\" [ngClass]=\"data.severity\">\r\n @if (isIconTemplateExits(data)) {\r\n <div [outerHTML]=\"data.options.iconTemplate\"></div>\r\n } @else {\r\n <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n }\r\n </div>\r\n }\r\n <div class=\"content\">\r\n @if (data.title) {\r\n <h1\r\n class=\"title\"\r\n [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"\r\n ></h1>\r\n }\r\n @if (data.message) {\r\n <p\r\n class=\"message\"\r\n [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"\r\n ></p>\r\n }\r\n </div>\r\n <div class=\"footer\">\r\n @if (!data?.options?.hideCancelBtn) {\r\n <button\r\n id=\"cancel\"\r\n class=\"btn btn-outline-primary me-2\"\r\n [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\"\r\n (click)=\"close(reject)\"\r\n ></button>\r\n }\r\n @if (!data?.options?.hideYesBtn) {\r\n <button\r\n id=\"confirm\"\r\n class=\"btn btn-primary\"\r\n [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\r\n (click)=\"close(confirm)\"\r\n ></button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\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;padding:40px 20px 10px}.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;padding:8px 20px 20px;font-size:16px;font-weight:400;text-align:center;margin-bottom:0}.confirmation .confirmation-dialog .footer{display:flex;align-items:center;justify-content:flex-end;padding:20px;width:100%}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
461
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: ConfirmationComponent, isStandalone: true, selector: "abp-confirmation", ngImport: i0, template: "@if (confirmation$ | async; as data) {\r\n <div class=\"confirmation\">\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 @if (data.severity || isCustomIconExists(data)) {\r\n <div class=\"icon-container\" [ngClass]=\"data.severity\">\r\n @if (isIconTemplateExits(data)) {\r\n <div [outerHTML]=\"data.options.iconTemplate\"></div>\r\n } @else {\r\n <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n }\r\n </div>\r\n }\r\n <div class=\"content\">\r\n @if (data.title) {\r\n <h1\r\n class=\"title\"\r\n [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"\r\n ></h1>\r\n }\r\n @if (data.message) {\r\n <p\r\n class=\"message\"\r\n [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"\r\n ></p>\r\n }\r\n </div>\r\n <div class=\"footer\">\r\n @if (!data?.options?.hideCancelBtn) {\r\n <button\r\n id=\"cancel\"\r\n class=\"btn btn-outline-primary me-2\"\r\n [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\"\r\n (click)=\"close(reject)\"\r\n ></button>\r\n }\r\n @if (!data?.options?.hideYesBtn) {\r\n <button\r\n id=\"confirm\"\r\n class=\"btn btn-primary\"\r\n [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\r\n (click)=\"close(confirm)\"\r\n ></button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\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;padding:40px 20px 10px}.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;padding:8px 20px 20px;font-size:16px;font-weight:400;text-align:center;margin-bottom:0}.confirmation .confirmation-dialog .footer{display:flex;align-items:center;justify-content:flex-end;padding:20px;width:100%}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
461
462
  }
462
463
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: ConfirmationComponent, decorators: [{
463
464
  type: Component,
464
- args: [{ selector: 'abp-confirmation', imports: [NgClass, AsyncPipe, LocalizationPipe], template: "@if (confirmation$ | async; as data) {\r\n <div class=\"confirmation\">\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 @if (data.severity || isCustomIconExists(data)) {\r\n <div class=\"icon-container\" [ngClass]=\"data.severity\">\r\n @if (isIconTemplateExits(data)) {\r\n <div [outerHTML]=\"data.options.iconTemplate\"></div>\r\n } @else {\r\n <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n }\r\n </div>\r\n }\r\n <div class=\"content\">\r\n @if (data.title) {\r\n <h1\r\n class=\"title\"\r\n [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"\r\n ></h1>\r\n }\r\n @if (data.message) {\r\n <p\r\n class=\"message\"\r\n [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"\r\n ></p>\r\n }\r\n </div>\r\n <div class=\"footer\">\r\n @if (!data?.options?.hideCancelBtn) {\r\n <button\r\n id=\"cancel\"\r\n class=\"btn btn-outline-primary me-2\"\r\n [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\"\r\n (click)=\"close(reject)\"\r\n ></button>\r\n }\r\n @if (!data?.options?.hideYesBtn) {\r\n <button\r\n id=\"confirm\"\r\n class=\"btn btn-primary\"\r\n [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\r\n (click)=\"close(confirm)\"\r\n ></button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\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;padding:40px 20px 10px}.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;padding:8px 20px 20px;font-size:16px;font-weight:400;text-align:center;margin-bottom:0}.confirmation .confirmation-dialog .footer{display:flex;align-items:center;justify-content:flex-end;padding:20px;width:100%}\n"] }]
465
+ args: [{ selector: 'abp-confirmation', imports: [NgClass, AsyncPipe, LocalizationPipe], template: "@if (confirmation$ | async; as data) {\r\n <div class=\"confirmation\">\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 @if (data.severity || isCustomIconExists(data)) {\r\n <div class=\"icon-container\" [ngClass]=\"data.severity\">\r\n @if (isIconTemplateExits(data)) {\r\n <div [outerHTML]=\"data.options.iconTemplate\"></div>\r\n } @else {\r\n <i class=\"icon\" [ngClass]=\"getIconClass(data)\"></i>\r\n }\r\n </div>\r\n }\r\n <div class=\"content\">\r\n @if (data.title) {\r\n <h1\r\n class=\"title\"\r\n [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"\r\n ></h1>\r\n }\r\n @if (data.message) {\r\n <p\r\n class=\"message\"\r\n [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"\r\n ></p>\r\n }\r\n </div>\r\n <div class=\"footer\">\r\n @if (!data?.options?.hideCancelBtn) {\r\n <button\r\n id=\"cancel\"\r\n class=\"btn btn-outline-primary me-2\"\r\n [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\"\r\n (click)=\"close(reject)\"\r\n ></button>\r\n }\r\n @if (!data?.options?.hideYesBtn) {\r\n <button\r\n id=\"confirm\"\r\n class=\"btn btn-primary\"\r\n [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\r\n (click)=\"close(confirm)\"\r\n ></button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\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;padding:40px 20px 10px}.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;padding:8px 20px 20px;font-size:16px;font-weight:400;text-align:center;margin-bottom:0}.confirmation .confirmation-dialog .footer{display:flex;align-items:center;justify-content:flex-end;padding:20px;width:100%}\n"] }]
465
466
  }] });
466
467
 
467
468
  class HttpErrorWrapperComponent {
@@ -902,11 +903,11 @@ class ToastContainerComponent {
902
903
  return toast.options?.id;
903
904
  }
904
905
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: ToastContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
905
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: ToastContainerComponent, isStandalone: true, 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 @for (toast of toasts; track toast.options?.id) {\r\n <abp-toast\r\n [toast]=\"toast\"\r\n (remove)=\"remove($event)\"\r\n ></abp-toast>\r\n }\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: "component", type: ToastComponent, selector: "abp-toast", inputs: ["toast"], outputs: ["remove"] }], animations: [toastInOut] }); }
906
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: ToastContainerComponent, isStandalone: true, 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 @for (toast of toasts; track toast.options?.id) {\r\n <abp-toast\r\n [toast]=\"toast\"\r\n (remove)=\"remove($event)\"\r\n ></abp-toast>\r\n }\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: "component", type: ToastComponent, selector: "abp-toast", inputs: ["toast"], outputs: ["remove"] }], animations: [toastInOut] }); }
906
907
  }
907
908
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: ToastContainerComponent, decorators: [{
908
909
  type: Component,
909
- args: [{ selector: 'abp-toast-container', animations: [toastInOut], imports: [ToastComponent], 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 @for (toast of toasts; track toast.options?.id) {\r\n <abp-toast\r\n [toast]=\"toast\"\r\n (remove)=\"remove($event)\"\r\n ></abp-toast>\r\n }\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"] }]
910
+ args: [{ selector: 'abp-toast-container', animations: [toastInOut], imports: [ToastComponent], 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 @for (toast of toasts; track toast.options?.id) {\r\n <abp-toast\r\n [toast]=\"toast\"\r\n (remove)=\"remove($event)\"\r\n ></abp-toast>\r\n }\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"] }]
910
911
  }], propDecorators: { top: [{
911
912
  type: Input
912
913
  }], right: [{
@@ -1830,7 +1831,7 @@ class PasswordComponent extends AbstractNgModelComponent {
1830
1831
  useExisting: forwardRef(() => PasswordComponent),
1831
1832
  multi: true,
1832
1833
  },
1833
- ], 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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: NgxValidateCoreModule }, { kind: "directive", type: i2.ValidationTargetDirective, selector: "[validationTarget]", exportAs: ["validationTarget"] }] }); }
1834
+ ], 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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: NgxValidateCoreModule }, { kind: "directive", type: i2.ValidationTargetDirective, selector: "[validationTarget]", exportAs: ["validationTarget"] }] }); }
1834
1835
  }
1835
1836
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: PasswordComponent, decorators: [{
1836
1837
  type: Component,
@@ -2089,7 +2090,7 @@ class FormCheckboxComponent extends AbstractNgModelComponent {
2089
2090
  </label>
2090
2091
  }
2091
2092
  </div>
2092
- `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
2093
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
2093
2094
  }
2094
2095
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: FormCheckboxComponent, decorators: [{
2095
2096
  type: Component,
@@ -2178,7 +2179,7 @@ class FormInputComponent extends AbstractNgModelComponent {
2178
2179
  [(ngModel)]="value"
2179
2180
  />
2180
2181
  </div>
2181
- `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
2182
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
2182
2183
  }
2183
2184
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: FormInputComponent, decorators: [{
2184
2185
  type: Component,
@@ -3225,7 +3226,8 @@ class BaseThemeSharedModule {
3225
3226
  NgxDatatableListDirective,
3226
3227
  NgxDatatableDefaultDirective,
3227
3228
  PasswordComponent] }); }
3228
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: BaseThemeSharedModule, imports: [FormInputComponent,
3229
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: BaseThemeSharedModule, imports: [ButtonComponent,
3230
+ FormInputComponent,
3229
3231
  FormCheckboxComponent,
3230
3232
  HttpErrorWrapperComponent,
3231
3233
  NgxDatatableModule,