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

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,7 +1,6 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, inject, LOCALE_ID, Input, Component, 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, makeEnvironmentProviders } from '@angular/core';
3
- import * as i1 from '@angular/common';
4
- import { formatDate, NgTemplateOutlet, CommonModule, NgClass, AsyncPipe, DOCUMENT, NgStyle, isPlatformBrowser } from '@angular/common';
2
+ import { Injectable, inject, LOCALE_ID, input, Component, ChangeDetectorRef, ChangeDetectionStrategy, Renderer2, signal, computed, output, viewChild, InjectionToken, DestroyRef, createComponent, effect, ViewEncapsulation, RendererFactory2, Injector, EnvironmentInjector, ApplicationRef, model, contentChild, HostListener, Directive, forwardRef, HostBinding, NgModule, ElementRef, ViewContainerRef, PLATFORM_ID, TemplateRef, provideAppInitializer, makeEnvironmentProviders } from '@angular/core';
3
+ import { formatDate, NgTemplateOutlet, AsyncPipe, DOCUMENT, isPlatformBrowser } from '@angular/common';
5
4
  import { NgbDateAdapter, NgbDatepickerI18n, NgbTimeAdapter, NgbTimepickerI18n, NgbModal, NgbTooltip, NgbInputDatepickerConfig, NgbTypeaheadConfig, NgbDateParserFormatter } from '@ng-bootstrap/ng-bootstrap';
6
5
  import { ConfigStateService, LocalizationPipe, RoutesService, SubscriptionService, RouterEvents, getRoutePath, StopPropagationDirective, HttpWaitService, RouterWaitService, ContentProjectionService, PROJECTION_STRATEGY, SORT_COMPARE_FUNC, InternalStore, AuthService, SessionStateService, DomInsertionService, CONTENT_STRATEGY, uuid, AbstractNgModelComponent, InternetConnectionService, LocalizationService, getLocaleDirection, HttpErrorReporterService, TENANT_NOT_FOUND_BY_NAME } from '@abp/ng.core';
7
6
  import { animation, style, animate, keyframes, trigger, state, transition, useAnimation, query } from '@angular/animations';
@@ -10,7 +9,7 @@ import { startWith, map, debounceTime, filter, takeUntil, take, switchMap } from
10
9
  import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
11
10
  import { fromEvent, Subscription, combineLatest, timer, ReplaySubject, Subject, BehaviorSubject, distinctUntilChanged, of, from, Observable, EMPTY } from 'rxjs';
12
11
  import { HttpErrorResponse } from '@angular/common/http';
13
- import * as i1$1 from '@angular/forms';
12
+ import * as i1 from '@angular/forms';
14
13
  import { FormsModule, NG_VALUE_ACCESSOR, NgControl, Validators } from '@angular/forms';
15
14
  import * as i2 from '@ngx-validate/core';
16
15
  import { NgxValidateCoreModule, normalizeDiacritics, VALIDATION_BLUEPRINTS, defaultMapErrorsFn, VALIDATION_MAP_ERRORS_FN, VALIDATION_VALIDATE_ON_SUBMIT } from '@ngx-validate/core';
@@ -321,17 +320,15 @@ const toastInOut = trigger('toastInOut', [
321
320
 
322
321
  class BreadcrumbItemsComponent {
323
322
  constructor() {
324
- this.items = [];
323
+ this.items = input([], ...(ngDevMode ? [{ debugName: "items" }] : []));
325
324
  }
326
325
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: BreadcrumbItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
327
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: BreadcrumbItemsComponent, isStandalone: true, selector: "abp-breadcrumb-items", inputs: { items: "items" }, ngImport: i0, template: "@if (items.length) {\r\n <ol class=\"breadcrumb\">\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 @for (item of items; track $index; let last = $last) {\r\n <li class=\"breadcrumb-item\" [class.active]=\"last\" aria-current=\"page\">\r\n <ng-container\r\n *ngTemplateOutlet=\"item.path ? linkTemplate : textTemplate; context: { $implicit: item }\"\r\n ></ng-container>\r\n </li>\r\n }\r\n </ol>\r\n}\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: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
326
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: BreadcrumbItemsComponent, isStandalone: true, selector: "abp-breadcrumb-items", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (items().length) {\r\n <ol class=\"breadcrumb\">\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 @for (item of items(); track $index; let last = $last) {\r\n <li class=\"breadcrumb-item\" [class.active]=\"last\" aria-current=\"page\">\r\n <ng-container\r\n *ngTemplateOutlet=\"item.path ? linkTemplate : textTemplate; context: { $implicit: item }\"\r\n ></ng-container>\r\n </li>\r\n }\r\n </ol>\r\n}\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: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
328
327
  }
329
328
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: BreadcrumbItemsComponent, decorators: [{
330
329
  type: Component,
331
- args: [{ selector: 'abp-breadcrumb-items', imports: [NgTemplateOutlet, RouterLink, LocalizationPipe], template: "@if (items.length) {\r\n <ol class=\"breadcrumb\">\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 @for (item of items; track $index; let last = $last) {\r\n <li class=\"breadcrumb-item\" [class.active]=\"last\" aria-current=\"page\">\r\n <ng-container\r\n *ngTemplateOutlet=\"item.path ? linkTemplate : textTemplate; context: { $implicit: item }\"\r\n ></ng-container>\r\n </li>\r\n }\r\n </ol>\r\n}\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" }]
332
- }], propDecorators: { items: [{
333
- type: Input
334
- }] } });
330
+ args: [{ selector: 'abp-breadcrumb-items', imports: [NgTemplateOutlet, RouterLink, LocalizationPipe], template: "@if (items().length) {\r\n <ol class=\"breadcrumb\">\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 @for (item of items(); track $index; let last = $last) {\r\n <li class=\"breadcrumb-item\" [class.active]=\"last\" aria-current=\"page\">\r\n <ng-container\r\n *ngTemplateOutlet=\"item.path ? linkTemplate : textTemplate; context: { $implicit: item }\"\r\n ></ng-container>\r\n </li>\r\n }\r\n </ol>\r\n}\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" }]
331
+ }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }] } });
335
332
 
336
333
  class BreadcrumbComponent {
337
334
  constructor() {
@@ -372,47 +369,62 @@ function isAdministration(route) {
372
369
  class ButtonComponent {
373
370
  constructor() {
374
371
  this.renderer = inject(Renderer2);
375
- this.buttonId = '';
376
- this.buttonClass = 'btn btn-primary';
377
- this.buttonType = 'button';
378
- this.formName = undefined;
379
- this.loading = false;
380
- this.disabled = false;
381
- this.click = new EventEmitter();
382
- this.focus = new EventEmitter();
383
- this.blur = new EventEmitter();
384
- this.abpClick = new EventEmitter();
385
- this.abpFocus = new EventEmitter();
386
- this.abpBlur = new EventEmitter();
387
- }
388
- get icon() {
389
- return `${this.loading ? 'fa fa-spinner fa-spin' : this.iconClass || 'd-none'}`;
372
+ this.buttonId = input('', ...(ngDevMode ? [{ debugName: "buttonId" }] : []));
373
+ this.buttonClass = input('btn btn-primary', ...(ngDevMode ? [{ debugName: "buttonClass" }] : []));
374
+ this.buttonType = input('button', ...(ngDevMode ? [{ debugName: "buttonType" }] : []));
375
+ this.formName = input(undefined, ...(ngDevMode ? [{ debugName: "formName" }] : []));
376
+ this.iconClass = input(undefined, ...(ngDevMode ? [{ debugName: "iconClass" }] : []));
377
+ this.loadingInput = input(false, { ...(ngDevMode ? { debugName: "loadingInput" } : {}), alias: 'loading' });
378
+ this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
379
+ this.attributes = input(undefined, ...(ngDevMode ? [{ debugName: "attributes" }] : []));
380
+ // Internal writable signal for loading state - can be set programmatically
381
+ this._loading = signal(false, ...(ngDevMode ? [{ debugName: "_loading" }] : []));
382
+ // Computed that combines input and internal state
383
+ this.isLoading = computed(() => this.loadingInput() || this._loading(), ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
384
+ this.click = output();
385
+ this.focus = output();
386
+ this.blur = output();
387
+ this.abpClick = output();
388
+ this.abpFocus = output();
389
+ this.abpBlur = output();
390
+ this.buttonRef = viewChild.required('button');
391
+ this.icon = computed(() => {
392
+ return this.isLoading() ? 'fa fa-spinner fa-spin' : this.iconClass() || 'd-none';
393
+ }, ...(ngDevMode ? [{ debugName: "icon" }] : []));
394
+ }
395
+ // Getter/setter for backward compatibility (used by ModalComponent)
396
+ get loading() {
397
+ return this._loading();
398
+ }
399
+ set loading(value) {
400
+ this._loading.set(value);
390
401
  }
391
402
  ngOnInit() {
392
- if (this.attributes) {
393
- Object.keys(this.attributes).forEach(key => {
394
- if (this.attributes?.[key]) {
395
- this.renderer.setAttribute(this.buttonRef.nativeElement, key, this.attributes[key]);
403
+ const attributes = this.attributes();
404
+ if (attributes) {
405
+ Object.keys(attributes).forEach(key => {
406
+ if (attributes[key]) {
407
+ this.renderer.setAttribute(this.buttonRef().nativeElement, key, attributes[key]);
396
408
  }
397
409
  });
398
410
  }
399
411
  }
400
412
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
401
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.9", type: ButtonComponent, isStandalone: true, 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: `
413
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.9", type: ButtonComponent, isStandalone: true, selector: "abp-button", inputs: { buttonId: { classPropertyName: "buttonId", publicName: "buttonId", isSignal: true, isRequired: false, transformFunction: null }, buttonClass: { classPropertyName: "buttonClass", publicName: "buttonClass", isSignal: true, isRequired: false, transformFunction: null }, buttonType: { classPropertyName: "buttonType", publicName: "buttonType", isSignal: true, isRequired: false, transformFunction: null }, formName: { classPropertyName: "formName", publicName: "formName", isSignal: true, isRequired: false, transformFunction: null }, iconClass: { classPropertyName: "iconClass", publicName: "iconClass", isSignal: true, isRequired: false, transformFunction: null }, loadingInput: { classPropertyName: "loadingInput", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, attributes: { classPropertyName: "attributes", publicName: "attributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click", focus: "focus", blur: "blur", abpClick: "abpClick", abpFocus: "abpFocus", abpBlur: "abpBlur" }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["button"], descendants: true, isSignal: true }], ngImport: i0, template: `
402
414
  <button
403
415
  #button
404
- [id]="buttonId"
405
- [attr.type]="buttonType"
406
- [attr.form]="formName"
407
- [ngClass]="buttonClass"
408
- [disabled]="loading || disabled"
409
- (click.stop)="click.next($event); abpClick.next($event)"
410
- (focus)="focus.next($event); abpFocus.next($event)"
411
- (blur)="blur.next($event); abpBlur.next($event)"
416
+ [id]="buttonId()"
417
+ [attr.type]="buttonType()"
418
+ [attr.form]="formName()"
419
+ [class]="buttonClass()"
420
+ [disabled]="isLoading() || disabled()"
421
+ (click.stop)="click.emit($event); abpClick.emit($event)"
422
+ (focus)="focus.emit($event); abpFocus.emit($event)"
423
+ (blur)="blur.emit($event); abpBlur.emit($event)"
412
424
  >
413
- <i [ngClass]="icon" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
425
+ <i [class]="icon()" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
414
426
  </button>
415
- `, 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"] }] }); }
427
+ `, isInline: true, dependencies: [{ kind: "directive", type: StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] }); }
416
428
  }
417
429
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ButtonComponent, decorators: [{
418
430
  type: Component,
@@ -421,52 +433,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
421
433
  template: `
422
434
  <button
423
435
  #button
424
- [id]="buttonId"
425
- [attr.type]="buttonType"
426
- [attr.form]="formName"
427
- [ngClass]="buttonClass"
428
- [disabled]="loading || disabled"
429
- (click.stop)="click.next($event); abpClick.next($event)"
430
- (focus)="focus.next($event); abpFocus.next($event)"
431
- (blur)="blur.next($event); abpBlur.next($event)"
436
+ [id]="buttonId()"
437
+ [attr.type]="buttonType()"
438
+ [attr.form]="formName()"
439
+ [class]="buttonClass()"
440
+ [disabled]="isLoading() || disabled()"
441
+ (click.stop)="click.emit($event); abpClick.emit($event)"
442
+ (focus)="focus.emit($event); abpFocus.emit($event)"
443
+ (blur)="blur.emit($event); abpBlur.emit($event)"
432
444
  >
433
- <i [ngClass]="icon" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
445
+ <i [class]="icon()" class="me-1" aria-hidden="true"></i><ng-content></ng-content>
434
446
  </button>
435
447
  `,
436
- imports: [CommonModule, StopPropagationDirective],
448
+ imports: [StopPropagationDirective],
437
449
  }]
438
- }], propDecorators: { buttonId: [{
439
- type: Input
440
- }], buttonClass: [{
441
- type: Input
442
- }], buttonType: [{
443
- type: Input
444
- }], formName: [{
445
- type: Input
446
- }], iconClass: [{
447
- type: Input
448
- }], loading: [{
449
- type: Input
450
- }], disabled: [{
451
- type: Input
452
- }], attributes: [{
453
- type: Input
454
- }], click: [{
455
- type: Output
456
- }], focus: [{
457
- type: Output
458
- }], blur: [{
459
- type: Output
460
- }], abpClick: [{
461
- type: Output
462
- }], abpFocus: [{
463
- type: Output
464
- }], abpBlur: [{
465
- type: Output
466
- }], buttonRef: [{
467
- type: ViewChild,
468
- args: ['button', { static: true }]
469
- }] } });
450
+ }], propDecorators: { buttonId: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonId", required: false }] }], buttonClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonClass", required: false }] }], buttonType: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonType", required: false }] }], formName: [{ type: i0.Input, args: [{ isSignal: true, alias: "formName", required: false }] }], iconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconClass", required: false }] }], loadingInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], attributes: [{ type: i0.Input, args: [{ isSignal: true, alias: "attributes", required: false }] }], click: [{ type: i0.Output, args: ["click"] }], focus: [{ type: i0.Output, args: ["focus"] }], blur: [{ type: i0.Output, args: ["blur"] }], abpClick: [{ type: i0.Output, args: ["abpClick"] }], abpFocus: [{ type: i0.Output, args: ["abpFocus"] }], abpBlur: [{ type: i0.Output, args: ["abpBlur"] }], buttonRef: [{ type: i0.ViewChild, args: ['button', { isSignal: true }] }] } });
470
451
 
