@design-factory/design-factory 19.1.3 → 20.0.0-next.1

package/fesm2022/design-factory.mjs

@@ -1,17 +1,16 @@
 import * as i0 from '@angular/core';
-import { signal, inject, ElementRef, Directive, contentChildren, computed, ChangeDetectionStrategy, Component, NgModule, HostListener, input, Renderer2, Injectable, PLATFORM_ID, InjectionToken, Inject, ViewContainerRef, TemplateRef, effect, booleanAttribute, numberAttribute, output, ViewEncapsulation, ComponentRef, untracked, HostBinding, Input, forwardRef, EventEmitter, ContentChild, ViewChild, Output, NgZone, Injector, contentChild, Host } from '@angular/core';
-import * as i1$1 from '@angular/common';
-import { DOCUMENT, isPlatformBrowser, isPlatformServer, NgTemplateOutlet, CommonModule, AsyncPipe } from '@angular/common';
-import * as i1 from '@ng-bootstrap/ng-bootstrap';
-import { NgbToastModule, NgbAlertModule, NgbDatepickerKeyboardService, NgbDate, NgbDatepickerModule, NgbDropdownModule, NgbAccordionModule, NgbPopoverConfig, NgbPopoverModule, NgbProgressbarModule, NgbCollapseModule, NgbTooltip, NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
+import { signal, inject, ElementRef, DOCUMENT, Directive, contentChildren, computed, ChangeDetectionStrategy, Component, NgModule, HostListener, input, Renderer2, Injectable, PLATFORM_ID, InjectionToken, ViewContainerRef, TemplateRef, effect, RendererFactory2, booleanAttribute, numberAttribute, output, ViewEncapsulation, ApplicationRef, EnvironmentInjector, ComponentRef, createComponent, untracked, HostBinding, Input, forwardRef, EventEmitter, ContentChild, ViewChild, Output, NgZone, Injector, contentChild } from '@angular/core';
+import * as i1$1 from '@ng-bootstrap/ng-bootstrap';
+import { NgbToastModule, NgbAlertModule, NgbDatepickerKeyboardService, NgbCalendar, NgbDateParserFormatter, NgbDate, NgbDatepickerModule, NgbDropdownModule, NgbAccordionModule, NgbModal, NgbPopoverConfig, NgbPopoverModule, NgbProgressbarModule, NgbConfig, NgbCollapseModule, NgbTooltip, NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
+import * as i1 from '@angular/common';
+import { isPlatformBrowser, isPlatformServer, NgTemplateOutlet, CommonModule, AsyncPipe } from '@angular/common';
 import { take, map, switchMap, distinctUntilChanged, throttleTime, tap, filter, endWith, takeUntil } from 'rxjs/operators';
 import { BehaviorSubject, fromEvent, Subscription, combineLatest, Subject, Observable, EMPTY, of, timer, race } from 'rxjs';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import * as i2 from '@angular/router';
 import { RouterModule } from '@angular/router';
 import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
-import * as i1$2 from '@ng-select/ng-select';
-import { NgSelectModule } from '@ng-select/ng-select';
+import { NgSelectComponent, NgSelectModule } from '@ng-select/ng-select';
 import { HttpClient } from '@angular/common/http';
 
 class SkipLinkDirective {
@@ -38,10 +37,10 @@ class SkipLinkDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SkipLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: SkipLinkDirective, isStandalone: true, selector: "[dfSkipLink]", host: { listeners: { "focus": "inFocus.set(true)", "click": "focusOnTarget()", "blur": "inFocus.set(false)" }, classAttribute: "list-group-item list-group-item-action" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SkipLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: SkipLinkDirective, isStandalone: true, selector: "[dfSkipLink]", host: { listeners: { "focus": "inFocus.set(true)", "click": "focusOnTarget()", "blur": "inFocus.set(false)" }, classAttribute: "list-group-item list-group-item-action" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SkipLinkDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SkipLinkDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfSkipLink]',
@@ -59,20 +58,20 @@ class SkipLinksContainerComponent {
         this.links = contentChildren(SkipLinkDirective);
         this.inFocus = computed(() => this.links().some((link) => link.inFocus()));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SkipLinksContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.5", type: SkipLinksContainerComponent, isStandalone: true, selector: "df-skip-links-container", queries: [{ propertyName: "links", predicate: SkipLinkDirective, isSignal: true }], ngImport: i0, template: "<section class=\"df-skip-links__section\">\n  <div class=\"df-skip-links\">\n    <div class=\"df-skip-links-wrap list-group\" [class.focus]=\"inFocus()\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</section>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SkipLinksContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.4", type: SkipLinksContainerComponent, isStandalone: true, selector: "df-skip-links-container", queries: [{ propertyName: "links", predicate: SkipLinkDirective, isSignal: true }], ngImport: i0, template: "<section class=\"df-skip-links__section\">\n  <div class=\"df-skip-links\">\n    <div class=\"df-skip-links-wrap list-group\" [class.focus]=\"inFocus()\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</section>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SkipLinksContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SkipLinksContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'df-skip-links-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"df-skip-links__section\">\n  <div class=\"df-skip-links\">\n    <div class=\"df-skip-links-wrap list-group\" [class.focus]=\"inFocus()\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</section>\n" }]
         }] });
 
 class DfAccessibilityModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAccessibilityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfAccessibilityModule, imports: [SkipLinkDirective, SkipLinksContainerComponent], exports: [SkipLinkDirective, SkipLinksContainerComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAccessibilityModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAccessibilityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfAccessibilityModule, imports: [SkipLinkDirective, SkipLinksContainerComponent], exports: [SkipLinkDirective, SkipLinksContainerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAccessibilityModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAccessibilityModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAccessibilityModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [SkipLinkDirective, SkipLinksContainerComponent],
@@ -81,7 +80,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfInsertIconDirective {
-    constructor(el, renderer) {
+    constructor(
+    // eslint-disable-next-line @angular-eslint/prefer-inject
+    el, 
+    // eslint-disable-next-line @angular-eslint/prefer-inject
+    renderer) {
         this.el = el;
         this.renderer = renderer;
         this.supportedCmps = ['alert', 'toast'];
@@ -114,10 +117,10 @@ class DfInsertIconDirective {
         }
         return 'fa-info-circle';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfInsertIconDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfInsertIconDirective, isStandalone: true, selector: "ngb-alert[dfInsertAlertIcon],ngb-toast[dfInsertToastIcon]", host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfInsertIconDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfInsertIconDirective, isStandalone: true, selector: "ngb-alert[dfInsertAlertIcon],ngb-toast[dfInsertToastIcon]", host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfInsertIconDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfInsertIconDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ngb-alert[dfInsertAlertIcon],ngb-toast[dfInsertToastIcon]',
@@ -128,11 +131,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }] });
 
 class DfInsertIconModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfInsertIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfInsertIconModule, imports: [DfInsertIconDirective], exports: [DfInsertIconDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfInsertIconModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfInsertIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfInsertIconModule, imports: [DfInsertIconDirective], exports: [DfInsertIconDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfInsertIconModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfInsertIconModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfInsertIconModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfInsertIconDirective],
@@ -141,11 +144,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfToastModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfToastModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfToastModule, imports: [DfInsertIconModule], exports: [NgbToastModule, DfInsertIconModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfToastModule, imports: [DfInsertIconModule, NgbToastModule, DfInsertIconModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfToastModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfToastModule, imports: [DfInsertIconModule], exports: [NgbToastModule, DfInsertIconModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfToastModule, imports: [DfInsertIconModule, NgbToastModule, DfInsertIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfToastModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfToastModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfInsertIconModule],
@@ -154,11 +157,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfAlertModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfAlertModule, imports: [DfInsertIconModule], exports: [NgbAlertModule, DfInsertIconModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAlertModule, imports: [DfInsertIconModule, NgbAlertModule, DfInsertIconModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfAlertModule, imports: [DfInsertIconModule], exports: [NgbAlertModule, DfInsertIconModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAlertModule, imports: [DfInsertIconModule, NgbAlertModule, DfInsertIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAlertModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAlertModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfInsertIconModule],
@@ -167,23 +170,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfTriggerClickDirective {
-    constructor(elementRef) {
-        this.elementRef = elementRef;
+    constructor() {
+        this.elementRef = inject(ElementRef);
     }
     triggerClick(event) {
         event.stopPropagation();
         event.preventDefault();
         this.elementRef.nativeElement.click();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTriggerClickDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfTriggerClickDirective, isStandalone: true, selector: "[dfTriggerClick]", host: { listeners: { "keydown.enter": "triggerClick($event)", "keydown.space": "triggerClick($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTriggerClickDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfTriggerClickDirective, isStandalone: true, selector: "[dfTriggerClick]", host: { listeners: { "keydown.enter": "triggerClick($event)", "keydown.space": "triggerClick($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTriggerClickDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTriggerClickDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfTriggerClick]'
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { triggerClick: [{
+        }], propDecorators: { triggerClick: [{
                 type: HostListener,
                 args: ['keydown.enter', ['$event']]
             }, {
@@ -263,10 +266,10 @@ class DfInputIconDirective {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfInputIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfInputIconDirective, isStandalone: true, selector: "[dfInputIcon]", inputs: { dfInputIcon: { classPropertyName: "dfInputIcon", publicName: "dfInputIcon", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "blur": "onBlur()", "focus": "onFocus()", "keydown.Tab": "onTab($event)" } }, exportAs: ["dfInputIcon"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfInputIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfInputIconDirective, isStandalone: true, selector: "[dfInputIcon]", inputs: { dfInputIcon: { classPropertyName: "dfInputIcon", publicName: "dfInputIcon", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "blur": "onBlur()", "focus": "onFocus()", "keydown.Tab": "onTab($event)" } }, exportAs: ["dfInputIcon"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfInputIconDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfInputIconDirective, decorators: [{
             type: Directive,
             args: [{
                     exportAs: 'dfInputIcon',
@@ -280,11 +283,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfAdvancedInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedInputModule, imports: [DfTriggerClickDirective, DfInputIconDirective], exports: [DfTriggerClickDirective, DfInputIconDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedInputModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedInputModule, imports: [DfTriggerClickDirective, DfInputIconDirective], exports: [DfTriggerClickDirective, DfInputIconDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedInputModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedInputModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfTriggerClickDirective, DfInputIconDirective],
@@ -321,10 +324,10 @@ class DfDatepickerKeyboardService extends NgbDatepickerKeyboardService {
         event.preventDefault();
         event.stopPropagation();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerKeyboardService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerKeyboardService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerKeyboardService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerKeyboardService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerKeyboardService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerKeyboardService, decorators: [{
             type: Injectable
         }] });
 
@@ -348,10 +351,10 @@ class DfDirectionDetectionService {
         }
         return RightToLeftDirectionEnum.LeftToRight;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDirectionDetectionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDirectionDetectionService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDirectionDetectionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDirectionDetectionService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDirectionDetectionService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDirectionDetectionService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -449,10 +452,10 @@ class DfDatepickerRangeDirective {
     ngOnDestroy() {
         this.removeListener.forEach((item) => item());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerRangeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfDatepickerRangeDirective, isStandalone: true, selector: "[dfDatepickerRange]", exportAs: ["dfDatepickerRange"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerRangeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfDatepickerRangeDirective, isStandalone: true, selector: "[dfDatepickerRange]", exportAs: ["dfDatepickerRange"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerRangeDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerRangeDirective, decorators: [{
             type: Directive,
             args: [{
                     exportAs: 'dfDatepickerRange',
@@ -461,9 +464,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfDatepickerRangeService {
-    constructor(calendar, formatter) {
-        this.calendar = calendar;
-        this.formatter = formatter;
+    constructor() {
         this.fromDate = null;
         this.toDate = null;
         this.hoveredDate = null;
@@ -473,6 +474,8 @@ class DfDatepickerRangeService {
         this.getFocusBack = null;
         this.isClosingOnToDate = true;
         this.datepicker = null;
+        this.calendar = inject(NgbCalendar);
+        this.formatter = inject(NgbDateParserFormatter);
     }
     onDateSelection(date) {
         if (!this.fromDate && !this.toDate) {
@@ -546,22 +549,22 @@ class DfDatepickerRangeService {
         this.toDate = this.parseInput(this.toDate, typed);
         this.toDateAsStr = this.formatter.format(this.toDate);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerRangeService, deps: [{ token: i1.NgbCalendar }, { token: i1.NgbDateParserFormatter }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerRangeService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerRangeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerRangeService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatepickerRangeService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatepickerRangeService, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i1.NgbCalendar }, { type: i1.NgbDateParserFormatter }] });
+        }] });
 
 class DfDatePickerModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfDatePickerModule, imports: [NgbDropdownModule, DfDatepickerRangeDirective], exports: [NgbDatepickerModule, DfAdvancedInputModule, DfDatepickerRangeDirective, NgbDropdownModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatePickerModule, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfDatePickerModule, imports: [NgbDropdownModule, DfDatepickerRangeDirective], exports: [NgbDatepickerModule, DfAdvancedInputModule, DfDatepickerRangeDirective, NgbDropdownModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatePickerModule, providers: [
             { provide: NgbDatepickerKeyboardService, useClass: DfDatepickerKeyboardService },
             DfDatepickerRangeService
         ], imports: [NgbDropdownModule, NgbDatepickerModule, DfAdvancedInputModule, NgbDropdownModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDatePickerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDatePickerModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [NgbDropdownModule, DfDatepickerRangeDirective],
@@ -590,10 +593,10 @@ const BREAKPOINTS_VARS = new InjectionToken('Bootstrap Breakpoints', {
     }
 });
 class DfBreakpoints {
-    constructor(_breakPointsVar, platformID) {
-        this._breakPointsVar = _breakPointsVar;
-        this.platformID = platformID;
+    constructor() {
         this._breakPoints$ = new BehaviorSubject(null);
+        this._breakPointsVar = inject(BREAKPOINTS_VARS);
+        this.platformID = inject(PLATFORM_ID);
         this.initBreakpoints();
     }
     get breakPoints$() {
@@ -657,22 +660,16 @@ class DfBreakpoints {
         }
         return dict;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfBreakpoints, deps: [{ token: BREAKPOINTS_VARS }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfBreakpoints, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfBreakpoints, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfBreakpoints, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfBreakpoints, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfBreakpoints, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [BREAKPOINTS_VARS]
-                }] }, { type: Object, decorators: [{
-                    type: Inject,
-                    args: [PLATFORM_ID]
-                }] }] });
+        }], ctorParameters: () => [] });
 class DfMediaQuery {
-    constructor(platformId) {
-        this._isBrowser = isPlatformBrowser(platformId);
+    constructor() {
+        this._isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
     }
     notSupported(query) {
         return { matches: false, media: query, addEventListener: () => { }, removeEventListener: () => { } };
@@ -685,21 +682,18 @@ class DfMediaQuery {
             return this.notSupported(query);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaQuery, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaQuery, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaQuery, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaQuery, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaQuery, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaQuery, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: Object, decorators: [{
-                    type: Inject,
-                    args: [PLATFORM_ID]
-                }] }] });
+        }] });
 class DfMediaObserver {
-    constructor(_mediaQuery) {
-        this._mediaQuery = _mediaQuery;
+    constructor() {
         this._subscription = new Subscription();
         this._queries = new Map();
+        this._mediaQuery = inject(DfMediaQuery);
     }
     /**
      * Verifies if at least one of the provided media-queries is matching
@@ -707,7 +701,7 @@ class DfMediaObserver {
      */
     matches(queries) {
         queries = this._flattenQueries(Array.isArray(queries) ? queries : [queries]);
-        return queries.some(q => this._registerQuery(q).mediaQueryList.matches);
+        return queries.some((q) => this._registerQuery(q).mediaQueryList.matches);
     }
     /**
      * Produces an observable for a set of media-queries that will emit
@@ -717,7 +711,7 @@ class DfMediaObserver {
      */
     observe(queries) {
         queries = this._flattenQueries(Array.isArray(queries) ? queries : [queries]);
-        return combineLatest(queries.map(q => this._registerQuery(q).mediaQueryList$)).pipe(map((events) => events.reduce((result, event) => {
+        return combineLatest(queries.map((q) => this._registerQuery(q).mediaQueryList$)).pipe(map((events) => events.reduce((result, event) => {
             result.matches = result.matches || event.matches;
             result.breakpoints[event.media] = event.matches;
             return result;
@@ -727,7 +721,7 @@ class DfMediaObserver {
         this._subscription.unsubscribe();
     }
     _flattenQueries(queries) {
-        return queries.map(q => q.split(',')).reduce((flat, a) => flat.concat(a));
+        return queries.map((q) => q.split(',')).reduce((flat, a) => flat.concat(a));
     }
     _registerQuery(query) {
         if (this._queries.has(query)) {
@@ -745,22 +739,22 @@ class DfMediaObserver {
         this._queries.set(query, meta);
         return meta;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaObserver, deps: [{ token: DfMediaQuery }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaObserver, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaObserver, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaObserver, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaObserver, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaObserver, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: DfMediaQuery }] });
+        }] });
 
 /**
  * Services you can use to get indication about the current width screen of your application
  * the matchMedia JS feature (https://developer.mozilla.org/fr/docs/Web/API/Window/matchMedia)
  */
 class DfMedia {
-    constructor(mediaObserver, _breakPointsService) {
-        this.mediaObserver = mediaObserver;
-        this._breakPointsService = _breakPointsService;
+    constructor() {
+        this.mediaObserver = inject(DfMediaObserver);
+        this._breakPointsService = inject(DfBreakpoints);
     }
     initQueries(mediaOrBreakpoints, breakPoints = {}) {
         const queries = [];
@@ -781,19 +775,19 @@ class DfMedia {
      * string/Array of string of the breakpoints name (sm...).
      */
     getObservable(mediaOrBreakpoints) {
-        return this._breakPointsService.breakPoints$.pipe(map(breakpoints => {
+        return this._breakPointsService.breakPoints$.pipe(map((breakpoints) => {
             return breakpoints ? this.initQueries(mediaOrBreakpoints, breakpoints) : this.initQueries(mediaOrBreakpoints);
-        }), switchMap(query => {
+        }), switchMap((query) => {
             return this.mediaObserver.observe(query);
-        }), map(value => value.matches), distinctUntilChanged());
+        }), map((value) => value.matches), distinctUntilChanged());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMedia, deps: [{ token: DfMediaObserver }, { token: DfBreakpoints }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMedia, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMedia, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMedia, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMedia, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMedia, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: DfMediaObserver }, { type: DfBreakpoints }] });
+        }] });
 
 /**
  * Directive using the matchMedia JS feature (https://developer.mozilla.org/fr/docs/Web/API/Window/matchMedia)
@@ -835,20 +829,20 @@ class DfIfMediaDirective {
             this._viewInstance = null;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfIfMediaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfIfMediaDirective, isStandalone: true, selector: "[dfIfMedia]", inputs: { dfIfMedia: { classPropertyName: "dfIfMedia", publicName: "dfIfMedia", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfIfMediaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfIfMediaDirective, isStandalone: true, selector: "[dfIfMedia]", inputs: { dfIfMedia: { classPropertyName: "dfIfMedia", publicName: "dfIfMedia", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfIfMediaDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfIfMediaDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[dfIfMedia]' }]
         }], ctorParameters: () => [] });
 
 class DfMediaModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfMediaModule, imports: [DfIfMediaDirective], exports: [DfIfMediaDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfMediaModule, imports: [DfIfMediaDirective], exports: [DfIfMediaDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfMediaModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfMediaModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfIfMediaDirective],
@@ -857,11 +851,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfFooterModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfFooterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfFooterModule, imports: [DfMediaModule, NgbAccordionModule], exports: [DfMediaModule, NgbAccordionModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfFooterModule, imports: [DfMediaModule, NgbAccordionModule, DfMediaModule, NgbAccordionModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfFooterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfFooterModule, imports: [DfMediaModule, NgbAccordionModule], exports: [DfMediaModule, NgbAccordionModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfFooterModule, imports: [DfMediaModule, NgbAccordionModule, DfMediaModule, NgbAccordionModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfFooterModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfFooterModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfMediaModule, NgbAccordionModule],
@@ -870,8 +864,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfAmadeusIconComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAmadeusIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DfAmadeusIconComponent, isStandalone: true, selector: "df-amadeus-icon", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAmadeusIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.4", type: DfAmadeusIconComponent, isStandalone: true, selector: "df-amadeus-icon", ngImport: i0, template: `
     <svg
       version="1.1"
       xmlns="http://www.w3.org/2000/svg"
@@ -907,7 +901,7 @@ class DfAmadeusIconComponent {
     </svg>
   `, isInline: true, styles: [":root{--df-navbar-height: 3.5rem}:host{min-width:60px}:host svg{margin:10%}:host.icon-primary{fill:var(--df-primary-500)}:host.icon-white{fill:#fff}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAmadeusIconComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAmadeusIconComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'df-amadeus-icon', template: `
     <svg
@@ -947,11 +941,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfIconModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfIconModule, imports: [DfAmadeusIconComponent], exports: [DfAmadeusIconComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfIconModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfIconModule, imports: [DfAmadeusIconComponent], exports: [DfAmadeusIconComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfIconModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfIconModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfIconModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfAmadeusIconComponent],
@@ -964,10 +958,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
  * Please note that `NgbModal` adds 'modal-open' class to the body while DfModalService adds 'df-modal-open' class. Both classes include the same styles, but you may need to update your stylesheets if you were overriding 'df-modal-open' in your application.
  */
 class DfModalService {
-    constructor(modalService, rendererFactory) {
-        this.modalService = modalService;
-        this.rendererFactory = rendererFactory;
-        this.renderer = this.rendererFactory.createRenderer(null, null);
+    constructor() {
+        this.renderer = inject(RendererFactory2).createRenderer(null, null);
+        this.modalService = inject(NgbModal);
     }
     open(content, options) {
         let modalRef;
@@ -986,34 +979,34 @@ class DfModalService {
         });
         return modalRef;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfModalService, deps: [{ token: i1.NgbModal }, { token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfModalService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfModalService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfModalService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfModalService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.NgbModal }, { type: i0.RendererFactory2 }] });
+        }] });
 
 class DfPopoverConfig extends NgbPopoverConfig {
     constructor() {
         super(...arguments);
         this.autoClose = 'outside';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfPopoverConfig, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfPopoverConfig }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfPopoverConfig, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfPopoverConfig }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfPopoverConfig, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfPopoverConfig, decorators: [{
             type: Injectable
         }] });
 
 class DfPopoverModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfPopoverModule, exports: [NgbPopoverModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfPopoverModule, providers: [{ provide: NgbPopoverConfig, useClass: DfPopoverConfig }], imports: [NgbPopoverModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfPopoverModule, exports: [NgbPopoverModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfPopoverModule, providers: [{ provide: NgbPopoverConfig, useClass: DfPopoverConfig }], imports: [NgbPopoverModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfPopoverModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfPopoverModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [NgbPopoverModule],
@@ -1142,20 +1135,20 @@ class DfProgressbarComponent {
     resetProgressBarValues() {
         this.innerValue.set(0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DfProgressbarComponent, isStandalone: true, selector: "df-progressbar", inputs: { infiniteAnimation: { classPropertyName: "infiniteAnimation", publicName: "infiniteAnimation", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, start$: { classPropertyName: "start$", publicName: "start$", isSignal: true, isRequired: false, transformFunction: null }, end$: { classPropertyName: "end$", publicName: "end$", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { percentageValueChange: "percentageValueChange" }, ngImport: i0, template: "@if (displayProgressBar()) {\n  @if (computedText(); as computedText) {\n    <div class=\"progressbar-text mb-2\">{{ computedText }}</div>\n  }\n  @if (infiniteAnimation()) {\n    <div\n      class=\"progress\"\n      role=\"progressbar\"\n      aria-valuetext=\"indeterminate\"\n      [attr.aria-labelledby]=\"ariaLabelledBy() || null\"\n      [attr.aria-label]=\"!ariaLabelledBy() && ariaLabel() ? ariaLabel() : null\"\n    >\n      <div class=\"progress-bar infinite-animation\"></div>\n    </div>\n  } @else {\n    <div\n      class=\"progress\"\n      role=\"progressbar\"\n      [attr.aria-valuenow]=\"innerValue()\"\n      aria-valuemin=\"0\"\n      [attr.aria-valuemax]=\"maxValue()\"\n      [attr.aria-valuetext]=\"computedText() || null\"\n      [attr.aria-labelledby]=\"ariaLabelledBy() || null\"\n      [attr.aria-label]=\"!ariaLabelledBy() && ariaLabel() ? ariaLabel() : null\"\n    >\n      <div [style.width.%]=\"percentageValue()\" class=\"progress-bar\"></div>\n    </div>\n  }\n}\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: DfProgressbarComponent, isStandalone: true, selector: "df-progressbar", inputs: { infiniteAnimation: { classPropertyName: "infiniteAnimation", publicName: "infiniteAnimation", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, start$: { classPropertyName: "start$", publicName: "start$", isSignal: true, isRequired: false, transformFunction: null }, end$: { classPropertyName: "end$", publicName: "end$", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { percentageValueChange: "percentageValueChange" }, ngImport: i0, template: "@if (displayProgressBar()) {\n  @if (computedText(); as computedText) {\n    <div class=\"progressbar-text mb-2\">{{ computedText }}</div>\n  }\n  @if (infiniteAnimation()) {\n    <div\n      class=\"progress\"\n      role=\"progressbar\"\n      aria-valuetext=\"indeterminate\"\n      [attr.aria-labelledby]=\"ariaLabelledBy() || null\"\n      [attr.aria-label]=\"!ariaLabelledBy() && ariaLabel() ? ariaLabel() : null\"\n    >\n      <div class=\"progress-bar infinite-animation\"></div>\n    </div>\n  } @else {\n    <div\n      class=\"progress\"\n      role=\"progressbar\"\n      [attr.aria-valuenow]=\"innerValue()\"\n      aria-valuemin=\"0\"\n      [attr.aria-valuemax]=\"maxValue()\"\n      [attr.aria-valuetext]=\"computedText() || null\"\n      [attr.aria-labelledby]=\"ariaLabelledBy() || null\"\n      [attr.aria-label]=\"!ariaLabelledBy() && ariaLabel() ? ariaLabel() : null\"\n    >\n      <div [style.width.%]=\"percentageValue()\" class=\"progress-bar\"></div>\n    </div>\n  }\n}\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressbarComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'df-progressbar', template: "@if (displayProgressBar()) {\n  @if (computedText(); as computedText) {\n    <div class=\"progressbar-text mb-2\">{{ computedText }}</div>\n  }\n  @if (infiniteAnimation()) {\n    <div\n      class=\"progress\"\n      role=\"progressbar\"\n      aria-valuetext=\"indeterminate\"\n      [attr.aria-labelledby]=\"ariaLabelledBy() || null\"\n      [attr.aria-label]=\"!ariaLabelledBy() && ariaLabel() ? ariaLabel() : null\"\n    >\n      <div class=\"progress-bar infinite-animation\"></div>\n    </div>\n  } @else {\n    <div\n      class=\"progress\"\n      role=\"progressbar\"\n      [attr.aria-valuenow]=\"innerValue()\"\n      aria-valuemin=\"0\"\n      [attr.aria-valuemax]=\"maxValue()\"\n      [attr.aria-valuetext]=\"computedText() || null\"\n      [attr.aria-labelledby]=\"ariaLabelledBy() || null\"\n      [attr.aria-label]=\"!ariaLabelledBy() && ariaLabel() ? ariaLabel() : null\"\n    >\n      <div [style.width.%]=\"percentageValue()\" class=\"progress-bar\"></div>\n    </div>\n  }\n}\n" }]
         }], ctorParameters: () => [] });
 
 class DfProgressbarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfProgressbarModule, imports: [DfProgressbarComponent], exports: [DfProgressbarComponent, NgbProgressbarModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressbarModule, imports: [NgbProgressbarModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfProgressbarModule, imports: [DfProgressbarComponent], exports: [DfProgressbarComponent, NgbProgressbarModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressbarModule, imports: [NgbProgressbarModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressbarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressbarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfProgressbarComponent],
@@ -1206,10 +1199,10 @@ class DfProgressIndicatorContainerComponent {
         });
         this.classes = computed(() => `df-progressindicator-container ${this.containerClass() || ''} ${this.positionClass()}`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.5", type: DfProgressIndicatorContainerComponent, isStandalone: true, selector: "df-progressindicator-container", inputs: { containerClass: { classPropertyName: "containerClass", publicName: "containerClass", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.4", type: DfProgressIndicatorContainerComponent, isStandalone: true, selector: "df-progressindicator-container", inputs: { containerClass: { classPropertyName: "containerClass", publicName: "containerClass", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorContainerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'df-progressindicator-container',
@@ -1228,10 +1221,10 @@ class DfDefaultSpinnerComponent {
         this.contentClass = input('spinner-border text-primary');
         this.ariaLabel = input();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDefaultSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DfDefaultSpinnerComponent, isStandalone: true, selector: "df-default-spinner", inputs: { isGlobalSpinner: { classPropertyName: "isGlobalSpinner", publicName: "isGlobalSpinner", isSignal: true, isRequired: false, transformFunction: null }, contentClass: { classPropertyName: "contentClass", publicName: "contentClass", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div [class]=\"contentClass()\" [attr.role]=\"isGlobalSpinner() ? 'alert' : 'status'\">\n  <span class=\"visually-hidden\">\n    @if (ariaLabel(); as ariaLabel) {\n      {{ ariaLabel }}\n    } @else {\n      <ng-container i18n=\"@@df.progressindicator.default.spinner.ariaLabel\">Loading...</ng-container>\n    }\n  </span>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDefaultSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: DfDefaultSpinnerComponent, isStandalone: true, selector: "df-default-spinner", inputs: { isGlobalSpinner: { classPropertyName: "isGlobalSpinner", publicName: "isGlobalSpinner", isSignal: true, isRequired: false, transformFunction: null }, contentClass: { classPropertyName: "contentClass", publicName: "contentClass", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div [class]=\"contentClass()\" [attr.role]=\"isGlobalSpinner() ? 'alert' : 'status'\">\n  <span class=\"visually-hidden\">\n    @if (ariaLabel(); as ariaLabel) {\n      {{ ariaLabel }}\n    } @else {\n      <ng-container i18n=\"@@df.progressindicator.default.spinner.ariaLabel\">Loading...</ng-container>\n    }\n  </span>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfDefaultSpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfDefaultSpinnerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'df-default-spinner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"contentClass()\" [attr.role]=\"isGlobalSpinner() ? 'alert' : 'status'\">\n  <span class=\"visually-hidden\">\n    @if (ariaLabel(); as ariaLabel) {\n      {{ ariaLabel }}\n    } @else {\n      <ng-container i18n=\"@@df.progressindicator.default.spinner.ariaLabel\">Loading...</ng-container>\n    }\n  </span>\n</div>\n" }]
         }] });
@@ -1242,10 +1235,10 @@ class DfProgressIndicatorBackdropComponent {
         this.isGlobalBackdrop = input(true);
         this.classes = computed(() => `df-progressindicator-backdrop ${this.backdropClass() || ''} df-progressindicator-backdrop${this.isGlobalBackdrop() ? '-global' : '-contextual'}`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorBackdropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.5", type: DfProgressIndicatorBackdropComponent, isStandalone: true, selector: "df-progressindicator-backdrop", inputs: { backdropClass: { classPropertyName: "backdropClass", publicName: "backdropClass", isSignal: true, isRequired: false, transformFunction: null }, isGlobalBackdrop: { classPropertyName: "isGlobalBackdrop", publicName: "isGlobalBackdrop", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorBackdropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.4", type: DfProgressIndicatorBackdropComponent, isStandalone: true, selector: "df-progressindicator-backdrop", inputs: { backdropClass: { classPropertyName: "backdropClass", publicName: "backdropClass", isSignal: true, isRequired: false, transformFunction: null }, isGlobalBackdrop: { classPropertyName: "isGlobalBackdrop", publicName: "isGlobalBackdrop", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorBackdropComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorBackdropComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'df-progressindicator-backdrop',
@@ -1275,8 +1268,8 @@ const noop$1 = () => { };
  * It is a copy of https://github.com/ng-bootstrap/ng-bootstrap/blob/master/src/util/scrollbar.ts
  */
 class ScrollBar {
-    constructor(_document) {
-        this._document = _document;
+    constructor() {
+        this._document = inject(DOCUMENT);
     }
     /**
      * To be called right before a potential vertical scrollbar would be removed:
@@ -1330,25 +1323,17 @@ class ScrollBar {
         body.removeChild(measurer);
         return width;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ScrollBar, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ScrollBar, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: ScrollBar, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: ScrollBar, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ScrollBar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: ScrollBar, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }] });
+        }] });
 
 class DfProgressIndicatorService {
-    constructor(document, rendererFactory, componentFactoryResolver, appRef, injector, scrollbar) {
-        this.document = document;
-        this.rendererFactory = rendererFactory;
-        this.componentFactoryResolver = componentFactoryResolver;
-        this.appRef = appRef;
-        this.injector = injector;
-        this.scrollbar = scrollbar;
+    constructor() {
+        this.renderer = inject(RendererFactory2).createRenderer(null, null);
         this.BODY_CLASS = 'df-progressindicator-open';
         // TODO - Remove it when https://github.com/angular/angular/issues/22567
         this.containerAttributes = ['containerClass', 'position'];
@@ -1356,7 +1341,10 @@ class DfProgressIndicatorService {
         this.defaultSpinnerAttributes = ['contentClass', 'ariaLabel', 'isGlobalSpinner'];
         this.defaultProgressBarAttributes = ['infiniteAnimation', 'ariaLabel'];
         this.activeInstances = [];
-        this.renderer = this.rendererFactory.createRenderer(null, null);
+        this.document = inject(DOCUMENT);
+        this.appRef = inject(ApplicationRef);
+        this.environmentInjector = inject(EnvironmentInjector);
+        this.scrollbar = inject(ScrollBar);
     }
     open(content, options) {
         const containerElt = this.getContainer(this.document, options);
@@ -1365,10 +1353,10 @@ class DfProgressIndicatorService {
         }
         // Create needed components
         const backdropRef = options?.backdrop !== false
-            ? this.createComponent(DfProgressIndicatorBackdropComponent, this.componentFactoryResolver, undefined, containerElt)
+            ? this.createComponent(DfProgressIndicatorBackdropComponent, undefined, containerElt)
             : undefined;
-        const contentRef = this.getContent(content, this.componentFactoryResolver, containerElt);
-        const containerCmpRef = this.createComponent(DfProgressIndicatorContainerComponent, this.componentFactoryResolver, contentRef, containerElt);
+        const contentRef = this.getContent(content, containerElt);
+        const containerCmpRef = this.createComponent(DfProgressIndicatorContainerComponent, contentRef, containerElt);
         const onDestroyOperations = [];
         // Add aria attributes on the container
         this.renderer.setAttribute(containerElt, 'aria-busy', 'true');
@@ -1436,12 +1424,12 @@ class DfProgressIndicatorService {
         }
         return options?.container ? document.querySelector(options.container) : document.body;
     }
-    getContent(content, cfr, container) {
+    getContent(content, container) {
         if (!content) {
-            return this.createComponent(DfDefaultSpinnerComponent, cfr);
+            return this.createComponent(DfDefaultSpinnerComponent);
         }
         else if (content instanceof DfProgressIndicatorContentSpinner) {
-            const cmpRef = this.createComponent(DfDefaultSpinnerComponent, cfr);
+            const cmpRef = this.createComponent(DfDefaultSpinnerComponent);
             this.applyOptions(cmpRef, this.defaultSpinnerAttributes, {
                 ...content.spinnerInput,
                 isGlobalSpinner: container === this.document.body
@@ -1449,7 +1437,7 @@ class DfProgressIndicatorService {
             return cmpRef;
         }
         else if (content instanceof DfProgressIndicatorContentProgressBar) {
-            const cmpRef = this.createComponent(DfProgressbarComponent, cfr);
+            const cmpRef = this.createComponent(DfProgressbarComponent);
             this.applyOptions(cmpRef, this.defaultProgressBarAttributes, {
                 ...content.progressBarInput,
                 infiniteAnimation: true
@@ -1462,22 +1450,29 @@ class DfProgressIndicatorService {
             return viewRef;
         }
         else {
-            return this.createComponent(content, cfr);
+            return this.createComponent(content);
         }
     }
-    createComponent(cmpType, cfr, childrenProjectables, container) {
-        const cmpFactory = cfr.resolveComponentFactory(cmpType);
+    createComponent(cmpType, childrenProjectables, container) {
         let cmpRef;
         if (childrenProjectables) {
             if (childrenProjectables instanceof ComponentRef) {
-                cmpRef = cmpFactory.create(this.injector, [[childrenProjectables.location.nativeElement]]);
+                cmpRef = createComponent(cmpType, {
+                    environmentInjector: this.environmentInjector,
+                    projectableNodes: [[childrenProjectables.location.nativeElement]]
+                });
             }
             else {
-                cmpRef = cmpFactory.create(this.injector, [childrenProjectables.rootNodes]);
+                cmpRef = createComponent(cmpType, {
+                    environmentInjector: this.environmentInjector,
+                    projectableNodes: [childrenProjectables.rootNodes]
+                });
             }
         }
         else {
-            cmpRef = cmpFactory.create(this.injector);
+            cmpRef = createComponent(cmpType, {
+                environmentInjector: this.environmentInjector
+            });
         }
         this.appRef.attachView(cmpRef.hostView);
         if (container) {
@@ -1495,18 +1490,15 @@ class DfProgressIndicatorService {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorService, deps: [{ token: DOCUMENT }, { token: i0.RendererFactory2 }, { token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: i0.Injector }, { token: ScrollBar }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: Document, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }, { type: i0.RendererFactory2 }, { type: i0.ComponentFactoryResolver }, { type: i0.ApplicationRef }, { type: i0.Injector }, { type: ScrollBar }] });
+        }] });
 
 class DfProgressIndicatorDirective {
     constructor() {
@@ -1529,10 +1521,10 @@ class DfProgressIndicatorDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfProgressIndicatorDirective, isStandalone: true, selector: "[dfProgressIndicator]", inputs: { dfProgressIndicator: { classPropertyName: "dfProgressIndicator", publicName: "dfProgressIndicator", isSignal: true, isRequired: true, transformFunction: null }, dfProgressIndicatorConfig: { classPropertyName: "dfProgressIndicatorConfig", publicName: "dfProgressIndicatorConfig", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfProgressIndicatorDirective, isStandalone: true, selector: "[dfProgressIndicator]", inputs: { dfProgressIndicator: { classPropertyName: "dfProgressIndicator", publicName: "dfProgressIndicator", isSignal: true, isRequired: true, transformFunction: null }, dfProgressIndicatorConfig: { classPropertyName: "dfProgressIndicatorConfig", publicName: "dfProgressIndicatorConfig", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfProgressIndicator]'
@@ -1540,8 +1532,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }], ctorParameters: () => [] });
 
 class DfProgressIndicatorModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorModule, imports: [DfDefaultSpinnerComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorModule, imports: [DfDefaultSpinnerComponent,
             DfProgressbarModule,
             DfProgressIndicatorBackdropComponent,
             DfProgressIndicatorContainerComponent,
@@ -1550,9 +1542,9 @@ class DfProgressIndicatorModule {
             DfProgressIndicatorDirective,
             DfProgressIndicatorBackdropComponent,
             DfDefaultSpinnerComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorModule, imports: [DfProgressbarModule, DfProgressbarModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorModule, imports: [DfProgressbarModule, DfProgressbarModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfProgressIndicatorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfProgressIndicatorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -1590,10 +1582,10 @@ class DfSliderDirectionDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSliderDirectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfSliderDirectionDirective, isStandalone: true, selector: "[dfSliderDirection]", inputs: { dfSliderDirection: { classPropertyName: "dfSliderDirection", publicName: "dfSliderDirection", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSliderDirectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfSliderDirectionDirective, isStandalone: true, selector: "[dfSliderDirection]", inputs: { dfSliderDirection: { classPropertyName: "dfSliderDirection", publicName: "dfSliderDirection", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSliderDirectionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSliderDirectionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfSliderDirection]'
@@ -1894,6 +1886,7 @@ class EventListenerHelper {
     }
 }
 
+/* eslint-disable @angular-eslint/prefer-inject */
 /**
  * @deprecated SliderElementDirective is deprecated. Use {@link https://design-factory.amadeus.net/components/slider/agnosui AgnosUI Slider} instead.
  */
@@ -2056,10 +2049,10 @@ class SliderElementDirective {
     isRefDestroyed() {
         return (ValueHelper.isNullOrUndefined(this.changeDetectionRef) || this.changeDetectionRef['destroyed']);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderElementDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: SliderElementDirective, isStandalone: true, selector: "[ngxSliderElement]", host: { properties: { "style.opacity": "this.opacity", "style.visibility": "this.visibility", "style.left": "this.left", "style.bottom": "this.bottom", "style.height": "this.height", "style.width": "this.width", "style.transform": "this.transform" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderElementDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: SliderElementDirective, isStandalone: true, selector: "[ngxSliderElement]", host: { properties: { "style.opacity": "this.opacity", "style.visibility": "this.visibility", "style.left": "this.left", "style.bottom": "this.bottom", "style.height": "this.height", "style.width": "this.width", "style.transform": "this.transform" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderElementDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderElementDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2092,6 +2085,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
  * @deprecated SliderHandleDirective is deprecated. Use {@link https://design-factory.amadeus.net/components/slider/agnosui AgnosUI Slider} instead.
  */
 class SliderHandleDirective extends SliderElementDirective {
+    // eslint-disable-next-line @angular-eslint/prefer-inject
     constructor(elemRef, renderer, changeDetectionRef) {
         super(elemRef, renderer, changeDetectionRef);
         this.active = false;
@@ -2108,10 +2102,10 @@ class SliderHandleDirective extends SliderElementDirective {
     focus() {
         this.elemRef.nativeElement.focus();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderHandleDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: SliderHandleDirective, isStandalone: true, selector: "[ngxSliderHandle]", host: { properties: { "class.ngx-slider-active": "this.active", "attr.role": "this.role", "attr.tabindex": "this.tabindex", "attr.aria-orientation": "this.ariaOrientation", "attr.aria-label": "this.ariaLabel", "attr.aria-labelledby": "this.ariaLabelledBy", "attr.aria-valuenow": "this.ariaValueNow", "attr.aria-valuetext": "this.ariaValueText", "attr.aria-valuemin": "this.ariaValueMin", "attr.aria-valuemax": "this.ariaValueMax" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderHandleDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: SliderHandleDirective, isStandalone: true, selector: "[ngxSliderHandle]", host: { properties: { "class.ngx-slider-active": "this.active", "attr.role": "this.role", "attr.tabindex": "this.tabindex", "attr.aria-orientation": "this.ariaOrientation", "attr.aria-label": "this.ariaLabel", "attr.aria-labelledby": "this.ariaLabelledBy", "attr.aria-valuenow": "this.ariaValueNow", "attr.aria-valuetext": "this.ariaValueText", "attr.aria-valuemin": "this.ariaValueMin", "attr.aria-valuemax": "this.ariaValueMax" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderHandleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderHandleDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2156,6 +2150,7 @@ class SliderLabelDirective extends SliderElementDirective {
     get value() {
         return this._value || '';
     }
+    // eslint-disable-next-line @angular-eslint/prefer-inject
     constructor(elemRef, renderer, changeDetectionRef) {
         super(elemRef, renderer, changeDetectionRef);
     }
@@ -2174,10 +2169,10 @@ class SliderLabelDirective extends SliderElementDirective {
             this.calculateDimension();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderLabelDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: SliderLabelDirective, isStandalone: true, selector: "[ngxSliderLabel]", usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderLabelDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: SliderLabelDirective, isStandalone: true, selector: "[ngxSliderLabel]", usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderLabelDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderLabelDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2190,10 +2185,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
  * @deprecated TooltipWrapperComponent is deprecated. Use {@link https://design-factory.amadeus.net/components/slider/agnosui AgnosUI Slider} instead.
  */
 class TooltipWrapperComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TooltipWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: TooltipWrapperComponent, isStandalone: true, selector: "ngx-slider-tooltip-wrapper", inputs: { template: "template", tooltip: "tooltip", placement: "placement", content: "content" }, ngImport: i0, template: "@if (template) {\n  <ng-template\n    *ngTemplateOutlet=\"template; context: { tooltip: tooltip, placement: placement, content: content }\"\n  ></ng-template>\n} @else {\n  <div class=\"ngx-slider-inner-tooltip\" [attr.title]=\"tooltip\" [attr.data-tooltip-placement]=\"placement\">\n    {{ content }}\n  </div>\n}\n", styles: [".ngx-slider-inner-tooltip{height:100%}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: TooltipWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: TooltipWrapperComponent, isStandalone: true, selector: "ngx-slider-tooltip-wrapper", inputs: { template: "template", tooltip: "tooltip", placement: "placement", content: "content" }, ngImport: i0, template: "@if (template) {\n  <ng-template\n    *ngTemplateOutlet=\"template; context: { tooltip: tooltip, placement: placement, content: content }\"\n  ></ng-template>\n} @else {\n  <div class=\"ngx-slider-inner-tooltip\" [attr.title]=\"tooltip\" [attr.data-tooltip-placement]=\"placement\">\n    {{ content }}\n  </div>\n}\n", styles: [".ngx-slider-inner-tooltip{height:100%}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TooltipWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: TooltipWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-slider-tooltip-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], template: "@if (template) {\n  <ng-template\n    *ngTemplateOutlet=\"template; context: { tooltip: tooltip, placement: placement, content: content }\"\n  ></ng-template>\n} @else {\n  <div class=\"ngx-slider-inner-tooltip\" [attr.title]=\"tooltip\" [attr.data-tooltip-placement]=\"placement\">\n    {{ content }}\n  </div>\n}\n", styles: [".ngx-slider-inner-tooltip{height:100%}\n"] }]
         }], propDecorators: { template: [{
@@ -2206,6 +2201,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                 type: Input
             }] } });
 
+/* eslint-disable @angular-eslint/prefer-inject */
 /* eslint-disable @angular-eslint/prefer-signals */
 class Tick {
     constructor() {
@@ -4100,10 +4096,10 @@ class SliderComponent {
         }
         return changeContext;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: SliderComponent, isStandalone: true, selector: "ngx-slider", inputs: { value: "value", highValue: "highValue", options: "options", manualRefresh: "manualRefresh", triggerFocus: "triggerFocus" }, outputs: { valueChange: "valueChange", highValueChange: "highValueChange", userChangeStart: "userChangeStart", userChange: "userChange", userChangeEnd: "userChangeEnd" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.class", "class.vertical": "this.sliderElementVerticalClass", "class.animate": "this.sliderElementAnimateClass", "class.with-legend": "this.sliderElementWithLegendClass", "attr.disabled": "this.sliderElementDisabledAttr", "attr.aria-label": "this.sliderElementAriaLabel" } }, providers: [NGX_SLIDER_CONTROL_VALUE_ACCESSOR], queries: [{ propertyName: "tooltipTemplate", first: true, predicate: ["tooltipTemplate"], descendants: true }], viewQueries: [{ propertyName: "leftOuterSelectionBarElement", first: true, predicate: ["leftOuterSelectionBar"], descendants: true, read: SliderElementDirective }, { propertyName: "rightOuterSelectionBarElement", first: true, predicate: ["rightOuterSelectionBar"], descendants: true, read: SliderElementDirective }, { propertyName: "fullBarElement", first: true, predicate: ["fullBar"], descendants: true, read: SliderElementDirective }, { propertyName: "selectionBarElement", first: true, predicate: ["selectionBar"], descendants: true, read: SliderElementDirective }, { propertyName: "minHandleElement", first: true, predicate: ["minHandle"], descendants: true, read: SliderHandleDirective }, { propertyName: "maxHandleElement", first: true, predicate: ["maxHandle"], descendants: true, read: SliderHandleDirective }, { propertyName: "floorLabelElement", first: true, predicate: ["floorLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "ceilLabelElement", first: true, predicate: ["ceilLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "minHandleLabelElement", first: true, predicate: ["minHandleLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "maxHandleLabelElement", first: true, predicate: ["maxHandleLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "combinedLabelElement", first: true, predicate: ["combinedLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "ticksElement", first: true, predicate: ["ticksElement"], descendants: true, read: SliderElementDirective }], usesOnChanges: true, ngImport: i0, template: "<!-- // 0 Left selection bar outside two handles -->\n<span\n  ngxSliderElement\n  #leftOuterSelectionBar\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-left-out-selection\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 1 Right selection bar outside two handles -->\n<span\n  ngxSliderElement\n  #rightOuterSelectionBar\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-right-out-selection\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 2 The whole slider bar -->\n<span\n  ngxSliderElement\n  #fullBar\n  [class.ngx-slider-transparent]=\"fullBarTransparentClass\"\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-full-bar\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 3 Selection bar between two handles -->\n<span\n  ngxSliderElement\n  #selectionBar\n  [class.ngx-slider-draggable]=\"selectionBarDraggableClass\"\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-selection-bar\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar ngx-slider-selection\" [ngStyle]=\"barStyle\"></span>\n</span>\n<!-- // 4 Low slider handle -->\n<span\n  ngxSliderHandle\n  #minHandle\n  class=\"ngx-slider-span ngx-slider-pointer ngx-slider-pointer-min\"\n  [ngStyle]=\"minPointerStyle\"\n></span>\n<!-- // 5 High slider handle -->\n<span\n  ngxSliderHandle\n  #maxHandle\n  [style.display]=\"range ? 'inherit' : 'none'\"\n  class=\"ngx-slider-span ngx-slider-pointer ngx-slider-pointer-max\"\n  [ngStyle]=\"maxPointerStyle\"\n></span>\n<!-- // 6 Floor label -->\n<span ngxSliderLabel #floorLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-limit ngx-slider-floor\"></span>\n<!-- // 7 Ceiling label -->\n<span ngxSliderLabel #ceilLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-limit ngx-slider-ceil\"></span>\n<!-- // 8 Label above the low slider handle -->\n<span ngxSliderLabel #minHandleLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-model-value\"></span>\n<!-- // 9 Label above the high slider handle -->\n<span ngxSliderLabel #maxHandleLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-model-high\"></span>\n<!-- // 10 Combined range label when the slider handles are close ex. 15 - 17 -->\n<span ngxSliderLabel #combinedLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-combined\"></span>\n<!-- // 11 The ticks -->\n<span\n  ngxSliderElement\n  #ticksElement\n  [hidden]=\"!showTicks\"\n  [class.ngx-slider-ticks-values-under]=\"ticksUnderValuesClass\"\n  class=\"ngx-slider-ticks\"\n>\n  @for (t of ticks; track t) {\n    <span class=\"ngx-slider-tick\" [ngClass]=\"{ 'ngx-slider-selected': t.selected }\" [ngStyle]=\"t.style\">\n      <ngx-slider-tooltip-wrapper\n        [template]=\"tooltipTemplate\"\n        [tooltip]=\"t.tooltip\"\n        [placement]=\"t.tooltipPlacement\"\n      ></ngx-slider-tooltip-wrapper>\n      @if (t.value !== null) {\n        <ngx-slider-tooltip-wrapper\n          class=\"ngx-slider-span ngx-slider-tick-value\"\n          [template]=\"tooltipTemplate\"\n          [tooltip]=\"t.valueTooltip\"\n          [placement]=\"t.valueTooltipPlacement\"\n          [content]=\"t.value\"\n        ></ngx-slider-tooltip-wrapper>\n      }\n      @if (t.legend !== null) {\n        <span class=\"ngx-slider-span ngx-slider-tick-legend\" [innerHTML]=\"t.legend\"></span>\n      }\n    </span>\n  }\n</span>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TooltipWrapperComponent, selector: "ngx-slider-tooltip-wrapper", inputs: ["template", "tooltip", "placement", "content"] }, { kind: "directive", type: SliderLabelDirective, selector: "[ngxSliderLabel]" }, { kind: "directive", type: SliderHandleDirective, selector: "[ngxSliderHandle]" }, { kind: "directive", type: SliderElementDirective, selector: "[ngxSliderElement]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: SliderComponent, isStandalone: true, selector: "ngx-slider", inputs: { value: "value", highValue: "highValue", options: "options", manualRefresh: "manualRefresh", triggerFocus: "triggerFocus" }, outputs: { valueChange: "valueChange", highValueChange: "highValueChange", userChangeStart: "userChangeStart", userChange: "userChange", userChangeEnd: "userChangeEnd" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.class", "class.vertical": "this.sliderElementVerticalClass", "class.animate": "this.sliderElementAnimateClass", "class.with-legend": "this.sliderElementWithLegendClass", "attr.disabled": "this.sliderElementDisabledAttr", "attr.aria-label": "this.sliderElementAriaLabel" } }, providers: [NGX_SLIDER_CONTROL_VALUE_ACCESSOR], queries: [{ propertyName: "tooltipTemplate", first: true, predicate: ["tooltipTemplate"], descendants: true }], viewQueries: [{ propertyName: "leftOuterSelectionBarElement", first: true, predicate: ["leftOuterSelectionBar"], descendants: true, read: SliderElementDirective }, { propertyName: "rightOuterSelectionBarElement", first: true, predicate: ["rightOuterSelectionBar"], descendants: true, read: SliderElementDirective }, { propertyName: "fullBarElement", first: true, predicate: ["fullBar"], descendants: true, read: SliderElementDirective }, { propertyName: "selectionBarElement", first: true, predicate: ["selectionBar"], descendants: true, read: SliderElementDirective }, { propertyName: "minHandleElement", first: true, predicate: ["minHandle"], descendants: true, read: SliderHandleDirective }, { propertyName: "maxHandleElement", first: true, predicate: ["maxHandle"], descendants: true, read: SliderHandleDirective }, { propertyName: "floorLabelElement", first: true, predicate: ["floorLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "ceilLabelElement", first: true, predicate: ["ceilLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "minHandleLabelElement", first: true, predicate: ["minHandleLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "maxHandleLabelElement", first: true, predicate: ["maxHandleLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "combinedLabelElement", first: true, predicate: ["combinedLabel"], descendants: true, read: SliderLabelDirective }, { propertyName: "ticksElement", first: true, predicate: ["ticksElement"], descendants: true, read: SliderElementDirective }], usesOnChanges: true, ngImport: i0, template: "<!-- // 0 Left selection bar outside two handles -->\n<span\n  ngxSliderElement\n  #leftOuterSelectionBar\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-left-out-selection\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 1 Right selection bar outside two handles -->\n<span\n  ngxSliderElement\n  #rightOuterSelectionBar\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-right-out-selection\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 2 The whole slider bar -->\n<span\n  ngxSliderElement\n  #fullBar\n  [class.ngx-slider-transparent]=\"fullBarTransparentClass\"\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-full-bar\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 3 Selection bar between two handles -->\n<span\n  ngxSliderElement\n  #selectionBar\n  [class.ngx-slider-draggable]=\"selectionBarDraggableClass\"\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-selection-bar\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar ngx-slider-selection\" [ngStyle]=\"barStyle\"></span>\n</span>\n<!-- // 4 Low slider handle -->\n<span\n  ngxSliderHandle\n  #minHandle\n  class=\"ngx-slider-span ngx-slider-pointer ngx-slider-pointer-min\"\n  [ngStyle]=\"minPointerStyle\"\n></span>\n<!-- // 5 High slider handle -->\n<span\n  ngxSliderHandle\n  #maxHandle\n  [style.display]=\"range ? 'inherit' : 'none'\"\n  class=\"ngx-slider-span ngx-slider-pointer ngx-slider-pointer-max\"\n  [ngStyle]=\"maxPointerStyle\"\n></span>\n<!-- // 6 Floor label -->\n<span ngxSliderLabel #floorLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-limit ngx-slider-floor\"></span>\n<!-- // 7 Ceiling label -->\n<span ngxSliderLabel #ceilLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-limit ngx-slider-ceil\"></span>\n<!-- // 8 Label above the low slider handle -->\n<span ngxSliderLabel #minHandleLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-model-value\"></span>\n<!-- // 9 Label above the high slider handle -->\n<span ngxSliderLabel #maxHandleLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-model-high\"></span>\n<!-- // 10 Combined range label when the slider handles are close ex. 15 - 17 -->\n<span ngxSliderLabel #combinedLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-combined\"></span>\n<!-- // 11 The ticks -->\n<span\n  ngxSliderElement\n  #ticksElement\n  [hidden]=\"!showTicks\"\n  [class.ngx-slider-ticks-values-under]=\"ticksUnderValuesClass\"\n  class=\"ngx-slider-ticks\"\n>\n  @for (t of ticks; track t) {\n    <span class=\"ngx-slider-tick\" [ngClass]=\"{ 'ngx-slider-selected': t.selected }\" [ngStyle]=\"t.style\">\n      <ngx-slider-tooltip-wrapper\n        [template]=\"tooltipTemplate\"\n        [tooltip]=\"t.tooltip\"\n        [placement]=\"t.tooltipPlacement\"\n      ></ngx-slider-tooltip-wrapper>\n      @if (t.value !== null) {\n        <ngx-slider-tooltip-wrapper\n          class=\"ngx-slider-span ngx-slider-tick-value\"\n          [template]=\"tooltipTemplate\"\n          [tooltip]=\"t.valueTooltip\"\n          [placement]=\"t.valueTooltipPlacement\"\n          [content]=\"t.value\"\n        ></ngx-slider-tooltip-wrapper>\n      }\n      @if (t.legend !== null) {\n        <span class=\"ngx-slider-span ngx-slider-tick-legend\" [innerHTML]=\"t.legend\"></span>\n      }\n    </span>\n  }\n</span>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TooltipWrapperComponent, selector: "ngx-slider-tooltip-wrapper", inputs: ["template", "tooltip", "placement", "content"] }, { kind: "directive", type: SliderLabelDirective, selector: "[ngxSliderLabel]" }, { kind: "directive", type: SliderHandleDirective, selector: "[ngxSliderHandle]" }, { kind: "directive", type: SliderElementDirective, selector: "[ngxSliderElement]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SliderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-slider', providers: [NGX_SLIDER_CONTROL_VALUE_ACCESSOR], imports: [CommonModule, TooltipWrapperComponent, SliderLabelDirective, SliderHandleDirective, SliderElementDirective], template: "<!-- // 0 Left selection bar outside two handles -->\n<span\n  ngxSliderElement\n  #leftOuterSelectionBar\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-left-out-selection\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 1 Right selection bar outside two handles -->\n<span\n  ngxSliderElement\n  #rightOuterSelectionBar\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-right-out-selection\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 2 The whole slider bar -->\n<span\n  ngxSliderElement\n  #fullBar\n  [class.ngx-slider-transparent]=\"fullBarTransparentClass\"\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-full-bar\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar\"></span>\n</span>\n<!-- // 3 Selection bar between two handles -->\n<span\n  ngxSliderElement\n  #selectionBar\n  [class.ngx-slider-draggable]=\"selectionBarDraggableClass\"\n  class=\"ngx-slider-span ngx-slider-bar-wrapper ngx-slider-selection-bar\"\n>\n  <span class=\"ngx-slider-span ngx-slider-bar ngx-slider-selection\" [ngStyle]=\"barStyle\"></span>\n</span>\n<!-- // 4 Low slider handle -->\n<span\n  ngxSliderHandle\n  #minHandle\n  class=\"ngx-slider-span ngx-slider-pointer ngx-slider-pointer-min\"\n  [ngStyle]=\"minPointerStyle\"\n></span>\n<!-- // 5 High slider handle -->\n<span\n  ngxSliderHandle\n  #maxHandle\n  [style.display]=\"range ? 'inherit' : 'none'\"\n  class=\"ngx-slider-span ngx-slider-pointer ngx-slider-pointer-max\"\n  [ngStyle]=\"maxPointerStyle\"\n></span>\n<!-- // 6 Floor label -->\n<span ngxSliderLabel #floorLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-limit ngx-slider-floor\"></span>\n<!-- // 7 Ceiling label -->\n<span ngxSliderLabel #ceilLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-limit ngx-slider-ceil\"></span>\n<!-- // 8 Label above the low slider handle -->\n<span ngxSliderLabel #minHandleLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-model-value\"></span>\n<!-- // 9 Label above the high slider handle -->\n<span ngxSliderLabel #maxHandleLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-model-high\"></span>\n<!-- // 10 Combined range label when the slider handles are close ex. 15 - 17 -->\n<span ngxSliderLabel #combinedLabel class=\"ngx-slider-span ngx-slider-bubble ngx-slider-combined\"></span>\n<!-- // 11 The ticks -->\n<span\n  ngxSliderElement\n  #ticksElement\n  [hidden]=\"!showTicks\"\n  [class.ngx-slider-ticks-values-under]=\"ticksUnderValuesClass\"\n  class=\"ngx-slider-ticks\"\n>\n  @for (t of ticks; track t) {\n    <span class=\"ngx-slider-tick\" [ngClass]=\"{ 'ngx-slider-selected': t.selected }\" [ngStyle]=\"t.style\">\n      <ngx-slider-tooltip-wrapper\n        [template]=\"tooltipTemplate\"\n        [tooltip]=\"t.tooltip\"\n        [placement]=\"t.tooltipPlacement\"\n      ></ngx-slider-tooltip-wrapper>\n      @if (t.value !== null) {\n        <ngx-slider-tooltip-wrapper\n          class=\"ngx-slider-span ngx-slider-tick-value\"\n          [template]=\"tooltipTemplate\"\n          [tooltip]=\"t.valueTooltip\"\n          [placement]=\"t.valueTooltipPlacement\"\n          [content]=\"t.value\"\n        ></ngx-slider-tooltip-wrapper>\n      }\n      @if (t.legend !== null) {\n        <span class=\"ngx-slider-span ngx-slider-tick-legend\" [innerHTML]=\"t.legend\"></span>\n      }\n    </span>\n  }\n</span>\n" }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { class: [{
@@ -4193,16 +4189,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
  * Use {@link https://design-factory.amadeus.net/components/slider/agnosui  AgnosUI Slider} instead.
  */
 class DfSliderModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfSliderModule, imports: [SliderComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfSliderModule, imports: [SliderComponent,
             SliderElementDirective,
             SliderHandleDirective,
             SliderLabelDirective,
             TooltipWrapperComponent,
             DfSliderDirectionDirective], exports: [DfSliderDirectionDirective, SliderComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSliderModule, imports: [SliderComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSliderModule, imports: [SliderComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSliderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSliderModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -4232,10 +4228,10 @@ class DfSideNavConfig {
         this.isAppOverlay = false;
         this.isAppOverlayMode = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavConfig, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavConfig, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavConfig, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavConfig, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -4258,19 +4254,19 @@ var DfNavItemType;
  * Creating a sidenav is straightforward: use [DfSideNavComponent](#/components/sidenav/api#DfSideNavComponent) component
  */
 class DfSideNavService {
-    constructor(config) {
-        this.config = config;
+    constructor() {
         this.type = DfNavItemType;
-        this._items = [];
-        this.subscription = new Subscription();
+        this.config = inject(DfSideNavConfig);
         this._sideNavItems$ = new BehaviorSubject([]);
-        this._isMinmized$ = new BehaviorSubject(config.isMinmized);
-        this._isCollapsed$ = new BehaviorSubject(config.isCollapsed);
-        this._isPresent$ = new BehaviorSubject(config.isPresent);
-        this._isInMenuOverlay$ = new BehaviorSubject(config.isInMenuOverlay);
-        this._isAppOverlay$ = new BehaviorSubject(config.isAppOverlay);
+        this._isMinmized$ = new BehaviorSubject(this.config.isMinmized);
+        this._isCollapsed$ = new BehaviorSubject(this.config.isCollapsed);
+        this._isPresent$ = new BehaviorSubject(this.config.isPresent);
         this._activeItem$ = new BehaviorSubject(null);
-        this._isAppOverlayMode = config.isAppOverlayMode;
+        this._isInMenuOverlay$ = new BehaviorSubject(this.config.isInMenuOverlay);
+        this._isAppOverlay$ = new BehaviorSubject(this.config.isAppOverlay);
+        this._isAppOverlayMode = this.config.isAppOverlayMode;
+        this._items = [];
+        this.subscription = new Subscription();
         this.subscription.add(this._isCollapsed$.subscribe(() => {
             this.updateOverLay();
         }));
@@ -4542,15 +4538,15 @@ class DfSideNavService {
     updateOverLay() {
         this._isAppOverlay$.next(this.isAppOverlayMode && this._isCollapsed$.value === false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavService, deps: [{ token: DfSideNavConfig }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: DfSideNavConfig }] });
+        }], ctorParameters: () => [] });
 
 const environment = {
     animation: true,
@@ -4665,8 +4661,8 @@ const ngbCompleteTransition = (element) => {
  * to provide default values for the sideNav used in the application.
  */
 class DfSideNavCollapseConfig {
-    constructor(_ngbConfig) {
-        this._ngbConfig = _ngbConfig;
+    constructor() {
+        this._ngbConfig = inject(NgbConfig);
     }
     get animation() {
         return this._animation === undefined ? this._ngbConfig.animation : this._animation;
@@ -4674,13 +4670,13 @@ class DfSideNavCollapseConfig {
     set animation(animation) {
         this._animation = animation;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseConfig, deps: [{ token: i1.NgbConfig }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseConfig, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseConfig, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseConfig, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseConfig, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1.NgbConfig }] });
+        }] });
 
 /**
  * A service for managing the sidenav panel animation.
@@ -4689,9 +4685,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
  * Creating a sidenav is straightforward: use [DfSideNavComponent](#/components/sidenav/api#DfSideNavComponent) component
  */
 class DfSideNavCollapseService {
-    constructor(_config) {
-        this._config = _config;
-        this._sideNavAnimation$ = new BehaviorSubject(_config.animation);
+    constructor() {
+        this._sideNavAnimation$ = new BehaviorSubject(inject(DfSideNavCollapseConfig).animation);
     }
     get sideNavAnimation$() {
         return this._sideNavAnimation$.asObservable();
@@ -4705,15 +4700,15 @@ class DfSideNavCollapseService {
     setAnimation(on) {
         this._sideNavAnimation$.next(on);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseService, deps: [{ token: DfSideNavCollapseConfig }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: DfSideNavCollapseConfig }] });
+        }] });
 
 function measureCollapsingElementWidthPx(element) {
     // SSR fix for without injecting the PlatformId
@@ -4868,20 +4863,20 @@ class DfSideNavCollapseDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfSideNavCollapseDirective, isStandalone: true, selector: "[dfSideNavCollapse]", inputs: { dfSideNavCollapse: { classPropertyName: "dfSideNavCollapse", publicName: "dfSideNavCollapse", isSignal: true, isRequired: true, transformFunction: null }, minimized: { classPropertyName: "minimized", publicName: "minimized", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dfSideNavCollapseChange: "dfSideNavCollapseChange", shown: "shown", hidden: "hidden" }, exportAs: ["dfSideNavCollapse"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfSideNavCollapseDirective, isStandalone: true, selector: "[dfSideNavCollapse]", inputs: { dfSideNavCollapse: { classPropertyName: "dfSideNavCollapse", publicName: "dfSideNavCollapse", isSignal: true, isRequired: true, transformFunction: null }, minimized: { classPropertyName: "minimized", publicName: "minimized", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dfSideNavCollapseChange: "dfSideNavCollapseChange", shown: "shown", hidden: "hidden" }, exportAs: ["dfSideNavCollapse"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[dfSideNavCollapse]', exportAs: 'dfSideNavCollapse' }]
         }], ctorParameters: () => [] });
 
 class DfSideNavCollapseModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseModule, imports: [DfSideNavCollapseDirective], exports: [DfSideNavCollapseDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseModule, imports: [DfSideNavCollapseDirective], exports: [DfSideNavCollapseDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavCollapseModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavCollapseModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfSideNavCollapseDirective],
@@ -4890,9 +4885,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfManageSideNavDirective {
-    constructor(element, renderer) {
-        this.element = element;
-        this.renderer = renderer;
+    constructor() {
+        this.element = inject(ElementRef);
+        this.renderer = inject(Renderer2);
     }
     ngAfterViewChecked() {
         if (this.element.nativeElement.querySelector('.active')) {
@@ -4902,37 +4897,47 @@ class DfManageSideNavDirective {
             this.renderer.removeClass(this.element.nativeElement, 'df-sidenav-list-withactivated');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageSideNavDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfManageSideNavDirective, isStandalone: true, selector: "[dfManageSideNav]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageSideNavDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfManageSideNavDirective, isStandalone: true, selector: "[dfManageSideNav]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageSideNavDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageSideNavDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfManageSideNav]'
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }] });
+        }] });
 
-/**
- * @param element the HTML element
- * @returns whether the element is overflowing
- */
-function hasOverflow(element) {
-    return hasOverflowX(element) || hasOverflowY(element);
-}
-/**
- * @param element the HTML element
- * @returns whether the element is overflowing horizontally
- */
-function hasOverflowX(element) {
-    return element.offsetWidth < element.scrollWidth;
-}
-/**
- * @param element the HTML element
- * @returns whether the element is overflowing vertically
- */
-function hasOverflowY(element) {
-    return element.offsetHeight < element.scrollHeight;
+class DfOverflowService {
+    /**
+     * @param element the HTML element
+     * @returns whether the element is overflowing
+     */
+    hasOverflow(element) {
+        return this.hasOverflowX(element) || this.hasOverflowY(element);
+    }
+    /**
+     * @param element the HTML element
+     * @returns whether the element is overflowing horizontally
+     */
+    hasOverflowX(element) {
+        return element.offsetWidth < element.scrollWidth;
+    }
+    /**
+     * @param element the HTML element
+     * @returns whether the element is overflowing vertically
+     */
+    hasOverflowY(element) {
+        return element.offsetHeight < element.scrollHeight;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfOverflowService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfOverflowService, providedIn: 'root' }); }
 }
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfOverflowService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
 
 /**
  * DfTitleTruncate directive
@@ -4943,6 +4948,7 @@ class DfTitleTruncateDirective {
     constructor() {
         this.elementRef = inject((ElementRef));
         this.renderer = inject(Renderer2);
+        this.overflowService = inject(DfOverflowService);
     }
     ngOnInit() {
         this.renderer.addClass(this.elementRef.nativeElement, 'text-truncate');
@@ -4950,17 +4956,17 @@ class DfTitleTruncateDirective {
     ngDoCheck() {
         const { nativeElement } = this.elementRef;
         const titleAttributeName = 'title';
-        if (hasOverflow(nativeElement)) {
+        if (this.overflowService.hasOverflow(nativeElement)) {
             nativeElement.setAttribute(titleAttributeName, nativeElement.textContent);
         }
         else if (nativeElement.getAttribute(titleAttributeName)) {
             nativeElement.removeAttribute(titleAttributeName);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTitleTruncateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfTitleTruncateDirective, isStandalone: true, selector: "[dfTitleTruncate]", exportAs: ["dfTitleTruncate"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTitleTruncateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfTitleTruncateDirective, isStandalone: true, selector: "[dfTitleTruncate]", exportAs: ["dfTitleTruncate"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTitleTruncateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTitleTruncateDirective, decorators: [{
             type: Directive,
             args: [{
                     exportAs: 'dfTitleTruncate',
@@ -4994,10 +5000,10 @@ class DfSideNavListComponent {
         uniqueId++;
         return `df-sidenav-id-${uniqueId};`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DfSideNavListComponent, isStandalone: true, selector: "df-sidenavlist", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, tplIcon: { classPropertyName: "tplIcon", publicName: "tplIcon", isSignal: true, isRequired: false, transformFunction: null }, tplItem: { classPropertyName: "tplItem", publicName: "tplItem", isSignal: true, isRequired: false, transformFunction: null }, currentItem: { classPropertyName: "currentItem", publicName: "currentItem", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ul class=\"df-sidenav-list\" [ngbCollapse]=\"currentItem()?.isCollapsed ?? false\" [attr.id]=\"id()\">\n  @for (item of items(); track item; let i = $index) {\n    <li [class]=\"item.class\" dfManageSideNav>\n      <ng-template #dfSideNavItemContent>\n        @let tIcon = tplIcon();\n        @if (tIcon && item.icon) {\n          <ng-template\n            [ngTemplateOutlet]=\"tIcon.templateRef\"\n            [ngTemplateOutletContext]=\"{ $implicit: item }\"\n          ></ng-template>\n        } @else if (item.icon) {\n          <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n        }\n        <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n      </ng-template>\n      @switch (item.type) {\n        @case (sideNavService.type.subMenus) {\n          <ng-template #subMenus>\n            <button\n              class=\"df-sidenav-item d-flex align-items-center\"\n              (click)=\"sideNavService.toggle(item)\"\n              type=\"button\"\n              [attr.aria-expanded]=\"!item.isCollapsed\"\n              [attr.aria-controls]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n              [class.df-sidenav-item-withicon]=\"item.icon\"\n            >\n              @let tIcon = tplIcon();\n              @if (tIcon && item.icon) {\n                <ng-template\n                  [ngTemplateOutlet]=\"tIcon.templateRef\"\n                  [ngTemplateOutletContext]=\"{ $implicit: item }\"\n                ></ng-template>\n              } @else if (item.icon) {\n                <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n              }\n              <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n              <span\n                class=\"ms-3 df-sidenav-collapse-icon fa-light\"\n                [class.fa-chevron-down]=\"item.isCollapsed\"\n                [class.fa-chevron-up]=\"!item.isCollapsed\"\n              ></span>\n              <!-- put the chevron as icon directly in the menu -->\n              <!-- todo the icon and the minimized -->\n            </button>\n            <!-- we don't pass the icons as they are not suppose to have ones ??-->\n            <df-sidenavlist\n              [items]=\"item.subMenus ?? []\"\n              [tplItem]=\"tplItem()\"\n              [currentItem]=\"item\"\n              [id]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n            ></df-sidenavlist>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.actionButton) {\n          <ng-template #dfSideNavItemButton>\n            <button\n              class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n              (click)=\"sideNavService.activeItem(item)\"\n              [class.active]=\"item.isActive\"\n            >\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n            </button>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.routerLink) {\n          <ng-template #dfRouterTemplate>\n            <a\n              class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n              routerLinkActive=\"active\"\n              routerLink=\"{{ item.value }}\"\n              ariaCurrentWhenActive=\"page\"\n            >\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n            </a>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.separator) {\n          <ng-template #dfSeparatorTmp>\n            <hr class=\"spacing-01\" />\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.template) {\n          @let tItem = tplItem();\n          @if (tItem) {\n            <ng-template\n              [ngTemplateOutlet]=\"tItem.templateRef\"\n              [ngTemplateOutletContext]=\"{ $implicit: item }\"\n            ></ng-template>\n          }\n        }\n        @case (sideNavService.type.title) {\n          <ng-template #dfTitleTmp>\n            <div class=\"df-sidenav-item df-sidenav-title d-flex align-items-center flex-grow-1\">\n              <span class=\"text-nowrap text-uppercase text-muted\" dfTitleTruncate>{{ item.title }}</span>\n            </div>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n            </ng-container>\n          }\n        }\n        @default {\n          <ng-template #dfLinkDefaultTmp>\n            <a\n              class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n              href=\"{{ item.value }}\"\n              [class.active]=\"item.isActive && item.type === sideNavService.type.link\"\n              [attr.target]=\"item.type === sideNavService.type.externalLink ? '_blank' : ''\"\n            >\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n            </a>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n            </ng-container>\n          }\n        }\n      }\n    </li>\n  }\n</ul>\n", dependencies: [{ kind: "component", type: DfSideNavListComponent, selector: "df-sidenavlist", inputs: ["items", "tplIcon", "tplItem", "currentItem", "id"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: NgbCollapseModule }, { kind: "directive", type: i1.NgbCollapse, selector: "[ngbCollapse]", inputs: ["animation", "ngbCollapse", "horizontal"], outputs: ["ngbCollapseChange", "shown", "hidden"], exportAs: ["ngbCollapse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: DfMediaModule }, { kind: "directive", type: DfIfMediaDirective, selector: "[dfIfMedia]", inputs: ["dfIfMedia"] }, { kind: "ngmodule", type: DfSideNavCollapseModule }, { kind: "directive", type: DfManageSideNavDirective, selector: "[dfManageSideNav]" }, { kind: "directive", type: DfTitleTruncateDirective, selector: "[dfTitleTruncate]", exportAs: ["dfTitleTruncate"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: DfSideNavListComponent, isStandalone: true, selector: "df-sidenavlist", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, tplIcon: { classPropertyName: "tplIcon", publicName: "tplIcon", isSignal: true, isRequired: false, transformFunction: null }, tplItem: { classPropertyName: "tplItem", publicName: "tplItem", isSignal: true, isRequired: false, transformFunction: null }, currentItem: { classPropertyName: "currentItem", publicName: "currentItem", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ul class=\"df-sidenav-list\" [ngbCollapse]=\"currentItem()?.isCollapsed ?? false\" [attr.id]=\"id()\">\n  @for (item of items(); track item; let i = $index) {\n    <li [class]=\"item.class\" dfManageSideNav>\n      <ng-template #dfSideNavItemContent>\n        @let tIcon = tplIcon();\n        @if (tIcon && item.icon) {\n          <ng-template\n            [ngTemplateOutlet]=\"tIcon.templateRef\"\n            [ngTemplateOutletContext]=\"{ $implicit: item }\"\n          ></ng-template>\n        } @else if (item.icon) {\n          <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n        }\n        <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n      </ng-template>\n      @switch (item.type) {\n        @case (sideNavService.type.subMenus) {\n          <ng-template #subMenus>\n            <button\n              class=\"df-sidenav-item d-flex align-items-center\"\n              (click)=\"sideNavService.toggle(item)\"\n              type=\"button\"\n              [attr.aria-expanded]=\"!item.isCollapsed\"\n              [attr.aria-controls]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n              [class.df-sidenav-item-withicon]=\"item.icon\"\n            >\n              @let tIcon = tplIcon();\n              @if (tIcon && item.icon) {\n                <ng-template\n                  [ngTemplateOutlet]=\"tIcon.templateRef\"\n                  [ngTemplateOutletContext]=\"{ $implicit: item }\"\n                ></ng-template>\n              } @else if (item.icon) {\n                <span aria-hidden=\"true\" class=\"{{ item.icon }} df-sidenav-icon me-3\"></span>\n              }\n              <span class=\"flex-grow-1 text-nowrap\" dfTitleTruncate>{{ item.title }}</span>\n              <span\n                class=\"ms-3 df-sidenav-collapse-icon fa-light\"\n                [class.fa-chevron-down]=\"item.isCollapsed\"\n                [class.fa-chevron-up]=\"!item.isCollapsed\"\n              ></span>\n              <!-- put the chevron as icon directly in the menu -->\n              <!-- todo the icon and the minimized -->\n            </button>\n            <!-- we don't pass the icons as they are not suppose to have ones ??-->\n            <df-sidenavlist\n              [items]=\"item.subMenus ?? []\"\n              [tplItem]=\"tplItem()\"\n              [currentItem]=\"item\"\n              [id]=\"'sidenavControl' + controlledUniqueId.toString() + '-' + i\"\n            ></df-sidenavlist>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"subMenus\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.actionButton) {\n          <ng-template #dfSideNavItemButton>\n            <button\n              class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n              (click)=\"sideNavService.activeItem(item)\"\n              [class.active]=\"item.isActive\"\n            >\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n            </button>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemButton\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.routerLink) {\n          <ng-template #dfRouterTemplate>\n            <a\n              class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n              routerLinkActive=\"active\"\n              routerLink=\"{{ item.value }}\"\n              ariaCurrentWhenActive=\"page\"\n            >\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n            </a>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfRouterTemplate\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.separator) {\n          <ng-template #dfSeparatorTmp>\n            <hr class=\"spacing-01\" />\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfSeparatorTmp\"></ng-container>\n            </ng-container>\n          }\n        }\n        @case (sideNavService.type.template) {\n          @let tItem = tplItem();\n          @if (tItem) {\n            <ng-template\n              [ngTemplateOutlet]=\"tItem.templateRef\"\n              [ngTemplateOutletContext]=\"{ $implicit: item }\"\n            ></ng-template>\n          }\n        }\n        @case (sideNavService.type.title) {\n          <ng-template #dfTitleTmp>\n            <div class=\"df-sidenav-item df-sidenav-title d-flex align-items-center flex-grow-1\">\n              <span class=\"text-nowrap text-uppercase text-muted\" dfTitleTruncate>{{ item.title }}</span>\n            </div>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfTitleTmp\"></ng-container>\n            </ng-container>\n          }\n        }\n        @default {\n          <ng-template #dfLinkDefaultTmp>\n            <a\n              class=\"df-sidenav-item d-flex align-items-center flex-nowrap\"\n              href=\"{{ item.value }}\"\n              [class.active]=\"item.isActive && item.type === sideNavService.type.link\"\n              [attr.target]=\"item.type === sideNavService.type.externalLink ? '_blank' : ''\"\n            >\n              <ng-container *ngTemplateOutlet=\"dfSideNavItemContent\"></ng-container>\n            </a>\n          </ng-template>\n          @if (!item.breakpoints) {\n            <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n          } @else {\n            <ng-container *dfIfMedia=\"item.breakpoints!\">\n              <ng-container *ngTemplateOutlet=\"dfLinkDefaultTmp\"></ng-container>\n            </ng-container>\n          }\n        }\n      }\n    </li>\n  }\n</ul>\n", dependencies: [{ kind: "component", type: DfSideNavListComponent, selector: "df-sidenavlist", inputs: ["items", "tplIcon", "tplItem", "currentItem", "id"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: NgbCollapseModule }, { kind: "directive", type: i1$1.NgbCollapse, selector: "[ngbCollapse]", inputs: ["animation", "ngbCollapse", "horizontal"], outputs: ["ngbCollapseChange", "shown", "hidden"], exportAs: ["ngbCollapse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: DfMediaModule }, { kind: "directive", type: DfIfMediaDirective, selector: "[dfIfMedia]", inputs: ["dfIfMedia"] }, { kind: "ngmodule", type: DfSideNavCollapseModule }, { kind: "directive", type: DfManageSideNavDirective, selector: "[dfManageSideNav]" }, { kind: "directive", type: DfTitleTruncateDirective, selector: "[dfTitleTruncate]", exportAs: ["dfTitleTruncate"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'df-sidenavlist', imports: [
                         NgTemplateOutlet,
@@ -5011,38 +5017,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfSideNavHeaderDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
+    constructor() {
+        this.templateRef = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavHeaderDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfSideNavHeaderDirective, isStandalone: true, selector: "ng-template[dfSideNavHeader]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfSideNavHeaderDirective, isStandalone: true, selector: "ng-template[dfSideNavHeader]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavHeaderDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavHeaderDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[dfSideNavHeader]' }]
-        }], ctorParameters: () => [{ type: i0.TemplateRef }] });
+        }] });
 class DfSideNavIconDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
+    constructor() {
+        this.templateRef = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavIconDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfSideNavIconDirective, isStandalone: true, selector: "ng-template[dfSideNavIcon]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfSideNavIconDirective, isStandalone: true, selector: "ng-template[dfSideNavIcon]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavIconDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavIconDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[dfSideNavIcon]' }]
-        }], ctorParameters: () => [{ type: i0.TemplateRef }] });
+        }] });
 class DfSideNavItemDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
+    constructor() {
+        this.templateRef = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavItemDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfSideNavItemDirective, isStandalone: true, selector: "ng-template[dfSideNavItem]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfSideNavItemDirective, isStandalone: true, selector: "ng-template[dfSideNavItem]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavItemDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavItemDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[dfSideNavItem]' }]
-        }], ctorParameters: () => [{ type: i0.TemplateRef }] });
+        }] });
 /**
  * SideNav is a component to provide navigation feature with a panel on the side of your page
  *
@@ -5072,10 +5078,10 @@ class DfSideNavComponent {
     ngOnDestroy() {
         this.sideNavService.removeSideBar();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DfSideNavComponent, isStandalone: true, selector: "df-sidenav", host: { properties: { "class": "classes()" } }, queries: [{ propertyName: "tplHeader", first: true, predicate: DfSideNavHeaderDirective, descendants: true, isSignal: true }, { propertyName: "tplIcon", first: true, predicate: DfSideNavIconDirective, descendants: true, isSignal: true }, { propertyName: "tplItem", first: true, predicate: DfSideNavItemDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"df-scroll-content\">\n  @if (tplHeader(); as tplHeader) {\n    <ng-template [ngTemplateOutlet]=\"tplHeader.templateRef\"></ng-template>\n  }\n  <df-sidenavlist [items]=\"navItems()\" [tplIcon]=\"tplIcon()\" [tplItem]=\"tplItem()\" />\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DfSideNavListComponent, selector: "df-sidenavlist", inputs: ["items", "tplIcon", "tplItem", "currentItem", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: DfSideNavComponent, isStandalone: true, selector: "df-sidenav", host: { properties: { "class": "classes()" } }, queries: [{ propertyName: "tplHeader", first: true, predicate: DfSideNavHeaderDirective, descendants: true, isSignal: true }, { propertyName: "tplIcon", first: true, predicate: DfSideNavIconDirective, descendants: true, isSignal: true }, { propertyName: "tplItem", first: true, predicate: DfSideNavItemDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"df-scroll-content\">\n  @if (tplHeader(); as tplHeader) {\n    <ng-template [ngTemplateOutlet]=\"tplHeader.templateRef\"></ng-template>\n  }\n  <df-sidenavlist [items]=\"navItems()\" [tplIcon]=\"tplIcon()\" [tplItem]=\"tplItem()\" />\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DfSideNavListComponent, selector: "df-sidenavlist", inputs: ["items", "tplIcon", "tplItem", "currentItem", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'df-sidenav', imports: [CommonModule, DfSideNavListComponent], host: {
                         '[class]': 'classes()'
@@ -5085,7 +5091,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
 /**
  * The directive to catch focusin event and put the focus at a defined position in the page
  *
- * @deprecated use {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inert inert} instead
+ * @deprecated 19.1.0 use {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inert inert} instead
  * @since 9.1.0
  */
 class DfExcludeTrapDirective {
@@ -5130,10 +5136,10 @@ class DfExcludeTrapDirective {
             this.subscriptionInput.unsubscribe();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfExcludeTrapDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfExcludeTrapDirective, isStandalone: true, selector: "[dfExcludeTrap]", inputs: { dfExcludeTrapSelector: { classPropertyName: "dfExcludeTrapSelector", publicName: "dfExcludeTrapSelector", isSignal: true, isRequired: false, transformFunction: null }, dfExcludeTrap: { classPropertyName: "dfExcludeTrap", publicName: "dfExcludeTrap", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfExcludeTrapDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfExcludeTrapDirective, isStandalone: true, selector: "[dfExcludeTrap]", inputs: { dfExcludeTrapSelector: { classPropertyName: "dfExcludeTrapSelector", publicName: "dfExcludeTrapSelector", isSignal: true, isRequired: false, transformFunction: null }, dfExcludeTrap: { classPropertyName: "dfExcludeTrap", publicName: "dfExcludeTrap", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfExcludeTrapDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfExcludeTrapDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfExcludeTrap]'
@@ -5143,11 +5149,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
 const DF_SELECT_CLASS = 'df-ym';
 
 class DfManageNavSelectDirective {
-    constructor(select, element, rtlDirectionService, renderer) {
-        this.select = select;
-        this.element = element;
-        this.rtlDirectionService = rtlDirectionService;
-        this.renderer = renderer;
+    constructor() {
+        this.select = inject(NgSelectComponent, { host: true });
+        this.element = inject(ElementRef);
+        this.rtlDirectionService = inject(DfDirectionDetectionService);
+        this.renderer = inject(Renderer2);
     }
     ngOnInit() {
         this.direction = this.rtlDirectionService.getPageDirection(this.element);
@@ -5222,17 +5228,15 @@ class DfManageNavSelectDirective {
             (listBadge[currentPos - 1] || document.activeElement).focus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageNavSelectDirective, deps: [{ token: i1$2.NgSelectComponent, host: true }, { token: i0.ElementRef }, { token: DfDirectionDetectionService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfManageNavSelectDirective, isStandalone: true, selector: "[dfManageNavSelect]", host: { listeners: { "keydown.arrowLeft": "handleKeyDown($event)", "keydown.Backspace": "handleKeyDownBackspace($event)", "keydown.arrowRight": "handleKeyDownRight($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageNavSelectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfManageNavSelectDirective, isStandalone: true, selector: "[dfManageNavSelect]", host: { listeners: { "keydown.arrowLeft": "handleKeyDown($event)", "keydown.Backspace": "handleKeyDownBackspace($event)", "keydown.arrowRight": "handleKeyDownRight($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageNavSelectDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageNavSelectDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfManageNavSelect]'
                 }]
-        }], ctorParameters: () => [{ type: i1$2.NgSelectComponent, decorators: [{
-                    type: Host
-                }] }, { type: i0.ElementRef }, { type: DfDirectionDetectionService }, { type: i0.Renderer2 }], propDecorators: { handleKeyDown: [{
+        }], propDecorators: { handleKeyDown: [{
                 type: HostListener,
                 args: ['keydown.arrowLeft', ['$event']]
             }], handleKeyDownBackspace: [{
@@ -5271,10 +5275,10 @@ class DfOptionHighlightDirective {
     setInnerHtml(html) {
         this.renderer.setProperty(this.elementRef.nativeElement, 'innerHTML', html);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfOptionHighlightDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfOptionHighlightDirective, isStandalone: true, selector: "[dfOptionHighlight]", inputs: { dfOptionHighlight: { classPropertyName: "dfOptionHighlight", publicName: "dfOptionHighlight", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfOptionHighlightDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfOptionHighlightDirective, isStandalone: true, selector: "[dfOptionHighlight]", inputs: { dfOptionHighlight: { classPropertyName: "dfOptionHighlight", publicName: "dfOptionHighlight", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfOptionHighlightDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfOptionHighlightDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfOptionHighlight]'
@@ -5315,10 +5319,10 @@ class DfManageBadgeEventsDirective {
         this.dfManageBadgeEventsSelect()[0](this.dfManageBadgeEventsSelect()[1]);
         event.stopPropagation();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageBadgeEventsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfManageBadgeEventsDirective, isStandalone: true, selector: "[dfManageBadgeEventsSelect]", inputs: { dfManageBadgeEventsSelect: { classPropertyName: "dfManageBadgeEventsSelect", publicName: "dfManageBadgeEventsSelect", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "tabindex": "-1" }, listeners: { "keydown.Backspace": "handleKeyDownBackspace($event)", "click": "handleClick($event)", "keydown.Enter": "handleKeyDownEnter($event)", "keydown.Delete": "handleKeyDownDelete($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageBadgeEventsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfManageBadgeEventsDirective, isStandalone: true, selector: "[dfManageBadgeEventsSelect]", inputs: { dfManageBadgeEventsSelect: { classPropertyName: "dfManageBadgeEventsSelect", publicName: "dfManageBadgeEventsSelect", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "tabindex": "-1" }, listeners: { "keydown.Backspace": "handleKeyDownBackspace($event)", "click": "handleClick($event)", "keydown.Enter": "handleKeyDownEnter($event)", "keydown.Delete": "handleKeyDownDelete($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageBadgeEventsDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageBadgeEventsDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfManageBadgeEventsSelect]',
@@ -5333,11 +5337,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }], ctorParameters: () => [] });
 
 class DfSelectModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfSelectModule, imports: [DfManageNavSelectDirective, DfManageBadgeEventsDirective, DfOptionHighlightDirective], exports: [DfManageNavSelectDirective, DfManageBadgeEventsDirective, DfOptionHighlightDirective, NgSelectModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSelectModule, imports: [NgSelectModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfSelectModule, imports: [DfManageNavSelectDirective, DfManageBadgeEventsDirective, DfOptionHighlightDirective], exports: [DfManageNavSelectDirective, DfManageBadgeEventsDirective, DfOptionHighlightDirective, NgSelectModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSelectModule, imports: [NgSelectModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSelectModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSelectModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfManageNavSelectDirective, DfManageBadgeEventsDirective, DfOptionHighlightDirective],
@@ -5556,10 +5560,10 @@ class DfStepperService {
         this._state = this.normalizeState(this._state);
         this.dispatchStepperState();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperService, decorators: [{
             type: Injectable
         }] });
 
@@ -5591,10 +5595,10 @@ class DfStepperStepDirective {
     ngOnDestroy() {
         this.unlistener.forEach((ul) => ul());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperStepDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfStepperStepDirective, isStandalone: true, selector: "[dfStepperStep]", exportAs: ["dfStepperStep"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperStepDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfStepperStepDirective, isStandalone: true, selector: "[dfStepperStep]", exportAs: ["dfStepperStep"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperStepDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperStepDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfStepperStep]',
@@ -5702,10 +5706,10 @@ class DfStepperDirective {
             this.stepperService.resetFocus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: DfStepperDirective, isStandalone: true, selector: "[dfStepperLogic]", host: { listeners: { "keydown.Enter": "handleEnterDown()", "keydown.Space": "handleSpaceDown()", "keydown.arrowRight": "handleKeyDownRight($event)", "keydown.arrowLeft": "handleKeyDown($event)", "keydown.arrowDown": "handleKeyDownUp($event)", "keydown.arrowUp": "handleKeyDownDown($event)" } }, exportAs: ["dfStepperLogic"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.4", type: DfStepperDirective, isStandalone: true, selector: "[dfStepperLogic]", host: { listeners: { "keydown.Enter": "handleEnterDown()", "keydown.Space": "handleSpaceDown()", "keydown.arrowRight": "handleKeyDownRight($event)", "keydown.arrowLeft": "handleKeyDown($event)", "keydown.arrowDown": "handleKeyDownUp($event)", "keydown.arrowUp": "handleKeyDownDown($event)" } }, exportAs: ["dfStepperLogic"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfStepperLogic]',
@@ -5740,10 +5744,10 @@ class DfStepperStepContentDirective {
          */
         this.dfStepperStepContent = input(-1, { transform: (value) => numberAttribute(value, -1) });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperStepContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfStepperStepContentDirective, isStandalone: true, selector: "ng-template[dfStepperStepContent]", inputs: { dfStepperStepContent: { classPropertyName: "dfStepperStepContent", publicName: "dfStepperStepContent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperStepContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfStepperStepContentDirective, isStandalone: true, selector: "ng-template[dfStepperStepContent]", inputs: { dfStepperStepContent: { classPropertyName: "dfStepperStepContent", publicName: "dfStepperStepContent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperStepContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperStepContentDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[dfStepperStepContent]' }]
         }] });
@@ -5770,10 +5774,10 @@ class DfStepperComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DfStepperComponent, isStandalone: true, selector: "[dfStepper]", host: { attributes: { "role": "tablist" }, properties: { "class.df-vertical-stepper": "state()?.isVertical", "attr.aria-label": "stepperService.stepperAriaLabel", "attr.aria-orientation": "state()?.isVertical ? \"vertical\": null" }, classAttribute: "df-stepper mb-2" }, queries: [{ propertyName: "tplStepsContent", predicate: DfStepperStepContentDirective, isSignal: true }], hostDirectives: [{ directive: DfStepperDirective }], ngImport: i0, template: "<ng-template #myStepperLine>\n  <div class=\"df-stepper-line-wrapper\">\n    <div class=\"df-stepper-line\">\n      <div class=\"df-stepper-horizontal-line\"></div>\n    </div>\n    <div class=\"df-stepper-line d-none d-sm-flex\">\n      <div class=\"flex-grow-1\"></div>\n    </div>\n  </div>\n</ng-template>\n@if (state(); as state) {\n  @for (step of state.steps; track step; let i = $index) {\n    <button\n      #stepbasic\n      class=\"btn btn-link df-stepper-step\"\n      dfStepperStep\n      [class.active]=\"i === state.active\"\n      [class.flex-row]=\"state.isInline || state.isVertical\"\n      [attr.tabIndex]=\"i === state.active ? 0 : -1\"\n      [class.df-stepper-step-warning]=\"step.type === 'warning'\"\n      [class.df-stepper-step-completed]=\"step.type === 'completed'\"\n      [class.df-stepper-step-visited]=\"step.type === 'visited'\"\n      [class.df-stepper-step-future]=\"step.type === 'future'\"\n      [disabled]=\"\n        state.isLinear &&\n        (step.type === 'future' || step.type === 'completed' || (step.type === 'visited' && i !== state.active))\n      \"\n      role=\"tab\"\n      [attr.aria-selected]=\"i === state.active ? 'true' : 'false'\"\n      [attr.aria-posinset]=\"i + 1\"\n      [attr.aria-setsize]=\"state.steps.length\"\n      [attr.aria-controls]=\"step.ariaControl\"\n      (click)=\"stepperService.selectWithFocus(i)\"\n    >\n      <div\n        [class.df-stepper-outline-number-visited]=\"step.type === 'visited'\"\n        [class.df-stepper-outline-icon]=\"step.type === 'warning'\"\n        [class.fa-exclamation-triangle]=\"step.type === 'warning'\"\n        [class.df-stepper-icon]=\"step.type === 'completed'\"\n        [class.fa-check]=\"step.type === 'completed'\"\n        [class.df-stepper-outline-number-future]=\"step.type === 'future'\"\n      >\n        <span aria-hidden=\"true\">{{ stepperService.getStepNumberLabel(i) }}</span>\n      </div>\n      <div\n        class=\"flex-column\"\n        [class.mt-1]=\"!state.isInline\"\n        [class.d-none]=\"!state.isVertical\"\n        [class.d-sm-flex]=\"!state.isVertical\"\n        [class.d-flex]=\"state.isVertical\"\n      >\n        @if (step.type === 'warning') {\n          <span class=\"visually-hidden\">{{ stepperService.warningLabel }}</span>\n        }\n        <span class=\"df-stepper-label\">{{ step.label }}</span>\n        @if (step.optionalLabel) {\n          <span class=\"df-stepper-optional-label\">{{ step.optionalLabel }}</span>\n        }\n        @if (step.completed) {\n          <span class=\"visually-hidden\">{{ stepperService.completedLabel }}</span>\n        }\n      </div>\n    </button>\n    @if (!state.isVertical && i < state.steps.length - 1) {\n      <ng-container [ngTemplateOutlet]=\"myStepperLine\"></ng-container>\n    }\n    @if (state.isVertical && i < state.steps.length) {\n      <div\n        [class.d-none]=\"state.steps.length - 1 === i\"\n        role=\"tabpanel\"\n        [id]=\"step.ariaControl\"\n        class=\"df-vertical-stepper-panel df-vertical-stepper-line\"\n      >\n        @if (mapStepToContent.has(i) && state.active === i) {\n          <ng-template\n            [ngTemplateOutlet]=\"mapStepToContent.get(i) || null\"\n            [ngTemplateOutletContext]=\"{ state, index: i, service: stepperService }\"\n          ></ng-template>\n        }\n      </div>\n    }\n  }\n}\n@if (stepperService.stepperState$ | async; as state) {\n  <div\n    class=\"text-primary mb-2\"\n    [class.d-block]=\"!state.isVertical\"\n    [class.d-sm-none]=\"!state.isVertical\"\n    [class.d-none]=\"state.isVertical\"\n  >\n    <span class=\"df-stepper-label\">{{ state.steps[state.active].label }}</span>\n  </div>\n}\n", dependencies: [{ kind: "directive", type: DfStepperStepDirective, selector: "[dfStepperStep]", exportAs: ["dfStepperStep"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: DfStepperComponent, isStandalone: true, selector: "[dfStepper]", host: { attributes: { "role": "tablist" }, properties: { "class.df-vertical-stepper": "state()?.isVertical", "attr.aria-label": "stepperService.stepperAriaLabel", "attr.aria-orientation": "state()?.isVertical ? \"vertical\": null" }, classAttribute: "df-stepper mb-2" }, queries: [{ propertyName: "tplStepsContent", predicate: DfStepperStepContentDirective, isSignal: true }], hostDirectives: [{ directive: DfStepperDirective }], ngImport: i0, template: "<ng-template #myStepperLine>\n  <div class=\"df-stepper-line-wrapper\">\n    <div class=\"df-stepper-line\">\n      <div class=\"df-stepper-horizontal-line\"></div>\n    </div>\n    <div class=\"df-stepper-line d-none d-sm-flex\">\n      <div class=\"flex-grow-1\"></div>\n    </div>\n  </div>\n</ng-template>\n@if (state(); as state) {\n  @for (step of state.steps; track step; let i = $index) {\n    <button\n      #stepbasic\n      class=\"btn btn-link df-stepper-step\"\n      dfStepperStep\n      [class.active]=\"i === state.active\"\n      [class.flex-row]=\"state.isInline || state.isVertical\"\n      [attr.tabIndex]=\"i === state.active ? 0 : -1\"\n      [class.df-stepper-step-warning]=\"step.type === 'warning'\"\n      [class.df-stepper-step-completed]=\"step.type === 'completed'\"\n      [class.df-stepper-step-visited]=\"step.type === 'visited'\"\n      [class.df-stepper-step-future]=\"step.type === 'future'\"\n      [disabled]=\"\n        state.isLinear &&\n        (step.type === 'future' || step.type === 'completed' || (step.type === 'visited' && i !== state.active))\n      \"\n      role=\"tab\"\n      [attr.aria-selected]=\"i === state.active ? 'true' : 'false'\"\n      [attr.aria-posinset]=\"i + 1\"\n      [attr.aria-setsize]=\"state.steps.length\"\n      [attr.aria-controls]=\"step.ariaControl\"\n      (click)=\"stepperService.selectWithFocus(i)\"\n    >\n      <div\n        [class.df-stepper-outline-number-visited]=\"step.type === 'visited'\"\n        [class.df-stepper-outline-icon]=\"step.type === 'warning'\"\n        [class.fa-exclamation-triangle]=\"step.type === 'warning'\"\n        [class.df-stepper-icon]=\"step.type === 'completed'\"\n        [class.fa-check]=\"step.type === 'completed'\"\n        [class.df-stepper-outline-number-future]=\"step.type === 'future'\"\n      >\n        <span aria-hidden=\"true\">{{ stepperService.getStepNumberLabel(i) }}</span>\n      </div>\n      <div\n        class=\"flex-column\"\n        [class.mt-1]=\"!state.isInline\"\n        [class.d-none]=\"!state.isVertical\"\n        [class.d-sm-flex]=\"!state.isVertical\"\n        [class.d-flex]=\"state.isVertical\"\n      >\n        @if (step.type === 'warning') {\n          <span class=\"visually-hidden\">{{ stepperService.warningLabel }}</span>\n        }\n        <span class=\"df-stepper-label\">{{ step.label }}</span>\n        @if (step.optionalLabel) {\n          <span class=\"df-stepper-optional-label\">{{ step.optionalLabel }}</span>\n        }\n        @if (step.completed) {\n          <span class=\"visually-hidden\">{{ stepperService.completedLabel }}</span>\n        }\n      </div>\n    </button>\n    @if (!state.isVertical && i < state.steps.length - 1) {\n      <ng-container [ngTemplateOutlet]=\"myStepperLine\"></ng-container>\n    }\n    @if (state.isVertical && i < state.steps.length) {\n      <div\n        [class.d-none]=\"state.steps.length - 1 === i\"\n        role=\"tabpanel\"\n        [id]=\"step.ariaControl\"\n        class=\"df-vertical-stepper-panel df-vertical-stepper-line\"\n      >\n        @if (mapStepToContent.has(i) && state.active === i) {\n          <ng-template\n            [ngTemplateOutlet]=\"mapStepToContent.get(i) || null\"\n            [ngTemplateOutletContext]=\"{ state, index: i, service: stepperService }\"\n          ></ng-template>\n        }\n      </div>\n    }\n  }\n}\n@if (stepperService.stepperState$ | async; as state) {\n  <div\n    class=\"text-primary mb-2\"\n    [class.d-block]=\"!state.isVertical\"\n    [class.d-sm-none]=\"!state.isVertical\"\n    [class.d-none]=\"state.isVertical\"\n  >\n    <span class=\"df-stepper-label\">{{ state.steps[state.active].label }}</span>\n  </div>\n}\n", dependencies: [{ kind: "directive", type: DfStepperStepDirective, selector: "[dfStepperStep]", exportAs: ["dfStepperStep"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperComponent, decorators: [{
             type: Component,
             args: [{ selector: '[dfStepper]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [DfStepperStepDirective, NgTemplateOutlet, AsyncPipe], hostDirectives: [DfStepperDirective], host: {
                         role: 'tablist',
@@ -5785,11 +5789,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }], ctorParameters: () => [] });
 
 class DfStepperModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfStepperModule, imports: [DfStepperDirective, DfStepperStepDirective, DfStepperComponent, DfStepperStepContentDirective], exports: [DfStepperDirective, DfStepperStepDirective, DfStepperComponent, DfStepperStepContentDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfStepperModule, imports: [DfStepperDirective, DfStepperStepDirective, DfStepperComponent, DfStepperStepContentDirective], exports: [DfStepperDirective, DfStepperStepDirective, DfStepperComponent, DfStepperStepContentDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfStepperModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfStepperModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfStepperDirective, DfStepperStepDirective, DfStepperComponent, DfStepperStepContentDirective],
@@ -5797,6 +5801,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                 }]
         }] });
 
+/**
+ * @param element the HTML element
+ * @returns whether the element is overflowing
+ */
+function hasOverflow(element) {
+    return hasOverflowX(element) || hasOverflowY(element);
+}
+/**
+ * @param element the HTML element
+ * @returns whether the element is overflowing horizontally
+ */
+function hasOverflowX(element) {
+    return element.offsetWidth < element.scrollWidth;
+}
+/**
+ * @param element the HTML element
+ * @returns whether the element is overflowing vertically
+ */
+function hasOverflowY(element) {
+    return element.offsetHeight < element.scrollHeight;
+}
+
 /**
  * My dfTooltipTruncate directive
  */
@@ -5830,10 +5856,10 @@ class DfTooltipTruncateDirective {
         this.tooltip.disableTooltip = disableToolTip;
         this.renderer.setAttribute(this.elementRef.nativeElement, 'tabIndex', disableToolTip ? '-1' : '0');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTooltipTruncateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfTooltipTruncateDirective, isStandalone: true, selector: "[dfTooltipTruncate]", inputs: { dfTooltipTruncate: { classPropertyName: "dfTooltipTruncate", publicName: "dfTooltipTruncate", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["dfTooltipTruncate"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTooltipTruncateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfTooltipTruncateDirective, isStandalone: true, selector: "[dfTooltipTruncate]", inputs: { dfTooltipTruncate: { classPropertyName: "dfTooltipTruncate", publicName: "dfTooltipTruncate", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["dfTooltipTruncate"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTooltipTruncateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTooltipTruncateDirective, decorators: [{
             type: Directive,
             args: [{
                     exportAs: 'dfTooltipTruncate',
@@ -5842,11 +5868,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfTooltipModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTooltipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfTooltipModule, imports: [DfTooltipTruncateDirective], exports: [DfTooltipTruncateDirective, NgbTooltipModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTooltipModule, imports: [NgbTooltipModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTooltipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfTooltipModule, imports: [DfTooltipTruncateDirective], exports: [DfTooltipTruncateDirective, NgbTooltipModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTooltipModule, imports: [NgbTooltipModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfTooltipModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfTooltipModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfTooltipTruncateDirective],
@@ -5855,8 +5881,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }] });
 
 class DfSideNavModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavModule, imports: [DfManageSideNavDirective,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavModule, imports: [DfManageSideNavDirective,
             DfSideNavComponent,
             DfSideNavHeaderDirective,
             DfExcludeTrapDirective,
@@ -5869,10 +5895,10 @@ class DfSideNavModule {
             DfSideNavItemDirective,
             DfSideNavCollapseModule,
             DfMediaModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavModule, imports: [DfSideNavComponent, DfSideNavCollapseModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavModule, imports: [DfSideNavComponent, DfSideNavCollapseModule,
             DfMediaModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfSideNavModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfSideNavModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -5926,25 +5952,38 @@ class DfManageCardSelectionDirective {
             this.element.nativeElement.focus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageCardSelectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfManageCardSelectionDirective, isStandalone: true, selector: "[dfManageCardSelected]", inputs: { dfManageCardSelected: { classPropertyName: "dfManageCardSelected", publicName: "dfManageCardSelected", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "click": "click($event)" } }, ngImport: i0 }); }
+    keydown(event) {
+        switch (event.key) {
+            case 'Enter':
+            case ' ':
+                this.click(event);
+                event.preventDefault();
+                break;
+            default:
+                return;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageCardSelectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfManageCardSelectionDirective, isStandalone: true, selector: "[dfManageCardSelected]", inputs: { dfManageCardSelected: { classPropertyName: "dfManageCardSelected", publicName: "dfManageCardSelected", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "click": "click($event)", "keydown": "keydown($event)" }, properties: { "attr.tabindex": "0" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfManageCardSelectionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfManageCardSelectionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfManageCardSelected]',
                     host: {
-                        '(click)': 'click($event)'
+                        '(click)': 'click($event)',
+                        '(keydown)': 'keydown($event)',
+                        '[attr.tabindex]': '0'
                     }
                 }]
         }], ctorParameters: () => [] });
 
 class DfAdvancedCardModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedCardModule, imports: [DfManageCardSelectionDirective], exports: [DfManageCardSelectionDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedCardModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedCardModule, imports: [DfManageCardSelectionDirective], exports: [DfManageCardSelectionDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedCardModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfAdvancedCardModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAdvancedCardModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfManageCardSelectionDirective],
@@ -5975,8 +6014,8 @@ const DF_MODULES = [
  * @deprecated Import only the needed modules or use standalone components instead of DfModule
  */
 class DfModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfModule, imports: [DfAlertModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfModule, imports: [DfAlertModule,
             DfDatePickerModule,
             DfSelectModule,
             DfProgressbarModule,
@@ -6009,7 +6048,7 @@ class DfModule {
             DfFooterModule,
             DfToastModule,
             DfStepperModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfModule, imports: [DF_MODULES, DfAlertModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfModule, imports: [DF_MODULES, DfAlertModule,
             DfDatePickerModule,
             DfSelectModule,
             DfProgressbarModule,
@@ -6027,7 +6066,7 @@ class DfModule {
             DfToastModule,
             DfStepperModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: DF_MODULES,
@@ -6105,10 +6144,10 @@ class DfWavesOfProgressDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfWavesOfProgressDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.5", type: DfWavesOfProgressDirective, isStandalone: true, selector: "[dfWavesOfProgress]", inputs: { dfWavesOfProgress: { classPropertyName: "dfWavesOfProgress", publicName: "dfWavesOfProgress", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "df-waves-of-progress-bg" }, exportAs: ["dfWavesOfProgress"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfWavesOfProgressDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.4", type: DfWavesOfProgressDirective, isStandalone: true, selector: "[dfWavesOfProgress]", inputs: { dfWavesOfProgress: { classPropertyName: "dfWavesOfProgress", publicName: "dfWavesOfProgress", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "df-waves-of-progress-bg" }, exportAs: ["dfWavesOfProgress"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfWavesOfProgressDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfWavesOfProgressDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[dfWavesOfProgress]',
@@ -6120,11 +6159,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }], ctorParameters: () => [] });
 
 class DfWavesOfProgressModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfWavesOfProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: DfWavesOfProgressModule, imports: [DfWavesOfProgressDirective], exports: [DfWavesOfProgressDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfWavesOfProgressModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfWavesOfProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: DfWavesOfProgressModule, imports: [DfWavesOfProgressDirective], exports: [DfWavesOfProgressDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfWavesOfProgressModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DfWavesOfProgressModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfWavesOfProgressModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [DfWavesOfProgressDirective],
@@ -6132,6 +6171,89 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                 }]
         }] });
 
+class DfAmadeusLogoComponent {
+    constructor() {
+        /**
+         * Class to apply to the SVG element. For example, you can use `df-logo-dim` to set proper dimensions inside footer and navbar.
+         */
+        this.svgClass = input('');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAmadeusLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.4", type: DfAmadeusLogoComponent, isStandalone: true, selector: "df-amadeus-logo", inputs: { svgClass: { classPropertyName: "svgClass", publicName: "svgClass", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <svg [class]="svgClass()" viewBox="0 0 113 16" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M107.272 6.62415C105.258 5.92656 104.367 5.46175 104.367 4.4161C104.367 3.75718 104.793 2.75021 106.807 2.75021C108.705 2.75021 110.72 3.60249 110.72 3.60249V0.696849C109.868 0.348052 108.357 0 106.652 0C103.746 0 100.958 1.54913 100.958 4.61021C100.958 7.67128 103.747 8.52282 105.646 9.14307C107.428 9.7239 108.629 10.3055 108.629 11.4671C108.629 12.4749 107.931 13.249 105.646 13.249C103.708 13.249 101.384 12.4749 101.384 12.4749V15.3798C101.384 15.3798 103.63 16 105.801 16C108.667 16 112.038 14.9923 112.038 11.2344C112.038 8.67751 109.946 7.55378 107.273 6.62415H107.272Z"
+        fill="currentColor"
+      />
+      <path
+        d="M34.2475 15.8059V0H29.8701L25.57 11.7773L21.2692 0H16.8917V15.8059H19.8747V3.87394L24.2135 15.8052H26.7316L31.2645 3.87394V15.8052H34.2475V15.8059Z"
+        fill="currentColor"
+      />
+      <path
+        d="M44.7062 0H38.9343V3.06033C41.6853 2.94432 42.4595 2.90564 43.6605 2.90564C45.5585 2.90564 46.6822 3.60249 46.6822 5.46249V6.66357H43.6605C38.5855 6.66357 37.0364 8.71693 37.0364 11.3898C37.0364 14.8376 39.5932 16 42.1501 16C44.7069 16 46.2568 14.7989 46.7603 14.4501V15.8059H50.0921V4.99693C50.0921 1.35502 48.1168 0 44.7069 0H44.7062ZM46.6822 12.4354C45.8299 12.7456 44.28 13.2877 42.8082 13.2877C41.4138 13.2877 40.2901 12.6682 40.2901 11.157C40.2901 9.8005 41.1424 9.10365 43.0016 9.02631L46.6822 8.87087V12.4354Z"
+        fill="currentColor"
+      />
+      <path
+        d="M73.8005 2.71154H81.7804V0H70.3906V15.8059H81.7804V13.0944H73.8005V9.25834H80.5793V6.58548H73.8005V2.71154Z"
+        fill="currentColor"
+      />
+      <path
+        d="M98.2073 15.8059V0H94.7209V12.048C93.8686 12.4354 92.6675 13.0557 90.9243 13.0557C88.7549 13.0557 88.0967 11.8546 88.0967 9.29776V0H84.6095V9.7239C84.6095 13.7919 85.9266 16 90.072 16C92.3968 16 93.5592 15.1477 94.7982 14.4501V15.8059H98.2073Z"
+        fill="currentColor"
+      />
+      <path
+        d="M59.8152 0H53.5398V15.8059H59.8152C65.123 15.8059 67.7958 13.3651 67.7958 7.74863C67.7958 2.8283 64.8902 0.000743702 59.8152 0.000743702V0ZM59.6597 13.0549H57.0255V2.75021H59.6597C62.2947 2.75021 64.2313 4.02863 64.2313 7.74789C64.2313 11.4671 62.9528 13.0549 59.6597 13.0549Z"
+        fill="currentColor"
+      />
+      <path
+        d="M7.67054 0H1.89867V3.06033C4.64888 2.94432 5.42382 2.90564 6.6249 2.90564C8.52282 2.90564 9.64656 3.60249 9.64656 5.46249V6.66357H6.6249C1.54987 6.66357 0 8.71693 0 11.3898C0 14.8376 2.55685 16 5.11369 16C7.67054 16 9.22041 14.7989 9.7239 14.4501V15.8059H13.0557V4.99693C13.0557 1.35577 11.0797 0 7.67054 0ZM9.64656 12.4354C8.79427 12.7456 7.2444 13.2877 5.77261 13.2877C4.37817 13.2877 3.25444 12.6682 3.25444 11.157C3.25444 9.8005 4.10672 9.10365 5.96598 9.02631L9.64656 8.87087V12.4354Z"
+        fill="currentColor"
+      />
+    </svg>
+    <span class="visually-hidden">Amadeus</span>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: DfAmadeusLogoComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'df-amadeus-logo',
+                    template: `
+    <svg [class]="svgClass()" viewBox="0 0 113 16" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M107.272 6.62415C105.258 5.92656 104.367 5.46175 104.367 4.4161C104.367 3.75718 104.793 2.75021 106.807 2.75021C108.705 2.75021 110.72 3.60249 110.72 3.60249V0.696849C109.868 0.348052 108.357 0 106.652 0C103.746 0 100.958 1.54913 100.958 4.61021C100.958 7.67128 103.747 8.52282 105.646 9.14307C107.428 9.7239 108.629 10.3055 108.629 11.4671C108.629 12.4749 107.931 13.249 105.646 13.249C103.708 13.249 101.384 12.4749 101.384 12.4749V15.3798C101.384 15.3798 103.63 16 105.801 16C108.667 16 112.038 14.9923 112.038 11.2344C112.038 8.67751 109.946 7.55378 107.273 6.62415H107.272Z"
+        fill="currentColor"
+      />
+      <path
+        d="M34.2475 15.8059V0H29.8701L25.57 11.7773L21.2692 0H16.8917V15.8059H19.8747V3.87394L24.2135 15.8052H26.7316L31.2645 3.87394V15.8052H34.2475V15.8059Z"
+        fill="currentColor"
+      />
+      <path
+        d="M44.7062 0H38.9343V3.06033C41.6853 2.94432 42.4595 2.90564 43.6605 2.90564C45.5585 2.90564 46.6822 3.60249 46.6822 5.46249V6.66357H43.6605C38.5855 6.66357 37.0364 8.71693 37.0364 11.3898C37.0364 14.8376 39.5932 16 42.1501 16C44.7069 16 46.2568 14.7989 46.7603 14.4501V15.8059H50.0921V4.99693C50.0921 1.35502 48.1168 0 44.7069 0H44.7062ZM46.6822 12.4354C45.8299 12.7456 44.28 13.2877 42.8082 13.2877C41.4138 13.2877 40.2901 12.6682 40.2901 11.157C40.2901 9.8005 41.1424 9.10365 43.0016 9.02631L46.6822 8.87087V12.4354Z"
+        fill="currentColor"
+      />
+      <path
+        d="M73.8005 2.71154H81.7804V0H70.3906V15.8059H81.7804V13.0944H73.8005V9.25834H80.5793V6.58548H73.8005V2.71154Z"
+        fill="currentColor"
+      />
+      <path
+        d="M98.2073 15.8059V0H94.7209V12.048C93.8686 12.4354 92.6675 13.0557 90.9243 13.0557C88.7549 13.0557 88.0967 11.8546 88.0967 9.29776V0H84.6095V9.7239C84.6095 13.7919 85.9266 16 90.072 16C92.3968 16 93.5592 15.1477 94.7982 14.4501V15.8059H98.2073Z"
+        fill="currentColor"
+      />
+      <path
+        d="M59.8152 0H53.5398V15.8059H59.8152C65.123 15.8059 67.7958 13.3651 67.7958 7.74863C67.7958 2.8283 64.8902 0.000743702 59.8152 0.000743702V0ZM59.6597 13.0549H57.0255V2.75021H59.6597C62.2947 2.75021 64.2313 4.02863 64.2313 7.74789C64.2313 11.4671 62.9528 13.0549 59.6597 13.0549Z"
+        fill="currentColor"
+      />
+      <path
+        d="M7.67054 0H1.89867V3.06033C4.64888 2.94432 5.42382 2.90564 6.6249 2.90564C8.52282 2.90564 9.64656 3.60249 9.64656 5.46249V6.66357H6.6249C1.54987 6.66357 0 8.71693 0 11.3898C0 14.8376 2.55685 16 5.11369 16C7.67054 16 9.22041 14.7989 9.7239 14.4501V15.8059H13.0557V4.99693C13.0557 1.35577 11.0797 0 7.67054 0ZM9.64656 12.4354C8.79427 12.7456 7.2444 13.2877 5.77261 13.2877C4.37817 13.2877 3.25444 12.6682 3.25444 11.157C3.25444 9.8005 4.10672 9.10365 5.96598 9.02631L9.64656 8.87087V12.4354Z"
+        fill="currentColor"
+      />
+    </svg>
+    <span class="visually-hidden">Amadeus</span>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }] });
+
 // Accessibility
 
 /**
@@ -6142,5 +6264,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BREAKPOINTS_VARS, ChangeContext, DF_BREAKPOINTS_VAR_DEFAULT, DfAccessibilityModule, DfAdvancedCardModule, DfAdvancedInputModule, DfAlertModule, DfAmadeusIconComponent, DfBreakpoints, DfDatePickerModule, DfDatepickerRangeDirective, DfDatepickerRangeService, DfDefaultSpinnerComponent, DfDirectionDetectionService, DfExcludeTrapDirective, DfFooterModule, DfIconModule, DfIfMediaDirective, DfInputIconDirective, DfInsertIconDirective, DfInsertIconModule, DfManageBadgeEventsDirective, DfManageCardSelectionDirective, DfManageNavSelectDirective, DfManageSideNavDirective, DfMedia, DfMediaModule, DfMediaObserver, DfMediaQuery, DfModalService, DfModule, DfNavItemType, DfOptionHighlightDirective, DfPopoverConfig, DfPopoverModule, DfProgressIndicatorBackdropComponent, DfProgressIndicatorContainerComponent, DfProgressIndicatorContentPosition, DfProgressIndicatorContentProgressBar, DfProgressIndicatorContentSpinner, DfProgressIndicatorContentType, DfProgressIndicatorDirective, DfProgressIndicatorModule, DfProgressIndicatorRef, DfProgressIndicatorService, DfProgressbarComponent, DfProgressbarModule, DfSelectModule, DfSideNavCollapseDirective, DfSideNavCollapseModule, DfSideNavCollapseService, DfSideNavComponent, DfSideNavConfig, DfSideNavHeaderDirective, DfSideNavIconDirective, DfSideNavItemDirective, DfSideNavModule, DfSideNavService, DfSliderDirectionDirective, DfSliderModule, DfStepperComponent, DfStepperDirective, DfStepperModule, DfStepperService, DfStepperStepContentDirective, DfStepperStepDirective, DfTitleTruncateDirective, DfToastModule, DfTooltipModule, DfTooltipTruncateDirective, DfTriggerClickDirective, DfWavesOfProgressDirective, DfWavesOfProgressModule, LabelType, Options, PointerType, RightToLeftDirectionEnum, SkipLinkDirective, SkipLinksContainerComponent, SliderComponent };
+export { BREAKPOINTS_VARS, ChangeContext, DF_BREAKPOINTS_VAR_DEFAULT, DfAccessibilityModule, DfAdvancedCardModule, DfAdvancedInputModule, DfAlertModule, DfAmadeusIconComponent, DfAmadeusLogoComponent, DfBreakpoints, DfDatePickerModule, DfDatepickerRangeDirective, DfDatepickerRangeService, DfDefaultSpinnerComponent, DfDirectionDetectionService, DfExcludeTrapDirective, DfFooterModule, DfIconModule, DfIfMediaDirective, DfInputIconDirective, DfInsertIconDirective, DfInsertIconModule, DfManageBadgeEventsDirective, DfManageCardSelectionDirective, DfManageNavSelectDirective, DfManageSideNavDirective, DfMedia, DfMediaModule, DfMediaObserver, DfMediaQuery, DfModalService, DfModule, DfNavItemType, DfOptionHighlightDirective, DfPopoverConfig, DfPopoverModule, DfProgressIndicatorBackdropComponent, DfProgressIndicatorContainerComponent, DfProgressIndicatorContentPosition, DfProgressIndicatorContentProgressBar, DfProgressIndicatorContentSpinner, DfProgressIndicatorContentType, DfProgressIndicatorDirective, DfProgressIndicatorModule, DfProgressIndicatorRef, DfProgressIndicatorService, DfProgressbarComponent, DfProgressbarModule, DfSelectModule, DfSideNavCollapseDirective, DfSideNavCollapseModule, DfSideNavCollapseService, DfSideNavComponent, DfSideNavConfig, DfSideNavHeaderDirective, DfSideNavIconDirective, DfSideNavItemDirective, DfSideNavModule, DfSideNavService, DfSliderDirectionDirective, DfSliderModule, DfStepperComponent, DfStepperDirective, DfStepperModule, DfStepperService, DfStepperStepContentDirective, DfStepperStepDirective, DfTitleTruncateDirective, DfToastModule, DfTooltipModule, DfTooltipTruncateDirective, DfTriggerClickDirective, DfWavesOfProgressDirective, DfWavesOfProgressModule, LabelType, Options, PointerType, RightToLeftDirectionEnum, SkipLinkDirective, SkipLinksContainerComponent, SliderComponent };
 //# sourceMappingURL=design-factory.mjs.map