471
452
  var Confirmation;
472
453
  (function (Confirmation) {
@@ -517,11 +498,11 @@ class ConfirmationComponent {
517
498
  return !!(options && options.iconTemplate);
518
499
  }
519
500
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
520
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", 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" }] }); }
501
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ConfirmationComponent, isStandalone: true, selector: "abp-confirmation", ngImport: i0, template: "@if (confirmation$ | async; as data) {\r\n<div class=\"confirmation\">\r\n <div class=\"confirmation-backdrop\" (click)=\"data.options?.dismissible ? close(dismiss) : null\"></div>\r\n <div class=\"confirmation-dialog\">\r\n @if (data.severity || isCustomIconExists(data)) {\r\n <div class=\"icon-container\" [class]=\"data.severity\">\r\n @if (isIconTemplateExits(data)) {\r\n <div [outerHTML]=\"data.options.iconTemplate\"></div>\r\n } @else {\r\n <i class=\"icon\" [class]=\"getIconClass(data)\"></i>\r\n }\r\n </div>\r\n }\r\n <div class=\"content\">\r\n @if (data.title) {\r\n <h1 class=\"title\" [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"></h1>\r\n }\r\n @if (data.message) {\r\n <p class=\"message\" [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"></p>\r\n }\r\n </div>\r\n <div class=\"footer\">\r\n @if (!data?.options?.hideCancelBtn) {\r\n <button id=\"cancel\" class=\"btn btn-outline-primary me-2\"\r\n [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\" (click)=\"close(reject)\"></button>\r\n }\r\n @if (!data?.options?.hideYesBtn) {\r\n <button id=\"confirm\" class=\"btn btn-primary\" [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\r\n (click)=\"close(confirm)\"></button>\r\n }\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;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: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
521
502
  }
522
503
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ConfirmationComponent, decorators: [{
523
504
  type: Component,
524
- 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"] }]
505
+ args: [{ selector: 'abp-confirmation', imports: [AsyncPipe, LocalizationPipe], template: "@if (confirmation$ | async; as data) {\r\n<div class=\"confirmation\">\r\n <div class=\"confirmation-backdrop\" (click)=\"data.options?.dismissible ? close(dismiss) : null\"></div>\r\n <div class=\"confirmation-dialog\">\r\n @if (data.severity || isCustomIconExists(data)) {\r\n <div class=\"icon-container\" [class]=\"data.severity\">\r\n @if (isIconTemplateExits(data)) {\r\n <div [outerHTML]=\"data.options.iconTemplate\"></div>\r\n } @else {\r\n <i class=\"icon\" [class]=\"getIconClass(data)\"></i>\r\n }\r\n </div>\r\n }\r\n <div class=\"content\">\r\n @if (data.title) {\r\n <h1 class=\"title\" [innerHTML]=\"data.title | abpLocalization: data.options?.titleLocalizationParams\"></h1>\r\n }\r\n @if (data.message) {\r\n <p class=\"message\" [innerHTML]=\"data.message | abpLocalization: data.options?.messageLocalizationParams\"></p>\r\n }\r\n </div>\r\n <div class=\"footer\">\r\n @if (!data?.options?.hideCancelBtn) {\r\n <button id=\"cancel\" class=\"btn btn-outline-primary me-2\"\r\n [innerHTML]=\"data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization\" (click)=\"close(reject)\"></button>\r\n }\r\n @if (!data?.options?.hideYesBtn) {\r\n <button id=\"confirm\" class=\"btn btn-primary\" [innerHTML]=\"data.options?.yesText || 'AbpUi::Yes' | abpLocalization\"\r\n (click)=\"close(confirm)\"></button>\r\n }\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;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"] }]
525
506
  }] });
526
507
 
527
508
  class HttpErrorWrapperComponent {
@@ -536,6 +517,7 @@ class HttpErrorWrapperComponent {
536
517
  this.customComponent = undefined;
537
518
  this.hideCloseIcon = false;
538
519
  this.isHomeShow = true;
520
+ this.containerRef = viewChild('container', ...(ngDevMode ? [{ debugName: "containerRef" }] : []));
539
521
  }
540
522
  get statusText() {
541
523
  return this.status ? `[${this.status}]` : '';
@@ -560,8 +542,9 @@ class HttpErrorWrapperComponent {
560
542
  }
561
543
  customComponentRef.instance.destroy$ = this.destroy$;
562
544
  this.appRef.attachView(customComponentRef.hostView);
563
- if (this.containerRef) {
564
- this.containerRef.nativeElement.appendChild(customComponentRef.hostView.rootNodes[0]);
545
+ const containerRef = this.containerRef();
546
+ if (containerRef) {
547
+ containerRef.nativeElement.appendChild(customComponentRef.hostView.rootNodes[0]);
565
548
  }
566
549
  customComponentRef.changeDetectorRef.detectChanges();
567
550
  }
@@ -581,15 +564,12 @@ class HttpErrorWrapperComponent {
581
564
  this.destroy();
582
565
  }
583
566
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: HttpErrorWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
584
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: HttpErrorWrapperComponent, isStandalone: true, selector: "abp-http-error-wrapper", 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 @if (!hideCloseIcon) {\r\n <button id=\"abp-close-button\" type=\"button\" class=\"btn-close me-2\" (click)=\"destroy()\"></button>\r\n }\r\n\r\n @if (!customComponent) {\r\n <div 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 @if (isHomeShow) {\r\n <a (click)=\"goHome()\" 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 }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n }\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: "ngmodule", type: CommonModule }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
567
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: HttpErrorWrapperComponent, isStandalone: true, selector: "abp-http-error-wrapper", viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true, isSignal: 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 @if (!hideCloseIcon) {\r\n <button id=\"abp-close-button\" type=\"button\" class=\"btn-close me-2\" (click)=\"destroy()\"></button>\r\n }\r\n\r\n @if (!customComponent) {\r\n <div 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 @if (isHomeShow) {\r\n <a (click)=\"goHome()\" 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 }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n }\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: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
585
568
  }
586
569
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: HttpErrorWrapperComponent, decorators: [{
587
570
  type: Component,
588
- args: [{ selector: 'abp-http-error-wrapper', imports: [CommonModule, LocalizationPipe], 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 @if (!hideCloseIcon) {\r\n <button id=\"abp-close-button\" type=\"button\" class=\"btn-close me-2\" (click)=\"destroy()\"></button>\r\n }\r\n\r\n @if (!customComponent) {\r\n <div 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 @if (isHomeShow) {\r\n <a (click)=\"goHome()\" 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 }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n }\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"] }]
589
- }], propDecorators: { containerRef: [{
590
- type: ViewChild,
591
- args: ['container', { static: false }]
592
- }] } });
571
+ args: [{ selector: 'abp-http-error-wrapper', imports: [LocalizationPipe], 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 @if (!hideCloseIcon) {\r\n <button id=\"abp-close-button\" type=\"button\" class=\"btn-close me-2\" (click)=\"destroy()\"></button>\r\n }\r\n\r\n @if (!customComponent) {\r\n <div 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 @if (isHomeShow) {\r\n <a (click)=\"goHome()\" 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 }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n }\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"] }]
572
+ }], propDecorators: { containerRef: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }] } });
593
573
 
594
574
  class LoaderBarComponent {
595
575
  constructor() {
@@ -597,8 +577,10 @@ class LoaderBarComponent {
597
577
  this.subscription = inject(SubscriptionService);
598
578
  this.httpWaitService = inject(HttpWaitService);
599
579
  this.routerWaitService = inject(RouterWaitService);
600
- this.containerClass = 'abp-loader-bar';
601
- this.color = '#77b6ff';
580
+ this.isLoadingInput = input(false, { ...(ngDevMode ? { debugName: "isLoadingInput" } : {}), alias: 'isLoading' });
581
+ this.containerClass = input('abp-loader-bar', ...(ngDevMode ? [{ debugName: "containerClass" }] : []));
582
+ this.color = input('#77b6ff', ...(ngDevMode ? [{ debugName: "color" }] : []));
583
+ this.isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
602
584
  this.progressLevel = 0;
603
585
  this.interval = new Subscription();
604
586
  this.timer = new Subscription();
@@ -623,16 +605,14 @@ class LoaderBarComponent {
623
605
  }
624
606
  this.cdRef.detectChanges();
625
607
  };
626
- }
627
- set isLoading(value) {
628
- this._isLoading = value;
629
- this.cdRef.detectChanges();
630
- }
631
- get isLoading() {
632
- return this._isLoading;
608
+ effect(() => {
609
+ const value = this.isLoadingInput();
610
+ this.isLoading.set(value);
611
+ this.cdRef.detectChanges();
612
+ });
633
613
  }
634
614
  get boxShadow() {
635
- return `0 0 10px rgba(${this.color}, 0.5)`;
615
+ return `0 0 10px rgba(${this.color()}, 0.5)`;
636
616
  }
637
617
  ngOnInit() {
638
618
  this.subscribeLoading();
@@ -649,9 +629,9 @@ class LoaderBarComponent {
649
629
  this.interval.unsubscribe();
650
630
  }
651
631
  startLoading() {
652
- if (this.isLoading || !this.interval.closed)
632
+ if (this.isLoading() || !this.interval.closed)
653
633
  return;
654
- this.isLoading = true;
634
+ this.isLoading.set(true);
655
635
  this.progressLevel = 0;
656
636
  this.cdRef.detectChanges();
657
637
  this.interval = timer(0, this.intervalPeriod).subscribe(this.reportProgress);
@@ -660,48 +640,42 @@ class LoaderBarComponent {
660
640
  stopLoading() {
661
641
  this.interval.unsubscribe();
662
642
  this.progressLevel = 100;
663
- this.isLoading = false;
643
+ this.isLoading.set(false);
664
644
  if (!this.timer.closed)
665
645
  return;
666
646
  this.timer = timer(this.stopDelay).subscribe(this.clearProgress);
667
647
  }
668
648
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: LoaderBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
669
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.9", type: LoaderBarComponent, isStandalone: true, selector: "abp-loader-bar", inputs: { isLoading: "isLoading", containerClass: "containerClass", color: "color" }, providers: [SubscriptionService], ngImport: i0, template: `
670
- <div id="abp-loader-bar" [ngClass]="containerClass" [class.is-loading]="isLoading">
649
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: LoaderBarComponent, isStandalone: true, selector: "abp-loader-bar", inputs: { isLoadingInput: { classPropertyName: "isLoadingInput", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, containerClass: { classPropertyName: "containerClass", publicName: "containerClass", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, providers: [SubscriptionService], ngImport: i0, template: `
650
+ <div id="abp-loader-bar" [class]="containerClass()" [class.is-loading]="isLoading()">
671
651
  <div
672
652
  class="abp-progress"
673
653
  [class.progressing]="progressLevel"
674
654
  [style.width.vw]="progressLevel"
675
- [ngStyle]="{
676
- 'background-color': color,
655
+ [style]="{
656
+ 'background-color': color(),
677
657
  'box-shadow': boxShadow,
678
658
  }"
679
659
  ></div>
680
660
  </div>
681
- `, 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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
661
+ `, 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"] }); }
682
662
  }
683
663
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: LoaderBarComponent, decorators: [{
684
664
  type: Component,
685
665
  args: [{ selector: 'abp-loader-bar', template: `
686
- <div id="abp-loader-bar" [ngClass]="containerClass" [class.is-loading]="isLoading">
666
+ <div id="abp-loader-bar" [class]="containerClass()" [class.is-loading]="isLoading()">
687
667
  <div
688
668
  class="abp-progress"
689
669
  [class.progressing]="progressLevel"
690
670
  [style.width.vw]="progressLevel"
691
- [ngStyle]="{
692
- 'background-color': color,
671
+ [style]="{
672
+ 'background-color': color(),
693
673
  'box-shadow': boxShadow,
694
674
  }"
695
675
  ></div>
696
676
  </div>
697
- `, providers: [SubscriptionService], imports: [NgClass, NgStyle], 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"] }]
698
- }], propDecorators: { isLoading: [{
699
- type: Input
700
- }], containerClass: [{
701
- type: Input
702
- }], color: [{
703
- type: Input
704
- }] } });
677
+ `, providers: [SubscriptionService], imports: [], 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"] }]
678
+ }], ctorParameters: () => [], propDecorators: { isLoadingInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], containerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "containerClass", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
705
679
 
706
680
  class LoadingComponent {
707
681
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
@@ -876,19 +850,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
876
850
 
877
851
  class ToastComponent {
878
852
  constructor() {
879
- this.remove = new EventEmitter();
853
+ this.toast = input.required(...(ngDevMode ? [{ debugName: "toast" }] : []));
854
+ this.remove = output();
880
855
  }
881
856
  get severityClass() {
882
- if (!this.toast || !this.toast.severity)
857
+ const toast = this.toast();
858
+ if (!toast || !toast.severity)
883
859
  return '';
884
- return `abp-toast-${this.toast.severity}`;
860
+ return `abp-toast-${toast.severity}`;
885
861
  }
886
862
  get iconClass() {
887
- const { iconClass } = this.toast.options || {};
863
+ const { iconClass } = this.toast().options || {};
888
864
  if (iconClass) {
889
865
  return iconClass;
890
866
  }
891
- switch (this.toast.severity) {
867
+ switch (this.toast().severity) {
892
868
  case 'success':
893
869
  return 'bi-check';
894
870
  case 'info':
@@ -902,7 +878,7 @@ class ToastComponent {
902
878
  }
903
879
  }
904
880
  ngOnInit() {
905
- const { sticky, life } = this.toast.options || {};
881
+ const { sticky, life } = this.toast().options || {};
906
882
  if (sticky)
907
883
  return;
908
884
  const timeout = life || 5000;
@@ -911,38 +887,41 @@ class ToastComponent {
911
887
  }, timeout);
912
888
  }
913
889
  close() {
914
- this.remove.emit(this.toast.options?.id);
890
+ this.remove.emit(this.toast().options?.id);
915
891
  }
916
892
  tap() {
917
- if (this.toast.options?.tapToDismiss)
893
+ if (this.toast().options?.tapToDismiss)
918
894
  this.close();
919
895
  }
920
896
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
921
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ToastComponent, isStandalone: true, 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=\"bi icon\" [ngClass]=\"iconClass\" aria-hidden=\"true\"></i>\r\n </div>\r\n <div class=\"abp-toast-content\">\r\n @if (toast.options?.closable) {\r\n <button class=\"abp-toast-close-button\" (click)=\"close()\">\r\n <i class=\"bi bi-x fs-4\" aria-hidden=\"true\"></i>\r\n </button>\r\n }\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:35px 1fr;gap:5px;margin:5px 0;padding:7px;width:350px;-webkit-user-select:none;user-select:none;z-index:9999;color:#fff;border-radius:8px;font-size:14px;box-shadow:0 0 20px #4c577d05;border:2px solid #f0f0f0;background-color:#f0f0f0;color:#000;box-shadow:0 0 10px -5px #0006}.abp-toast:hover{border:2px solid #e4e4e4;background-color:#e4e4e4;box-shadow:0 0 15px -5px #0006}.abp-toast{opacity:1}.abp-toast.abp-toast-success{border:2px solid #4fbf67;background-color:#4fbf67;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-success:hover{border:2px solid rgb(69.1,187.4,94.45);background-color:#45bb5e;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-info{border:2px solid #438aa7;background-color:#438aa7;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-info:hover{border:2px solid rgb(63.65,131.1,158.65);background-color:#40839f;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-warning{border:2px solid #ff9f38;background-color:#ff9f38;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-warning:hover{border:2px solid rgb(255,151.4984924623,40.45);background-color:#ff9728;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-error{border:2px solid #c00d49;background-color:#c00d49;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-error:hover{border:2px solid rgb(182.4,12.35,69.35);background-color:#b60c45;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:32px}.abp-toast .abp-toast-content{position:relative;display:flex;align-self:center;flex-direction:column;word-break:break-word;padding-bottom:2px}.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:100%;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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
897
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ToastComponent, isStandalone: true, selector: "abp-toast", inputs: { toast: { classPropertyName: "toast", publicName: "toast", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { remove: "remove" }, ngImport: i0, template: "<div class=\"abp-toast\" [class]=\"severityClass\" (click)=\"tap()\">\r\n <div class=\"abp-toast-icon\">\r\n <i class=\"bi icon\" [class]=\"iconClass\" aria-hidden=\"true\"></i>\r\n </div>\r\n <div class=\"abp-toast-content\">\r\n @if (toast().options?.closable) {\r\n <button class=\"abp-toast-close-button\" (click)=\"close()\">\r\n <i class=\"bi bi-x fs-4\" aria-hidden=\"true\"></i>\r\n </button>\r\n }\r\n <div class=\"abp-toast-title\">\r\n {{ toast().title | abpLocalization: toast().options?.titleLocalizationParams }}\r\n </div>\r\n <p class=\"abp-toast-message\"\r\n [innerHTML]=\"toast().message | abpLocalization: toast().options?.messageLocalizationParams\"></p>\r\n </div>\r\n</div>", styles: [".abp-toast{display:grid;grid-template-columns:35px 1fr;gap:5px;margin:5px 0;padding:7px;width:350px;-webkit-user-select:none;user-select:none;z-index:9999;color:#fff;border-radius:8px;font-size:14px;box-shadow:0 0 20px #4c577d05;border:2px solid #f0f0f0;background-color:#f0f0f0;color:#000;box-shadow:0 0 10px -5px #0006}.abp-toast:hover{border:2px solid #e4e4e4;background-color:#e4e4e4;box-shadow:0 0 15px -5px #0006}.abp-toast{opacity:1}.abp-toast.abp-toast-success{border:2px solid #4fbf67;background-color:#4fbf67;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-success:hover{border:2px solid rgb(69.1,187.4,94.45);background-color:#45bb5e;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-info{border:2px solid #438aa7;background-color:#438aa7;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-info:hover{border:2px solid rgb(63.65,131.1,158.65);background-color:#40839f;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-warning{border:2px solid #ff9f38;background-color:#ff9f38;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-warning:hover{border:2px solid rgb(255,151.4984924623,40.45);background-color:#ff9728;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-error{border:2px solid #c00d49;background-color:#c00d49;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-error:hover{border:2px solid rgb(182.4,12.35,69.35);background-color:#b60c45;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:32px}.abp-toast .abp-toast-content{position:relative;display:flex;align-self:center;flex-direction:column;word-break:break-word;padding-bottom:2px}.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:100%;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: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
922
898
  }
923
899
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ToastComponent, decorators: [{
924
900
  type: Component,
925
- args: [{ selector: 'abp-toast', imports: [NgClass, LocalizationPipe], template: "<div class=\"abp-toast\" [ngClass]=\"severityClass\" (click)=\"tap()\">\r\n <div class=\"abp-toast-icon\">\r\n <i class=\"bi icon\" [ngClass]=\"iconClass\" aria-hidden=\"true\"></i>\r\n </div>\r\n <div class=\"abp-toast-content\">\r\n @if (toast.options?.closable) {\r\n <button class=\"abp-toast-close-button\" (click)=\"close()\">\r\n <i class=\"bi bi-x fs-4\" aria-hidden=\"true\"></i>\r\n </button>\r\n }\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:35px 1fr;gap:5px;margin:5px 0;padding:7px;width:350px;-webkit-user-select:none;user-select:none;z-index:9999;color:#fff;border-radius:8px;font-size:14px;box-shadow:0 0 20px #4c577d05;border:2px solid #f0f0f0;background-color:#f0f0f0;color:#000;box-shadow:0 0 10px -5px #0006}.abp-toast:hover{border:2px solid #e4e4e4;background-color:#e4e4e4;box-shadow:0 0 15px -5px #0006}.abp-toast{opacity:1}.abp-toast.abp-toast-success{border:2px solid #4fbf67;background-color:#4fbf67;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-success:hover{border:2px solid rgb(69.1,187.4,94.45);background-color:#45bb5e;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-info{border:2px solid #438aa7;background-color:#438aa7;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-info:hover{border:2px solid rgb(63.65,131.1,158.65);background-color:#40839f;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-warning{border:2px solid #ff9f38;background-color:#ff9f38;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-warning:hover{border:2px solid rgb(255,151.4984924623,40.45);background-color:#ff9728;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-error{border:2px solid #c00d49;background-color:#c00d49;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-error:hover{border:2px solid rgb(182.4,12.35,69.35);background-color:#b60c45;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:32px}.abp-toast .abp-toast-content{position:relative;display:flex;align-self:center;flex-direction:column;word-break:break-word;padding-bottom:2px}.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:100%;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"] }]
926
- }], propDecorators: { toast: [{
927
- type: Input
928
- }], remove: [{
929
- type: Output
930
- }] } });
901
+ args: [{ selector: 'abp-toast', imports: [LocalizationPipe], template: "<div class=\"abp-toast\" [class]=\"severityClass\" (click)=\"tap()\">\r\n <div class=\"abp-toast-icon\">\r\n <i class=\"bi icon\" [class]=\"iconClass\" aria-hidden=\"true\"></i>\r\n </div>\r\n <div class=\"abp-toast-content\">\r\n @if (toast().options?.closable) {\r\n <button class=\"abp-toast-close-button\" (click)=\"close()\">\r\n <i class=\"bi bi-x fs-4\" aria-hidden=\"true\"></i>\r\n </button>\r\n }\r\n <div class=\"abp-toast-title\">\r\n {{ toast().title | abpLocalization: toast().options?.titleLocalizationParams }}\r\n </div>\r\n <p class=\"abp-toast-message\"\r\n [innerHTML]=\"toast().message | abpLocalization: toast().options?.messageLocalizationParams\"></p>\r\n </div>\r\n</div>", styles: [".abp-toast{display:grid;grid-template-columns:35px 1fr;gap:5px;margin:5px 0;padding:7px;width:350px;-webkit-user-select:none;user-select:none;z-index:9999;color:#fff;border-radius:8px;font-size:14px;box-shadow:0 0 20px #4c577d05;border:2px solid #f0f0f0;background-color:#f0f0f0;color:#000;box-shadow:0 0 10px -5px #0006}.abp-toast:hover{border:2px solid #e4e4e4;background-color:#e4e4e4;box-shadow:0 0 15px -5px #0006}.abp-toast{opacity:1}.abp-toast.abp-toast-success{border:2px solid #4fbf67;background-color:#4fbf67;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-success:hover{border:2px solid rgb(69.1,187.4,94.45);background-color:#45bb5e;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-info{border:2px solid #438aa7;background-color:#438aa7;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-info:hover{border:2px solid rgb(63.65,131.1,158.65);background-color:#40839f;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-warning{border:2px solid #ff9f38;background-color:#ff9f38;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-warning:hover{border:2px solid rgb(255,151.4984924623,40.45);background-color:#ff9728;box-shadow:0 0 15px -5px #0006}.abp-toast.abp-toast-error{border:2px solid #c00d49;background-color:#c00d49;color:#fff;box-shadow:0 0 10px -5px #0006}.abp-toast.abp-toast-error:hover{border:2px solid rgb(182.4,12.35,69.35);background-color:#b60c45;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:32px}.abp-toast .abp-toast-content{position:relative;display:flex;align-self:center;flex-direction:column;word-break:break-word;padding-bottom:2px}.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:100%;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"] }]
902
+ }], propDecorators: { toast: [{ type: i0.Input, args: [{ isSignal: true, alias: "toast", required: true }] }], remove: [{ type: i0.Output, args: ["remove"] }] } });
931
903
 
932
904
  class ToastContainerComponent {
933
905
  constructor() {
934
906
  this.toasts = [];
935
- this.right = '30px';
907
+ this.top = input(undefined, ...(ngDevMode ? [{ debugName: "top" }] : []));
908
+ this.rightInput = input('30px', { ...(ngDevMode ? { debugName: "rightInput" } : {}), alias: 'right' });
909
+ this.bottom = input('30px', ...(ngDevMode ? [{ debugName: "bottom" }] : []));
910
+ this.left = input(undefined, ...(ngDevMode ? [{ debugName: "left" }] : []));
911
+ this.toastKey = input(undefined, ...(ngDevMode ? [{ debugName: "toastKey" }] : []));
912
+ this.right = signal('30px', ...(ngDevMode ? [{ debugName: "right" }] : []));
936
913
  this.defaultRight = '30px';
937
914
  this.defaultMobileRight = '0';
938
- this.bottom = '30px';
915
+ effect(() => {
916
+ this.right.set(this.rightInput());
917
+ });
939
918
  }
940
919
  ngOnInit() {
941
920
  this.setDefaultRight();
942
921
  this.toasts$.subscribe(toasts => {
943
- this.toasts = this.toastKey
922
+ this.toasts = this.toastKey()
944
923
  ? toasts.filter(t => {
945
- return t.options && t.options.containerKey !== this.toastKey;
924
+ return t.options && t.options.containerKey !== this.toastKey();
946
925
  })
947
926
  : toasts;
948
927
  });
@@ -952,8 +931,8 @@ class ToastContainerComponent {
952
931
  }
953
932
  setDefaultRight() {
954
933
  const screenWidth = window.innerWidth;
955
- if (screenWidth < 768 && this.right == this.defaultRight) {
956
- this.right = this.defaultMobileRight;
934
+ if (screenWidth < 768 && this.right() === this.defaultRight) {
935
+ this.right.set(this.defaultMobileRight);
957
936
  }
958
937
  }
959
938
  trackByFunc(index, toast) {
@@ -962,25 +941,14 @@ class ToastContainerComponent {
962
941
  return toast.options?.id;
963
942
  }
964
943
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ToastContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
965
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ToastContainerComponent, isStandalone: true, selector: "abp-toast-container", inputs: { top: "top", right: "right", bottom: "bottom", left: "left", toastKey: "toastKey" }, host: { listeners: { "window:resize": "onWindowResize()" } }, 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] }); }
944
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ToastContainerComponent, isStandalone: true, selector: "abp-toast-container", inputs: { top: { classPropertyName: "top", publicName: "top", isSignal: true, isRequired: false, transformFunction: null }, rightInput: { classPropertyName: "rightInput", publicName: "right", isSignal: true, isRequired: false, transformFunction: null }, bottom: { classPropertyName: "bottom", publicName: "bottom", isSignal: true, isRequired: false, transformFunction: null }, left: { classPropertyName: "left", publicName: "left", isSignal: true, isRequired: false, transformFunction: null }, toastKey: { classPropertyName: "toastKey", publicName: "toastKey", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onWindowResize()" } }, 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] }); }
966
945
  }
967
946
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ToastContainerComponent, decorators: [{
968
947
  type: Component,
969
- 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"] }]
970
- }], propDecorators: { top: [{
971
- type: Input
972
- }], right: [{
973
- type: Input
974
- }], bottom: [{
975
- type: Input
976
- }], left: [{
977
- type: Input
978
- }], toastKey: [{
979
- type: Input
980
- }], onWindowResize: [{
981
- type: HostListener,
982
- args: ['window:resize']
983
- }] } });
948
+ args: [{ selector: 'abp-toast-container', animations: [toastInOut], imports: [ToastComponent], host: {
949
+ '(window:resize)': 'onWindowResize()'
950
+ }, 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"] }]
951
+ }], ctorParameters: () => [], propDecorators: { top: [{ type: i0.Input, args: [{ isSignal: true, alias: "top", required: false }] }], rightInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "right", required: false }] }], bottom: [{ type: i0.Input, args: [{ isSignal: true, alias: "bottom", required: false }] }], left: [{ type: i0.Input, args: [{ isSignal: true, alias: "left", required: false }] }], toastKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "toastKey", required: false }] }] } });
984
952
 
985
953
  class ToasterService {
986
954
  setContainer() {
@@ -1637,6 +1605,8 @@ const SUPPRESS_UNSAVED_CHANGES_WARNING = new InjectionToken('SUPPRESS_UNSAVED_CH
1637
1605
  const LOGO_URL_TOKEN = new InjectionToken('LOGO_URL_TOKEN');
1638
1606
  const LOGO_APP_NAME_TOKEN = new InjectionToken('LOGO_APP_NAME_TOKEN');
1639
1607
 
1608
+ const THEME_CHANGE_TOKEN = new InjectionToken('THEME_CHANGE_TOKEN');
1609
+
1640
1610
  class RouterErrorHandlerService {
1641
1611
  constructor() {
1642
1612
  this.routerEvents = inject(RouterEvents);
@@ -1878,134 +1848,128 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
1878
1848
  * https://abp.io/docs/latest/framework/ui/angular/show-password-directive
1879
1849
  */
1880
1850
  class PasswordComponent extends AbstractNgModelComponent {
1851
+ constructor() {
1852
+ super(...arguments);
1853
+ this.inputId = input.required(...(ngDevMode ? [{ debugName: "inputId" }] : []));
1854
+ this.formControlName = input.required(...(ngDevMode ? [{ debugName: "formControlName" }] : []));
1855
+ }
1881
1856
  toggleFieldTextType() {
1882
1857
  this.fieldTextType = !this.fieldTextType;
1883
1858
  }
1884
1859
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PasswordComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1885
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.9", type: PasswordComponent, isStandalone: true, selector: "abp-password", inputs: { inputId: "inputId", formControlName: "formControlName" }, providers: [
1860
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: PasswordComponent, isStandalone: true, selector: "abp-password", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, formControlName: { classPropertyName: "formControlName", publicName: "formControlName", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
1886
1861
  {
1887
1862
  provide: NG_VALUE_ACCESSOR,
1888
1863
  useExisting: forwardRef(() => PasswordComponent),
1889
1864
  multi: true,
1890
1865
  },
1891
- ], 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"] }] }); }
1866
+ ], 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 [class]=\"{\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: "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"] }] }); }
1892
1867
  }
1893
1868
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PasswordComponent, decorators: [{
1894
1869
  type: Component,
1895
- args: [{ selector: 'abp-password', imports: [NgClass, FormsModule, NgxValidateCoreModule], providers: [
1870
+ args: [{ selector: 'abp-password', imports: [FormsModule, NgxValidateCoreModule], providers: [
1896
1871
  {
1897
1872
  provide: NG_VALUE_ACCESSOR,
1898
1873
  useExisting: forwardRef(() => PasswordComponent),
1899
1874
  multi: true,
1900
1875
  },
1901
- ], 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" }]
1902
- }], propDecorators: { inputId: [{
1903
- type: Input
1904
- }], formControlName: [{
1905
- type: Input
1906
- }] } });
1876
+ ], 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 [class]=\"{\r\n 'fa-eye-slash': !fieldTextType,\r\n 'fa-eye': fieldTextType\r\n }\"\r\n ></i>\r\n </button>\r\n</div>\r\n" }]
1877
+ }], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], formControlName: [{ type: i0.Input, args: [{ isSignal: true, alias: "formControlName", required: true }] }] } });
1907
1878
 
1908
1879
  class CardBodyComponent {
1909
1880
  constructor() {
1910
1881
  this.componentClass = 'card-body';
1882
+ this.cardBodyClass = input(undefined, ...(ngDevMode ? [{ debugName: "cardBodyClass" }] : []));
1883
+ this.cardBodyStyle = input(undefined, ...(ngDevMode ? [{ debugName: "cardBodyStyle" }] : []));
1911
1884
  }
1912
1885
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1913
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.9", type: CardBodyComponent, isStandalone: true, selector: "abp-card-body", inputs: { cardBodyClass: "cardBodyClass", cardBodyStyle: "cardBodyStyle" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: ` <div [ngClass]="cardBodyClass" [ngStyle]="cardBodyStyle">
1886
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: CardBodyComponent, isStandalone: true, selector: "abp-card-body", inputs: { cardBodyClass: { classPropertyName: "cardBodyClass", publicName: "cardBodyClass", isSignal: true, isRequired: false, transformFunction: null }, cardBodyStyle: { classPropertyName: "cardBodyStyle", publicName: "cardBodyStyle", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: ` <div [class]="cardBodyClass()" [style]="cardBodyStyle()">
1914
1887
  <ng-content></ng-content>
1915
- </div>`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
1888
+ </div>`, isInline: true }); }
1916
1889
  }
1917
1890
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardBodyComponent, decorators: [{
1918
1891
  type: Component,
1919
1892
  args: [{
1920
1893
  selector: 'abp-card-body',
1921
- template: ` <div [ngClass]="cardBodyClass" [ngStyle]="cardBodyStyle">
1894
+ template: ` <div [class]="cardBodyClass()" [style]="cardBodyStyle()">
1922
1895
  <ng-content></ng-content>
1923
1896
  </div>`,
1924
- imports: [NgClass, NgStyle],
1925
1897
  }]
1926
1898
  }], propDecorators: { componentClass: [{
1927
1899
  type: HostBinding,
1928
1900
  args: ['class']
1929
- }], cardBodyClass: [{
1930
- type: Input
1931
- }], cardBodyStyle: [{
1932
- type: Input
1933
- }] } });
1901
+ }], cardBodyClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardBodyClass", required: false }] }], cardBodyStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardBodyStyle", required: false }] }] } });
1934
1902
 
1935
1903
  class CardComponent {
1904
+ constructor() {
1905
+ this.cardClass = input(undefined, ...(ngDevMode ? [{ debugName: "cardClass" }] : []));
1906
+ this.cardStyle = input(undefined, ...(ngDevMode ? [{ debugName: "cardStyle" }] : []));
1907
+ }
1936
1908
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1937
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.9", type: CardComponent, isStandalone: true, selector: "abp-card", inputs: { cardClass: "cardClass", cardStyle: "cardStyle" }, ngImport: i0, template: ` <div class="card" [ngClass]="cardClass" [ngStyle]="cardStyle">
1909
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: CardComponent, isStandalone: true, selector: "abp-card", inputs: { cardClass: { classPropertyName: "cardClass", publicName: "cardClass", isSignal: true, isRequired: false, transformFunction: null }, cardStyle: { classPropertyName: "cardStyle", publicName: "cardStyle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: ` <div class="card" [class]="cardClass()" [style]="cardStyle()">
1938
1910
  <ng-content></ng-content>
1939
- </div>`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
1911
+ </div>`, isInline: true }); }
1940
1912
  }
1941
1913
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardComponent, decorators: [{
1942
1914
  type: Component,
1943
1915
  args: [{
1944
1916
  selector: 'abp-card',
1945
- template: ` <div class="card" [ngClass]="cardClass" [ngStyle]="cardStyle">
1917
+ template: ` <div class="card" [class]="cardClass()" [style]="cardStyle()">
1946
1918
  <ng-content></ng-content>
1947
1919
  </div>`,
1948
- imports: [NgClass, NgStyle],
1920
+ imports: [],
1949
1921
  }]
1950
- }], propDecorators: { cardClass: [{
1951
- type: Input
1952
- }], cardStyle: [{
1953
- type: Input
1954
- }] } });
1922
+ }], propDecorators: { cardClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardClass", required: false }] }], cardStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardStyle", required: false }] }] } });
1955
1923
 
1956
1924
  class CardHeaderComponent {
1957
1925
  constructor() {
1958
1926
  this.componentClass = 'card-header';
1927
+ this.cardHeaderClass = input(undefined, ...(ngDevMode ? [{ debugName: "cardHeaderClass" }] : []));
1928
+ this.cardHeaderStyle = input(undefined, ...(ngDevMode ? [{ debugName: "cardHeaderStyle" }] : []));
1959
1929
  }
1960
1930
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1961
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.9", type: CardHeaderComponent, isStandalone: true, selector: "abp-card-header", inputs: { cardHeaderClass: "cardHeaderClass", cardHeaderStyle: "cardHeaderStyle" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
1962
- <div [ngClass]="cardHeaderClass" [ngStyle]="cardHeaderStyle">
1931
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: CardHeaderComponent, isStandalone: true, selector: "abp-card-header", inputs: { cardHeaderClass: { classPropertyName: "cardHeaderClass", publicName: "cardHeaderClass", isSignal: true, isRequired: false, transformFunction: null }, cardHeaderStyle: { classPropertyName: "cardHeaderStyle", publicName: "cardHeaderStyle", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
1932
+ <div [class]="cardHeaderClass()" [style]="cardHeaderStyle()">
1963
1933
  <ng-content></ng-content>
1964
1934
  </div>
1965
- `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
1935
+ `, isInline: true }); }
1966
1936
  }
1967
1937
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardHeaderComponent, decorators: [{
1968
1938
  type: Component,
1969
1939
  args: [{ selector: 'abp-card-header', template: `
1970
- <div [ngClass]="cardHeaderClass" [ngStyle]="cardHeaderStyle">
1940
+ <div [class]="cardHeaderClass()" [style]="cardHeaderStyle()">
1971
1941
  <ng-content></ng-content>
1972
1942
  </div>
1973
- `, imports: [NgClass, NgStyle] }]
1943
+ `, imports: [] }]
1974
1944
  }], propDecorators: { componentClass: [{
1975
1945
  type: HostBinding,
1976
1946
  args: ['class']
1977
- }], cardHeaderClass: [{
1978
- type: Input
1979
- }], cardHeaderStyle: [{
1980
- type: Input
1981
- }] } });
1947
+ }], cardHeaderClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardHeaderClass", required: false }] }], cardHeaderStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardHeaderStyle", required: false }] }] } });
1982
1948
 
1983
1949
  class CardFooterComponent {
1984
1950
  constructor() {
1985
1951
  this.componentClass = 'card-footer';
1952
+ this.cardFooterStyle = input(undefined, ...(ngDevMode ? [{ debugName: "cardFooterStyle" }] : []));
1953
+ this.cardFooterClass = input(undefined, ...(ngDevMode ? [{ debugName: "cardFooterClass" }] : []));
1986
1954
  }
1987
1955
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1988
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.9", type: CardFooterComponent, isStandalone: true, selector: "abp-card-footer", inputs: { cardFooterStyle: "cardFooterStyle", cardFooterClass: "cardFooterClass" }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
1989
- <div [ngStyle]="cardFooterStyle" [ngClass]="cardFooterClass">
1956
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: CardFooterComponent, isStandalone: true, selector: "abp-card-footer", inputs: { cardFooterStyle: { classPropertyName: "cardFooterStyle", publicName: "cardFooterStyle", isSignal: true, isRequired: false, transformFunction: null }, cardFooterClass: { classPropertyName: "cardFooterClass", publicName: "cardFooterClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.componentClass" } }, ngImport: i0, template: `
1957
+ <div [style]="cardFooterStyle()" [class]="cardFooterClass()">
1990
1958
  <ng-content></ng-content>
1991
1959
  </div>
1992
- `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
1960
+ `, isInline: true }); }
1993
1961
  }
1994
1962
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: CardFooterComponent, decorators: [{
1995
1963
  type: Component,
1996
1964
  args: [{ selector: 'abp-card-footer', template: `
1997
- <div [ngStyle]="cardFooterStyle" [ngClass]="cardFooterClass">
1965
+ <div [style]="cardFooterStyle()" [class]="cardFooterClass()">
1998
1966
  <ng-content></ng-content>
1999
1967
  </div>
2000
- `, imports: [NgClass, NgStyle] }]
1968
+ `, imports: [] }]
2001
1969
  }], propDecorators: { componentClass: [{
2002
1970
  type: HostBinding,
2003
1971
  args: ['class']
2004
- }], cardFooterStyle: [{
2005
- type: Input
2006
- }], cardFooterClass: [{
2007
- type: Input
2008
- }] } });
1972
+ }], cardFooterStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardFooterStyle", required: false }] }], cardFooterClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardFooterClass", required: false }] }] } });
2009
1973
 
2010
1974
  class CardTitleDirective {
2011
1975
  constructor() {
@@ -2116,14 +2080,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
2116
2080
  class FormCheckboxComponent extends AbstractNgModelComponent {
2117
2081
  constructor() {
2118
2082
  super(...arguments);
2119
- this.labelClass = 'form-check-label';
2120
- this.checkboxClass = 'form-check-input';
2121
- this.checkboxReadonly = false;
2122
- this.checkboxBlur = new EventEmitter();
2123
- this.checkboxFocus = new EventEmitter();
2083
+ this.label = input(undefined, ...(ngDevMode ? [{ debugName: "label" }] : []));
2084
+ this.labelClass = input('form-check-label', ...(ngDevMode ? [{ debugName: "labelClass" }] : []));
2085
+ this.checkboxId = input.required(...(ngDevMode ? [{ debugName: "checkboxId" }] : []));
2086
+ this.checkboxStyle = input(undefined, ...(ngDevMode ? [{ debugName: "checkboxStyle" }] : []));
2087
+ this.checkboxClass = input('form-check-input', ...(ngDevMode ? [{ debugName: "checkboxClass" }] : []));
2088
+ this.checkboxReadonly = input(false, ...(ngDevMode ? [{ debugName: "checkboxReadonly" }] : []));
2089
+ this.checkboxBlur = output();
2090
+ this.checkboxFocus = output();
2124
2091
  }
2125
2092
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: FormCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2126
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: FormCheckboxComponent, isStandalone: true, selector: "abp-checkbox", inputs: { label: "label", labelClass: "labelClass", checkboxId: "checkboxId", checkboxStyle: "checkboxStyle", checkboxClass: "checkboxClass", checkboxReadonly: "checkboxReadonly" }, outputs: { checkboxBlur: "checkboxBlur", checkboxFocus: "checkboxFocus" }, providers: [
2093
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: FormCheckboxComponent, isStandalone: true, selector: "abp-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, checkboxId: { classPropertyName: "checkboxId", publicName: "checkboxId", isSignal: true, isRequired: true, transformFunction: null }, checkboxStyle: { classPropertyName: "checkboxStyle", publicName: "checkboxStyle", isSignal: true, isRequired: false, transformFunction: null }, checkboxClass: { classPropertyName: "checkboxClass", publicName: "checkboxClass", isSignal: true, isRequired: false, transformFunction: null }, checkboxReadonly: { classPropertyName: "checkboxReadonly", publicName: "checkboxReadonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkboxBlur: "checkboxBlur", checkboxFocus: "checkboxFocus" }, providers: [
2127
2094
  {
2128
2095
  provide: NG_VALUE_ACCESSOR,
2129
2096
  useExisting: forwardRef(() => FormCheckboxComponent),
@@ -2134,20 +2101,20 @@ class FormCheckboxComponent extends AbstractNgModelComponent {
2134
2101
  <input
2135
2102
  type="checkbox"
2136
2103
  [(ngModel)]="value"
2137
- [id]="checkboxId"
2138
- [readonly]="checkboxReadonly"
2139
- [ngClass]="checkboxClass"
2140
- [ngStyle]="checkboxStyle"
2141
- (blur)="checkboxBlur.next()"
2142
- (focus)="checkboxFocus.next()"
2104
+ [id]="checkboxId()"
2105
+ [readonly]="checkboxReadonly()"
2106
+ [class]="checkboxClass()"
2107
+ [style]="checkboxStyle()"
2108
+ (blur)="checkboxBlur.emit()"
2109
+ (focus)="checkboxFocus.emit()"
2143
2110
  />
2144
- @if (label) {
2145
- <label [ngClass]="labelClass" [for]="checkboxId">
2146
- {{ label | abpLocalization }}
2111
+ @if (label()) {
2112
+ <label [class]="labelClass()" [for]="checkboxId()">
2113
+ {{ label() | abpLocalization }}
2147
2114
  </label>
2148
2115
  }
2149
2116
  </div>
2150
- `, 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" }] }); }
2117
+ `, isInline: true, dependencies: [{ 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" }] }); }
2151
2118
  }
2152
2119
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: FormCheckboxComponent, decorators: [{
2153
2120
  type: Component,
@@ -2158,16 +2125,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
2158
2125
  <input
2159
2126
  type="checkbox"
2160
2127
  [(ngModel)]="value"
2161
- [id]="checkboxId"
2162
- [readonly]="checkboxReadonly"
2163
- [ngClass]="checkboxClass"
2164
- [ngStyle]="checkboxStyle"
2165
- (blur)="checkboxBlur.next()"
2166
- (focus)="checkboxFocus.next()"
2128
+ [id]="checkboxId()"
2129
+ [readonly]="checkboxReadonly()"
2130
+ [class]="checkboxClass()"
2131
+ [style]="checkboxStyle()"
2132
+ (blur)="checkboxBlur.emit()"
2133
+ (focus)="checkboxFocus.emit()"
2167
2134
  />
2168
- @if (label) {
2169
- <label [ngClass]="labelClass" [for]="checkboxId">
2170
- {{ label | abpLocalization }}
2135
+ @if (label()) {
2136
+ <label [class]="labelClass()" [for]="checkboxId()">
2137
+ {{ label() | abpLocalization }}
2171
2138
  </label>
2172
2139
  }
2173
2140
  </div>
@@ -2179,39 +2146,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
2179
2146
  multi: true,
2180
2147
  },
2181
2148
  ],
2182
- imports: [NgClass, NgStyle, FormsModule, LocalizationPipe],
2149
+ imports: [FormsModule, LocalizationPipe],
2183
2150
  }]
2184
- }], propDecorators: { label: [{
2185
- type: Input
2186
- }], labelClass: [{
2187
- type: Input
2188
- }], checkboxId: [{
2189
- type: Input
2190
- }], checkboxStyle: [{
2191
- type: Input
2192
- }], checkboxClass: [{
2193
- type: Input
2194
- }], checkboxReadonly: [{
2195
- type: Input
2196
- }], checkboxBlur: [{
2197
- type: Output
2198
- }], checkboxFocus: [{
2199
- type: Output
2200
- }] } });
2151
+ }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], checkboxId: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxId", required: true }] }], checkboxStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxStyle", required: false }] }], checkboxClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxClass", required: false }] }], checkboxReadonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxReadonly", required: false }] }], checkboxBlur: [{ type: i0.Output, args: ["checkboxBlur"] }], checkboxFocus: [{ type: i0.Output, args: ["checkboxFocus"] }] } });
2201
2152
 
2202
2153
  class FormInputComponent extends AbstractNgModelComponent {
2203
2154
  constructor() {
2204
2155
  super(...arguments);
2205
- this.inputReadonly = false;
2206
- this.label = '';
2207
- this.labelClass = 'form-label';
2208
- this.inputPlaceholder = '';
2209
- this.inputClass = 'form-control';
2210
- this.formBlur = new EventEmitter();
2211
- this.formFocus = new EventEmitter();
2156
+ this.inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : []));
2157
+ this.inputReadonly = input(false, ...(ngDevMode ? [{ debugName: "inputReadonly" }] : []));
2158
+ this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
2159
+ this.labelClass = input('form-label', ...(ngDevMode ? [{ debugName: "labelClass" }] : []));
2160
+ this.inputPlaceholder = input('', ...(ngDevMode ? [{ debugName: "inputPlaceholder" }] : []));
2161
+ this.inputStyle = input(undefined, ...(ngDevMode ? [{ debugName: "inputStyle" }] : []));
2162
+ this.inputClass = input('form-control', ...(ngDevMode ? [{ debugName: "inputClass" }] : []));
2163
+ this.formBlur = output();
2164
+ this.formFocus = output();
2212
2165
  }
2213
2166
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: FormInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2214
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: FormInputComponent, isStandalone: true, 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: [
2167
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: FormInputComponent, isStandalone: true, selector: "abp-form-input", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, inputReadonly: { classPropertyName: "inputReadonly", publicName: "inputReadonly", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, inputPlaceholder: { classPropertyName: "inputPlaceholder", publicName: "inputPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, inputStyle: { classPropertyName: "inputStyle", publicName: "inputStyle", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { formBlur: "formBlur", formFocus: "formFocus" }, providers: [
2215
2168
  {
2216
2169
  provide: NG_VALUE_ACCESSOR,
2217
2170
  useExisting: forwardRef(() => FormInputComponent),
@@ -2219,24 +2172,24 @@ class FormInputComponent extends AbstractNgModelComponent {
2219
2172
  },
2220
2173
  ], usesInheritance: true, ngImport: i0, template: `
2221
2174
  <div class="mb-3">
2222
- @if (label) {
2223
- <label [ngClass]="labelClass" [for]="inputId">
2224
- {{ label | abpLocalization }}
2175
+ @if (label()) {
2176
+ <label [class]="labelClass()" [for]="inputId()">
2177
+ {{ label() | abpLocalization }}
2225
2178
  </label>
2226
2179
  }
2227
2180
  <input
2228
2181
  type="text"
2229
- [id]="inputId"
2230
- [placeholder]="inputPlaceholder"
2231
- [readonly]="inputReadonly"
2232
- [ngClass]="inputClass"
2233
- [ngStyle]="inputStyle"
2234
- (blur)="formBlur.next()"
2235
- (focus)="formFocus.next()"
2182
+ [id]="inputId()"
2183
+ [placeholder]="inputPlaceholder()"
2184
+ [readonly]="inputReadonly()"
2185
+ [class]="inputClass()"
2186
+ [style]="inputStyle()"
2187
+ (blur)="formBlur.emit()"
2188
+ (focus)="formFocus.emit()"
2236
2189
  [(ngModel)]="value"
2237
2190
  />
2238
2191
  </div>
2239
- `, 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.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: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
2192
+ `, isInline: true, dependencies: [{ 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: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
2240
2193
  }
2241
2194
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: FormInputComponent, decorators: [{
2242
2195
  type: Component,
@@ -2244,20 +2197,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
2244
2197
  selector: 'abp-form-input',
2245
2198
  template: `
2246
2199
  <div class="mb-3">
2247
- @if (label) {
2248
- <label [ngClass]="labelClass" [for]="inputId">
2249
- {{ label | abpLocalization }}
2200
+ @if (label()) {
2201
+ <label [class]="labelClass()" [for]="inputId()">
2202
+ {{ label() | abpLocalization }}
2250
2203
  </label>
2251
2204
  }
2252
2205
  <input
2253
2206
  type="text"
2254
- [id]="inputId"
2255
- [placeholder]="inputPlaceholder"
2256
- [readonly]="inputReadonly"
2257
- [ngClass]="inputClass"
2258
- [ngStyle]="inputStyle"
2259
- (blur)="formBlur.next()"
2260
- (focus)="formFocus.next()"
2207
+ [id]="inputId()"
2208
+ [placeholder]="inputPlaceholder()"
2209
+ [readonly]="inputReadonly()"
2210
+ [class]="inputClass()"
2211
+ [style]="inputStyle()"
2212
+ (blur)="formBlur.emit()"
2213
+ (focus)="formFocus.emit()"
2261
2214
  [(ngModel)]="value"
2262
2215
  />
2263
2216
  </div>
@@ -2269,27 +2222,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
2269
2222
  multi: true,
2270
2223
  },
2271
2224
  ],
2272
- imports: [NgClass, NgStyle, LocalizationPipe, FormsModule],
2225
+ imports: [LocalizationPipe, FormsModule],
2273
2226
  }]
2274
- }], propDecorators: { inputId: [{
2275
- type: Input
2276
- }], inputReadonly: [{
2277
- type: Input
2278
- }], label: [{
2279
- type: Input
2280
- }], labelClass: [{
2281
- type: Input
2282
- }], inputPlaceholder: [{
2283
- type: Input
2284
- }], inputStyle: [{
2285
- type: Input
2286
- }], inputClass: [{
2287
- type: Input
2288
- }], formBlur: [{
2289
- type: Output
2290
- }], formFocus: [{
2291
- type: Output
2292
- }] } });
2227
+ }], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], inputReadonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputReadonly", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], inputPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputPlaceholder", required: false }] }], inputStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputStyle", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], formBlur: [{ type: i0.Output, args: ["formBlur"] }], formFocus: [{ type: i0.Output, args: ["formFocus"] }] } });
2293
2228
 
2294
2229
  class InternetConnectionStatusComponent {
2295
2230
  constructor() {
@@ -2356,84 +2291,75 @@ class EllipsisDirective {
2356
2291
  constructor() {
2357
2292
  this.cdRef = inject(ChangeDetectorRef);
2358
2293
  this.elRef = inject(ElementRef);
2359
- this.enabled = true;
2360
- }
2361
- get inlineClass() {
2362
- return this.enabled && this.width;
2363
- }
2364
- get class() {
2365
- return this.enabled && !this.width;
2366
- }
2367
- get maxWidth() {
2368
- return this.enabled && this.width ? this.width || '170px' : undefined;
2294
+ this.width = input(undefined, { ...(ngDevMode ? { debugName: "width" } : {}), alias: 'abpEllipsis' });
2295
+ this.title = input(undefined, ...(ngDevMode ? [{ debugName: "title" }] : []));
2296
+ this.enabled = input(true, { ...(ngDevMode ? { debugName: "enabled" } : {}), alias: 'abpEllipsisEnabled' });
2297
+ this.autoTitle = signal(undefined, ...(ngDevMode ? [{ debugName: "autoTitle" }] : []));
2298
+ this.effectiveTitle = computed(() => this.title() || this.autoTitle(), ...(ngDevMode ? [{ debugName: "effectiveTitle" }] : []));
2299
+ this.inlineClass = computed(() => this.enabled() && !!this.width(), ...(ngDevMode ? [{ debugName: "inlineClass" }] : []));
2300
+ this.ellipsisClass = computed(() => this.enabled() && !this.width(), ...(ngDevMode ? [{ debugName: "ellipsisClass" }] : []));
2301
+ this.maxWidth = computed(() => {
2302
+ const width = this.width();
2303
+ return this.enabled() && width ? width || '170px' : undefined;
2304
+ }, ...(ngDevMode ? [{ debugName: "maxWidth" }] : []));
2369
2305
  }
2370
2306
  ngAfterViewInit() {
2371
- this.title = this.title || this.elRef.nativeElement.innerText;
2372
- this.cdRef.detectChanges();
2307
+ if (!this.title()) {
2308
+ this.autoTitle.set(this.elRef.nativeElement.innerText);
2309
+ this.cdRef.detectChanges();
2310
+ }
2373
2311
  }
2374
2312
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: EllipsisDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2375
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: EllipsisDirective, isStandalone: true, 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 }); }
2313
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: EllipsisDirective, isStandalone: true, selector: "[abpEllipsis]", inputs: { width: { classPropertyName: "width", publicName: "abpEllipsis", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, enabled: { classPropertyName: "enabled", publicName: "abpEllipsisEnabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "title": "effectiveTitle()", "class.abp-ellipsis-inline": "inlineClass()", "class.abp-ellipsis": "ellipsisClass()", "style.max-width": "maxWidth()" } }, ngImport: i0 }); }
2376
2314
  }
2377
2315
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: EllipsisDirective, decorators: [{
2378
2316
  type: Directive,
2379
2317
  args: [{
2380
2318
  selector: '[abpEllipsis]',
2319
+ host: {
2320
+ '[title]': 'effectiveTitle()',
2321
+ '[class.abp-ellipsis-inline]': 'inlineClass()',
2322
+ '[class.abp-ellipsis]': 'ellipsisClass()',
2323
+ '[style.max-width]': 'maxWidth()'
2324
+ }
2381
2325
  }]
2382
- }], propDecorators: { width: [{
2383
- type: Input,
2384
- args: ['abpEllipsis']
2385
- }], title: [{
2386
- type: HostBinding,
2387
- args: ['title']
2388
- }, {
2389
- type: Input
2390
- }], enabled: [{
2391
- type: Input,
2392
- args: ['abpEllipsisEnabled']
2393
- }], inlineClass: [{
2394
- type: HostBinding,
2395
- args: ['class.abp-ellipsis-inline']
2396
- }], class: [{
2397
- type: HostBinding,
2398
- args: ['class.abp-ellipsis']
2399
- }], maxWidth: [{
2400
- type: HostBinding,
2401
- args: ['style.max-width']
2402
- }] } });
2326
+ }], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "abpEllipsis", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], enabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "abpEllipsisEnabled", required: false }] }] } });
2403
2327
 
2404
2328
  class LoadingDirective {
2405
2329
  constructor() {
2406
2330
  this.elRef = inject(ElementRef);
2407
- this.cdRes = inject(ComponentFactoryResolver);
2408
2331
  this.injector = inject(Injector);
2409
2332
  this.renderer = inject(Renderer2);
2410
- this.position = 'relative';
2411
- this.delay = 0;
2333
+ this.viewContainerRef = inject(ViewContainerRef);
2334
+ this.loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : {}), alias: 'abpLoading' });
2335
+ this.targetElementInput = input(undefined, { ...(ngDevMode ? { debugName: "targetElementInput" } : {}), alias: 'abpLoadingTargetElement' });
2336
+ this.delay = input(0, { ...(ngDevMode ? { debugName: "delay" } : {}), alias: 'abpLoadingDelay' });
2337
+ this.componentRef = null;
2412
2338
  this.rootNode = null;
2413
2339
  this.timerSubscription = null;
2340
+ effect(() => {
2341
+ const newValue = this.loading();
2342
+ this.handleLoadingChange(newValue);
2343
+ });
2414
2344
  }
2415
- get loading() {
2416
- return this._loading;
2417
- }
2418
- set loading(newValue) {
2345
+ handleLoadingChange(newValue) {
2419
2346
  setTimeout(() => {
2420
2347
  if (!newValue && this.timerSubscription) {
2421
2348
  this.timerSubscription.unsubscribe();
2422
2349
  this.timerSubscription = null;
2423
- this._loading = newValue;
2424
2350
  if (this.rootNode) {
2425
2351
  this.renderer.removeChild(this.rootNode.parentElement, this.rootNode);
2426
2352
  this.rootNode = null;
2427
2353
  }
2428
2354
  return;
2429
2355
  }
2430
- this.timerSubscription = timer(this.delay)
2356
+ this.timerSubscription = timer(this.delay())
2431
2357
  .pipe(take(1))
2432
2358
  .subscribe(() => {
2433
2359
  if (!this.componentRef) {
2434
- this.componentRef = this.cdRes
2435
- .resolveComponentFactory(LoadingComponent)
2436
- .create(this.injector);
2360
+ this.componentRef = this.viewContainerRef.createComponent(LoadingComponent, {
2361
+ injector: this.injector
2362
+ });
2437
2363
  }
2438
2364
  if (newValue && !this.rootNode) {
2439
2365
  this.rootNode = this.componentRef.hostView.rootNodes[0];
@@ -2443,12 +2369,12 @@ class LoadingDirective {
2443
2369
  this.renderer.removeChild(this.rootNode.parentElement, this.rootNode);
2444
2370
  this.rootNode = null;
2445
2371
  }
2446
- this._loading = newValue;
2447
2372
  this.timerSubscription = null;
2448
2373
  });
2449
2374
  }, 0);
2450
2375
  }
2451
2376
  ngOnInit() {
2377
+ this.targetElement = this.targetElementInput();
2452
2378
  if (!this.targetElement) {
2453
2379
  const { offsetHeight, offsetWidth } = this.elRef.nativeElement;
2454
2380
  if (!offsetHeight && !offsetWidth && this.elRef.nativeElement.children?.length) {
@@ -2465,30 +2391,21 @@ class LoadingDirective {
2465
2391
  }
2466
2392
  }
2467
2393
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: LoadingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2468
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: LoadingDirective, isStandalone: true, selector: "[abpLoading]", inputs: { loading: ["abpLoading", "loading"], targetElement: ["abpLoadingTargetElement", "targetElement"], delay: ["abpLoadingDelay", "delay"] }, host: { properties: { "style.position": "this.position" } }, ngImport: i0 }); }
2394
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: LoadingDirective, isStandalone: true, selector: "[abpLoading]", inputs: { loading: { classPropertyName: "loading", publicName: "abpLoading", isSignal: true, isRequired: false, transformFunction: null }, targetElementInput: { classPropertyName: "targetElementInput", publicName: "abpLoadingTargetElement", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "abpLoadingDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.position": "\"relative\"" } }, ngImport: i0 }); }
2469
2395
  }
2470
2396
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: LoadingDirective, decorators: [{
2471
2397
  type: Directive,
2472
2398
  args: [{
2473
2399
  selector: '[abpLoading]',
2400
+ host: {
2401
+ '[style.position]': '"relative"'
2402
+ }
2474
2403
  }]
2475
- }], propDecorators: { position: [{
2476
- type: HostBinding,
2477
- args: ['style.position']
2478
- }], loading: [{
2479
- type: Input,
2480
- args: ['abpLoading']
2481
- }], targetElement: [{
2482
- type: Input,
2483
- args: ['abpLoadingTargetElement']
2484
- }], delay: [{
2485
- type: Input,
2486
- args: ['abpLoadingDelay']
2487
- }] } });
2404
+ }], ctorParameters: () => [], propDecorators: { loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "abpLoading", required: false }] }], targetElementInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "abpLoadingTargetElement", required: false }] }], delay: [{ type: i0.Input, args: [{ isSignal: true, alias: "abpLoadingDelay", required: false }] }] } });
2488
2405
 
2489
2406
  class NgxDatatableDefaultDirective {
2490
2407
  get classes() {
2491
- return `ngx-datatable ${this.class}`;
2408
+ return `ngx-datatable ${this.class()}`;
2492
2409
  }
2493
2410
  constructor() {
2494
2411
  this.table = inject(DatatableComponent);
@@ -2496,7 +2413,7 @@ class NgxDatatableDefaultDirective {
2496
2413
  this.platformId = inject(PLATFORM_ID);
2497
2414
  this.subscription = new Subscription();
2498
2415
  this.resizeDiff = 0;
2499
- this.class = 'material bordered';
2416
+ this.class = input('material bordered', ...(ngDevMode ? [{ debugName: "class" }] : []));
2500
2417
  this.table.columnMode = ColumnMode.force;
2501
2418
  this.table.footerHeight = 50;
2502
2419
  this.table.headerHeight = 50;
@@ -2539,7 +2456,7 @@ class NgxDatatableDefaultDirective {
2539
2456
  this.subscription.unsubscribe();
2540
2457
  }
2541
2458
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: NgxDatatableDefaultDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2542
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: NgxDatatableDefaultDirective, isStandalone: true, selector: "ngx-datatable[default]", inputs: { class: "class" }, host: { properties: { "class": "this.classes" } }, exportAs: ["ngxDatatableDefault"], ngImport: i0 }); }
2459
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: NgxDatatableDefaultDirective, isStandalone: true, selector: "ngx-datatable[default]", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.classes" } }, exportAs: ["ngxDatatableDefault"], ngImport: i0 }); }
2543
2460
  }
2544
2461
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: NgxDatatableDefaultDirective, decorators: [{
2545
2462
  type: Directive,
@@ -2548,9 +2465,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
2548
2465
  selector: 'ngx-datatable[default]',
2549
2466
  exportAs: 'ngxDatatableDefault',
2550
2467
  }]
2551
- }], ctorParameters: () => [], propDecorators: { class: [{
2552
- type: Input
2553
- }], classes: [{
2468
+ }], ctorParameters: () => [], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], classes: [{
2554
2469
  type: HostBinding,
2555
2470
  args: ['class']
2556
2471
  }] } });
@@ -2564,6 +2479,7 @@ class NgxDatatableListDirective {
2564
2479
  this.ngxDatatableMessages = inject(NGX_DATATABLE_MESSAGES, { optional: true });
2565
2480
  this.viewContainerRef = inject(ViewContainerRef);
2566
2481
  this.renderer = inject(Renderer2);
2482
+ this.list = input.required(...(ngDevMode ? [{ debugName: "list" }] : []));
2567
2483
  this.setInitialValues();
2568
2484
  }
2569
2485
  ngDoCheck() {
@@ -2583,7 +2499,7 @@ class NgxDatatableListDirective {
2583
2499
  this.table.offset = page;
2584
2500
  }
2585
2501
  subscribeToRequestStatus() {
2586
- const requestStatus$ = this.list.requestStatus$.pipe(distinctUntilChanged());
2502
+ const requestStatus$ = this.list().requestStatus$.pipe(distinctUntilChanged());
2587
2503
  const { emptyMessage, errorMessage } = this.ngxDatatableMessages || defaultNgxDatatableMessages;
2588
2504
  requestStatus$.subscribe(status => {
2589
2505
  this.table.loadingIndicator = false;
@@ -2641,15 +2557,16 @@ class NgxDatatableListDirective {
2641
2557
  this.table.sort
2642
2558
  .pipe(takeUntilDestroyed(this.destroyRef))
2643
2559
  .subscribe(({ sorts: [{ prop, dir }] }) => {
2644
- if (prop === this.list.sortKey && this.list.sortOrder === 'desc') {
2645
- this.list.sortKey = '';
2646
- this.list.sortOrder = '';
2560
+ const list = this.list();
2561
+ if (prop === list.sortKey && list.sortOrder === 'desc') {
2562
+ list.sortKey = '';
2563
+ list.sortOrder = '';
2647
2564
  this.table.sorts = [];
2648
2565
  this.cdRef.detectChanges();
2649
2566
  }
2650
2567
  else {
2651
- this.list.sortKey = prop;
2652
- this.list.sortOrder = dir;
2568
+ list.sortKey = prop;
2569
+ list.sortOrder = dir;
2653
2570
  }
2654
2571
  });
2655
2572
  }
@@ -2659,35 +2576,35 @@ class NgxDatatableListDirective {
2659
2576
  });
2660
2577
  }
2661
2578
  subscribeToQuery() {
2662
- this.list.query$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {
2663
- const offset = this.list.page;
2579
+ this.list().query$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {
2580
+ const offset = this.list().page;
2664
2581
  if (this.table.offset !== offset)
2665
2582
  this.table.offset = offset;
2666
2583
  });
2667
2584
  }
2668
2585
  setTablePage(pageNum) {
2669
- this.list.page = pageNum;
2586
+ this.list().page = pageNum;
2670
2587
  this.table.offset = pageNum;
2671
2588
  }
2672
2589
  refreshPageIfDataExist() {
2673
2590
  if (this.table.rows?.length < 1 && this.table.count > 0) {
2674
- let maxPage = Math.floor(Number(this.table.count / this.list.maxResultCount));
2675
- if (this.table.count < this.list.maxResultCount) {
2591
+ let maxPage = Math.floor(Number(this.table.count / this.list().maxResultCount));
2592
+ if (this.table.count < this.list().maxResultCount) {
2676
2593
  this.setTablePage(0);
2677
2594
  return;
2678
2595
  }
2679
- if (this.table.count % this.list.maxResultCount === 0) {
2596
+ if (this.table.count % this.list().maxResultCount === 0) {
2680
2597
  maxPage -= 1;
2681
2598
  }
2682
- if (this.list.page < maxPage) {
2683
- this.setTablePage(this.list.page);
2599
+ if (this.list().page < maxPage) {
2600
+ this.setTablePage(this.list().page);
2684
2601
  return;
2685
2602
  }
2686
2603
  this.setTablePage(maxPage);
2687
2604
  }
2688
2605
  }
2689
2606
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: NgxDatatableListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2690
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: NgxDatatableListDirective, isStandalone: true, selector: "ngx-datatable[list]", inputs: { list: "list" }, exportAs: ["ngxDatatableList"], usesOnChanges: true, ngImport: i0 }); }
2607
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: NgxDatatableListDirective, isStandalone: true, selector: "ngx-datatable[list]", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["ngxDatatableList"], usesOnChanges: true, ngImport: i0 }); }
2691
2608
  }
2692
2609
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: NgxDatatableListDirective, decorators: [{
2693
2610
  type: Directive,
@@ -2696,27 +2613,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
2696
2613
  selector: 'ngx-datatable[list]',
2697
2614
  exportAs: 'ngxDatatableList',
2698
2615
  }]
2699
- }], ctorParameters: () => [], propDecorators: { list: [{
2700
- type: Input
2701
- }] } });
2616
+ }], ctorParameters: () => [], propDecorators: { list: [{ type: i0.Input, args: [{ isSignal: true, alias: "list", required: true }] }] } });
2702
2617
 
2703
2618
  class AbpVisibleDirective {
2704
2619
  constructor() {
2705
2620
  this.viewContainerRef = inject(ViewContainerRef);
2706
2621
  this.templateRef = inject(TemplateRef);
2707
2622
  this.condition$ = of(false);
2708
- }
2709
- set abpVisible(value) {
2710
- this.condition$ = checkType(value);
2711
- this.subscribeToCondition();
2712
- }
2713
- ngOnInit() {
2714
- this.updateVisibility();
2623
+ this.abpVisible = input(...(ngDevMode ? [undefined, { debugName: "abpVisible" }] : []));
2624
+ effect(() => {
2625
+ const value = this.abpVisible();
2626
+ if (value === this.lastInput)
2627
+ return;
2628
+ this.lastInput = value;
2629
+ this.condition$ = checkType(value);
2630
+ this.subscribeToCondition();
2631
+ });
2715
2632
  }
2716
2633
  ngOnDestroy() {
2717
2634
  this.conditionSubscription?.unsubscribe();
2718
2635
  }
2719
2636
  subscribeToCondition() {
2637
+ this.conditionSubscription?.unsubscribe();
2720
2638
  this.conditionSubscription = this.condition$.subscribe(value => {
2721
2639
  this.isVisible = value;
2722
2640
  this.updateVisibility();
@@ -2731,16 +2649,14 @@ class AbpVisibleDirective {
2731
2649
  this.viewContainerRef.createEmbeddedView(this.templateRef);
2732
2650
  }
2733
2651
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: AbpVisibleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2734
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: AbpVisibleDirective, isStandalone: true, selector: "[abpVisible]", inputs: { abpVisible: "abpVisible" }, ngImport: i0 }); }
2652
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: AbpVisibleDirective, isStandalone: true, selector: "[abpVisible]", inputs: { abpVisible: { classPropertyName: "abpVisible", publicName: "abpVisible", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
2735
2653
  }
2736
2654
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: AbpVisibleDirective, decorators: [{
2737
2655
  type: Directive,
2738
2656
  args: [{
2739
2657
  selector: '[abpVisible]',
2740
2658
  }]
2741
- }], propDecorators: { abpVisible: [{
2742
- type: Input
2743
- }] } });
2659
+ }], ctorParameters: () => [], propDecorators: { abpVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "abpVisible", required: false }] }] } });
2744
2660
  function checkType(value) {
2745
2661
  if (value instanceof Promise) {
2746
2662
  return from(value);
@@ -2762,25 +2678,24 @@ function checkType(value) {
2762
2678
  class DisabledDirective {
2763
2679
  constructor() {
2764
2680
  this.ngControl = inject(NgControl, { host: true });
2765
- this.abpDisabled = false;
2766
- }
2767
- // Related issue: https://github.com/angular/angular/issues/35330
2768
- ngOnChanges({ abpDisabled }) {
2769
- if (this.ngControl.control && abpDisabled) {
2770
- this.ngControl.control[abpDisabled.currentValue ? 'disable' : 'enable']();
2771
- }
2681
+ this.abpDisabled = input(false, ...(ngDevMode ? [{ debugName: "abpDisabled" }] : []));
2682
+ // Related issue: https://github.com/angular/angular/issues/35330
2683
+ this.disabledEffect = effect(() => {
2684
+ const disabled = this.abpDisabled();
2685
+ if (this.ngControl.control) {
2686
+ this.ngControl.control[disabled ? 'disable' : 'enable']();
2687
+ }
2688
+ }, ...(ngDevMode ? [{ debugName: "disabledEffect" }] : []));
2772
2689
  }
2773
2690
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DisabledDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2774
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: DisabledDirective, isStandalone: true, selector: "[abpDisabled]", inputs: { abpDisabled: "abpDisabled" }, usesOnChanges: true, ngImport: i0 }); }
2691
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: DisabledDirective, isStandalone: true, selector: "[abpDisabled]", inputs: { abpDisabled: { classPropertyName: "abpDisabled", publicName: "abpDisabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
2775
2692
  }
2776
2693
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DisabledDirective, decorators: [{
2777
2694
  type: Directive,
2778
2695
  args: [{
2779
2696
  selector: '[abpDisabled]',
2780
2697
  }]
2781
- }], propDecorators: { abpDisabled: [{
2782
- type: Input
2783
- }] } });
2698
+ }], propDecorators: { abpDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "abpDisabled", required: false }] }] } });
2784
2699
 
2785
2700
  var eFormComponets;
2786
2701
  (function (eFormComponets) {
@@ -3291,10 +3206,8 @@ class BaseThemeSharedModule {
3291
3206
  NgxDatatableListDirective,
3292
3207
  NgxDatatableDefaultDirective,
3293
3208
  PasswordComponent] }); }
3294
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: BaseThemeSharedModule, imports: [ButtonComponent,
3295
- FormInputComponent,
3209
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: BaseThemeSharedModule, imports: [FormInputComponent,
3296
3210
  FormCheckboxComponent,
3297
- HttpErrorWrapperComponent,
3298
3211
  NgxDatatableModule,
3299
3212
  NgxValidateCoreModule,
3300
3213
  CardModule,
@@ -3343,5 +3256,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
3343
3256
  * Generated bundle index. Do not edit.
3344
3257
  */
3345
3258
 
3346
- export { AbpAuthenticationErrorHandler, AbpFormatErrorHandlerService, AbpVisibleDirective, BaseThemeSharedModule, BreadcrumbComponent, BreadcrumbItemsComponent, ButtonComponent, CARD_COMPONENTS, CARD_DIRECTIVES, CONFIRMATION_ICONS, CUSTOM_ERROR_HANDLERS, CUSTOM_HTTP_ERROR_HANDLER_PRIORITY, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CardHeaderDirective, CardImgTopDirective, CardModule, CardSubtitleDirective, CardTitleDirective, Confirmation, ConfirmationComponent, ConfirmationService, CreateErrorComponentService, DEFAULT_CONFIRMATION_ICONS, DEFAULT_ERROR_LOCALIZATIONS, DEFAULT_ERROR_MESSAGES, DEFAULT_HANDLERS_PROVIDERS, DEFAULT_VALIDATION_BLUEPRINTS, DateAdapter, DateParserFormatter, DateTimeAdapter, DatepickerI18nAdapter, DisabledDirective, DocumentDirHandlerService, EllipsisDirective, ErrorHandler, FormCheckboxComponent, FormInputComponent, HTTP_ERROR_CONFIG, HTTP_ERROR_DETAIL, HTTP_ERROR_HANDLER, HTTP_ERROR_STATUS, HttpErrorWrapperComponent, InternetConnectionStatusComponent, LOGO_APP_NAME_TOKEN, LOGO_URL_TOKEN, LoaderBarComponent, LoadingComponent, LoadingDirective, LogoFeatureKind, ModalCloseDirective, ModalComponent, ModalRefService, NGX_DATATABLE_MESSAGES, NG_BOOTSTRAP_CONFIG_PROVIDERS, NavItem, NavItemsService, NgxDatatableDefaultDirective, NgxDatatableListDirective, PageAlertService, PasswordComponent, RouterErrorHandlerService, SUPPRESS_UNSAVED_CHANGES_WARNING, SpinnerComponent, StatusCodeErrorHandlerService, THEME_SHARED_APPEND_CONTENT, THEME_SHARED_EXPORTS, THEME_SHARED_ROUTE_PROVIDERS, TenantResolveErrorHandlerService, ThemeSharedFeatureKind, ThemeSharedModule, TimeAdapter, TimepickerI18nAdapter, ToastComponent, ToastContainerComponent, ToasterService, UnknownStatusCodeErrorHandlerService, 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, getErrorFromRequestBody, getPasswordValidators, provideAbpThemeShared, provideLogo, slideFromBottom, tenantNotFoundProvider, toastInOut, validatePassword, withConfirmationIcon, withEnvironmentOptions, withHttpErrorConfig, withValidateOnSubmit, withValidationBluePrint, withValidationMapErrorsFn };
3259
+ export { AbpAuthenticationErrorHandler, AbpFormatErrorHandlerService, AbpVisibleDirective, BaseThemeSharedModule, BreadcrumbComponent, BreadcrumbItemsComponent, ButtonComponent, CARD_COMPONENTS, CARD_DIRECTIVES, CONFIRMATION_ICONS, CUSTOM_ERROR_HANDLERS, CUSTOM_HTTP_ERROR_HANDLER_PRIORITY, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CardHeaderDirective, CardImgTopDirective, CardModule, CardSubtitleDirective, CardTitleDirective, Confirmation, ConfirmationComponent, ConfirmationService, CreateErrorComponentService, DEFAULT_CONFIRMATION_ICONS, DEFAULT_ERROR_LOCALIZATIONS, DEFAULT_ERROR_MESSAGES, DEFAULT_HANDLERS_PROVIDERS, DEFAULT_VALIDATION_BLUEPRINTS, DateAdapter, DateParserFormatter, DateTimeAdapter, DatepickerI18nAdapter, DisabledDirective, DocumentDirHandlerService, EllipsisDirective, ErrorHandler, FormCheckboxComponent, FormInputComponent, HTTP_ERROR_CONFIG, HTTP_ERROR_DETAIL, HTTP_ERROR_HANDLER, HTTP_ERROR_STATUS, HttpErrorWrapperComponent, InternetConnectionStatusComponent, LOGO_APP_NAME_TOKEN, LOGO_URL_TOKEN, LoaderBarComponent, LoadingComponent, LoadingDirective, LogoFeatureKind, ModalCloseDirective, ModalComponent, ModalRefService, NGX_DATATABLE_MESSAGES, NG_BOOTSTRAP_CONFIG_PROVIDERS, NavItem, NavItemsService, NgxDatatableDefaultDirective, NgxDatatableListDirective, PageAlertService, PasswordComponent, RouterErrorHandlerService, SUPPRESS_UNSAVED_CHANGES_WARNING, SpinnerComponent, StatusCodeErrorHandlerService, THEME_CHANGE_TOKEN, THEME_SHARED_APPEND_CONTENT, THEME_SHARED_EXPORTS, THEME_SHARED_ROUTE_PROVIDERS, TenantResolveErrorHandlerService, ThemeSharedFeatureKind, ThemeSharedModule, TimeAdapter, TimepickerI18nAdapter, ToastComponent, ToastContainerComponent, ToasterService, UnknownStatusCodeErrorHandlerService, 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, getErrorFromRequestBody, getPasswordValidators, provideAbpThemeShared, provideLogo, slideFromBottom, tenantNotFoundProvider, toastInOut, validatePassword, withConfirmationIcon, withEnvironmentOptions, withHttpErrorConfig, withValidateOnSubmit, withValidationBluePrint, withValidationMapErrorsFn };
3347
3260
  //# sourceMappingURL=abp-ng.theme.shared.mjs.map