@ethlete/cdk 2.5.0 → 2.5.2

package/fesm2022/ethlete-cdk.mjs

@@ -5,8 +5,8 @@ import { AsyncPipe, NgIf, NgClass, NgTemplateOutlet, NgForOf, JsonPipe, NgFor, D
 import * as i0 from '@angular/core';
 import { Component, ViewEncapsulation, ChangeDetectionStrategy, Directive, InjectionToken, Input, ContentChild, ContentChildren, inject, ElementRef, Injector, HostBinding, isDevMode, Injectable, TemplateRef, ViewContainerRef, forwardRef, ViewChild, EventEmitter, Output, Optional, Inject, SkipSelf, HostListener, ChangeDetectorRef, Renderer2, Attribute } from '@angular/core';
 import * as i1$1 from '@ethlete/core';
-import { LetDirective, createDestroy, ScrollObserverFirstElementDirective, ScrollObserverLastElementDirective, Memo, createReactiveBindings, IS_EMAIL, MUST_MATCH, IS_ARRAY_NOT_EMPTY, equal, ResizeObserverService, createFlipAnimation, ClickOutsideDirective, ANIMATED_LIFECYCLE_TOKEN, AnimatedLifecycleDirective, clone, AnimatedOverlayDirective, ObserveContentDirective, clamp, nextFrame, DELAYABLE_TOKEN, ObserveResizeDirective, SmartBlockScrollStrategy, RouterStateService, ClickObserverService, FocusVisibleService, scrollToElement, IS_ACTIVE_ELEMENT, CursorDragScrollDirective, ObserveScrollStateDirective, ScrollObserverIgnoreTargetDirective, TypedQueryList } from '@ethlete/core';
-import { BehaviorSubject, startWith, map, switchMap, combineLatest, pairwise, tap, takeUntil, skip, of, Subject, debounceTime, filter, distinctUntilChanged, withLatestFrom, shareReplay, catchError, throwError, firstValueFrom, fromEvent, merge, take, timer, skipUntil, defer, Subscription, Observable } from 'rxjs';
+import { LetDirective, createDestroy, ScrollObserverFirstElementDirective, ScrollObserverLastElementDirective, Memo, createReactiveBindings, IS_EMAIL, MUST_MATCH, IS_ARRAY_NOT_EMPTY, equal, ResizeObserverService, createFlipAnimation, ClickOutsideDirective, ANIMATED_LIFECYCLE_TOKEN, AnimatedLifecycleDirective, RuntimeError, AnimatedOverlayDirective, SelectionModel, ObserveContentDirective, clamp, nextFrame, DELAYABLE_TOKEN, ObserveResizeDirective, SmartBlockScrollStrategy, RouterStateService, ClickObserverService, FocusVisibleService, scrollToElement, IS_ACTIVE_ELEMENT, CursorDragScrollDirective, ObserveScrollStateDirective, ScrollObserverIgnoreTargetDirective, TypedQueryList } from '@ethlete/core';
+import { BehaviorSubject, startWith, map, switchMap, combineLatest, pairwise, tap, takeUntil, skip, of, Subject, debounceTime, filter, distinctUntilChanged, withLatestFrom, skipWhile, catchError, throwError, firstValueFrom, fromEvent, merge, take, timer, skipUntil, defer, Subscription, Observable } from 'rxjs';
 import { trigger, state, style, transition, animate } from '@angular/animations';
 import { __decorate, __metadata } from 'tslib';
 import { extractQuery, isQueryStateLoading, isQueryStateSuccess, isQueryStateFailure, QueryDirective } from '@ethlete/query';
@@ -14,7 +14,7 @@ import * as i1$2 from '@angular/cdk/a11y';
 import { FocusMonitor, LiveAnnouncer, AriaDescriber, FocusKeyManager, A11yModule } from '@angular/cdk/a11y';
 import { AutofillMonitor } from '@angular/cdk/text-field';
 import { FormControl, NgControl, Validators, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { ENTER, ESCAPE, TAB as TAB$1, DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW, SPACE, hasModifierKey, PAGE_DOWN, PAGE_UP, END, HOME, A } from '@angular/cdk/keycodes';
+import { ENTER, SPACE, ESCAPE, TAB as TAB$1, DOWN_ARROW, UP_ARROW, PAGE_UP, PAGE_DOWN, HOME, END, A, LEFT_ARROW, RIGHT_ARROW, hasModifierKey } from '@angular/cdk/keycodes';
 import * as i1$4 from '@angular/cdk/bidi';
 import { Directionality } from '@angular/cdk/bidi';
 import { CdkDialogContainer, Dialog, DialogConfig, DIALOG_SCROLL_STRATEGY_PROVIDER as DIALOG_SCROLL_STRATEGY_PROVIDER$1 } from '@angular/cdk/dialog';
@@ -32,8 +32,8 @@ import { CdkCell, CdkCellDef, CdkColumnDef, CDK_TABLE, CdkFooterCell, CdkFooterC
 import { takeUntil as takeUntil$1, take as take$1 } from 'rxjs/operators';
 
 class ChevronIconComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ChevronIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ChevronIconComponent, isStandalone: true, selector: "et-chevron-icon", host: { classAttribute: "et-chevron-icon" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ChevronIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ChevronIconComponent, isStandalone: true, selector: "et-chevron-icon", host: { classAttribute: "et-chevron-icon" }, ngImport: i0, template: `
     <!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. -->
     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
       <path
@@ -43,7 +43,7 @@ class ChevronIconComponent {
     </svg>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ChevronIconComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ChevronIconComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-chevron-icon',
@@ -68,10 +68,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
 const IconImports = [ChevronIconComponent];
 
 class AccordionLabelDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: AccordionLabelDirective, isStandalone: true, selector: "[et-accordion-label]", host: { classAttribute: "et-accordion-label" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: AccordionLabelDirective, isStandalone: true, selector: "[et-accordion-label]", host: { classAttribute: "et-accordion-label" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionLabelDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionLabelDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[et-accordion-label]',
@@ -88,10 +88,10 @@ class AccordionLabelWrapperDirective extends CdkPortal {
     constructor(templateRef, viewContainerRef) {
         super(templateRef, viewContainerRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionLabelWrapperDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: AccordionLabelWrapperDirective, isStandalone: true, selector: "ng-template[et-accordion-label-wrapper]", providers: [{ provide: ACCORDION_LABEL_WRAPPER_DIRECTIVE, useExisting: AccordionLabelWrapperDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionLabelWrapperDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: AccordionLabelWrapperDirective, isStandalone: true, selector: "ng-template[et-accordion-label-wrapper]", providers: [{ provide: ACCORDION_LABEL_WRAPPER_DIRECTIVE, useExisting: AccordionLabelWrapperDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionLabelWrapperDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionLabelWrapperDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[et-accordion-label-wrapper]',
@@ -101,10 +101,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; } });
 
 class AccordionHintDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionHintDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: AccordionHintDirective, isStandalone: true, selector: "[et-accordion-hint]", host: { classAttribute: "et-accordion-hint" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionHintDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: AccordionHintDirective, isStandalone: true, selector: "[et-accordion-hint]", host: { classAttribute: "et-accordion-hint" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionHintDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionHintDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[et-accordion-hint]',
@@ -121,10 +121,10 @@ class AccordionHintWrapperDirective extends CdkPortal {
     constructor(templateRef, viewContainerRef) {
         super(templateRef, viewContainerRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionHintWrapperDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: AccordionHintWrapperDirective, isStandalone: true, selector: "ng-template[et-accordion-hint-wrapper]", providers: [{ provide: ACCORDION_HINT_WRAPPER_DIRECTIVE, useExisting: AccordionHintWrapperDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionHintWrapperDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: AccordionHintWrapperDirective, isStandalone: true, selector: "ng-template[et-accordion-hint-wrapper]", providers: [{ provide: ACCORDION_HINT_WRAPPER_DIRECTIVE, useExisting: AccordionHintWrapperDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionHintWrapperDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionHintWrapperDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[et-accordion-hint-wrapper]',
@@ -186,10 +186,10 @@ class AccordionComponent {
     close() {
         this._isOpen$.next(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AccordionComponent, isStandalone: true, selector: "et-accordion", inputs: { isOpenByDefault: "isOpenByDefault", disabled: "disabled", label: "label" }, host: { classAttribute: "et-accordion" }, providers: [{ provide: ACCORDION_COMPONENT, useExisting: AccordionComponent }], queries: [{ propertyName: "templateLabel", first: true, predicate: ACCORDION_LABEL_WRAPPER_DIRECTIVE, descendants: true }, { propertyName: "templateHint", first: true, predicate: ACCORDION_HINT_WRAPPER_DIRECTIVE, descendants: true }], ngImport: i0, template: "<div *etLet=\"_isOpen$ | async as isOpen\" class=\"et-accordion-container\">\n  <h3 class=\"et-accordion-header-wrapper\">\n    <button\n      [disabled]=\"disabled\"\n      [id]=\"headerId\"\n      [attr.aria-controls]=\"bodyId\"\n      [attr.aria-expanded]=\"isOpen\"\n      [class.et-accordion-has-hint]=\"!!templateHint\"\n      (click)=\"toggleAccordionOpen()\"\n      class=\"et-accordion-header\"\n      type=\"button\"\n    >\n      <div>\n        <ng-template [ngIf]=\"templateLabel\" [ngIfElse]=\"textLabelTpl\">\n          <ng-template [cdkPortalOutlet]=\"templateLabel\" />\n        </ng-template>\n\n        <ng-template #textLabelTpl\n          ><span et-accordion-label>{{ label }} </span>\n        </ng-template>\n      </div>\n\n      <ng-container *ngIf=\"templateHint\">\n        <ng-template [cdkPortalOutlet]=\"templateHint\" />\n      </ng-container>\n\n      <et-chevron-icon />\n    </button>\n  </h3>\n  <div\n    [@animateOpenClose]=\"(_isOpen$ | async) ? 'open' : 'close'\"\n    [attr.aria-labelledby]=\"headerId\"\n    [id]=\"bodyId\"\n    class=\"et-accordion-body\"\n    role=\"region\"\n  >\n    <div class=\"et-accordion-body-container\">\n      <ng-content />\n    </div>\n  </div>\n  <hr class=\"et-accordion-separator\" />\n</div>\n", styles: [":where(.et-accordion){--chevron-size: 15px}.et-accordion .et-accordion-container{position:relative;z-index:1}.et-accordion .et-chevron-icon{display:block;transform:rotate(180deg);transition:transform .3s var(--ease-5);inline-size:var(--chevron-size);block-size:var(--chevron-size)}.et-accordion [aria-expanded=true] .et-chevron-icon{transform:rotate(0)}.et-accordion .et-accordion-header{display:grid;grid-template-columns:1fr auto;inline-size:100%;block-size:100%;text-align:left;background-color:transparent;border:none;align-items:center;padding:0;gap:15px}.et-accordion .et-accordion-header:not(:disabled){cursor:pointer}.et-accordion .et-accordion-header.et-accordion-has-hint{grid-template-columns:1fr auto auto}.et-accordion .et-accordion-header-wrapper{margin:0}.et-accordion .et-accordion-body{overflow:hidden}.et-accordion .et-accordion-separator{position:relative;z-index:-1}\n"], dependencies: [{ kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: AccordionLabelDirective, selector: "[et-accordion-label]" }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }], animations: [accordionAnimations.animateOpenClose], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: AccordionComponent, isStandalone: true, selector: "et-accordion", inputs: { isOpenByDefault: "isOpenByDefault", disabled: "disabled", label: "label" }, host: { classAttribute: "et-accordion" }, providers: [{ provide: ACCORDION_COMPONENT, useExisting: AccordionComponent }], queries: [{ propertyName: "templateLabel", first: true, predicate: ACCORDION_LABEL_WRAPPER_DIRECTIVE, descendants: true }, { propertyName: "templateHint", first: true, predicate: ACCORDION_HINT_WRAPPER_DIRECTIVE, descendants: true }], ngImport: i0, template: "<div *etLet=\"_isOpen$ | async as isOpen\" class=\"et-accordion-container\">\n  <h3 class=\"et-accordion-header-wrapper\">\n    <button\n      [disabled]=\"disabled\"\n      [id]=\"headerId\"\n      [attr.aria-controls]=\"bodyId\"\n      [attr.aria-expanded]=\"isOpen\"\n      [class.et-accordion-has-hint]=\"!!templateHint\"\n      (click)=\"toggleAccordionOpen()\"\n      class=\"et-accordion-header\"\n      type=\"button\"\n    >\n      <div>\n        <ng-template [ngIf]=\"templateLabel\" [ngIfElse]=\"textLabelTpl\">\n          <ng-template [cdkPortalOutlet]=\"templateLabel\" />\n        </ng-template>\n\n        <ng-template #textLabelTpl\n          ><span et-accordion-label>{{ label }} </span>\n        </ng-template>\n      </div>\n\n      <ng-container *ngIf=\"templateHint\">\n        <ng-template [cdkPortalOutlet]=\"templateHint\" />\n      </ng-container>\n\n      <et-chevron-icon />\n    </button>\n  </h3>\n  <div\n    [@animateOpenClose]=\"(_isOpen$ | async) ? 'open' : 'close'\"\n    [attr.aria-labelledby]=\"headerId\"\n    [id]=\"bodyId\"\n    class=\"et-accordion-body\"\n    role=\"region\"\n  >\n    <div class=\"et-accordion-body-container\">\n      <ng-content />\n    </div>\n  </div>\n  <hr class=\"et-accordion-separator\" />\n</div>\n", styles: [":where(.et-accordion){--chevron-size: 15px}.et-accordion .et-accordion-container{position:relative;z-index:1}.et-accordion .et-chevron-icon{display:block;transform:rotate(180deg);transition:transform .3s var(--ease-5);inline-size:var(--chevron-size);block-size:var(--chevron-size)}.et-accordion [aria-expanded=true] .et-chevron-icon{transform:rotate(0)}.et-accordion .et-accordion-header{display:grid;grid-template-columns:1fr auto;inline-size:100%;block-size:100%;text-align:left;background-color:transparent;border:none;align-items:center;padding:0;gap:15px}.et-accordion .et-accordion-header:not(:disabled){cursor:pointer}.et-accordion .et-accordion-header.et-accordion-has-hint{grid-template-columns:1fr auto auto}.et-accordion .et-accordion-header-wrapper{margin:0}.et-accordion .et-accordion-body{overflow:hidden}.et-accordion .et-accordion-separator{position:relative;z-index:-1}\n"], dependencies: [{ kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: AccordionLabelDirective, selector: "[et-accordion-label]" }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }], animations: [accordionAnimations.animateOpenClose], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-accordion', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, providers: [{ provide: ACCORDION_COMPONENT, useExisting: AccordionComponent }], imports: [
                         LetDirective,
@@ -255,10 +255,10 @@ class AccordionGroupComponent {
         }), takeUntil(this._destroy$))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AccordionGroupComponent, isStandalone: true, selector: "et-accordion-group", inputs: { autoCloseOthers: "autoCloseOthers" }, host: { classAttribute: "et-accordion-group" }, queries: [{ propertyName: "_accordions", predicate: ACCORDION_COMPONENT }], ngImport: i0, template: "<ng-content select=\"et-accordion\" />\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: AccordionGroupComponent, isStandalone: true, selector: "et-accordion-group", inputs: { autoCloseOthers: "autoCloseOthers" }, host: { classAttribute: "et-accordion-group" }, queries: [{ propertyName: "_accordions", predicate: ACCORDION_COMPONENT }], ngImport: i0, template: "<ng-content select=\"et-accordion\" />\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AccordionGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AccordionGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-accordion-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, host: {
                         class: 'et-accordion-group',
@@ -285,10 +285,10 @@ class BracketMatchDirective {
         this.bracket = inject(BRACKET_TOKEN);
         this.match$ = this.bracket.getBracketMatchById(this.matchId);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketMatchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: BracketMatchDirective, isStandalone: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketMatchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: BracketMatchDirective, isStandalone: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketMatchDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketMatchDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -301,10 +301,10 @@ class BracketRoundDirective {
         this.bracket = inject(BRACKET_TOKEN);
         this.round$ = this.bracket.getBracketRoundById(this.roundId);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketRoundDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: BracketRoundDirective, isStandalone: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketRoundDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: BracketRoundDirective, isStandalone: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketRoundDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketRoundDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -315,10 +315,10 @@ class BracketMatchComponent {
     constructor() {
         this.matchData = inject(BracketMatchDirective);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketMatchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: BracketMatchComponent, isStandalone: true, selector: "et-bracket-match", host: { classAttribute: "et-bracket-match" }, hostDirectives: [{ directive: BracketMatchDirective }], ngImport: i0, template: "<ng-container *ngIf=\"matchData.match$ | async as match\">\n  {{ match.data.id }}\n</ng-container>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketMatchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: BracketMatchComponent, isStandalone: true, selector: "et-bracket-match", host: { classAttribute: "et-bracket-match" }, hostDirectives: [{ directive: BracketMatchDirective }], ngImport: i0, template: "<ng-container *ngIf=\"matchData.match$ | async as match\">\n  {{ match.data.id }}\n</ng-container>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketMatchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketMatchComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-bracket-match', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'et-bracket-match',
@@ -329,10 +329,10 @@ class BracketRoundHeaderComponent {
     constructor() {
         this.roundData = inject(BracketRoundDirective);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketRoundHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: BracketRoundHeaderComponent, isStandalone: true, selector: "et-bracket-round-header", host: { classAttribute: "et-bracket-round-header" }, hostDirectives: [{ directive: BracketRoundDirective }], ngImport: i0, template: "<ng-container *ngIf=\"roundData.round$ | async as round\">\n  {{ round.name }}\n</ng-container>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketRoundHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: BracketRoundHeaderComponent, isStandalone: true, selector: "et-bracket-round-header", host: { classAttribute: "et-bracket-round-header" }, hostDirectives: [{ directive: BracketRoundDirective }], ngImport: i0, template: "<ng-container *ngIf=\"roundData.round$ | async as round\">\n  {{ round.name }}\n</ng-container>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketRoundHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketRoundHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-bracket-round-header', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'et-bracket-round-header',
@@ -909,8 +909,8 @@ class BracketComponent {
         const round = this._getRoundById(roundId, bracket);
         return round?.matches.find((match) => match.data.id === matchId) ?? null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: BracketComponent, isStandalone: true, selector: "et-bracket", inputs: { itemWith: "itemWith", itemHeight: "itemHeight", roundHeaderHeight: "roundHeaderHeight", upperLowerBracketGap: "upperLowerBracketGap", columnGap: "columnGap", rowGap: "rowGap", roundsWithMatches: "roundsWithMatches", componentConfig: "componentConfig" }, host: { properties: { "attr.has-round-headers": "this.hasRoundHeaders" }, classAttribute: "et-bracket" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: BracketComponent, isStandalone: true, selector: "et-bracket", inputs: { itemWith: "itemWith", itemHeight: "itemHeight", roundHeaderHeight: "roundHeaderHeight", upperLowerBracketGap: "upperLowerBracketGap", columnGap: "columnGap", rowGap: "rowGap", roundsWithMatches: "roundsWithMatches", componentConfig: "componentConfig" }, host: { properties: { "attr.has-round-headers": "this.hasRoundHeaders" }, classAttribute: "et-bracket" }, providers: [
             {
                 provide: BRACKET_TOKEN,
                 useExisting: BracketComponent,
@@ -987,7 +987,7 @@ __decorate([
     __metadata("design:paramtypes", [Object, Bracket]),
     __metadata("design:returntype", void 0)
 ], BracketComponent.prototype, "_getNextMatch", null);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BracketComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BracketComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-bracket', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         NgClass,
@@ -1089,10 +1089,10 @@ class ButtonDirective {
     _removeTabIndexBindings() {
         this._bindings.remove('tabindex');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: ButtonDirective, isStandalone: true, inputs: { disabled: "disabled", type: "type", pressed: "pressed" }, exportAs: ["etButton"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: ButtonDirective, isStandalone: true, inputs: { disabled: "disabled", type: "type", pressed: "pressed" }, exportAs: ["etButton"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -1196,10 +1196,10 @@ class QueryButtonDirective {
         });
         this._button._removeDisabledBindings();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: QueryButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: QueryButtonDirective, isStandalone: true, inputs: { query: "query" }, exportAs: ["etQueryButton"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: QueryButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: QueryButtonDirective, isStandalone: true, inputs: { query: "query" }, exportAs: ["etQueryButton"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: QueryButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: QueryButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -1213,10 +1213,10 @@ class ButtonComponent {
     constructor() {
         this.button = inject(ButtonDirective);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ButtonComponent, isStandalone: true, selector: "[et-button]", host: { classAttribute: "et-button" }, hostDirectives: [{ directive: ButtonDirective, inputs: ["disabled", "disabled", "type", "type", "pressed", "pressed"] }], ngImport: i0, template: "<span class=\"et-button-content\">\n  <span class=\"et-button-text\">\n    <ng-content></ng-content>\n  </span>\n</span>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ButtonComponent, isStandalone: true, selector: "[et-button]", host: { classAttribute: "et-button" }, hostDirectives: [{ directive: ButtonDirective, inputs: ["disabled", "disabled", "type", "type", "pressed", "pressed"] }], ngImport: i0, template: "<span class=\"et-button-content\">\n  <span class=\"et-button-text\">\n    <ng-content></ng-content>\n  </span>\n</span>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: '[et-button]', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, hostDirectives: [{ directive: ButtonDirective, inputs: ['disabled', 'type', 'pressed'] }], host: {
                         class: 'et-button',
@@ -1227,10 +1227,10 @@ class QueryButtonComponent {
     constructor() {
         this.queryButton = inject(QueryButtonDirective);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: QueryButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: QueryButtonComponent, isStandalone: true, selector: "[et-query-button]", host: { classAttribute: "et-query-button" }, hostDirectives: [{ directive: QueryButtonDirective, inputs: ["query", "query"] }, { directive: ButtonDirective, inputs: ["disabled", "disabled", "type", "type", "pressed", "pressed"] }], ngImport: i0, template: "<ng-container *etLet=\"queryButton.showSuccess$ | async as showSuccess\">\n  <ng-container *etLet=\"queryButton.showFailure$ | async as showFailure\">\n    <span *etQuery=\"queryButton.query$ | async; loading as loading\" class=\"et-button-content et-query-button-content\">\n      <span\n        [attr.aria-hidden]=\"loading || showSuccess || showFailure ? 'true' : undefined\"\n        class=\"et-button-text et-query-button-text et-query-button-text--default\"\n      >\n        <ng-content></ng-content>\n      </span>\n\n      <span *ngIf=\"loading\" class=\"et-query-button-loading\"> </span>\n      <span *ngIf=\"loading\" class=\"et-button-text et-query-button-text et-query-button-text--loading\">Loading</span>\n\n      <span *ngIf=\"showSuccess\" class=\"et-button-text et-query-button-text et-query-button-text--success\">Success</span>\n      <span *ngIf=\"showFailure\" class=\"et-button-text et-query-button-text et-query-button-text--failure\">Failure</span>\n    </span>\n  </ng-container>\n</ng-container>\n", styles: [".et-query-button .et-button-content{display:grid}.et-query-button .et-query-button-text,.et-query-button .et-query-button-loading{grid-area:1/1/2/2}.et-query-button.et-query-button--loading .et-query-button-text--default,.et-query-button.et-query-button--success .et-query-button-text--default,.et-query-button.et-query-button--failure .et-query-button-text--default{opacity:0;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "directive", type: QueryDirective, selector: "[etQuery]", inputs: ["etQuery", "etQueryCache"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: QueryButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: QueryButtonComponent, isStandalone: true, selector: "[et-query-button]", host: { classAttribute: "et-query-button" }, hostDirectives: [{ directive: QueryButtonDirective, inputs: ["query", "query"] }, { directive: ButtonDirective, inputs: ["disabled", "disabled", "type", "type", "pressed", "pressed"] }], ngImport: i0, template: "<ng-container *etLet=\"queryButton.showSuccess$ | async as showSuccess\">\n  <ng-container *etLet=\"queryButton.showFailure$ | async as showFailure\">\n    <span *etQuery=\"queryButton.query$ | async; loading as loading\" class=\"et-button-content et-query-button-content\">\n      <span\n        [attr.aria-hidden]=\"loading || showSuccess || showFailure ? 'true' : undefined\"\n        class=\"et-button-text et-query-button-text et-query-button-text--default\"\n      >\n        <ng-content></ng-content>\n      </span>\n\n      <span *ngIf=\"loading\" class=\"et-query-button-loading\"> </span>\n      <span *ngIf=\"loading\" class=\"et-button-text et-query-button-text et-query-button-text--loading\">Loading</span>\n\n      <span *ngIf=\"showSuccess\" class=\"et-button-text et-query-button-text et-query-button-text--success\">Success</span>\n      <span *ngIf=\"showFailure\" class=\"et-button-text et-query-button-text et-query-button-text--failure\">Failure</span>\n    </span>\n  </ng-container>\n</ng-container>\n", styles: [".et-query-button .et-button-content{display:grid}.et-query-button .et-query-button-text,.et-query-button .et-query-button-loading{grid-area:1/1/2/2}.et-query-button.et-query-button--loading .et-query-button-text--default,.et-query-button.et-query-button--success .et-query-button-text--default,.et-query-button.et-query-button--failure .et-query-button-text--default{opacity:0;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "directive", type: QueryDirective, selector: "[etQuery]", inputs: ["etQuery", "etQueryCache"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: QueryButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: QueryButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: '[et-query-button]', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, hostDirectives: [
                         { directive: QueryButtonDirective, inputs: ['query'] },
@@ -1283,10 +1283,10 @@ class DefaultValidatorErrorsService {
         }
         return 'This field is invalid';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DefaultValidatorErrorsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DefaultValidatorErrorsService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DefaultValidatorErrorsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DefaultValidatorErrorsService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DefaultValidatorErrorsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DefaultValidatorErrorsService, decorators: [{
             type: Injectable
         }] });
 
@@ -1304,10 +1304,10 @@ class FormFieldStateService {
             return idList || null;
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FormFieldStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FormFieldStateService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FormFieldStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FormFieldStateService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FormFieldStateService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FormFieldStateService, decorators: [{
             type: Injectable
         }] });
 
@@ -1322,10 +1322,10 @@ class FormGroupStateService {
             return idList || null;
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FormGroupStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FormGroupStateService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FormGroupStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FormGroupStateService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FormGroupStateService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FormGroupStateService, decorators: [{
             type: Injectable
         }] });
 
@@ -1342,7 +1342,8 @@ class InputStateService {
         this.autofilled$ = new BehaviorSubject(false);
         this.valueIsTruthy$ = this.value$.pipe(map((value) => !!value));
         this.valueIsFalsy$ = this.value$.pipe(map((value) => !value));
-        this.valueIsEmpty$ = combineLatest([this.value$, this.autofilled$]).pipe(map(([value, autofilled]) => (value === null || value === undefined || value === '') && !autofilled));
+        this.valueIsEmpty$ = combineLatest([this.value$, this.autofilled$]).pipe(map(([value, autofilled]) => (value === null || value === undefined || value === '' || (Array.isArray(value) && !value.length)) &&
+            !autofilled));
         this.errors$ = new BehaviorSubject(null);
         this.shouldDisplayError$ = new BehaviorSubject(false);
         this.isFocusedVia$ = new BehaviorSubject(null);
@@ -1354,10 +1355,10 @@ class InputStateService {
             // stub
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputStateService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputStateService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputStateService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputStateService, decorators: [{
             type: Injectable
         }] });
 
@@ -1368,8 +1369,8 @@ class LabelComponent {
         this.formFieldStateService = inject(FormFieldStateService);
         this.id = `et-label-${++nextUniqueId$6}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: LabelComponent, isStandalone: true, selector: "et-label", host: { classAttribute: "et-label" }, providers: [{ provide: LABEL_TOKEN, useExisting: LabelComponent }], exportAs: ["etLabel"], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: LabelComponent, isStandalone: true, selector: "et-label", host: { classAttribute: "et-label" }, providers: [{ provide: LABEL_TOKEN, useExisting: LabelComponent }], exportAs: ["etLabel"], ngImport: i0, template: `
     <label
       [attr.for]="formFieldStateService.inputId$ | async"
       [attr.aria-owns]="formFieldStateService.inputId$ | async"
@@ -1381,7 +1382,7 @@ class LabelComponent {
     <ng-content select="[etLabelSuffix]" />
   `, isInline: true, dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: LabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: LabelComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-label',
@@ -1421,10 +1422,10 @@ class LabelSuffixDirective {
     get _attrAriaHidden() {
         return this.showToScreenReader ? null : 'true';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: LabelSuffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: LabelSuffixDirective, isStandalone: true, selector: "[etLabelSuffix]", inputs: { showToScreenReader: "showToScreenReader" }, host: { properties: { "attr.aria-hidden": "this._attrAriaHidden" } }, exportAs: ["etLabelSuffix"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: LabelSuffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: LabelSuffixDirective, isStandalone: true, selector: "[etLabelSuffix]", inputs: { showToScreenReader: "showToScreenReader" }, host: { properties: { "attr.aria-hidden": "this._attrAriaHidden" } }, exportAs: ["etLabelSuffix"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: LabelSuffixDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: LabelSuffixDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etLabelSuffix]',
@@ -1454,15 +1455,15 @@ class DynamicFormFieldDirective {
     get hideErrorMessage$() {
         return this._explicitlyHideErrorMessage$.asObservable();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DynamicFormFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: DynamicFormFieldDirective, isStandalone: true, inputs: { hideErrorMessage: "hideErrorMessage" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DynamicFormFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: DynamicFormFieldDirective, isStandalone: true, inputs: { hideErrorMessage: "hideErrorMessage" }, providers: [
             {
                 provide: DYNAMIC_FORM_FIELD_TOKEN,
                 useExisting: DynamicFormFieldDirective,
             },
         ], exportAs: ["etDynamicFormField"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DynamicFormFieldDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DynamicFormFieldDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -1492,15 +1493,15 @@ class DynamicFormGroupDirective {
     get hideErrorMessage$() {
         return this._explicitlyHideErrorMessage$.asObservable();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DynamicFormGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: DynamicFormGroupDirective, isStandalone: true, inputs: { hideErrorMessage: "hideErrorMessage" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DynamicFormGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: DynamicFormGroupDirective, isStandalone: true, inputs: { hideErrorMessage: "hideErrorMessage" }, providers: [
             {
                 provide: DYNAMIC_FORM_GROUP_TOKEN,
                 useExisting: DynamicFormGroupDirective,
             },
         ], exportAs: ["etDynamicFormGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DynamicFormGroupDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DynamicFormGroupDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -1735,10 +1736,10 @@ class InputDirective {
             this._inputStateService.disabledChange$.next(isDisabled);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InputDirective, isStandalone: true, selector: "[etInput]", inputs: { autocomplete: "autocomplete", placeholder: "placeholder" }, host: { properties: { "attr.autocomplete": "null" }, classAttribute: "et-input" }, providers: [{ provide: INPUT_TOKEN, useExisting: InputDirective }], exportAs: ["etInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InputDirective, isStandalone: true, selector: "[etInput]", inputs: { autocomplete: "autocomplete", placeholder: "placeholder" }, host: { properties: { "attr.autocomplete": "null" }, classAttribute: "et-input" }, providers: [{ provide: INPUT_TOKEN, useExisting: InputDirective }], exportAs: ["etInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etInput]',
@@ -1780,10 +1781,10 @@ class IfInputEmptyDirective {
         }))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: IfInputEmptyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: IfInputEmptyDirective, isStandalone: true, selector: "[etIfInputEmpty]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: IfInputEmptyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: IfInputEmptyDirective, isStandalone: true, selector: "[etIfInputEmpty]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: IfInputEmptyDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: IfInputEmptyDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etIfInputEmpty]',
@@ -1815,10 +1816,10 @@ class IfInputFilledDirective {
         }))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: IfInputFilledDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: IfInputFilledDirective, isStandalone: true, selector: "[etIfInputFilled]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: IfInputFilledDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: IfInputFilledDirective, isStandalone: true, selector: "[etIfInputFilled]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: IfInputFilledDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: IfInputFilledDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etIfInputFilled]',
@@ -1828,15 +1829,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
 
 const INPUT_PREFIX_TOKEN = new InjectionToken('INPUT_PREFIX_DIRECTIVE_TOKEN');
 class InputPrefixDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputPrefixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InputPrefixDirective, isStandalone: true, selector: "[etInputPrefix]", host: { classAttribute: "et-input-prefix" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputPrefixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InputPrefixDirective, isStandalone: true, selector: "[etInputPrefix]", host: { classAttribute: "et-input-prefix" }, providers: [
             {
                 provide: INPUT_PREFIX_TOKEN,
                 useExisting: InputPrefixDirective,
             },
         ], exportAs: ["etInputPrefix"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputPrefixDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputPrefixDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etInputPrefix]',
@@ -1856,15 +1857,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
 
 const INPUT_SUFFIX_TOKEN = new InjectionToken('INPUT_SUFFIX_DIRECTIVE_TOKEN');
 class InputSuffixDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputSuffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InputSuffixDirective, isStandalone: true, selector: "[etInputSuffix]", host: { classAttribute: "et-input-suffix" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputSuffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InputSuffixDirective, isStandalone: true, selector: "[etInputSuffix]", host: { classAttribute: "et-input-suffix" }, providers: [
             {
                 provide: INPUT_SUFFIX_TOKEN,
                 useExisting: InputSuffixDirective,
             },
         ], exportAs: ["etInputSuffix"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputSuffixDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputSuffixDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etInputSuffix]',
@@ -1887,10 +1888,10 @@ class NativeInputRefDirective {
     constructor() {
         this.element = inject(ElementRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeInputRefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: NativeInputRefDirective, isStandalone: true, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]", providers: [{ provide: NATIVE_INPUT_REF_TOKEN, useExisting: NativeInputRefDirective }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeInputRefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: NativeInputRefDirective, isStandalone: true, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]", providers: [{ provide: NATIVE_INPUT_REF_TOKEN, useExisting: NativeInputRefDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeInputRefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeInputRefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]',
@@ -1937,8 +1938,8 @@ class StaticFormFieldDirective {
         }), takeUntil(this._destroy$))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: StaticFormFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: StaticFormFieldDirective, isStandalone: true, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: StaticFormFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: StaticFormFieldDirective, isStandalone: true, providers: [
             FormFieldStateService,
             {
                 provide: STATIC_FORM_FIELD_TOKEN,
@@ -1946,7 +1947,7 @@ class StaticFormFieldDirective {
             },
         ], queries: [{ propertyName: "_input", predicate: i0.forwardRef(function () { return INPUT_TOKEN; }) }, { propertyName: "_label", predicate: i0.forwardRef(function () { return LABEL_TOKEN; }) }], exportAs: ["etStaticFormField"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: StaticFormFieldDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: StaticFormFieldDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -1969,8 +1970,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
 
 const STATIC_FORM_GROUP_TOKEN = new InjectionToken('ET_STATIC_FORM_GROUP_DIRECTIVE_TOKEN');
 class StaticFormGroupDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: StaticFormGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: StaticFormGroupDirective, isStandalone: true, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: StaticFormGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: StaticFormGroupDirective, isStandalone: true, providers: [
             FormGroupStateService,
             {
                 provide: STATIC_FORM_GROUP_TOKEN,
@@ -1978,7 +1979,7 @@ class StaticFormGroupDirective {
             },
         ], exportAs: ["etStaticFormGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: StaticFormGroupDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: StaticFormGroupDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2037,14 +2038,14 @@ class WriteableInputDirective {
     setDisabledState(isDisabled) {
         this._inputStateService.disabled$.next(isDisabled);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: WriteableInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: WriteableInputDirective, isStandalone: true, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: WriteableInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: WriteableInputDirective, isStandalone: true, providers: [
             WRITEABLE_INPUT_VALUE_ACCESSOR,
             InputStateService,
             { provide: WRITEABLE_INPUT_TOKEN, useExisting: WriteableInputDirective },
         ], exportAs: ["etWriteableInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: WriteableInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: WriteableInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2094,10 +2095,10 @@ class ErrorComponent {
             this._formFieldOrGroupStateService.errorId$.next(null);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ErrorComponent, isStandalone: true, selector: "et-error", inputs: { errors: "errors" }, host: { classAttribute: "et-error" }, ngImport: i0, template: "<ng-container *ngIf=\"errorText$ | async | async as text\">\n  <span [id]=\"id\" aria-atomic=\"true\" aria-live=\"polite\"> {{ text }} </span>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ErrorComponent, isStandalone: true, selector: "et-error", inputs: { errors: "errors" }, host: { classAttribute: "et-error" }, ngImport: i0, template: "<ng-container *ngIf=\"errorText$ | async | async as text\">\n  <span [id]=\"id\" aria-atomic=\"true\" aria-live=\"polite\"> {{ text }} </span>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ErrorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ErrorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-error', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-error',
@@ -2121,10 +2122,10 @@ class CheckboxFieldDirective {
             observable: this._checkbox.changes.pipe(startWith(this._checkbox)).pipe(switchMap((checkboxes) => combineLatest(checkboxes.filter((cb) => !!cb).map((checkbox) => checkbox.indeterminate$))), map((checked) => checked.some((value) => value))),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: CheckboxFieldDirective, isStandalone: true, providers: [{ provide: CHECKBOX_FIELD_TOKEN, useExisting: CheckboxFieldDirective }], queries: [{ propertyName: "_checkbox", predicate: i0.forwardRef(function () { return CHECKBOX_TOKEN; }), descendants: true }], exportAs: ["etCheckboxGroup"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: CheckboxFieldDirective, isStandalone: true, providers: [{ provide: CHECKBOX_FIELD_TOKEN, useExisting: CheckboxFieldDirective }], queries: [{ propertyName: "_checkbox", predicate: i0.forwardRef(function () { return CHECKBOX_TOKEN; }), descendants: true }], exportAs: ["etCheckboxGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxFieldDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxFieldDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2163,10 +2164,10 @@ class CheckboxDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: CheckboxDirective, isStandalone: true, providers: [{ provide: CHECKBOX_TOKEN, useExisting: CheckboxDirective }], exportAs: ["etCheckbox"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: CheckboxDirective, isStandalone: true, providers: [{ provide: CHECKBOX_TOKEN, useExisting: CheckboxDirective }], exportAs: ["etCheckbox"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2231,10 +2232,10 @@ class CheckboxGroupDirective {
         }))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: CheckboxGroupDirective, isStandalone: true, host: { attributes: { "role": "group" } }, providers: [{ provide: CHECKBOX_GROUP_TOKEN, useExisting: CheckboxGroupDirective }], queries: [{ propertyName: "groupControl", first: true, predicate: i0.forwardRef(function () { return CHECKBOX_GROUP_CONTROL_TOKEN; }), descendants: true }, { propertyName: "checkboxes", predicate: i0.forwardRef(function () { return CHECKBOX_TOKEN; }), descendants: true }], exportAs: ["etCheckboxGroup"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: CheckboxGroupDirective, isStandalone: true, host: { attributes: { "role": "group" } }, providers: [{ provide: CHECKBOX_GROUP_TOKEN, useExisting: CheckboxGroupDirective }], queries: [{ propertyName: "groupControl", first: true, predicate: i0.forwardRef(function () { return CHECKBOX_GROUP_CONTROL_TOKEN; }), descendants: true }, { propertyName: "checkboxes", predicate: i0.forwardRef(function () { return CHECKBOX_TOKEN; }), descendants: true }], exportAs: ["etCheckboxGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxGroupDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxGroupDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2270,10 +2271,10 @@ class CheckboxGroupControlDirective {
             }))) ?? of(false),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxGroupControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: CheckboxGroupControlDirective, isStandalone: true, selector: "[etCheckboxGroupControl]", providers: [{ provide: CHECKBOX_GROUP_CONTROL_TOKEN, useExisting: CheckboxGroupControlDirective }], exportAs: ["etCheckboxGroupControl"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxGroupControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: CheckboxGroupControlDirective, isStandalone: true, selector: "[etCheckboxGroupControl]", providers: [{ provide: CHECKBOX_GROUP_CONTROL_TOKEN, useExisting: CheckboxGroupControlDirective }], exportAs: ["etCheckboxGroupControl"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxGroupControlDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxGroupControlDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etCheckboxGroupControl]',
@@ -2287,8 +2288,8 @@ class CheckboxFieldComponent {
     constructor() {
         this.inputState = inject(InputStateService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: CheckboxFieldComponent, isStandalone: true, selector: "et-checkbox-field", host: { classAttribute: "et-form-field et-checkbox-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }, { directive: CheckboxFieldDirective }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: CheckboxFieldComponent, isStandalone: true, selector: "et-checkbox-field", host: { classAttribute: "et-form-field et-checkbox-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }, { directive: CheckboxFieldDirective }], ngImport: i0, template: `
     <div class="et-checkbox-field-container">
       <ng-content select="et-checkbox" />
       <ng-content select="et-label" />
@@ -2296,7 +2297,7 @@ class CheckboxFieldComponent {
     <et-error [errors]="inputState.errors$ | async" />
   `, isInline: true, dependencies: [{ kind: "component", type: ErrorComponent, selector: "et-error", inputs: ["errors"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxFieldComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-checkbox-field',
@@ -2327,10 +2328,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class CheckboxGroupComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: CheckboxGroupComponent, isStandalone: true, selector: "et-checkbox-group", host: { classAttribute: "et-form-group et-checkbox-group" }, hostDirectives: [{ directive: CheckboxGroupDirective }, { directive: StaticFormGroupDirective }], ngImport: i0, template: ` <ng-content select="et-checkbox-field" /> `, isInline: true, styles: [":where(.et-checkbox-group){display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: CheckboxGroupComponent, isStandalone: true, selector: "et-checkbox-group", host: { classAttribute: "et-form-group et-checkbox-group" }, hostDirectives: [{ directive: CheckboxGroupDirective }, { directive: StaticFormGroupDirective }], ngImport: i0, template: ` <ng-content select="et-checkbox-field" /> `, isInline: true, styles: [":where(.et-checkbox-group){display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-checkbox-group', template: ` <ng-content select="et-checkbox-field" /> `, standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-form-group et-checkbox-group',
@@ -2348,10 +2349,10 @@ class DecoratedFormFieldBase {
             observable: this._formFieldStateService.hasSuffix$,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DecoratedFormFieldBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: DecoratedFormFieldBase, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DecoratedFormFieldBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: DecoratedFormFieldBase, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DecoratedFormFieldBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DecoratedFormFieldBase, decorators: [{
             type: Directive
         }] });
 
@@ -2362,10 +2363,10 @@ class InputBase {
     set nativeInputRef(value) {
         this.input._setNativeInputRef(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InputBase, viewQueries: [{ propertyName: "nativeInputRef", first: true, predicate: NATIVE_INPUT_REF_TOKEN, descendants: true }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InputBase, viewQueries: [{ propertyName: "nativeInputRef", first: true, predicate: NATIVE_INPUT_REF_TOKEN, descendants: true }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputBase, decorators: [{
             type: Directive
         }], propDecorators: { nativeInputRef: [{
                 type: ViewChild,
@@ -2396,10 +2397,10 @@ class DecoratedInputBase extends InputBase {
             .pipe(takeUntil(this._destroy$), startWith(this.inputSuffix), map((list) => list.length > 0))
             .subscribe(this._formFieldStateService.hasSuffix$);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DecoratedInputBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: DecoratedInputBase, queries: [{ propertyName: "inputPrefix", predicate: INPUT_PREFIX_TOKEN }, { propertyName: "inputSuffix", predicate: INPUT_SUFFIX_TOKEN }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DecoratedInputBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: DecoratedInputBase, queries: [{ propertyName: "inputPrefix", predicate: INPUT_PREFIX_TOKEN }, { propertyName: "inputSuffix", predicate: INPUT_SUFFIX_TOKEN }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DecoratedInputBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DecoratedInputBase, decorators: [{
             type: Directive
         }], propDecorators: { inputPrefix: [{
                 type: ContentChildren,
@@ -2414,10 +2415,10 @@ class CheckboxComponent extends InputBase {
         super(...arguments);
         this.checkbox = inject(CHECKBOX_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: CheckboxComponent, isStandalone: true, selector: "et-checkbox", host: { classAttribute: "et-checkbox" }, usesInheritance: true, hostDirectives: [{ directive: CheckboxDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<input\n  [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n  [attr.checked]=\"(checkbox.checked$ | async) || null\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [indeterminate]=\"checkbox.indeterminate$ | async\"\n  (click)=\"checkbox._onInputInteraction($event)\"\n  (blur)=\"checkbox._controlTouched()\"\n  class=\"et-checkbox-native-input\"\n  etNativeInputRef\n  type=\"checkbox\"\n/>\n\n<div [ngClass]=\"{ 'et-checkbox-check--active': checkbox.checked$ | async }\" class=\"et-checkbox-check\"></div>\n<div\n  [ngClass]=\"{ 'et-checkbox-indeterminate--active': checkbox.indeterminate$ | async }\"\n  class=\"et-checkbox-indeterminate\"\n></div>\n", styles: [":where(.et-checkbox){--et-checkbox-size: 25px;--et-checkbox-check-size: 10px;--et-checkbox-border-color: #e5e5e5;--et-checkbox-state-color: #e5e5e5;--et-checkbox-indeterminate-width: 10px;--et-checkbox-indeterminate-height: 2px;inline-size:var(--et-checkbox-size);block-size:var(--et-checkbox-size);border:1px solid var(--et-checkbox-border-color);display:inline-grid}:where(.et-checkbox-check){inline-size:var(--et-checkbox-check-size);block-size:var(--et-checkbox-check-size)}:where(.et-checkbox-check).et-checkbox-check--active{background-color:var(--et-checkbox-state-color)}:where(.et-checkbox-indeterminate){inline-size:var(--et-checkbox-indeterminate-width);block-size:var(--et-checkbox-indeterminate-height)}:where(.et-checkbox-indeterminate).et-checkbox-indeterminate--active{background-color:var(--et-checkbox-state-color)}.et-checkbox{position:relative;align-items:center;justify-items:center}.et-checkbox-native-input,.et-checkbox-check,.et-checkbox-indeterminate{grid-area:1/1/2/2}.et-checkbox-native-input{z-index:1;inline-size:var(--et-checkbox-size);block-size:var(--et-checkbox-size);opacity:0;margin:0;border:none}.et-checkbox:not(.et-checkbox--disabled) .et-checkbox-native-input{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: CheckboxComponent, isStandalone: true, selector: "et-checkbox", host: { classAttribute: "et-checkbox" }, usesInheritance: true, hostDirectives: [{ directive: CheckboxDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<input\n  [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n  [attr.checked]=\"(checkbox.checked$ | async) || null\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [indeterminate]=\"checkbox.indeterminate$ | async\"\n  (click)=\"checkbox._onInputInteraction($event)\"\n  (blur)=\"checkbox._controlTouched()\"\n  class=\"et-checkbox-native-input\"\n  etNativeInputRef\n  type=\"checkbox\"\n/>\n\n<div [ngClass]=\"{ 'et-checkbox-check--active': checkbox.checked$ | async }\" class=\"et-checkbox-check\"></div>\n<div\n  [ngClass]=\"{ 'et-checkbox-indeterminate--active': checkbox.indeterminate$ | async }\"\n  class=\"et-checkbox-indeterminate\"\n></div>\n", styles: [":where(.et-checkbox){--et-checkbox-size: 25px;--et-checkbox-check-size: 10px;--et-checkbox-border-color: #e5e5e5;--et-checkbox-state-color: #e5e5e5;--et-checkbox-indeterminate-width: 10px;--et-checkbox-indeterminate-height: 2px;inline-size:var(--et-checkbox-size);block-size:var(--et-checkbox-size);border:1px solid var(--et-checkbox-border-color);display:inline-grid}:where(.et-checkbox-check){inline-size:var(--et-checkbox-check-size);block-size:var(--et-checkbox-check-size)}:where(.et-checkbox-check).et-checkbox-check--active{background-color:var(--et-checkbox-state-color)}:where(.et-checkbox-indeterminate){inline-size:var(--et-checkbox-indeterminate-width);block-size:var(--et-checkbox-indeterminate-height)}:where(.et-checkbox-indeterminate).et-checkbox-indeterminate--active{background-color:var(--et-checkbox-state-color)}.et-checkbox{position:relative;align-items:center;justify-items:center}.et-checkbox-native-input,.et-checkbox-check,.et-checkbox-indeterminate{grid-area:1/1/2/2}.et-checkbox-native-input{z-index:1;inline-size:var(--et-checkbox-size);block-size:var(--et-checkbox-size);opacity:0;margin:0;border:none}.et-checkbox:not(.et-checkbox--disabled) .et-checkbox-native-input{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CheckboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-checkbox', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-checkbox',
@@ -2464,10 +2465,10 @@ class AutosizeTextareaDirective {
         this.element.style.height = '0';
         this.element.style.height = `${this.element.scrollHeight}px`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AutosizeTextareaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: AutosizeTextareaDirective, isStandalone: true, selector: "et-textarea-input[etAutosize]", host: { classAttribute: "et-textarea--autosize" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AutosizeTextareaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: AutosizeTextareaDirective, isStandalone: true, selector: "et-textarea-input[etAutosize]", host: { classAttribute: "et-textarea--autosize" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AutosizeTextareaDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: AutosizeTextareaDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2511,10 +2512,10 @@ class EmailInputDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: EmailInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: EmailInputDirective, isStandalone: true, providers: [{ provide: EMAIL_INPUT_TOKEN, useExisting: EmailInputDirective }], exportAs: ["etEmailInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: EmailInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: EmailInputDirective, isStandalone: true, providers: [{ provide: EMAIL_INPUT_TOKEN, useExisting: EmailInputDirective }], exportAs: ["etEmailInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: EmailInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: EmailInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2557,10 +2558,10 @@ class NumberInputDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NumberInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: NumberInputDirective, isStandalone: true, providers: [{ provide: NUMBER_INPUT_TOKEN, useExisting: NumberInputDirective }], exportAs: ["etNumberInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NumberInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: NumberInputDirective, isStandalone: true, providers: [{ provide: NUMBER_INPUT_TOKEN, useExisting: NumberInputDirective }], exportAs: ["etNumberInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NumberInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NumberInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2606,10 +2607,10 @@ class PasswordInputDirective {
     _toggleShowPassword() {
         this.showPassword$.next(!this.showPassword$.value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PasswordInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: PasswordInputDirective, isStandalone: true, providers: [{ provide: PASSWORD_INPUT_TOKEN, useExisting: PasswordInputDirective }], exportAs: ["etPasswordInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PasswordInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: PasswordInputDirective, isStandalone: true, providers: [{ provide: PASSWORD_INPUT_TOKEN, useExisting: PasswordInputDirective }], exportAs: ["etPasswordInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PasswordInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PasswordInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2655,10 +2656,10 @@ class SearchInputDirective {
         this.input._updateValue(null);
         this._controlTouched();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SearchInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SearchInputDirective, isStandalone: true, providers: [{ provide: SEARCH_INPUT_TOKEN, useExisting: SearchInputDirective }], exportAs: ["etSearchInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SearchInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SearchInputDirective, isStandalone: true, providers: [{ provide: SEARCH_INPUT_TOKEN, useExisting: SearchInputDirective }], exportAs: ["etSearchInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SearchInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SearchInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2700,10 +2701,10 @@ class TextInputDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: TextInputDirective, isStandalone: true, providers: [{ provide: TEXT_INPUT_TOKEN, useExisting: TextInputDirective }], exportAs: ["etTextInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: TextInputDirective, isStandalone: true, providers: [{ provide: TEXT_INPUT_TOKEN, useExisting: TextInputDirective }], exportAs: ["etTextInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2745,10 +2746,10 @@ class TextareaInputDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextareaInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: TextareaInputDirective, isStandalone: true, providers: [{ provide: TEXTAREA_INPUT_TOKEN, useExisting: TextareaInputDirective }], exportAs: ["etTextareaInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextareaInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: TextareaInputDirective, isStandalone: true, providers: [{ provide: TEXTAREA_INPUT_TOKEN, useExisting: TextareaInputDirective }], exportAs: ["etTextareaInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextareaInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextareaInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -2762,10 +2763,10 @@ class EmailInputComponent extends DecoratedInputBase {
         super(...arguments);
         this.emailInput = inject(EMAIL_INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: EmailInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: EmailInputComponent, isStandalone: true, selector: "et-email-input", host: { classAttribute: "et-email-input" }, usesInheritance: true, hostDirectives: [{ directive: EmailInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"emailInput._onInputInteraction($event)\"\n  (blur)=\"emailInput._controlTouched()\"\n  class=\"et-input-native-control et-email-input-native-control\"\n  type=\"email\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: EmailInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: EmailInputComponent, isStandalone: true, selector: "et-email-input", host: { classAttribute: "et-email-input" }, usesInheritance: true, hostDirectives: [{ directive: EmailInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"emailInput._onInputInteraction($event)\"\n  (blur)=\"emailInput._controlTouched()\"\n  class=\"et-input-native-control et-email-input-native-control\"\n  type=\"email\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: EmailInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: EmailInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-email-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-email-input',
@@ -2777,8 +2778,8 @@ class InputFieldComponent extends DecoratedFormFieldBase {
         super(...arguments);
         this.inputState = inject(InputStateService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: InputFieldComponent, isStandalone: true, selector: "et-input-field", host: { classAttribute: "et-form-field et-input-field" }, usesInheritance: true, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: InputFieldComponent, isStandalone: true, selector: "et-input-field", host: { classAttribute: "et-form-field et-input-field" }, usesInheritance: true, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
     <ng-content select="et-label" />
     <div class="et-input-field-input">
       <ng-content
@@ -2788,7 +2789,7 @@ class InputFieldComponent extends DecoratedFormFieldBase {
     <et-error [errors]="inputState.errors$ | async" />
   `, isInline: true, dependencies: [{ kind: "component", type: ErrorComponent, selector: "et-error", inputs: ["errors"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InputFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InputFieldComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-input-field',
@@ -2824,10 +2825,10 @@ class NumberInputComponent extends DecoratedInputBase {
         super(...arguments);
         this.numberInput = inject(NUMBER_INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NumberInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: NumberInputComponent, isStandalone: true, selector: "et-number-input", host: { classAttribute: "et-number-input" }, usesInheritance: true, hostDirectives: [{ directive: NumberInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"numberInput._onInputInteraction($event)\"\n  (blur)=\"numberInput._controlTouched()\"\n  class=\"et-input-native-control et-number-input-native-control\"\n  type=\"number\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NumberInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: NumberInputComponent, isStandalone: true, selector: "et-number-input", host: { classAttribute: "et-number-input" }, usesInheritance: true, hostDirectives: [{ directive: NumberInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"numberInput._onInputInteraction($event)\"\n  (blur)=\"numberInput._controlTouched()\"\n  class=\"et-input-native-control et-number-input-native-control\"\n  type=\"number\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NumberInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NumberInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-number-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-number-input',
@@ -2839,10 +2840,10 @@ class PasswordInputComponent extends DecoratedInputBase {
         super(...arguments);
         this.passwordInput = inject(PASSWORD_INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PasswordInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: PasswordInputComponent, isStandalone: true, selector: "et-password-input", host: { classAttribute: "et-password-input" }, usesInheritance: true, hostDirectives: [{ directive: PasswordInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.type]=\"(passwordInput.showPassword$ | async) ? 'text' : 'password'\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"passwordInput._onInputInteraction($event)\"\n  (blur)=\"passwordInput._controlTouched()\"\n  class=\"et-input-native-control et-password-input-native-control\"\n  etNativeInputRef\n  spellcheck=\"false\"\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PasswordInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: PasswordInputComponent, isStandalone: true, selector: "et-password-input", host: { classAttribute: "et-password-input" }, usesInheritance: true, hostDirectives: [{ directive: PasswordInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.type]=\"(passwordInput.showPassword$ | async) ? 'text' : 'password'\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"passwordInput._onInputInteraction($event)\"\n  (blur)=\"passwordInput._controlTouched()\"\n  class=\"et-input-native-control et-password-input-native-control\"\n  etNativeInputRef\n  spellcheck=\"false\"\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PasswordInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PasswordInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-password-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-password-input',
@@ -2854,10 +2855,10 @@ class SearchInputComponent extends DecoratedInputBase {
         super(...arguments);
         this.searchInput = inject(SEARCH_INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SearchInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SearchInputComponent, isStandalone: true, selector: "et-search-input", host: { classAttribute: "et-search-input" }, usesInheritance: true, hostDirectives: [{ directive: SearchInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"searchInput._onInputInteraction($event)\"\n  (blur)=\"searchInput._controlTouched()\"\n  (keyup.escape)=\"searchInput._clear()\"\n  class=\"et-input-native-control et-search-input-native-control\"\n  type=\"search\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [".et-search-input input[type=search]::-webkit-search-cancel-button,.et-search-input input[type=search]::-webkit-search-decoration{-webkit-appearance:none}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SearchInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SearchInputComponent, isStandalone: true, selector: "et-search-input", host: { classAttribute: "et-search-input" }, usesInheritance: true, hostDirectives: [{ directive: SearchInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"searchInput._onInputInteraction($event)\"\n  (blur)=\"searchInput._controlTouched()\"\n  (keyup.escape)=\"searchInput._clear()\"\n  class=\"et-input-native-control et-search-input-native-control\"\n  type=\"search\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [".et-search-input input[type=search]::-webkit-search-cancel-button,.et-search-input input[type=search]::-webkit-search-decoration{-webkit-appearance:none}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SearchInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SearchInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-search-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-search-input',
@@ -2869,10 +2870,10 @@ class TextInputComponent extends DecoratedInputBase {
         super(...arguments);
         this.textInput = inject(TEXT_INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: TextInputComponent, isStandalone: true, selector: "et-text-input", host: { classAttribute: "et-text-input" }, usesInheritance: true, hostDirectives: [{ directive: TextInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"textInput._onInputInteraction($event)\"\n  (blur)=\"textInput._controlTouched()\"\n  class=\"et-input-native-control et-text-input-native-control\"\n  type=\"text\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: TextInputComponent, isStandalone: true, selector: "et-text-input", host: { classAttribute: "et-text-input" }, usesInheritance: true, hostDirectives: [{ directive: TextInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<input\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"textInput._onInputInteraction($event)\"\n  (blur)=\"textInput._controlTouched()\"\n  class=\"et-input-native-control et-text-input-native-control\"\n  type=\"text\"\n  etNativeInputRef\n/>\n\n<ng-content select=\"[etInputSuffix]\" />\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-text-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-text-input',
@@ -2898,10 +2899,10 @@ class TextareaInputComponent extends DecoratedInputBase {
     set rows(value) {
         this._rows = coerceNumberProperty(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextareaInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: TextareaInputComponent, isStandalone: true, selector: "et-textarea-input", inputs: { cols: "cols", rows: "rows" }, host: { classAttribute: "et-textarea-input" }, usesInheritance: true, hostDirectives: [{ directive: TextareaInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<textarea\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [cols]=\"cols\"\n  [rows]=\"rows\"\n  (input)=\"textareaInput._onInputInteraction($event)\"\n  (blur)=\"textareaInput._controlTouched()\"\n  class=\"et-input-native-control et-textarea-input-native-control\"\n  etNativeInputRef\n></textarea>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextareaInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: TextareaInputComponent, isStandalone: true, selector: "et-textarea-input", inputs: { cols: "cols", rows: "rows" }, host: { classAttribute: "et-textarea-input" }, usesInheritance: true, hostDirectives: [{ directive: TextareaInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete", "placeholder", "placeholder"] }], ngImport: i0, template: "<textarea\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.placeholder]=\"input.placeholder || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [cols]=\"cols\"\n  [rows]=\"rows\"\n  (input)=\"textareaInput._onInputInteraction($event)\"\n  (blur)=\"textareaInput._controlTouched()\"\n  class=\"et-input-native-control et-textarea-input-native-control\"\n  etNativeInputRef\n></textarea>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextareaInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextareaInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-textarea-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-textarea-input',
@@ -2917,10 +2918,10 @@ class PasswordInputToggleComponent {
         this.passwordInput = inject(PASSWORD_INPUT_TOKEN);
         this.input = inject(INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PasswordInputToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: PasswordInputToggleComponent, isStandalone: true, selector: "et-password-input-toggle", inputs: { ariaLabel: "ariaLabel" }, host: { classAttribute: "et-password-input-toggle" }, ngImport: i0, template: "<button\n  [attr.aria-controls]=\"input.id\"\n  [attr.aria-pressed]=\"passwordInput.showPassword$ | async\"\n  [class.et-password-input-toggle-button--active]=\"passwordInput.showPassword$ | async\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [disabled]=\"input.disabled$ | async\"\n  (click)=\"passwordInput._toggleShowPassword(); input.focusInputVia()\"\n  class=\"et-password-input-toggle-button\"\n  type=\"button\"\n  tabindex=\"-1\"\n>\n  <ng-content />\n</button>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PasswordInputToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: PasswordInputToggleComponent, isStandalone: true, selector: "et-password-input-toggle", inputs: { ariaLabel: "ariaLabel" }, host: { classAttribute: "et-password-input-toggle" }, ngImport: i0, template: "<button\n  [attr.aria-controls]=\"input.id\"\n  [attr.aria-pressed]=\"passwordInput.showPassword$ | async\"\n  [class.et-password-input-toggle-button--active]=\"passwordInput.showPassword$ | async\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [disabled]=\"input.disabled$ | async\"\n  (click)=\"passwordInput._toggleShowPassword(); input.focusInputVia()\"\n  class=\"et-password-input-toggle-button\"\n  type=\"button\"\n  tabindex=\"-1\"\n>\n  <ng-content />\n</button>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PasswordInputToggleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PasswordInputToggleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-password-input-toggle', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-password-input-toggle',
@@ -2934,10 +2935,10 @@ class SearchInputClearComponent {
         this.searchInput = inject(SEARCH_INPUT_TOKEN);
         this.input = inject(INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SearchInputClearComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SearchInputClearComponent, isStandalone: true, selector: "et-search-input-clear", inputs: { ariaLabel: "ariaLabel" }, host: { classAttribute: "et-search-input-clear" }, ngImport: i0, template: "<button\n  [attr.aria-controls]=\"input.id\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [disabled]=\"input.disabled$ | async\"\n  (click)=\"searchInput._clear(); input.focusInputVia()\"\n  class=\"et-search-input-clear-button\"\n  type=\"button\"\n>\n  <ng-content />\n</button>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SearchInputClearComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SearchInputClearComponent, isStandalone: true, selector: "et-search-input-clear", inputs: { ariaLabel: "ariaLabel" }, host: { classAttribute: "et-search-input-clear" }, ngImport: i0, template: "<button\n  [attr.aria-controls]=\"input.id\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [disabled]=\"input.disabled$ | async\"\n  (click)=\"searchInput._clear(); input.focusInputVia()\"\n  class=\"et-search-input-clear-button\"\n  type=\"button\"\n>\n  <ng-content />\n</button>\n", styles: [""], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SearchInputClearComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SearchInputClearComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-search-input-clear', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-search-input-clear',
@@ -3004,10 +3005,10 @@ class RadioDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: RadioDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled" }, providers: [{ provide: RADIO_TOKEN, useExisting: RadioDirective }], exportAs: ["etRadio"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: RadioDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled" }, providers: [{ provide: RADIO_TOKEN, useExisting: RadioDirective }], exportAs: ["etRadio"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -3039,10 +3040,10 @@ class RadioFieldDirective {
             observable: this._radio.changes.pipe(startWith(this._radio)).pipe(switchMap((radios) => combineLatest(radios.filter((radio) => !!radio).map((radio) => radio.disabled$))), map((disabled) => disabled.some((value) => value))),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: RadioFieldDirective, isStandalone: true, providers: [{ provide: RADIO_FIELD_TOKEN, useExisting: RadioFieldDirective }], queries: [{ propertyName: "_radio", predicate: i0.forwardRef(function () { return RADIO_TOKEN; }), descendants: true }], exportAs: ["etRadioField"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: RadioFieldDirective, isStandalone: true, providers: [{ provide: RADIO_FIELD_TOKEN, useExisting: RadioFieldDirective }], queries: [{ propertyName: "_radio", predicate: i0.forwardRef(function () { return RADIO_TOKEN; }), descendants: true }], exportAs: ["etRadioField"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioFieldDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioFieldDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -3070,10 +3071,10 @@ class RadioGroupDirective {
             })),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: RadioGroupDirective, isStandalone: true, host: { attributes: { "role": "radiogroup" } }, providers: [{ provide: RADIO_GROUP_TOKEN, useExisting: RadioGroupDirective }], exportAs: ["etRadioGroup"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: RadioGroupDirective, isStandalone: true, host: { attributes: { "role": "radiogroup" } }, providers: [{ provide: RADIO_GROUP_TOKEN, useExisting: RadioGroupDirective }], exportAs: ["etRadioGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioGroupDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioGroupDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -3086,15 +3087,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class RadioFieldComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: RadioFieldComponent, isStandalone: true, selector: "et-radio-field", host: { classAttribute: "et-form-field et-radio-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: RadioFieldDirective }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: RadioFieldComponent, isStandalone: true, selector: "et-radio-field", host: { classAttribute: "et-form-field et-radio-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: RadioFieldDirective }], ngImport: i0, template: `
     <div class="et-radio-field-container">
       <ng-content select="et-radio" />
       <ng-content select="et-label" />
     </div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioFieldComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-radio-field',
@@ -3118,15 +3119,15 @@ class RadioGroupComponent {
     constructor() {
         this.inputState = inject(InputStateService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: RadioGroupComponent, isStandalone: true, selector: "et-radio-group", host: { classAttribute: "et-form-group et-radio-group" }, hostDirectives: [{ directive: StaticFormGroupDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormGroupDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }, { directive: RadioGroupDirective }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: RadioGroupComponent, isStandalone: true, selector: "et-radio-group", host: { classAttribute: "et-form-group et-radio-group" }, hostDirectives: [{ directive: StaticFormGroupDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormGroupDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }, { directive: RadioGroupDirective }], ngImport: i0, template: `
     <div class="et-radio-group-container">
       <ng-content select="et-radio-field" />
     </div>
     <et-error [errors]="inputState.errors$ | async" />
   `, isInline: true, styles: [":where(.et-radio-group){display:block}\n"], dependencies: [{ kind: "component", type: ErrorComponent, selector: "et-error", inputs: ["errors"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-radio-group', template: `
     <div class="et-radio-group-container">
@@ -3152,10 +3153,10 @@ class RadioComponent extends InputBase {
         this.radio = inject(RADIO_TOKEN);
         this.radioGroup = inject(RADIO_GROUP_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: RadioComponent, isStandalone: true, selector: "et-radio", host: { classAttribute: "et-radio" }, usesInheritance: true, hostDirectives: [{ directive: RadioDirective, inputs: ["value", "value", "disabled", "disabled"] }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<input\n  [attr.tabindex]=\"(radio.disabled$ | async) ? -1 : 0\"\n  [attr.checked]=\"(radio.checked$ | async) || null\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [disabled]=\"radio.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  [attr.name]=\"radioGroup.name\"\n  (click)=\"radio._onInputInteraction($event)\"\n  (blur)=\"radio._controlTouched()\"\n  class=\"et-radio-native-input\"\n  type=\"radio\"\n  etNativeInputRef\n/>\n\n<div [ngClass]=\"{ 'et-radio-check--active': radio.checked$ | async }\" class=\"et-radio-check\"></div>\n", styles: [":where(.et-radio){--et-radio-size: 25px;--et-radio-check-size: 10px;--et-radio-border-radius: 50%;--et-radio-border-color: #e5e5e5;--et-radio-state-color: #e5e5e5;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);border:1px solid var(--et-radio-border-color);border-radius:var(--et-radio-border-radius);display:inline-grid}:where(.et-radio-check){inline-size:var(--et-radio-check-size);block-size:var(--et-radio-check-size);border-radius:var(--et-radio-border-radius)}:where(.et-radio-check).et-radio-check--active{background-color:var(--et-radio-state-color)}.et-radio{position:relative;align-items:center;justify-items:center}.et-radio-native-input,.et-radio-check{grid-area:1/1/2/2}.et-radio-native-input{z-index:1;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);opacity:0;margin:0;border:none}.et-radio:not(.et-radio--disabled) .et-radio-native-input{cursor:pointer}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: RadioComponent, isStandalone: true, selector: "et-radio", host: { classAttribute: "et-radio" }, usesInheritance: true, hostDirectives: [{ directive: RadioDirective, inputs: ["value", "value", "disabled", "disabled"] }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<input\n  [attr.tabindex]=\"(radio.disabled$ | async) ? -1 : 0\"\n  [attr.checked]=\"(radio.checked$ | async) || null\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [disabled]=\"radio.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  [attr.name]=\"radioGroup.name\"\n  (click)=\"radio._onInputInteraction($event)\"\n  (blur)=\"radio._controlTouched()\"\n  class=\"et-radio-native-input\"\n  type=\"radio\"\n  etNativeInputRef\n/>\n\n<div [ngClass]=\"{ 'et-radio-check--active': radio.checked$ | async }\" class=\"et-radio-check\"></div>\n", styles: [":where(.et-radio){--et-radio-size: 25px;--et-radio-check-size: 10px;--et-radio-border-radius: 50%;--et-radio-border-color: #e5e5e5;--et-radio-state-color: #e5e5e5;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);border:1px solid var(--et-radio-border-color);border-radius:var(--et-radio-border-radius);display:inline-grid}:where(.et-radio-check){inline-size:var(--et-radio-check-size);block-size:var(--et-radio-check-size);border-radius:var(--et-radio-border-radius)}:where(.et-radio-check).et-radio-check--active{background-color:var(--et-radio-state-color)}.et-radio{position:relative;align-items:center;justify-items:center}.et-radio-native-input,.et-radio-check{grid-area:1/1/2/2}.et-radio-native-input{z-index:1;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);opacity:0;margin:0;border:none}.et-radio:not(.et-radio--disabled) .et-radio-native-input{cursor:pointer}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RadioComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RadioComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-radio', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-radio',
@@ -3218,10 +3219,10 @@ class SegmentedButtonDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SegmentedButtonDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled" }, providers: [{ provide: SEGMENTED_BUTTON_TOKEN, useExisting: SegmentedButtonDirective }], exportAs: ["etSegmentedButton"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SegmentedButtonDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled" }, providers: [{ provide: SEGMENTED_BUTTON_TOKEN, useExisting: SegmentedButtonDirective }], exportAs: ["etSegmentedButton"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -3253,10 +3254,10 @@ class SegmentedButtonFieldDirective {
             observable: this._segmentedButton.changes.pipe(startWith(this._segmentedButton)).pipe(switchMap((buttons) => combineLatest(buttons.filter((radio) => !!radio).map((button) => button.disabled$))), map((disabled) => disabled.some((value) => value))),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SegmentedButtonFieldDirective, isStandalone: true, providers: [{ provide: SEGMENTED_BUTTON_FIELD_TOKEN, useExisting: SegmentedButtonFieldDirective }], queries: [{ propertyName: "_segmentedButton", predicate: i0.forwardRef(function () { return SEGMENTED_BUTTON_TOKEN; }), descendants: true }], exportAs: ["etSegmentedButtonField"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SegmentedButtonFieldDirective, isStandalone: true, providers: [{ provide: SEGMENTED_BUTTON_FIELD_TOKEN, useExisting: SegmentedButtonFieldDirective }], queries: [{ propertyName: "_segmentedButton", predicate: i0.forwardRef(function () { return SEGMENTED_BUTTON_TOKEN; }), descendants: true }], exportAs: ["etSegmentedButtonField"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonFieldDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonFieldDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -3312,10 +3313,10 @@ class SegmentedButtonGroupDirective {
         }), takeUntil(this._destroy$))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SegmentedButtonGroupDirective, isStandalone: true, host: { attributes: { "role": "group" } }, providers: [{ provide: SEGMENTED_BUTTON_GROUP_TOKEN, useExisting: SegmentedButtonGroupDirective }], queries: [{ propertyName: "_segmentedButtons", predicate: i0.forwardRef(function () { return SEGMENTED_BUTTON_TOKEN; }), descendants: true }], exportAs: ["etSegmentedButtonGroup"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SegmentedButtonGroupDirective, isStandalone: true, host: { attributes: { "role": "group" } }, providers: [{ provide: SEGMENTED_BUTTON_GROUP_TOKEN, useExisting: SegmentedButtonGroupDirective }], queries: [{ propertyName: "_segmentedButtons", predicate: i0.forwardRef(function () { return SEGMENTED_BUTTON_TOKEN; }), descendants: true }], exportAs: ["etSegmentedButtonGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonGroupDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonGroupDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -3342,10 +3343,10 @@ class SegmentedButtonComponent extends InputBase {
         }
         this.segmentedButton._setActiveIndicatorElement(this.activeIndicator.nativeElement);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SegmentedButtonComponent, isStandalone: true, selector: "et-segmented-button", host: { classAttribute: "et-segmented-button" }, viewQueries: [{ propertyName: "activeIndicator", first: true, predicate: ["activeIndicator"], descendants: true, static: true }], usesInheritance: true, hostDirectives: [{ directive: SegmentedButtonDirective, inputs: ["value", "value", "disabled", "disabled"] }, { directive: InputDirective }], ngImport: i0, template: "<button\n  [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n  [attr.aria-pressed]=\"segmentedButton.checked$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [disabled]=\"segmentedButton.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  (click)=\"segmentedButton._onInputInteraction($event)\"\n  (blur)=\"segmentedButton._controlTouched()\"\n  class=\"et-segmented-button-button\"\n  type=\"button\"\n>\n  <div #activeIndicator class=\"et-segmented-button-button-active-indicator\"></div>\n\n  <span class=\"et-segmented-button-button-content\">\n    <ng-content />\n  </span>\n</button>\n", styles: [":where(.et-segmented-button){--et-segmented-button-active-indicator-color: #e0e0e0;--et-segmented-button-active-indicator-radius: 1px}.et-segmented-button-button{position:relative}.et-segmented-button-button-content{position:relative;z-index:2}.et-segmented-button-button-active-indicator{position:absolute;inset:0;background-color:var(--et-segmented-button-active-indicator-color);border-radius:var(--et-segmented-button-active-indicator-radius);opacity:0;z-index:1}.et-segmented-button--checked .et-segmented-button-button-active-indicator{opacity:1}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SegmentedButtonComponent, isStandalone: true, selector: "et-segmented-button", host: { classAttribute: "et-segmented-button" }, viewQueries: [{ propertyName: "activeIndicator", first: true, predicate: ["activeIndicator"], descendants: true, static: true }], usesInheritance: true, hostDirectives: [{ directive: SegmentedButtonDirective, inputs: ["value", "value", "disabled", "disabled"] }, { directive: InputDirective }], ngImport: i0, template: "<button\n  [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n  [attr.aria-pressed]=\"segmentedButton.checked$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [disabled]=\"segmentedButton.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  (click)=\"segmentedButton._onInputInteraction($event)\"\n  (blur)=\"segmentedButton._controlTouched()\"\n  class=\"et-segmented-button-button\"\n  type=\"button\"\n>\n  <div #activeIndicator class=\"et-segmented-button-button-active-indicator\"></div>\n\n  <span class=\"et-segmented-button-button-content\">\n    <ng-content />\n  </span>\n</button>\n", styles: [":where(.et-segmented-button){--et-segmented-button-active-indicator-color: #e0e0e0;--et-segmented-button-active-indicator-radius: 1px}.et-segmented-button-button{position:relative}.et-segmented-button-button-content{position:relative;z-index:2}.et-segmented-button-button-active-indicator{position:absolute;inset:0;background-color:var(--et-segmented-button-active-indicator-color);border-radius:var(--et-segmented-button-active-indicator-radius);opacity:0;z-index:1}.et-segmented-button--checked .et-segmented-button-button-active-indicator{opacity:1}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-segmented-button', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-segmented-button',
@@ -3359,14 +3360,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
             }] } });
 
 class SegmentedButtonFieldComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SegmentedButtonFieldComponent, isStandalone: true, selector: "et-segmented-button-field", host: { classAttribute: "et-form-field et-segmented-button-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: SegmentedButtonFieldDirective }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SegmentedButtonFieldComponent, isStandalone: true, selector: "et-segmented-button-field", host: { classAttribute: "et-form-field et-segmented-button-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: SegmentedButtonFieldDirective }], ngImport: i0, template: `
     <div class="et-segmented-button-field-container">
       <ng-content select="et-segmented-button" />
     </div>
   `, isInline: true, styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonFieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-segmented-button-field', template: `
     <div class="et-segmented-button-field-container">
@@ -3381,15 +3382,15 @@ class SegmentedButtonGroupComponent {
     constructor() {
         this.inputState = inject(InputStateService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SegmentedButtonGroupComponent, isStandalone: true, selector: "et-segmented-button-group", host: { classAttribute: "et-form-group et-segmented-button-group" }, hostDirectives: [{ directive: StaticFormGroupDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormGroupDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }, { directive: SegmentedButtonGroupDirective }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SegmentedButtonGroupComponent, isStandalone: true, selector: "et-segmented-button-group", host: { classAttribute: "et-form-group et-segmented-button-group" }, hostDirectives: [{ directive: StaticFormGroupDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormGroupDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }, { directive: SegmentedButtonGroupDirective }], ngImport: i0, template: `
     <div class="et-segmented-button-group-container">
       <ng-content select="et-segmented-button-field" />
     </div>
     <et-error [errors]="inputState.errors$ | async" />
   `, isInline: true, styles: [":where(.et-segmented-button-group){--et-segmented-button-group-gap: 1rem}.et-segmented-button-group-container{display:flex;gap:var(--et-segmented-button-group-gap)}\n"], dependencies: [{ kind: "component", type: ErrorComponent, selector: "et-error", inputs: ["errors"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SegmentedButtonGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SegmentedButtonGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-segmented-button-group', template: `
     <div class="et-segmented-button-group-container">
@@ -3415,13 +3416,30 @@ const SegmentedButtonImports = [
     SegmentedButtonGroupComponent,
 ];
 
+const SELECT_FIELD_TOKEN = new InjectionToken('ET_SELECT_FIELD_DIRECTIVE_TOKEN');
+class SelectFieldDirective {
+    constructor() {
+        this._bindings = createReactiveBindings();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SelectFieldDirective, isStandalone: true, providers: [{ provide: SELECT_FIELD_TOKEN, useExisting: SelectFieldDirective }], exportAs: ["etSelectField"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectFieldDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    providers: [{ provide: SELECT_FIELD_TOKEN, useExisting: SelectFieldDirective }],
+                    exportAs: 'etSelectField',
+                }]
+        }] });
+
 class SelectFieldComponent extends DecoratedFormFieldBase {
     constructor() {
         super(...arguments);
         this.inputState = inject(InputStateService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SelectFieldComponent, isStandalone: true, selector: "et-select-field", host: { classAttribute: "et-form-field et-select-field" }, usesInheritance: true, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SelectFieldComponent, isStandalone: true, selector: "et-select-field", host: { classAttribute: "et-form-field et-select-field" }, usesInheritance: true, hostDirectives: [{ directive: SelectFieldDirective }, { directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
     <ng-content select="et-label" />
     <div class="et-select-field-input">
       <ng-content />
@@ -3429,7 +3447,7 @@ class SelectFieldComponent extends DecoratedFormFieldBase {
     <et-error [errors]="inputState.errors$ | async" />
   `, isInline: true, dependencies: [{ kind: "component", type: ErrorComponent, selector: "et-error", inputs: ["errors"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectFieldComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-select-field',
@@ -3447,6 +3465,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                         class: 'et-form-field et-select-field',
                     },
                     hostDirectives: [
+                        SelectFieldDirective,
                         StaticFormFieldDirective,
                         WriteableInputDirective,
                         {
@@ -3491,15 +3510,15 @@ class ComboboxOptionComponent {
         }
         return false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ComboboxOptionComponent, isStandalone: true, selector: "et-combobox-option", inputs: { option: "option" }, host: { listeners: { "click": "activateOption()" }, classAttribute: "et-combobox-option" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ComboboxOptionComponent, isStandalone: true, selector: "et-combobox-option", inputs: { option: "option" }, host: { listeners: { "click": "activateOption()" }, classAttribute: "et-combobox-option" }, providers: [
             {
                 provide: COMBOBOX_OPTION_TOKEN,
                 useExisting: ComboboxOptionComponent,
             },
         ], ngImport: i0, template: "{{ combobox.getOptionLabel(option) | async }}\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxOptionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-combobox-option', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-combobox-option',
@@ -3532,55 +3551,37 @@ class ComboboxBodyComponent {
             .pipe(takeUntil(this._destroy$), tap(() => this.combobox.close()))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ComboboxBodyComponent, isStandalone: true, selector: "et-combobox-body", host: { classAttribute: "et-combobox-body et-with-default-animation" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ComboboxBodyComponent, isStandalone: true, selector: "et-combobox-body", host: { classAttribute: "et-combobox-body et-with-default-animation" }, providers: [
             {
                 provide: COMBOBOX_BODY_TOKEN,
                 useExisting: ComboboxBodyComponent,
             },
-        ], viewQueries: [{ propertyName: "_animatedLifecycle", first: true, predicate: ANIMATED_LIFECYCLE_TOKEN, descendants: true, static: true }], hostDirectives: [{ directive: i1$1.ClickOutsideDirective }], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<div class=\"et-combobox-body-container\" etAnimatedLifecycle>\n  <ng-container *etLet=\"combobox.options$ | async as options\">\n    <et-combobox-option *ngFor=\"let option of options\" [option]=\"option\" />\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ComboboxOptionComponent, selector: "et-combobox-option", inputs: ["option"] }, { kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: AnimatedLifecycleDirective, selector: "[etAnimatedLifecycle]", exportAs: ["etAnimatedLifecycle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "_animatedLifecycle", first: true, predicate: ANIMATED_LIFECYCLE_TOKEN, descendants: true, static: true }], hostDirectives: [{ directive: i1$1.ClickOutsideDirective }], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<div class=\"et-combobox-body-container\" etAnimatedLifecycle>\n  <ng-container *etLet=\"combobox.options$ | async as options\">\n    <p *ngIf=\"!options?.length\" class=\"et-combobox-body--empty\">{{ combobox.emptyText }}</p>\n\n    <et-combobox-option *ngFor=\"let option of options\" [option]=\"option\" />\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ComboboxOptionComponent, selector: "et-combobox-option", inputs: ["option"] }, { kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: AnimatedLifecycleDirective, selector: "[etAnimatedLifecycle]", exportAs: ["etAnimatedLifecycle"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-combobox-body', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-combobox-body et-with-default-animation',
-                    }, imports: [NgTemplateOutlet, NgFor, ComboboxOptionComponent, LetDirective, AsyncPipe, AnimatedLifecycleDirective], hostDirectives: [ClickOutsideDirective], providers: [
+                    }, imports: [
+                        NgTemplateOutlet,
+                        NgFor,
+                        ComboboxOptionComponent,
+                        LetDirective,
+                        AsyncPipe,
+                        AnimatedLifecycleDirective,
+                        NgIf,
+                    ], hostDirectives: [ClickOutsideDirective], providers: [
                         {
                             provide: COMBOBOX_BODY_TOKEN,
                             useExisting: ComboboxBodyComponent,
                         },
-                    ], template: "<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<div class=\"et-combobox-body-container\" etAnimatedLifecycle>\n  <ng-container *etLet=\"combobox.options$ | async as options\">\n    <et-combobox-option *ngFor=\"let option of options\" [option]=\"option\" />\n  </ng-container>\n</div>\n" }]
+                    ], template: "<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<div class=\"et-combobox-body-container\" etAnimatedLifecycle>\n  <ng-container *etLet=\"combobox.options$ | async as options\">\n    <p *ngIf=\"!options?.length\" class=\"et-combobox-body--empty\">{{ combobox.emptyText }}</p>\n\n    <et-combobox-option *ngFor=\"let option of options\" [option]=\"option\" />\n  </ng-container>\n</div>\n" }]
         }], propDecorators: { _animatedLifecycle: [{
                 type: ViewChild,
                 args: [ANIMATED_LIFECYCLE_TOKEN, { static: true }]
             }] } });
 
-class RuntimeError extends Error {
-    constructor(code, message, data = '__ET_NO_DATA__') {
-        super(formatRuntimeError(code, message));
-        this.code = code;
-        this.data = data;
-        if (data !== '__ET_NO_DATA__') {
-            try {
-                const _data = clone(data);
-                setTimeout(() => {
-                    console.error(_data);
-                }, 1);
-            }
-            catch {
-                setTimeout(() => {
-                    console.error(data);
-                }, 1);
-            }
-        }
-    }
-}
-function formatRuntimeError(code, message) {
-    // prefix code with zeros if it's less than 100
-    const codeWithZeros = code < 10 ? `00${code}` : code < 100 ? `0${code}` : code;
-    const fullCode = `ET${codeWithZeros}`;
-    return `${fullCode}${message ? ': ' + message : ''}`;
-}
 const COMBOBOX_ERRORS = {
     1: 'Expected options to be an array of objects. This is due to "bindLabel" and "bindValue" being set.',
     2: 'Expected options to be an array of primitives. This is due to "bindLabel" and "bindValue" not being set or "allowCustomValues" being set to true.',
@@ -3610,46 +3611,35 @@ const isObjectArray = (value) => {
 const isEmptyArray = (value) => {
     return Array.isArray(value) && value.length === 0;
 };
-const isObject = (value) => {
-    return typeof value === 'object' && value !== null;
-};
 const ComboboxOptionType = {
     Primitive: 'primitive',
     Object: 'object',
 };
-const ComboboxInputValueType = {
-    Single: 'single',
-    Array: 'array',
-};
-const getObjectProperty = (obj, prop) => {
-    const hasDotNotation = prop.includes('.');
-    if (!hasDotNotation)
-        return obj[prop];
-    const props = prop.split('.');
-    let value = obj;
-    for (const prop of props) {
-        if (!isObject(value))
-            return undefined;
-        value = value[prop];
-    }
-    return value;
-};
 const COMBOBOX_TOKEN = new InjectionToken('ET_COMBOBOX_TOKEN');
 class ComboboxComponent extends DecoratedInputBase {
     //#endregion
     //#region Inputs
     get options() {
-        return this._options$.value;
+        return this._selectionModel.getFilteredOptions();
     }
     set options(value) {
-        this._options$.next(value);
-    }
-    get initialValue() {
-        return this._initialValue$.value;
+        this._selectionModel.setOptions(value);
     }
     set initialValue(value) {
-        this._initialValue$.next(value);
-        this._updateSelectedOptionsViaInitialValue();
+        this._selectionModel.setSelection(value);
+    }
+    get filterInternal() {
+        return this._filterInternal$.value;
+    }
+    set filterInternal(value) {
+        const val = coerceBooleanProperty(value);
+        this._filterInternal$.next(val);
+        if (!val) {
+            this._selectionModel.setFilter('');
+        }
+        else {
+            this._selectionModel.setFilter(this._currentFilter);
+        }
     }
     get loading() {
         return this._loading$.value;
@@ -3669,23 +3659,14 @@ class ComboboxComponent extends DecoratedInputBase {
     set placeholder(value) {
         this._placeholder$.next(value);
     }
-    get multiple() {
-        return this._multiple$.value;
-    }
     set multiple(value) {
-        this._multiple$.next(coerceBooleanProperty(value));
-    }
-    get bindLabel() {
-        return this._bindLabel$.value;
+        this._selectionModel.setAllowMultiple(coerceBooleanProperty(value));
     }
     set bindLabel(value) {
-        this._bindLabel$.next(value);
-    }
-    get bindValue() {
-        return this._bindValue$.value;
+        this._selectionModel.setLabelBinding(value);
     }
     set bindValue(value) {
-        this._bindValue$.next(value);
+        this._selectionModel.setValueBinding(value);
     }
     get allowCustomValues() {
         return this._allowCustomValues$.value;
@@ -3695,9 +3676,6 @@ class ComboboxComponent extends DecoratedInputBase {
     }
     //#endregion
     //#region Members
-    get _rawSelectedOptions() {
-        return this._rawSelectedOptions$.value;
-    }
     get _currentFilter() {
         return this._currentFilter$.value;
     }
@@ -3705,67 +3683,34 @@ class ComboboxComponent extends DecoratedInputBase {
         return this._animatedOverlay.isMounted;
     }
     //#endregion
+    //#region Computes
+    //#endregion
     //#region Lifecycle
     constructor() {
         super();
         //#region Injects
         this._input = inject(INPUT_TOKEN);
         this._animatedOverlay = inject(AnimatedOverlayDirective);
-        this._options$ = new BehaviorSubject([]);
-        this.options$ = this._options$.asObservable();
-        this._initialValue$ = new BehaviorSubject(null);
+        this._selectField = inject(SELECT_FIELD_TOKEN);
+        this._filterInternal$ = new BehaviorSubject(true);
         this._loading$ = new BehaviorSubject(false);
         this.loading$ = this._loading$.asObservable();
         this._error$ = new BehaviorSubject(null);
+        this.emptyText = 'No results found';
         this._placeholder$ = new BehaviorSubject(null);
-        this._multiple$ = new BehaviorSubject(false);
-        this._bindLabel$ = new BehaviorSubject(null);
-        this._bindValue$ = new BehaviorSubject(null);
         this._allowCustomValues$ = new BehaviorSubject(false);
         //#endregion
         //#region Outputs
         this.filterChange = new EventEmitter();
-        this._rawSelectedOptions$ = new BehaviorSubject([]);
         this._currentFilter$ = new BehaviorSubject('');
         this._isOpen$ = this._animatedOverlay.isMounted$;
-        //#endregion
-        //#region Computes
-        this._allOptions$ = combineLatest([this._options$, this._rawSelectedOptions$]).pipe(map(([options, rawSelectedOptions]) => [...options, ...rawSelectedOptions]), shareReplay({ bufferSize: 1, refCount: true }));
-        this.expectedOptionType$ = combineLatest([
-            this._bindLabel$,
-            this._bindValue$,
-            this._allowCustomValues$,
-        ]).pipe(map(([bindLabel, bindValue, allowCustomValues]) => {
-            const shouldBeObjects = bindLabel && bindValue && !allowCustomValues;
-            if (shouldBeObjects) {
-                return ComboboxOptionType.Object;
-            }
-            return ComboboxOptionType.Primitive;
-        }));
-        this.expectedInputValueType$ = this._multiple$.pipe(map((multiple) => (multiple ? ComboboxInputValueType.Array : ComboboxInputValueType.Single)));
-        this.selectedOptions$ = combineLatest([
-            this._input.value$,
-            this.expectedInputValueType$,
-            this._allOptions$,
-        ]).pipe(map(([inputValue, expectedInputValueType, allOptions]) => {
-            if (expectedInputValueType === ComboboxInputValueType.Single) {
-                if (Array.isArray(inputValue)) {
-                    return [];
-                }
-                const option = this._findOptionByValue(inputValue, allOptions);
-                return [option];
-            }
-            else if (expectedInputValueType === ComboboxInputValueType.Array) {
-                if (!Array.isArray(inputValue)) {
-                    return [];
-                }
-                const options = inputValue.map((value) => this._findOptionByValue(value, allOptions)).filter((v) => !!v);
-                if (!options.length)
-                    return [];
-                return options;
-            }
-            return [];
-        }), map((options) => options.filter((v) => !!v)));
+        this._selectionModel = new SelectionModel();
+        this.selectedOptions$ = this._selectionModel.selection$;
+        this.multiple$ = this._selectionModel.allowMultiple$;
+        this.options$ = this._selectionModel.filteredOptions$;
+        this.rawOptions$ = this._selectionModel.options$;
+        this._animatedOverlay.placement = 'bottom';
+        this._animatedOverlay.allowedAutoPlacements = ['bottom', 'top'];
         this._bindings.push({
             attribute: 'class.et-combobox--loading',
             observable: this._loading$,
@@ -3778,6 +3723,14 @@ class ComboboxComponent extends DecoratedInputBase {
             attribute: 'class.et-combobox--open',
             observable: this._isOpen$,
         });
+        this._selectField._bindings.push({
+            attribute: 'class.et-select-field--multiple',
+            observable: this.multiple$,
+        });
+        this._selectField._bindings.push({
+            attribute: 'class.et-select-field--open',
+            observable: this._isOpen$,
+        });
     }
     ngOnInit() {
         this._initDispatchFilterChanges();
@@ -3785,42 +3738,24 @@ class ComboboxComponent extends DecoratedInputBase {
         if (isDevMode()) {
             this._debugValidateComboboxConfig();
         }
+        this._selectionModel.value$
+            .pipe(takeUntil(this._destroy$), tap((value) => {
+            this._input._updateValue(value);
+            this._setFilterFromInputValue();
+        }))
+            .subscribe();
     }
     //#endregion
     //#region Public Methods
     getOptionLabel(option) {
-        if (!this.bindLabel || !isObject(option)) {
-            return of(option);
-        }
-        return this._bindLabel$.pipe(map((label) => {
-            if (!label)
-                return option;
-            return getObjectProperty(option, label) ?? option;
-        }));
+        return this._selectionModel.getLabel$(option);
     }
     getOptionValue(option) {
-        if (!this.bindValue || !isObject(option)) {
-            return of(option);
-        }
-        return this._bindValue$.pipe(map((value) => {
-            if (!value)
-                return option;
-            return getObjectProperty(option, value) ?? option;
-        }));
+        return this._selectionModel.getValue$(option);
     }
     removeSelectedOption(option) {
+        this._selectionModel.removeSelectedOption(option);
         this.input._markAsTouched();
-        const selectedOptions = this._rawSelectedOptions;
-        const optionValue = this._getOptionValueSync(option);
-        const index = selectedOptions.findIndex((v) => {
-            const val = this._getOptionValueSync(v);
-            return val === optionValue;
-        });
-        if (index === -1)
-            return;
-        selectedOptions.splice(index, 1);
-        this._rawSelectedOptions$.next(selectedOptions);
-        this._removeOrClearInputValue(optionValue);
     }
     open() {
         // if (!this._selectBodyConfig) return;
@@ -3842,72 +3777,110 @@ class ComboboxComponent extends DecoratedInputBase {
         this._animatedOverlay.unmount();
         // this._selectBodyId$.next(null);
     }
+    selectInputAndOpen() {
+        if (this.input.disabled)
+            return;
+        this.input.nativeInputRef?.element.nativeElement.select();
+        this.open();
+    }
     writeValueFromOption(option) {
         this.input._markAsTouched();
-        const optionValue = this._getOptionValueSync(option);
-        if (this._findOptionByValue(optionValue, this._rawSelectedOptions)) {
-            if (this.multiple) {
-                this.removeSelectedOption(option);
-                this._removeOrClearInputValue(optionValue);
-            }
-            return;
+        if (this._selectionModel.allowMultiple) {
+            this._selectionModel.toggleSelectedOption(option);
+        }
+        else {
+            this._selectionModel.addSelectedOption(option);
         }
-        this._setOrAddToInputValue(optionValue);
-        this._addSelectedOption(option);
-        if (!this.multiple) {
+        if (!this._selectionModel.allowMultiple) {
             this.close();
             this._setFilterFromInputValue();
         }
     }
     isOptionSelected(option) {
-        return combineLatest([this._rawSelectedOptions$, this.getOptionValue(option)]).pipe(map(([selectedOptions, value]) => !!this._findOptionByValue(value, selectedOptions)));
+        return this._selectionModel.isSelected$(option);
     }
     //#endregion
     //#region Protected Methods
     processKeydownEvent(event) {
         const keyCode = event.keyCode;
         const isOpen = this._isOpen;
-        const isMultiple = this.multiple;
+        const isMultiple = this._selectionModel.allowMultiple;
         const canAddCustomValue = this.allowCustomValues;
         const value = event.target.value;
-        const hasValue = !!value;
+        const hasFilterValue = !!value;
+        const result = {};
         // The user typed a custom value and pressed enter. Add it to the selected options.
-        if (keyCode === ENTER && canAddCustomValue && hasValue) {
-            // Don't add the value if it already exists.
-            if (!this._findOptionByValue(value, this._rawSelectedOptions)) {
-                this._addSelectedOption(value);
-                this._setOrAddToInputValue(value);
+        if (keyCode === ENTER) {
+            if (canAddCustomValue && hasFilterValue) {
+                result.optionAction = { type: 'add', option: value };
             }
-            if (this.multiple) {
-                this._updateFilter('');
+            else {
+                if (isMultiple) {
+                    // TODO: Toggle the focused option
+                }
+                else {
+                    // TODO: Select the focused option
+                }
             }
-            return;
+            if (isMultiple) {
+                result.setFilter = '';
+            }
+            else {
+                result.overlayOperation = 'close';
+            }
+            return this._interpretKeyHandlerResult(result);
+        }
+        if (keyCode === SPACE) {
+            if (isMultiple) {
+                // result.setFilter = '';
+                // TODO: Toggle the focused option
+            }
+            else {
+                result.overlayOperation = 'close';
+                // TODO: Select the focused option
+            }
+            return this._interpretKeyHandlerResult(result);
         }
         if (keyCode === ESCAPE) {
             if (isOpen) {
-                this.close();
+                result.overlayOperation = 'close';
             }
-            else {
-                if (!isMultiple) {
-                    this._removeOrClearInputValue(null);
-                    this._updateFilter('');
-                    return;
-                }
+            else if (!isMultiple) {
+                result.setFilter = '';
+                result.optionAction = 'clear';
             }
+            return this._interpretKeyHandlerResult(result);
         }
         if (keyCode === TAB$1) {
-            this.close();
-            return;
+            result.overlayOperation = 'close';
+            return this._interpretKeyHandlerResult(result);
         }
         if (!isOpen) {
-            this.open();
+            result.overlayOperation = 'open';
         }
         if (keyCode === DOWN_ARROW) {
-            // TODO: Implement
+            result.focusAction = 'next';
         }
         if (keyCode === UP_ARROW) {
-            // TODO: Implement
+            result.focusAction = 'previous';
+        }
+        if (keyCode === PAGE_UP) {
+            result.focusAction = { type: 'offset', offset: -10 };
+        }
+        if (keyCode === PAGE_DOWN) {
+            result.focusAction = { type: 'offset', offset: 10 };
+        }
+        if (keyCode === HOME) {
+            result.focusAction = 'first';
+        }
+        if (keyCode === END) {
+            result.focusAction = 'last';
         }
+        if (keyCode === A && event.ctrlKey && isMultiple) {
+            result.optionAction = 'toggleAll';
+            event.preventDefault();
+        }
+        return this._interpretKeyHandlerResult(result);
     }
     processInputEvent(event) {
         const value = event.target.value;
@@ -3916,10 +3889,10 @@ class ComboboxComponent extends DecoratedInputBase {
     handleBlurEvent() {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
-        if (this.multiple)
+        if (this._selectionModel.allowMultiple)
             return;
         if (this._currentFilter === '') {
-            this._removeOrClearInputValue(null);
+            this._selectionModel.clearSelectedOptions();
             return;
         }
         this._setFilterFromInputValue();
@@ -3928,7 +3901,7 @@ class ComboboxComponent extends DecoratedInputBase {
     //#region Private Methods
     _initDispatchFilterChanges() {
         this._currentFilter$
-            .pipe(debounceTime(300), distinctUntilChanged(), takeUntil(this._destroy$), tap((v) => this.filterChange.emit(v)))
+            .pipe(skipWhile(() => this.filterInternal), debounceTime(300), distinctUntilChanged(), takeUntil(this._destroy$), tap((v) => this.filterChange.emit(v)))
             .subscribe();
     }
     _initRepositionOnValueChanges() {
@@ -3936,65 +3909,6 @@ class ComboboxComponent extends DecoratedInputBase {
             .pipe(takeUntil(this._destroy$), debounceTime(0), tap(() => this._animatedOverlay._reposition()))
             .subscribe();
     }
-    _updateSelectedOptionsViaInitialValue() {
-        if (this.initialValue !== null && this.initialValue !== undefined) {
-            if (Array.isArray(this.initialValue)) {
-                this._addSelectedOptions(this.initialValue);
-            }
-            else {
-                this._addSelectedOption(this.initialValue);
-            }
-        }
-    }
-    _addSelectedOption(option) {
-        if (this.multiple) {
-            this._rawSelectedOptions$.next([...this._rawSelectedOptions, option]);
-        }
-        else {
-            this._rawSelectedOptions$.next([option]);
-        }
-    }
-    _addSelectedOptions(options) {
-        if (!this.multiple) {
-            return;
-        }
-        this._rawSelectedOptions$.next([...this._rawSelectedOptions, ...options]);
-    }
-    _findOptionByValue(value, allOptions) {
-        const option = allOptions.find((option) => {
-            if (isObject(option) && this.bindValue) {
-                return getObjectProperty(option, this.bindValue) === value;
-            }
-            return option === value;
-        });
-        return option;
-    }
-    _setOrAddToInputValue(value) {
-        if (this.multiple) {
-            if (Array.isArray(this._input.value)) {
-                this._input._updateValue([...this._input.value, value]);
-            }
-            else {
-                this._input._updateValue([value]);
-            }
-        }
-        else {
-            this._input._updateValue(value);
-        }
-    }
-    _removeOrClearInputValue(value) {
-        if (this.multiple) {
-            if (Array.isArray(this._input.value)) {
-                this._input._updateValue(this._input.value.filter((v) => v !== value));
-            }
-            else {
-                this._input._updateValue([]);
-            }
-        }
-        else {
-            this._input._updateValue(null);
-        }
-    }
     _updateFilter(value) {
         if (this.input.nativeInputRef && this.input.nativeInputRef.element.nativeElement.value !== value) {
             this.input.nativeInputRef.element.nativeElement.value = value;
@@ -4002,52 +3916,106 @@ class ComboboxComponent extends DecoratedInputBase {
         if (this._currentFilter === value)
             return;
         this._currentFilter$.next(value);
-    }
-    _getOptionValueSync(option) {
-        if (!this.bindValue || !isObject(option)) {
-            return option;
-        }
-        return getObjectProperty(option, this.bindValue) ?? option;
-    }
-    _getOptionLabelSync(option) {
-        if (!this.bindLabel || !isObject(option)) {
-            return option;
+        if (this.filterInternal) {
+            this._selectionModel.setFilter(value);
         }
-        return getObjectProperty(option, this.bindLabel) ?? option;
     }
     _setFilterFromInputValue() {
-        if (this.multiple)
+        if (this._selectionModel.allowMultiple)
             return;
         const value = this.input.value;
         if (!value || Array.isArray(value)) {
             this._updateFilter('');
             return;
         }
-        const option = this._findOptionByValue(value, this._rawSelectedOptions);
+        const option = this._selectionModel.getOptionByValue(value);
         if (!option)
             return;
-        const label = this._getOptionLabelSync(option);
+        const label = this._selectionModel.getLabel(option);
         if (typeof label !== 'string')
             return;
         this._updateFilter(label);
     }
+    _interpretKeyHandlerResult(result) {
+        if (result.overlayOperation === 'close') {
+            this.close();
+        }
+        else if (result.overlayOperation === 'open') {
+            this.open();
+        }
+        if (result.setFilter !== undefined) {
+            this._updateFilter(result.setFilter);
+        }
+        if (result.optionAction) {
+            if (typeof result.optionAction === 'string') {
+                if (result.optionAction === 'clear') {
+                    this._selectionModel.clearSelectedOptions();
+                }
+                else if (result.optionAction === 'toggleAll') {
+                    this._selectionModel.toggleAllSelectedOptions();
+                }
+            }
+            else {
+                const { type, option } = result.optionAction;
+                if (type === 'add') {
+                    this._selectionModel.addSelectedOption(option);
+                }
+                if (type === 'remove') {
+                    this._selectionModel.removeSelectedOption(option);
+                }
+                if (type === 'toggle') {
+                    this._selectionModel.toggleSelectedOption(option);
+                }
+            }
+        }
+        if (result.focusAction) {
+            if (typeof result.focusAction === 'string') {
+                if (result.focusAction === 'first') {
+                    // TODO: Implement
+                }
+                if (result.focusAction === 'last') {
+                    // TODO: Implement
+                }
+                if (result.focusAction === 'next') {
+                    // TODO: Implement
+                }
+                if (result.focusAction === 'previous') {
+                    // TODO: Implement
+                }
+            }
+            else {
+                const { type } = result.focusAction;
+                if (type === 'offset') {
+                    const { offset } = result.focusAction;
+                    // TODO: Implement
+                }
+            }
+        }
+    }
     //#endregion
     //#region Dev mode
     _debugValidateComboboxConfig(isRetry = false) {
-        this.expectedOptionType$
+        combineLatest([this._selectionModel.labelBinding$, this._selectionModel.valueBinding$, this._allowCustomValues$])
             .pipe(skip(isRetry ? 1 : 0), // Skip if retrying to avoid infinite loop
-        debounceTime(0), takeUntil(this._destroy$), tap((expectedOptionType) => {
-            if (isEmptyArray(this.options)) {
+        debounceTime(0), takeUntil(this._destroy$), map(([bindLabel, bindValue, allowCustomValues]) => {
+            const shouldBeObjects = bindLabel && bindValue && !allowCustomValues;
+            if (shouldBeObjects) {
+                return ComboboxOptionType.Object;
+            }
+            return ComboboxOptionType.Primitive;
+        }), tap((expectedOptionType) => {
+            const options = this._selectionModel.options;
+            if (isEmptyArray(options)) {
                 return;
             }
             if (expectedOptionType === ComboboxOptionType.Object) {
-                if (!isObjectArray(this.options)) {
-                    throw comboboxError(1, this.options);
+                if (!isObjectArray(options)) {
+                    throw comboboxError(1, options);
                 }
             }
             else if (expectedOptionType === ComboboxOptionType.Primitive) {
-                if (!isPrimitiveArray(this.options)) {
-                    throw comboboxError(2, this.options);
+                if (!isPrimitiveArray(options)) {
+                    throw comboboxError(2, options);
                 }
             }
         }), catchError((e) => {
@@ -4056,33 +4024,38 @@ class ComboboxComponent extends DecoratedInputBase {
         }))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ComboboxComponent, isStandalone: true, selector: "et-combobox", inputs: { options: "options", initialValue: "initialValue", loading: "loading", error: "error", placeholder: "placeholder", multiple: "multiple", bindLabel: "bindLabel", bindValue: "bindValue", allowCustomValues: "allowCustomValues" }, outputs: { filterChange: "filterChange" }, host: { classAttribute: "et-combobox" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ComboboxComponent, isStandalone: true, selector: "et-combobox", inputs: { options: "options", initialValue: "initialValue", filterInternal: "filterInternal", loading: "loading", error: "error", emptyText: "emptyText", placeholder: "placeholder", multiple: "multiple", bindLabel: "bindLabel", bindValue: "bindValue", allowCustomValues: "allowCustomValues" }, outputs: { filterChange: "filterChange" }, host: { listeners: { "click": "selectInputAndOpen()" }, classAttribute: "et-combobox" }, providers: [
             {
                 provide: COMBOBOX_TOKEN,
                 useExisting: ComboboxComponent,
             },
-        ], usesInheritance: true, hostDirectives: [{ directive: InputDirective }, { directive: i1$1.AnimatedOverlayDirective }], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<ng-content select=\"[etInputPrefix]\" />\n\n<div class=\"et-combobox-wrapper\">\n  <ul *ngIf=\"multiple\" class=\"et-combobox-selected-options\">\n    <li *ngFor=\"let item of selectedOptions$ | async\" class=\"et-combobox-selected-option\">\n      {{ getOptionLabel(item) | async }}\n      <span (click)=\"removeSelectedOption(item)\" class=\"et-combobox-selected-option-remove\" tabindex=\"-1\"> x </span>\n    </li>\n  </ul>\n\n  <input\n    (keydown)=\"processKeydownEvent($event)\"\n    (click)=\"open()\"\n    (blur)=\"handleBlurEvent()\"\n    (input)=\"processInputEvent($event)\"\n    type=\"text\"\n    etNativeInputRef\n  />\n\n  <et-chevron-icon class=\"et-combobox-chevron\" />\n</div>\n\n<ng-content select=\"[etInputSuffix]\" />\n\n<ng-template>\n  <ng-content />\n</ng-template>\n", styles: [".et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-from,.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-to{opacity:0;transform:scaleY(0)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-active{transition:transform 125ms var(--ease-out-5),opacity 125ms var(--ease-out-5)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-active{transition:transform 50ms var(--ease-in-5),opacity 50ms var(--ease-in-5)}.et-combobox-body.et-with-default-animation[data-popper-placement^=top] .et-combobox-body-container{transform-origin:bottom}.et-combobox-body.et-with-default-animation[data-popper-placement^=bottom] .et-combobox-body-container{transform-origin:top}.et-combobox-body-container{display:block;background-color:#3d3d3d;color:#fff;max-height:300px;overflow:auto}@supports (overflow: overlay){.et-combobox-body-container{overflow:overlay}}.et-combobox-body{width:100%;display:grid}.et-combobox-option{display:block}.et-combobox{display:block;border:1px solid #ccc;padding:15px;position:relative}.et-combobox-chevron{transform:rotate(180deg);display:block;inline-size:15px;block-size:15px;position:absolute;inset-inline-end:15px;inset-block-start:7px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, hostDirectives: [{ directive: InputDirective }, { directive: i1$1.AnimatedOverlayDirective }], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<ng-content select=\"[etInputPrefix]\" />\n\n<div class=\"et-combobox-wrapper\">\n  <ul *ngIf=\"multiple$ | async\" class=\"et-combobox-selected-options\">\n    <li *ngFor=\"let item of selectedOptions$ | async\" class=\"et-combobox-selected-option\">\n      {{ getOptionLabel(item) | async }}\n      <span\n        (click)=\"removeSelectedOption(item); $event.stopPropagation()\"\n        class=\"et-combobox-selected-option-remove\"\n        tabindex=\"-1\"\n      >\n        x\n      </span>\n    </li>\n  </ul>\n\n  <input\n    (keydown)=\"processKeydownEvent($event)\"\n    (click)=\"open()\"\n    (blur)=\"handleBlurEvent()\"\n    (input)=\"processInputEvent($event)\"\n    type=\"text\"\n    etNativeInputRef\n  />\n\n  <et-chevron-icon class=\"et-combobox-chevron\" />\n</div>\n\n<ng-content select=\"[etInputSuffix]\" />\n\n<ng-template>\n  <ng-content />\n</ng-template>\n", styles: [".et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-from,.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-to{opacity:0;transform:scaleY(0)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-active{transition:transform 125ms var(--ease-out-5),opacity 125ms var(--ease-out-5)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-active{transition:transform 50ms var(--ease-in-5),opacity 50ms var(--ease-in-5)}.et-combobox-body.et-with-default-animation[data-popper-placement^=top] .et-combobox-body-container{transform-origin:bottom}.et-combobox-body.et-with-default-animation[data-popper-placement^=bottom] .et-combobox-body-container{transform-origin:top}.et-combobox-body-container{display:block;background-color:#3d3d3d;color:#fff;max-height:300px;overflow:auto}@supports (overflow: overlay){.et-combobox-body-container{overflow:overlay}}.et-combobox-body{width:100%;display:grid}.et-combobox-option{display:block}.et-combobox{display:block;border:1px solid #ccc;padding:15px;position:relative}.et-combobox-chevron{transform:rotate(180deg);display:block;inline-size:15px;block-size:15px;position:absolute;inset-inline-end:15px;inset-block-start:7px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-combobox', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-combobox',
+                        '(click)': 'selectInputAndOpen()',
                     }, imports: [NgIf, NativeInputRefDirective, AsyncPipe, ChevronIconComponent, LetDirective, NgFor], hostDirectives: [{ directive: InputDirective }, AnimatedOverlayDirective], providers: [
                         {
                             provide: COMBOBOX_TOKEN,
                             useExisting: ComboboxComponent,
                         },
-                    ], template: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<ng-content select=\"[etInputPrefix]\" />\n\n<div class=\"et-combobox-wrapper\">\n  <ul *ngIf=\"multiple\" class=\"et-combobox-selected-options\">\n    <li *ngFor=\"let item of selectedOptions$ | async\" class=\"et-combobox-selected-option\">\n      {{ getOptionLabel(item) | async }}\n      <span (click)=\"removeSelectedOption(item)\" class=\"et-combobox-selected-option-remove\" tabindex=\"-1\"> x </span>\n    </li>\n  </ul>\n\n  <input\n    (keydown)=\"processKeydownEvent($event)\"\n    (click)=\"open()\"\n    (blur)=\"handleBlurEvent()\"\n    (input)=\"processInputEvent($event)\"\n    type=\"text\"\n    etNativeInputRef\n  />\n\n  <et-chevron-icon class=\"et-combobox-chevron\" />\n</div>\n\n<ng-content select=\"[etInputSuffix]\" />\n\n<ng-template>\n  <ng-content />\n</ng-template>\n", styles: [".et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-from,.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-to{opacity:0;transform:scaleY(0)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-active{transition:transform 125ms var(--ease-out-5),opacity 125ms var(--ease-out-5)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-active{transition:transform 50ms var(--ease-in-5),opacity 50ms var(--ease-in-5)}.et-combobox-body.et-with-default-animation[data-popper-placement^=top] .et-combobox-body-container{transform-origin:bottom}.et-combobox-body.et-with-default-animation[data-popper-placement^=bottom] .et-combobox-body-container{transform-origin:top}.et-combobox-body-container{display:block;background-color:#3d3d3d;color:#fff;max-height:300px;overflow:auto}@supports (overflow: overlay){.et-combobox-body-container{overflow:overlay}}.et-combobox-body{width:100%;display:grid}.et-combobox-option{display:block}.et-combobox{display:block;border:1px solid #ccc;padding:15px;position:relative}.et-combobox-chevron{transform:rotate(180deg);display:block;inline-size:15px;block-size:15px;position:absolute;inset-inline-end:15px;inset-block-start:7px}\n"] }]
+                    ], template: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/use-track-by-function -->\n<ng-content select=\"[etInputPrefix]\" />\n\n<div class=\"et-combobox-wrapper\">\n  <ul *ngIf=\"multiple$ | async\" class=\"et-combobox-selected-options\">\n    <li *ngFor=\"let item of selectedOptions$ | async\" class=\"et-combobox-selected-option\">\n      {{ getOptionLabel(item) | async }}\n      <span\n        (click)=\"removeSelectedOption(item); $event.stopPropagation()\"\n        class=\"et-combobox-selected-option-remove\"\n        tabindex=\"-1\"\n      >\n        x\n      </span>\n    </li>\n  </ul>\n\n  <input\n    (keydown)=\"processKeydownEvent($event)\"\n    (click)=\"open()\"\n    (blur)=\"handleBlurEvent()\"\n    (input)=\"processInputEvent($event)\"\n    type=\"text\"\n    etNativeInputRef\n  />\n\n  <et-chevron-icon class=\"et-combobox-chevron\" />\n</div>\n\n<ng-content select=\"[etInputSuffix]\" />\n\n<ng-template>\n  <ng-content />\n</ng-template>\n", styles: [".et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-from,.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-to{opacity:0;transform:scaleY(0)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-enter-active{transition:transform 125ms var(--ease-out-5),opacity 125ms var(--ease-out-5)}.et-combobox-body.et-with-default-animation .et-combobox-body-container.et-animation-leave-active{transition:transform 50ms var(--ease-in-5),opacity 50ms var(--ease-in-5)}.et-combobox-body.et-with-default-animation[data-popper-placement^=top] .et-combobox-body-container{transform-origin:bottom}.et-combobox-body.et-with-default-animation[data-popper-placement^=bottom] .et-combobox-body-container{transform-origin:top}.et-combobox-body-container{display:block;background-color:#3d3d3d;color:#fff;max-height:300px;overflow:auto}@supports (overflow: overlay){.et-combobox-body-container{overflow:overlay}}.et-combobox-body{width:100%;display:grid}.et-combobox-option{display:block}.et-combobox{display:block;border:1px solid #ccc;padding:15px;position:relative}.et-combobox-chevron{transform:rotate(180deg);display:block;inline-size:15px;block-size:15px;position:absolute;inset-inline-end:15px;inset-block-start:7px}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { options: [{
                 type: Input,
                 args: [{ required: true }]
             }], initialValue: [{
                 type: Input
+            }], filterInternal: [{
+                type: Input
             }], loading: [{
                 type: Input
             }], error: [{
                 type: Input
+            }], emptyText: [{
+                type: Input
             }], placeholder: [{
                 type: Input
             }], multiple: [{
@@ -4107,15 +4080,15 @@ const ComboboxImports = [
 
 const COMBOBOX_DIR_TOKEN = new InjectionToken('ET_COMBOBOX_INPUT_TOKEN');
 class ComboboxDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: ComboboxDirective, isStandalone: true, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: ComboboxDirective, isStandalone: true, providers: [
             {
                 provide: COMBOBOX_DIR_TOKEN,
                 useExisting: ComboboxDirective,
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ComboboxDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ComboboxDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -4160,10 +4133,10 @@ class NativeSelectOptionDirective {
     _setTextTemplate(template) {
         this._textTemplate$.next(template);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectOptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: NativeSelectOptionDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled", hidden: "hidden", key: "key" }, providers: [{ provide: NATIVE_SELECT_OPTION_TOKEN, useExisting: NativeSelectOptionDirective }], exportAs: ["etNativeSelectOption"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectOptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: NativeSelectOptionDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled", hidden: "hidden", key: "key" }, providers: [{ provide: NATIVE_SELECT_OPTION_TOKEN, useExisting: NativeSelectOptionDirective }], exportAs: ["etNativeSelectOption"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectOptionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectOptionDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -4217,10 +4190,10 @@ class NativeSelectInputDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: NativeSelectInputDirective, isStandalone: true, providers: [{ provide: NATIVE_SELECT_INPUT_TOKEN, useExisting: NativeSelectInputDirective }], queries: [{ propertyName: "options", predicate: NATIVE_SELECT_OPTION_TOKEN, descendants: true }], exportAs: ["etNativeSelectInput"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: NativeSelectInputDirective, isStandalone: true, providers: [{ provide: NATIVE_SELECT_INPUT_TOKEN, useExisting: NativeSelectInputDirective }], queries: [{ propertyName: "options", predicate: NATIVE_SELECT_OPTION_TOKEN, descendants: true }], exportAs: ["etNativeSelectInput"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectInputDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -4237,10 +4210,10 @@ class NativeSelectInputComponent extends DecoratedInputBase {
         super(...arguments);
         this.select = inject(NATIVE_SELECT_INPUT_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: NativeSelectInputComponent, isStandalone: true, selector: "et-native-select", host: { classAttribute: "et-native-select" }, usesInheritance: true, hostDirectives: [{ directive: NativeSelectInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<ng-template>\n  <ng-content select=\"et-native-select-option\" />\n</ng-template>\n\n<ng-content select=\"[etInputPrefix]\" />\n\n<select\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"select._onInputInteraction($event)\"\n  (blur)=\"select._controlTouched()\"\n  class=\"et-native-select-native-input\"\n  etNativeInputRef\n>\n  <option\n    *ngFor=\"let option of select.options; trackBy: select._trackByFn\"\n    [value]=\"option.value\"\n    [disabled]=\"option.disabled\"\n    [attr.selected]=\"option.value === input.value ? '' : null\"\n    [attr.hidden]=\"option.hidden ? '' : null\"\n    class=\"et-native-select-native-option\"\n  >\n    <ng-container *ngTemplateOutlet=\"option.textTemplate$ | async\" />\n  </option>\n</select>\n\n<ng-content select=\"[etInputSuffix]\" />\n", dependencies: [{ kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: NativeSelectInputComponent, isStandalone: true, selector: "et-native-select", host: { classAttribute: "et-native-select" }, usesInheritance: true, hostDirectives: [{ directive: NativeSelectInputDirective }, { directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<ng-template>\n  <ng-content select=\"et-native-select-option\" />\n</ng-template>\n\n<ng-content select=\"[etInputPrefix]\" />\n\n<select\n  [attr.id]=\"input.id\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [required]=\"input.required$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.autocomplete]=\"input.autocomplete || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  (input)=\"select._onInputInteraction($event)\"\n  (blur)=\"select._controlTouched()\"\n  class=\"et-native-select-native-input\"\n  etNativeInputRef\n>\n  <option\n    *ngFor=\"let option of select.options; trackBy: select._trackByFn\"\n    [value]=\"option.value\"\n    [disabled]=\"option.disabled\"\n    [attr.selected]=\"option.value === input.value ? '' : null\"\n    [attr.hidden]=\"option.hidden ? '' : null\"\n    class=\"et-native-select-native-option\"\n  >\n    <ng-container *ngTemplateOutlet=\"option.textTemplate$ | async\" />\n  </option>\n</select>\n\n<ng-content select=\"[etInputSuffix]\" />\n", dependencies: [{ kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-native-select', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-native-select',
@@ -4254,10 +4227,10 @@ class NativeSelectOptionComponent {
     ngOnInit() {
         this.option._setTextTemplate(this.textTpl ?? null);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: NativeSelectOptionComponent, isStandalone: true, selector: "et-native-select-option", host: { classAttribute: "et-native-select-option" }, viewQueries: [{ propertyName: "textTpl", first: true, predicate: ["textTpl"], descendants: true, static: true }], hostDirectives: [{ directive: NativeSelectOptionDirective, inputs: ["value", "value", "disabled", "disabled", "hidden", "hidden"] }], ngImport: i0, template: ` <ng-template #textTpl> <ng-content /></ng-template> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: NativeSelectOptionComponent, isStandalone: true, selector: "et-native-select-option", host: { classAttribute: "et-native-select-option" }, viewQueries: [{ propertyName: "textTpl", first: true, predicate: ["textTpl"], descendants: true, static: true }], hostDirectives: [{ directive: NativeSelectOptionDirective, inputs: ["value", "value", "disabled", "disabled", "hidden", "hidden"] }], ngImport: i0, template: ` <ng-template #textTpl> <ng-content /></ng-template> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NativeSelectOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NativeSelectOptionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-native-select-option',
@@ -4364,15 +4337,15 @@ class SelectOptionDirective {
     _setActive(isActive) {
         this._isActive$.next(isActive);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectOptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SelectOptionDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled" }, host: { attributes: { "role": "option" }, listeners: { "click": "setSelectValue()", "etObserveContent": "_updateViewValue()" }, properties: { "attr.id": "id", "attr.aria-disabled": "disabled", "class.et-select-option--disabled": "disabled" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectOptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SelectOptionDirective, isStandalone: true, inputs: { value: "value", disabled: "disabled" }, host: { attributes: { "role": "option" }, listeners: { "click": "setSelectValue()", "etObserveContent": "_updateViewValue()" }, properties: { "attr.id": "id", "attr.aria-disabled": "disabled", "class.et-select-option--disabled": "disabled" } }, providers: [
             {
                 provide: SELECT_OPTION_TOKEN,
                 useExisting: SelectOptionDirective,
             },
         ], hostDirectives: [{ directive: i1$1.ObserveContentDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectOptionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectOptionDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -4418,6 +4391,7 @@ class SelectDirective {
         this._animatedOverlay = inject(AnimatedOverlayDirective);
         this._destroy$ = createDestroy();
         this._liveAnnouncer = inject(LiveAnnouncer);
+        this._selectField = inject(SELECT_FIELD_TOKEN);
         this.input = inject(INPUT_TOKEN);
         this._selectBodyId$ = new BehaviorSubject(null);
         this._isOpen$ = new BehaviorSubject(false);
@@ -4491,6 +4465,15 @@ class SelectDirective {
         });
         this.trackByFn = (_, item) => item.id;
         this._animatedOverlay.placement = 'bottom';
+        this._animatedOverlay.allowedAutoPlacements = ['bottom', 'top'];
+        this._selectField._bindings.push({
+            attribute: 'class.et-select-field--open',
+            observable: this._isOpen$,
+        });
+        this._selectField._bindings.push({
+            attribute: 'class.et-select-field--multiple',
+            observable: this.multiple$,
+        });
     }
     ngOnInit() {
         this._unmountSelectBodyOnDisable();
@@ -4808,15 +4791,15 @@ class SelectDirective {
         }
         this._setActiveOption(null);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SelectDirective, isStandalone: true, inputs: { multiple: "multiple", emptyText: "emptyText" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SelectDirective, isStandalone: true, inputs: { multiple: "multiple", emptyText: "emptyText" }, providers: [
             {
                 provide: SELECT_TOKEN,
                 useExisting: SelectDirective,
             },
         ], queries: [{ propertyName: "_selectOptionsQueryList", predicate: SELECT_OPTION_TOKEN, descendants: true }], hostDirectives: [{ directive: i1$1.AnimatedOverlayDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -4864,15 +4847,15 @@ class SelectBodyDirective {
             .pipe(takeUntil(this._destroy$), tap(() => this._select.unmountSelectBody()))
             .subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectBodyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SelectBodyDirective, isStandalone: true, host: { attributes: { "tabindex": "-1", "role": "listbox" }, properties: { "attr.id": "id" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectBodyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SelectBodyDirective, isStandalone: true, host: { attributes: { "tabindex": "-1", "role": "listbox" }, properties: { "attr.id": "id" } }, providers: [
             {
                 provide: SELECT_BODY_TOKEN,
                 useExisting: SelectBodyDirective,
             },
         ], hostDirectives: [{ directive: i1$1.ClickOutsideDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectBodyDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectBodyDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -4896,14 +4879,14 @@ class SelectBodyComponent {
         this.selectBody = inject(SELECT_BODY_TOKEN);
         this._bodyTemplate = null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SelectBodyComponent, isStandalone: true, selector: "et-select-body", host: { classAttribute: "et-select-body et-with-default-animation" }, viewQueries: [{ propertyName: "_animatedLifecycle", first: true, predicate: ANIMATED_LIFECYCLE_TOKEN, descendants: true, static: true }], hostDirectives: [{ directive: SelectBodyDirective }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SelectBodyComponent, isStandalone: true, selector: "et-select-body", host: { classAttribute: "et-select-body et-with-default-animation" }, viewQueries: [{ propertyName: "_animatedLifecycle", first: true, predicate: ANIMATED_LIFECYCLE_TOKEN, descendants: true, static: true }], hostDirectives: [{ directive: SelectBodyDirective }], ngImport: i0, template: `
     <div class="et-select-body-container" etAnimatedLifecycle>
       <ng-container [ngTemplateOutlet]="_bodyTemplate" />
     </div>
   `, isInline: true, styles: [".et-select-body.et-with-default-animation .et-select-body-container.et-animation-enter-from,.et-select-body.et-with-default-animation .et-select-body-container.et-animation-leave-to{opacity:0;transform:scaleY(0)}.et-select-body.et-with-default-animation .et-select-body-container.et-animation-enter-active{transition:transform 125ms var(--ease-out-5),opacity 125ms var(--ease-out-5)}.et-select-body.et-with-default-animation .et-select-body-container.et-animation-leave-active{transition:transform 50ms var(--ease-in-5),opacity 50ms var(--ease-in-5)}.et-select-body.et-with-default-animation[data-popper-placement^=top] .et-select-body-container{transform-origin:bottom}.et-select-body.et-with-default-animation[data-popper-placement^=bottom] .et-select-body-container{transform-origin:top}.et-select-body-container{display:block;background-color:#3d3d3d;color:#fff;max-height:300px;overflow:auto}@supports (overflow: overlay){.et-select-body-container{overflow:overlay}}.et-select-body{width:100%;display:grid}\n"], dependencies: [{ kind: "directive", type: AnimatedLifecycleDirective, selector: "[etAnimatedLifecycle]", exportAs: ["etAnimatedLifecycle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-select-body', template: `
     <div class="et-select-body-container" etAnimatedLifecycle>
@@ -4921,10 +4904,10 @@ class SelectOptionComponent {
     constructor() {
         this.selectOption = inject(SELECT_OPTION_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SelectOptionComponent, isStandalone: true, selector: "et-select-option", host: { classAttribute: "et-select-option" }, hostDirectives: [{ directive: SelectOptionDirective, inputs: ["value", "value", "disabled", "disabled"] }], ngImport: i0, template: ` <ng-content /> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SelectOptionComponent, isStandalone: true, selector: "et-select-option", host: { classAttribute: "et-select-option" }, hostDirectives: [{ directive: SelectOptionDirective, inputs: ["value", "value", "disabled", "disabled"] }], ngImport: i0, template: ` <ng-content /> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectOptionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-select-option',
@@ -4951,10 +4934,10 @@ class SelectComponent extends DecoratedInputBase {
             return;
         this.select.setSelectBody({ component: SelectBodyComponent, template: this.selectBodyTpl });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SelectComponent, isStandalone: true, selector: "et-select", host: { classAttribute: "et-select" }, viewQueries: [{ propertyName: "selectBodyTpl", first: true, predicate: ["selectBodyTpl"], descendants: true }], usesInheritance: true, hostDirectives: [{ directive: InputDirective }, { directive: SelectDirective, inputs: ["multiple", "multiple", "emptyText", "emptyText"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<div class=\"et-select-wrapper\">\n  <div\n    #inputElement\n    [attr.id]=\"input.id\"\n    [attr.aria-labelledby]=\"select.labelledBy$ | async\"\n    [attr.aria-describedby]=\"input.describedBy$ | async\"\n    [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n    [attr.aria-required]=\"(input.required$ | async) || null\"\n    [attr.aria-disabled]=\"(input.disabled$ | async) || null\"\n    [attr.aria-invalid]=\"(input.invalid$ | async) || null\"\n    [attr.aria-controls]=\"(select.selectBodyId$ | async) || null\"\n    [attr.aria-owns]=\"(select.owns$ | async) || null\"\n    [attr.aria-expanded]=\"select.isOpen$ | async\"\n    [attr.aria-activedescendant]=\"select.activeDescendant$ | async\"\n    (click)=\"select.mountSelectBody()\"\n    (keydown)=\"select.handleKeyDown($event)\"\n    (blur)=\"select._controlTouched()\"\n    class=\"et-select-input et-select-input--static\"\n    aria-haspopup=\"listbox\"\n    role=\"combobox\"\n    aria-autocomplete=\"none\"\n  >\n    <span\n      *etLet=\"select.ariaViewValue$ | async as ariaViewValue\"\n      [attr.id]=\"select.selectCurrentValueId\"\n      [class.cdk-visually-hidden]=\"select.multiple && ariaViewValue\"\n      class=\"et-select-current-value\"\n    >\n      <ng-container *ngIf=\"select.ariaViewValue$ | async as ariaViewValue; else emptyTpl\">\n        {{ ariaViewValue }}\n      </ng-container>\n      <ng-template #emptyTpl> {{ select.emptyText }} </ng-template>\n    </span>\n\n    <ng-container *ngIf=\"select.multiple\">\n      <ng-container *ngIf=\"select.selectedOptions$ | async as selectedOptions\">\n        <ul *ngIf=\"selectedOptions.length\" class=\"et-select-selected-options\" aria-hidden=\"true\">\n          <li *ngFor=\"let opt of selectedOptions; trackBy: select.trackByFn\" class=\"et-select-selected-option\">\n            {{ opt.opt.viewValue$ | async }}\n            <button\n              (click)=\"\n                $event.stopImmediatePropagation(); inputElement.focus(); select.removeOptionFromSelection(opt.opt)\n              \"\n              class=\"et-select-selected-option-remove\"\n              tabindex=\"-1\"\n              type=\"button\"\n            ></button>\n          </li>\n        </ul>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <et-chevron-icon class=\"et-select-chevron\" />\n</div>\n\n<ng-content select=\"[etInputSuffix]\" />\n\n<ng-template #selectBodyTpl>\n  <ng-content />\n</ng-template>\n", styles: [".et-select{display:block;border:1px solid #ccc;padding:15px;position:relative}.et-select-input{position:absolute;inset:0}.et-select-option{display:block}.et-select-chevron{transform:rotate(180deg);display:block;inline-size:15px;block-size:15px;position:absolute;inset-inline-end:15px;inset-block-start:7px}.et-select-option--active{background-color:#1f1f1f}.et-select-option--selected{font-weight:700}.et-select-selected-options{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0;gap:5px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }, { kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SelectComponent, isStandalone: true, selector: "et-select", host: { classAttribute: "et-select" }, viewQueries: [{ propertyName: "selectBodyTpl", first: true, predicate: ["selectBodyTpl"], descendants: true }], usesInheritance: true, hostDirectives: [{ directive: InputDirective }, { directive: SelectDirective, inputs: ["multiple", "multiple", "emptyText", "emptyText"] }], ngImport: i0, template: "<ng-content select=\"[etInputPrefix]\" />\n\n<div class=\"et-select-wrapper\">\n  <div\n    #inputElement\n    [attr.id]=\"input.id\"\n    [attr.aria-labelledby]=\"select.labelledBy$ | async\"\n    [attr.aria-describedby]=\"input.describedBy$ | async\"\n    [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n    [attr.aria-required]=\"(input.required$ | async) || null\"\n    [attr.aria-disabled]=\"(input.disabled$ | async) || null\"\n    [attr.aria-invalid]=\"(input.invalid$ | async) || null\"\n    [attr.aria-controls]=\"(select.selectBodyId$ | async) || null\"\n    [attr.aria-owns]=\"(select.owns$ | async) || null\"\n    [attr.aria-expanded]=\"select.isOpen$ | async\"\n    [attr.aria-activedescendant]=\"select.activeDescendant$ | async\"\n    (click)=\"select.mountSelectBody()\"\n    (keydown)=\"select.handleKeyDown($event)\"\n    (blur)=\"select._controlTouched()\"\n    class=\"et-select-input et-select-input--static\"\n    aria-haspopup=\"listbox\"\n    role=\"combobox\"\n    aria-autocomplete=\"none\"\n  >\n    <span\n      *etLet=\"select.ariaViewValue$ | async as ariaViewValue\"\n      [attr.id]=\"select.selectCurrentValueId\"\n      [class.cdk-visually-hidden]=\"select.multiple && ariaViewValue\"\n      class=\"et-select-current-value\"\n    >\n      <ng-container *ngIf=\"select.ariaViewValue$ | async as ariaViewValue; else emptyTpl\">\n        {{ ariaViewValue }}\n      </ng-container>\n      <ng-template #emptyTpl> {{ select.emptyText }} </ng-template>\n    </span>\n\n    <ng-container *ngIf=\"select.multiple\">\n      <ng-container *ngIf=\"select.selectedOptions$ | async as selectedOptions\">\n        <ul *ngIf=\"selectedOptions.length\" class=\"et-select-selected-options\" aria-hidden=\"true\">\n          <li *ngFor=\"let opt of selectedOptions; trackBy: select.trackByFn\" class=\"et-select-selected-option\">\n            {{ opt.opt.viewValue$ | async }}\n            <button\n              (click)=\"\n                $event.stopImmediatePropagation(); inputElement.focus(); select.removeOptionFromSelection(opt.opt)\n              \"\n              class=\"et-select-selected-option-remove\"\n              tabindex=\"-1\"\n              type=\"button\"\n            ></button>\n          </li>\n        </ul>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <et-chevron-icon class=\"et-select-chevron\" />\n</div>\n\n<ng-content select=\"[etInputSuffix]\" />\n\n<ng-template #selectBodyTpl>\n  <ng-content />\n</ng-template>\n", styles: [".et-select{display:block;border:1px solid #ccc;padding:15px;position:relative}.et-select-input{position:absolute;inset:0}.et-select-option{display:block}.et-select-chevron{transform:rotate(180deg);display:block;inline-size:15px;block-size:15px;position:absolute;inset-inline-end:15px;inset-block-start:7px}.et-select-option--active{background-color:#1f1f1f}.et-select-option--selected{font-weight:700}.et-select-selected-options{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0;gap:5px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }, { kind: "directive", type: LetDirective, selector: "[etLet]", inputs: ["etLet"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-select', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-select',
@@ -4977,8 +4960,8 @@ class SlideToggleFieldComponent {
     constructor() {
         this.inputState = inject(InputStateService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SlideToggleFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SlideToggleFieldComponent, isStandalone: true, selector: "et-slide-toggle-field", host: { classAttribute: "et-form-field et-slide-toggle-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SlideToggleFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SlideToggleFieldComponent, isStandalone: true, selector: "et-slide-toggle-field", host: { classAttribute: "et-form-field et-slide-toggle-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
     <div class="et-slide-toggle-field-container">
       <ng-content select="et-slide-toggle" />
       <ng-content select="et-label" />
@@ -4986,7 +4969,7 @@ class SlideToggleFieldComponent {
     <et-error [errors]="inputState.errors$ | async" />
   `, isInline: true, dependencies: [{ kind: "component", type: ErrorComponent, selector: "et-error", inputs: ["errors"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SlideToggleFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SlideToggleFieldComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-slide-toggle-field',
@@ -5038,10 +5021,10 @@ class SlideToggleDirective {
         this.input._markAsTouched();
         this.input._setShouldDisplayError(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SlideToggleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SlideToggleDirective, isStandalone: true, providers: [{ provide: SLIDE_TOGGLE_TOKEN, useExisting: SlideToggleDirective }], exportAs: ["etSlideToggle"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SlideToggleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SlideToggleDirective, isStandalone: true, providers: [{ provide: SLIDE_TOGGLE_TOKEN, useExisting: SlideToggleDirective }], exportAs: ["etSlideToggle"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SlideToggleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SlideToggleDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -5055,10 +5038,10 @@ class SlideToggleComponent extends InputBase {
         super(...arguments);
         this.slideToggle = inject(SLIDE_TOGGLE_TOKEN);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SlideToggleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SlideToggleComponent, isStandalone: true, selector: "et-slide-toggle", host: { classAttribute: "et-slide-toggle" }, usesInheritance: true, hostDirectives: [{ directive: SlideToggleDirective }, { directive: InputDirective }], ngImport: i0, template: "<button\n  [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n  [attr.aria-checked]=\"slideToggle.checked$ | async\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  (click)=\"slideToggle._onInputInteraction($event)\"\n  (blur)=\"slideToggle._controlTouched()\"\n  class=\"et-slide-toggle-button\"\n  role=\"switch\"\n  type=\"button\"\n  etNativeInputRef\n>\n  <div class=\"et-slide-toggle-handle\"></div>\n</button>\n", styles: [":where(.et-slide-toggle-button){--et-slide-toggle-button-inline-size: 42px;--et-slide-toggle-button-block-size: 22px;--et-slide-toggle-button-border-radius: 9999px;--et-slide-toggle-border-size: 1px;--et-slide-toggle-border-style: solid;--et-slide-toggle-track-unchecked-color: #e0e0e0;--et-slide-toggle-track-checked-color: #ff8686;--et-slide-toggle-border-unchecked-color: var(--et-slide-toggle-track-unchecked-color);--et-slide-toggle-border-checked-color: var(--et-slide-toggle-track-checked-color);--et-slide-toggle-thumb-size: calc( var(--et-slide-toggle-button-block-size) - (var(--et-slide-toggle-thumb-spacing) * 2) );--et-slide-toggle-thumb-spacing: 3px;--et-slide-toggle-border-radius: 9999px;--et-slide-toggle-thumb-unchecked-color: #525252;--et-slide-toggle-thumb-checked-color: var(--et-slide-toggle-thumb-unchecked-color)}:where(.et-slide-toggle){display:inline-block}.et-slide-toggle-button{position:relative;display:block;box-sizing:border-box;inline-size:var(--et-slide-toggle-button-inline-size);block-size:var(--et-slide-toggle-button-block-size);border-radius:var(--et-slide-toggle-button-border-radius);background-color:var(--et-slide-toggle-track-unchecked-color);border:var(--et-slide-toggle-border-size) var(--et-slide-toggle-border-style) var(--et-slide-toggle-border-unchecked-color);padding:0;transition:background-color .2s var(--ease-5),border-color .2s var(--ease-5)}.et-slide-toggle-button:not(:disabled){cursor:pointer}.et-slide-toggle-handle{position:absolute;inset-block-start:calc(var(--et-slide-toggle-thumb-spacing) - var(--et-slide-toggle-border-size));inset-inline-start:calc(var(--et-slide-toggle-thumb-spacing) - var(--et-slide-toggle-border-size));inline-size:var(--et-slide-toggle-thumb-size);block-size:var(--et-slide-toggle-thumb-size);border-radius:var(--et-slide-toggle-border-radius);background-color:var(--et-slide-toggle-thumb-unchecked-color);transition:transform .2s var(--ease-5),background-color .2s var(--ease-5)}.et-slide-toggle--checked .et-slide-toggle-button{background-color:var(--et-slide-toggle-track-checked-color);border-color:var(--et-slide-toggle-border-checked-color)}.et-slide-toggle--checked .et-slide-toggle-handle{transform:translate(calc(var(--et-slide-toggle-button-inline-size) - var(--et-slide-toggle-thumb-size) - var(--et-slide-toggle-thumb-spacing) * 2));background-color:var(--et-slide-toggle-thumb-checked-color)}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SlideToggleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SlideToggleComponent, isStandalone: true, selector: "et-slide-toggle", host: { classAttribute: "et-slide-toggle" }, usesInheritance: true, hostDirectives: [{ directive: SlideToggleDirective }, { directive: InputDirective }], ngImport: i0, template: "<button\n  [attr.tabindex]=\"(input.disabled$ | async) ? -1 : 0\"\n  [attr.aria-checked]=\"slideToggle.checked$ | async\"\n  [attr.aria-labelledby]=\"input.labelId$ | async\"\n  [attr.aria-required]=\"(input.required$ | async) || null\"\n  [attr.aria-describedby]=\"input.describedBy$ | async\"\n  [disabled]=\"input.disabled$ | async\"\n  [attr.id]=\"input.id\"\n  (click)=\"slideToggle._onInputInteraction($event)\"\n  (blur)=\"slideToggle._controlTouched()\"\n  class=\"et-slide-toggle-button\"\n  role=\"switch\"\n  type=\"button\"\n  etNativeInputRef\n>\n  <div class=\"et-slide-toggle-handle\"></div>\n</button>\n", styles: [":where(.et-slide-toggle-button){--et-slide-toggle-button-inline-size: 42px;--et-slide-toggle-button-block-size: 22px;--et-slide-toggle-button-border-radius: 9999px;--et-slide-toggle-border-size: 1px;--et-slide-toggle-border-style: solid;--et-slide-toggle-track-unchecked-color: #e0e0e0;--et-slide-toggle-track-checked-color: #ff8686;--et-slide-toggle-border-unchecked-color: var(--et-slide-toggle-track-unchecked-color);--et-slide-toggle-border-checked-color: var(--et-slide-toggle-track-checked-color);--et-slide-toggle-thumb-size: calc( var(--et-slide-toggle-button-block-size) - (var(--et-slide-toggle-thumb-spacing) * 2) );--et-slide-toggle-thumb-spacing: 3px;--et-slide-toggle-border-radius: 9999px;--et-slide-toggle-thumb-unchecked-color: #525252;--et-slide-toggle-thumb-checked-color: var(--et-slide-toggle-thumb-unchecked-color)}:where(.et-slide-toggle){display:inline-block}.et-slide-toggle-button{position:relative;display:block;box-sizing:border-box;inline-size:var(--et-slide-toggle-button-inline-size);block-size:var(--et-slide-toggle-button-block-size);border-radius:var(--et-slide-toggle-button-border-radius);background-color:var(--et-slide-toggle-track-unchecked-color);border:var(--et-slide-toggle-border-size) var(--et-slide-toggle-border-style) var(--et-slide-toggle-border-unchecked-color);padding:0;transition:background-color .2s var(--ease-5),border-color .2s var(--ease-5)}.et-slide-toggle-button:not(:disabled){cursor:pointer}.et-slide-toggle-handle{position:absolute;inset-block-start:calc(var(--et-slide-toggle-thumb-spacing) - var(--et-slide-toggle-border-size));inset-inline-start:calc(var(--et-slide-toggle-thumb-spacing) - var(--et-slide-toggle-border-size));inline-size:var(--et-slide-toggle-thumb-size);block-size:var(--et-slide-toggle-thumb-size);border-radius:var(--et-slide-toggle-border-radius);background-color:var(--et-slide-toggle-thumb-unchecked-color);transition:transform .2s var(--ease-5),background-color .2s var(--ease-5)}.et-slide-toggle--checked .et-slide-toggle-button{background-color:var(--et-slide-toggle-track-checked-color);border-color:var(--et-slide-toggle-border-checked-color)}.et-slide-toggle--checked .et-slide-toggle-handle{transform:translate(calc(var(--et-slide-toggle-button-inline-size) - var(--et-slide-toggle-thumb-size) - var(--et-slide-toggle-thumb-spacing) * 2));background-color:var(--et-slide-toggle-thumb-checked-color)}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NativeInputRefDirective, selector: "input[etNativeInputRef], textarea[etNativeInputRef], select[etNativeInputRef], button[etNativeInputRef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SlideToggleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SlideToggleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-slide-toggle', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-slide-toggle',
@@ -5071,8 +5054,8 @@ class SliderFieldComponent {
     constructor() {
         this.inputState = inject(InputStateService);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SliderFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SliderFieldComponent, isStandalone: true, selector: "et-slider-field", host: { classAttribute: "et-form-field et-slider-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SliderFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SliderFieldComponent, isStandalone: true, selector: "et-slider-field", host: { classAttribute: "et-form-field et-slider-field" }, hostDirectives: [{ directive: StaticFormFieldDirective }, { directive: WriteableInputDirective }, { directive: i0.forwardRef(function () { return DynamicFormFieldDirective; }), inputs: ["hideErrorMessage", "hideErrorMessage"] }], ngImport: i0, template: `
     <ng-content select="et-label" />
     <div class="et-slider-field-container">
       <ng-content select="et-slider" />
@@ -5080,7 +5063,7 @@ class SliderFieldComponent {
     <et-error [errors]="inputState.errors$ | async" />
   `, isInline: true, dependencies: [{ kind: "component", type: ErrorComponent, selector: "et-error", inputs: ["errors"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SliderFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SliderFieldComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-slider-field',
@@ -5419,10 +5402,10 @@ class SliderComponent {
         this._sliderDimensions$.next(this._elementRef.nativeElement.getBoundingClientRect());
         return this._sliderDimensions$;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SliderComponent, isStandalone: true, selector: "et-slider", inputs: { min: "min", max: "max", step: "step", vertical: "vertical", inverted: "inverted" }, host: { attributes: { "role": "slider" }, properties: { "id": "_input.id" }, classAttribute: "et-slider" }, hostDirectives: [{ directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<div class=\"et-slider-track-container\">\n  <div\n    *ngIf=\"trackBackgroundStyles$ | async as trackBackgroundStyles\"\n    [style.transform]=\"trackBackgroundStyles.transform\"\n    class=\"et-slider-track-background\"\n  ></div>\n  <div\n    *ngIf=\"trackFillStyles$ | async as trackFillStyles\"\n    [style.transform]=\"trackFillStyles.transform\"\n    [style.display]=\"trackFillStyles.display\"\n    class=\"et-slider-track-fill\"\n  ></div>\n</div>\n\n<div\n  *ngIf=\"thumbContainerStyles$ | async as thumbContainerStyles\"\n  [style.transform]=\"thumbContainerStyles.transform\"\n  class=\"et-slider-thumb-container\"\n>\n  <div class=\"et-slider-thumb\"></div>\n</div>\n", styles: [":where(.et-slider){--et-slider-track-block-size: 2px;--et-slider-track-border-radius: 0;--et-slider-inactive-track-color: #646464;--et-slider-active-track-color: #ffffff;--et-slider-block-size: 32px;--et-slider-min-inline-size: 112px;--et-slider-thumb-target-size: 32px;--et-slider-thumb-size: 12px;--et-slider-thumb-border-radius: 9999px;--et-slider-thumb-color: #ffffff;--et-slider-transition-duration: 80ms;outline:none}.et-slider{position:relative;display:block}.et-slider.et-slider--disable-animations{--et-slider-transition-duration: 0ms}.et-slider[aria-orientation=horizontal]{block-size:var(--et-slider-block-size);min-inline-size:var(--et-slider-min-inline-size)}.et-slider[aria-orientation=horizontal] .et-slider-track-container{inset-block-start:calc(50% - var(--et-slider-track-block-size) / 2);inset-inline-start:0;block-size:var(--et-slider-track-block-size);inline-size:100%}.et-slider[aria-orientation=horizontal] .et-slider-track-fill{block-size:var(--et-slider-track-block-size);inline-size:100%;transform-origin:0 0}.et-slider[aria-orientation=horizontal] .et-slider-track-background{block-size:var(--et-slider-track-block-size);inline-size:100%;transform-origin:100% 100%}.et-slider[aria-orientation=horizontal] .et-slider-thumb-container{inline-size:100%;block-size:0;inset-block-start:50%}.et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-fill{transform-origin:100% 100%}.et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-background{transform-origin:0 0}.et-slider[aria-orientation=vertical]{inline-size:var(--et-slider-block-size);min-block-size:var(--et-slider-min-inline-size)}.et-slider[aria-orientation=vertical] .et-slider-track-container{inset-block-start:0;inset-inline-start:calc(50% - var(--et-slider-track-block-size) / 2);block-size:100%;inline-size:var(--et-slider-track-block-size)}.et-slider[aria-orientation=vertical] .et-slider-track-fill{inline-size:var(--et-slider-track-block-size);block-size:100%;transform-origin:100% 100%}.et-slider[aria-orientation=vertical] .et-slider-track-background{inline-size:var(--et-slider-track-block-size);block-size:100%;transform-origin:0 0}.et-slider[aria-orientation=vertical] .et-slider-thumb-container{inline-size:0;block-size:100%;inset-inline-start:50%}.et-slider[aria-orientation=vertical].et-slider--inverted .et-slider-track-fill{transform-origin:0 0}.et-slider[aria-orientation=vertical].et-slider--inverted .et-slider-track-background,[dir=rtl] .et-slider[aria-orientation=horizontal] .et-slider-track-fill{transform-origin:100% 100%}[dir=rtl] .et-slider[aria-orientation=horizontal] .et-slider-track-background,[dir=rtl] .et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-fill{transform-origin:0 0}[dir=rtl] .et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-background{transform-origin:100% 100%}.et-slider .et-slider-track-container{position:absolute;overflow:hidden}.et-slider .et-slider-track-fill{position:absolute;transition:transform var(--et-slider-transition-duration);background-color:var(--et-slider-active-track-color)}.et-slider .et-slider-track-background{position:absolute;transition:transform var(--et-slider-transition-duration);background-color:var(--et-slider-inactive-track-color)}.et-slider .et-slider-thumb-container{position:absolute;z-index:1;transition:transform var(--et-slider-transition-duration)}.et-slider .et-slider-thumb{position:absolute;inset-inline-end:calc(var(--et-slider-thumb-target-size) / 2 * -1);inset-block-end:calc(var(--et-slider-thumb-target-size) / 2 * -1);inline-size:var(--et-slider-thumb-target-size);block-size:var(--et-slider-thumb-target-size);transition:transform var(--et-slider-transition-duration);display:flex;justify-content:center;align-items:center}.et-slider .et-slider-thumb:after{content:\"\";position:relative;inline-size:var(--et-slider-thumb-size);block-size:var(--et-slider-thumb-size);background-color:var(--et-slider-thumb-color);border-radius:var(--et-slider-thumb-border-radius);cursor:grab}.et-slider.et-slider--is-sliding .et-slider-thumb:after{cursor:grabbing}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SliderComponent, isStandalone: true, selector: "et-slider", inputs: { min: "min", max: "max", step: "step", vertical: "vertical", inverted: "inverted" }, host: { attributes: { "role": "slider" }, properties: { "id": "_input.id" }, classAttribute: "et-slider" }, hostDirectives: [{ directive: InputDirective, inputs: ["autocomplete", "autocomplete"] }], ngImport: i0, template: "<div class=\"et-slider-track-container\">\n  <div\n    *ngIf=\"trackBackgroundStyles$ | async as trackBackgroundStyles\"\n    [style.transform]=\"trackBackgroundStyles.transform\"\n    class=\"et-slider-track-background\"\n  ></div>\n  <div\n    *ngIf=\"trackFillStyles$ | async as trackFillStyles\"\n    [style.transform]=\"trackFillStyles.transform\"\n    [style.display]=\"trackFillStyles.display\"\n    class=\"et-slider-track-fill\"\n  ></div>\n</div>\n\n<div\n  *ngIf=\"thumbContainerStyles$ | async as thumbContainerStyles\"\n  [style.transform]=\"thumbContainerStyles.transform\"\n  class=\"et-slider-thumb-container\"\n>\n  <div class=\"et-slider-thumb\"></div>\n</div>\n", styles: [":where(.et-slider){--et-slider-track-block-size: 2px;--et-slider-track-border-radius: 0;--et-slider-inactive-track-color: #646464;--et-slider-active-track-color: #ffffff;--et-slider-block-size: 32px;--et-slider-min-inline-size: 112px;--et-slider-thumb-target-size: 32px;--et-slider-thumb-size: 12px;--et-slider-thumb-border-radius: 9999px;--et-slider-thumb-color: #ffffff;--et-slider-transition-duration: 80ms;outline:none}.et-slider{position:relative;display:block}.et-slider.et-slider--disable-animations{--et-slider-transition-duration: 0ms}.et-slider[aria-orientation=horizontal]{block-size:var(--et-slider-block-size);min-inline-size:var(--et-slider-min-inline-size)}.et-slider[aria-orientation=horizontal] .et-slider-track-container{inset-block-start:calc(50% - var(--et-slider-track-block-size) / 2);inset-inline-start:0;block-size:var(--et-slider-track-block-size);inline-size:100%}.et-slider[aria-orientation=horizontal] .et-slider-track-fill{block-size:var(--et-slider-track-block-size);inline-size:100%;transform-origin:0 0}.et-slider[aria-orientation=horizontal] .et-slider-track-background{block-size:var(--et-slider-track-block-size);inline-size:100%;transform-origin:100% 100%}.et-slider[aria-orientation=horizontal] .et-slider-thumb-container{inline-size:100%;block-size:0;inset-block-start:50%}.et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-fill{transform-origin:100% 100%}.et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-background{transform-origin:0 0}.et-slider[aria-orientation=vertical]{inline-size:var(--et-slider-block-size);min-block-size:var(--et-slider-min-inline-size)}.et-slider[aria-orientation=vertical] .et-slider-track-container{inset-block-start:0;inset-inline-start:calc(50% - var(--et-slider-track-block-size) / 2);block-size:100%;inline-size:var(--et-slider-track-block-size)}.et-slider[aria-orientation=vertical] .et-slider-track-fill{inline-size:var(--et-slider-track-block-size);block-size:100%;transform-origin:100% 100%}.et-slider[aria-orientation=vertical] .et-slider-track-background{inline-size:var(--et-slider-track-block-size);block-size:100%;transform-origin:0 0}.et-slider[aria-orientation=vertical] .et-slider-thumb-container{inline-size:0;block-size:100%;inset-inline-start:50%}.et-slider[aria-orientation=vertical].et-slider--inverted .et-slider-track-fill{transform-origin:0 0}.et-slider[aria-orientation=vertical].et-slider--inverted .et-slider-track-background,[dir=rtl] .et-slider[aria-orientation=horizontal] .et-slider-track-fill{transform-origin:100% 100%}[dir=rtl] .et-slider[aria-orientation=horizontal] .et-slider-track-background,[dir=rtl] .et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-fill{transform-origin:0 0}[dir=rtl] .et-slider[aria-orientation=horizontal].et-slider--inverted .et-slider-track-background{transform-origin:100% 100%}.et-slider .et-slider-track-container{position:absolute;overflow:hidden}.et-slider .et-slider-track-fill{position:absolute;transition:transform var(--et-slider-transition-duration);background-color:var(--et-slider-active-track-color)}.et-slider .et-slider-track-background{position:absolute;transition:transform var(--et-slider-transition-duration);background-color:var(--et-slider-inactive-track-color)}.et-slider .et-slider-thumb-container{position:absolute;z-index:1;transition:transform var(--et-slider-transition-duration)}.et-slider .et-slider-thumb{position:absolute;inset-inline-end:calc(var(--et-slider-thumb-target-size) / 2 * -1);inset-block-end:calc(var(--et-slider-thumb-target-size) / 2 * -1);inline-size:var(--et-slider-thumb-target-size);block-size:var(--et-slider-thumb-target-size);transition:transform var(--et-slider-transition-duration);display:flex;justify-content:center;align-items:center}.et-slider .et-slider-thumb:after{content:\"\";position:relative;inline-size:var(--et-slider-thumb-size);block-size:var(--et-slider-thumb-size);background-color:var(--et-slider-thumb-color);border-radius:var(--et-slider-thumb-border-radius);cursor:grab}.et-slider.et-slider--is-sliding .et-slider-thumb:after{cursor:grabbing}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SliderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-slider', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-slider',
@@ -5489,10 +5472,10 @@ class MasonryItemComponent {
             nextFrame(() => this._isPositioned$.next(true));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: MasonryItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: MasonryItemComponent, isStandalone: true, selector: "[et-masonry-item], et-masonry-item", inputs: { key: "key" }, host: { attributes: { "role": "listitem" }, styleAttribute: "opacity: 0;", classAttribute: "et-masonry-item" }, providers: [{ provide: MASONRY_ITEM_TOKEN, useExisting: MasonryItemComponent }], viewQueries: [{ propertyName: "_innerElementRef", first: true, predicate: ["innerElement"], descendants: true, static: true }], exportAs: ["etMasonryItem"], ngImport: i0, template: `<div #innerElement class="et-masonry-item-inner"><ng-content /></div>`, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: MasonryItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: MasonryItemComponent, isStandalone: true, selector: "[et-masonry-item], et-masonry-item", inputs: { key: "key" }, host: { attributes: { "role": "listitem" }, styleAttribute: "opacity: 0;", classAttribute: "et-masonry-item" }, providers: [{ provide: MASONRY_ITEM_TOKEN, useExisting: MasonryItemComponent }], viewQueries: [{ propertyName: "_innerElementRef", first: true, predicate: ["innerElement"], descendants: true, static: true }], exportAs: ["etMasonryItem"], ngImport: i0, template: `<div #innerElement class="et-masonry-item-inner"><ng-content /></div>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: MasonryItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: MasonryItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[et-masonry-item], et-masonry-item',
@@ -5684,13 +5667,13 @@ class MasonryComponent {
     _setColumnWidth(width) {
         this._elementRef.nativeElement.style.setProperty('--et-masonry-column-width', `${width}px`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: MasonryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: MasonryComponent, isStandalone: true, selector: "et-masonry", inputs: { columWidth: "columWidth", gap: "gap" }, outputs: { initializing: "initializing", initialized: "initialized" }, host: { classAttribute: "et-masonry" }, queries: [{ propertyName: "_items", predicate: i0.forwardRef(function () { return MASONRY_ITEM_TOKEN; }), descendants: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: MasonryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: MasonryComponent, isStandalone: true, selector: "et-masonry", inputs: { columWidth: "columWidth", gap: "gap" }, outputs: { initializing: "initializing", initialized: "initialized" }, host: { classAttribute: "et-masonry" }, queries: [{ propertyName: "_items", predicate: i0.forwardRef(function () { return MASONRY_ITEM_TOKEN; }), descendants: true }], ngImport: i0, template: `
     <div (etObserveResize)="setResizeEvent()"></div>
     <ng-content select="[etMasonryItem], et-masonry-item, ng-container" />
   `, isInline: true, styles: [".et-masonry{position:relative;display:block}.et-masonry-item{position:absolute;top:0;left:0}.et-masonry.et-masonry--hide-overflow{overflow:hidden}.et-masonry.et-masonry--initialized .et-masonry-item{transition:transform .15s var(--ease-out-3)}\n"], dependencies: [{ kind: "directive", type: ObserveResizeDirective, selector: "[etObserveResize]", inputs: ["etObserveResizeDisabled", "etObserveResizeDebounce"], outputs: ["etObserveResize"], exportAs: ["etObserveResize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: MasonryComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: MasonryComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-masonry', template: `
     <div (etObserveResize)="setResizeEvent()"></div>
@@ -5757,10 +5740,10 @@ class BottomSheetContainerBaseComponent extends CdkDialogContainer {
             this._trapFocus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetContainerBaseComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: BOTTOM_SHEET_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: BottomSheetContainerBaseComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetContainerBaseComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: BOTTOM_SHEET_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: BottomSheetContainerBaseComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetContainerBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetContainerBaseComponent, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$2.FocusTrapFactory }, { type: Document, decorators: [{
@@ -5984,10 +5967,10 @@ class BottomSheetServiceBase {
             bottomSheets[i].close();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetServiceBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: BottomSheetServiceBase, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetServiceBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: BottomSheetServiceBase, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetServiceBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetServiceBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i2.Overlay }, { type: i0.Injector }, { type: undefined }, { type: undefined }, { type: undefined }, { type: i0.Type }, { type: i0.Type }, { type: i0.InjectionToken }]; } });
 
@@ -6067,10 +6050,10 @@ class SwipeHandlerService {
         }
         return handler;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SwipeHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SwipeHandlerService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SwipeHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SwipeHandlerService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SwipeHandlerService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SwipeHandlerService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -6114,10 +6097,10 @@ class BottomSheetSwipeHandlerService {
         }
         return handler;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetSwipeHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetSwipeHandlerService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetSwipeHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetSwipeHandlerService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetSwipeHandlerService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetSwipeHandlerService, decorators: [{
             type: Injectable
         }] });
 
@@ -6125,10 +6108,10 @@ class BottomSheetService extends BottomSheetServiceBase {
     constructor(overlay, injector, defaultOptions, scrollStrategy, parentBottomSheetService) {
         super(overlay, injector, defaultOptions, parentBottomSheetService, scrollStrategy, BottomSheetRef, BottomSheetContainerComponent, BOTTOM_SHEET_DATA);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetService, deps: [{ token: i2.Overlay }, { token: i0.Injector }, { token: BOTTOM_SHEET_DEFAULT_OPTIONS, optional: true }, { token: BOTTOM_SHEET_SCROLL_STRATEGY }, { token: BottomSheetService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetService, deps: [{ token: i2.Overlay }, { token: i0.Injector }, { token: BOTTOM_SHEET_DEFAULT_OPTIONS, optional: true }, { token: BOTTOM_SHEET_SCROLL_STRATEGY }, { token: BottomSheetService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.Overlay }, { type: i0.Injector }, { type: undefined, decorators: [{
                     type: Optional
@@ -6213,10 +6196,10 @@ class BottomSheetDragHandleComponent {
             this._bottomSheetRef._closeBottomSheetVia(this._bottomSheetRef, 'touch', this.bottomSheetResult);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetDragHandleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: BottomSheetDragHandleComponent, isStandalone: true, selector: "[et-bottom-sheet-drag-handle], [etBottomSheetDragHandle]", inputs: { ariaLabel: ["aria-label", "ariaLabel"], type: "type", bottomSheetResult: ["et-bottom-sheet-drag-handle", "bottomSheetResult"], _etBottomSheetDragHandle: ["etBottomSheetDragHandle", "_etBottomSheetDragHandle"] }, host: { listeners: { "click": "_onButtonClick($event)" }, properties: { "attr.aria-label": "ariaLabel || null", "attr.type": "this.type" }, classAttribute: "et-bottom-sheet-drag-handle" }, providers: [BottomSheetSwipeHandlerService], exportAs: ["etBottomSheetDragHandle"], usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: [":where(.et-bottom-sheet-drag-handle){--background-color: red}.et-bottom-sheet-drag-handle{--_tap-target-width: 100px;--_tap-target-height: 25px;inset-inline-start:calc(50% - var(--_tap-target-width) / 2);inline-size:var(--_tap-target-width);block-size:var(--_tap-target-height);border:none;position:relative;background-color:#0000;touch-action:manipulation;-webkit-appearance:none;appearance:none}.et-bottom-sheet-drag-handle:before{--_toggle-width: 32px;--_toggle-height: 4px;inline-size:var(--_toggle-width);block-size:var(--_toggle-height);content:\"\";position:absolute;background-color:var(--background-color);border-radius:9999px;inset-inline-start:calc(50% - var(--_toggle-width) / 2);inset-block-start:calc(50% - var(--_toggle-height) / 2);z-index:1}.et-bottom-sheet-drag-handle:after{opacity:0;inline-size:100%;block-size:100%;content:\"\";position:absolute;background-color:#0003;border-radius:8px;inset-block-start:0;inset-inline-start:0;transform:scale(0);transition:opacity .3s var(--ease-5),transform .3s var(--ease-5)}.et-bottom-sheet-drag-handle:focus-visible{outline:none}.et-bottom-sheet-drag-handle:focus-visible:after{opacity:1;transform:scale(1);transition:opacity .3s var(--ease-5),transform .3s var(--ease-squish-3)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetDragHandleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: BottomSheetDragHandleComponent, isStandalone: true, selector: "[et-bottom-sheet-drag-handle], [etBottomSheetDragHandle]", inputs: { ariaLabel: ["aria-label", "ariaLabel"], type: "type", bottomSheetResult: ["et-bottom-sheet-drag-handle", "bottomSheetResult"], _etBottomSheetDragHandle: ["etBottomSheetDragHandle", "_etBottomSheetDragHandle"] }, host: { listeners: { "click": "_onButtonClick($event)" }, properties: { "attr.aria-label": "ariaLabel || null", "attr.type": "this.type" }, classAttribute: "et-bottom-sheet-drag-handle" }, providers: [BottomSheetSwipeHandlerService], exportAs: ["etBottomSheetDragHandle"], usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: [":where(.et-bottom-sheet-drag-handle){--background-color: red}.et-bottom-sheet-drag-handle{--_tap-target-width: 100px;--_tap-target-height: 25px;inset-inline-start:calc(50% - var(--_tap-target-width) / 2);inline-size:var(--_tap-target-width);block-size:var(--_tap-target-height);border:none;position:relative;background-color:#0000;touch-action:manipulation;-webkit-appearance:none;appearance:none}.et-bottom-sheet-drag-handle:before{--_toggle-width: 32px;--_toggle-height: 4px;inline-size:var(--_toggle-width);block-size:var(--_toggle-height);content:\"\";position:absolute;background-color:var(--background-color);border-radius:9999px;inset-inline-start:calc(50% - var(--_toggle-width) / 2);inset-block-start:calc(50% - var(--_toggle-height) / 2);z-index:1}.et-bottom-sheet-drag-handle:after{opacity:0;inline-size:100%;block-size:100%;content:\"\";position:absolute;background-color:#0003;border-radius:8px;inset-block-start:0;inset-inline-start:0;transform:scale(0);transition:opacity .3s var(--ease-5),transform .3s var(--ease-5)}.et-bottom-sheet-drag-handle:focus-visible{outline:none}.et-bottom-sheet-drag-handle:focus-visible:after{opacity:1;transform:scale(1);transition:opacity .3s var(--ease-5),transform .3s var(--ease-squish-3)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetDragHandleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetDragHandleComponent, decorators: [{
             type: Component,
             args: [{ selector: '[et-bottom-sheet-drag-handle], [etBottomSheetDragHandle]', template: '', exportAs: 'etBottomSheetDragHandle', host: {
                         class: 'et-bottom-sheet-drag-handle',
@@ -6269,10 +6252,10 @@ class BottomSheetTitleDirective {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: BottomSheetTitleDirective, isStandalone: true, selector: "[et-bottom-sheet-title], [etBottomSheetTitle]", inputs: { id: "id" }, host: { properties: { "attr.id": "this.id" } }, exportAs: ["etBottomSheetTitle"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: BottomSheetTitleDirective, isStandalone: true, selector: "[et-bottom-sheet-title], [etBottomSheetTitle]", inputs: { id: "id" }, host: { properties: { "attr.id": "this.id" } }, exportAs: ["etBottomSheetTitle"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[et-bottom-sheet-title], [etBottomSheetTitle]',
@@ -6297,10 +6280,10 @@ class BottomSheetContainerComponent extends BottomSheetContainerBaseComponent {
             this._animatedLifecycle.enter();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: BOTTOM_SHEET_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: BottomSheetContainerComponent, isStandalone: true, selector: "et-bottom-sheet-container", host: { attributes: { "tabindex": "-1" }, properties: { "attr.aria-modal": "_config.ariaModal", "id": "_config.id", "attr.role": "_config.role", "attr.aria-labelledby": "_config.ariaLabel ? null : _ariaLabelledBy", "attr.aria-label": "_config.ariaLabel", "attr.aria-describedby": "_config.ariaDescribedBy || null", "class.et-with-default-animation": "!_config.customAnimated", "class": "_config.containerClass" }, classAttribute: "et-bottom-sheet" }, usesInheritance: true, hostDirectives: [{ directive: i1$1.AnimatedLifecycleDirective }], ngImport: i0, template: `<ng-template cdkPortalOutlet></ng-template>`, isInline: true, styles: [".et-bottom-sheet{transform:translateY(var(--touch-translate-y))}.et-bottom-sheet.et-with-default-animation{outline:none}.et-bottom-sheet.et-with-default-animation.et-animation-enter-from,.et-bottom-sheet.et-with-default-animation.et-animation-leave-to{transform:translateY(100%)}.et-bottom-sheet.et-with-default-animation.et-animation-enter-active{transition:transform .3s var(--ease-out-5)}.et-bottom-sheet.et-with-default-animation.et-animation-leave-active{transition:transform .15s var(--ease-in-5)}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: BOTTOM_SHEET_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: BottomSheetContainerComponent, isStandalone: true, selector: "et-bottom-sheet-container", host: { attributes: { "tabindex": "-1" }, properties: { "attr.aria-modal": "_config.ariaModal", "id": "_config.id", "attr.role": "_config.role", "attr.aria-labelledby": "_config.ariaLabel ? null : _ariaLabelledBy", "attr.aria-label": "_config.ariaLabel", "attr.aria-describedby": "_config.ariaDescribedBy || null", "class.et-with-default-animation": "!_config.customAnimated", "class": "_config.containerClass" }, classAttribute: "et-bottom-sheet" }, usesInheritance: true, hostDirectives: [{ directive: i1$1.AnimatedLifecycleDirective }], ngImport: i0, template: `<ng-template cdkPortalOutlet></ng-template>`, isInline: true, styles: [".et-bottom-sheet{transform:translateY(var(--touch-translate-y))}.et-bottom-sheet.et-with-default-animation{outline:none}.et-bottom-sheet.et-with-default-animation.et-animation-enter-from,.et-bottom-sheet.et-with-default-animation.et-animation-leave-to{transform:translateY(100%)}.et-bottom-sheet.et-with-default-animation.et-animation-enter-active{transition:transform .3s var(--ease-out-5)}.et-bottom-sheet.et-with-default-animation.et-animation-leave-active{transition:transform .15s var(--ease-in-5)}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: BottomSheetContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: BottomSheetContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-bottom-sheet-container', template: `<ng-template cdkPortalOutlet></ng-template>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'et-bottom-sheet',
@@ -6590,10 +6573,10 @@ class DialogServiceBase {
             dialogs[i].close();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogServiceBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: DialogServiceBase, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogServiceBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: DialogServiceBase, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogServiceBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogServiceBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i2.Overlay }, { type: i0.Injector }, { type: undefined }, { type: undefined }, { type: undefined }, { type: i0.Type }, { type: i0.Type }, { type: i0.InjectionToken }]; } });
 
@@ -6601,10 +6584,10 @@ class DialogService extends DialogServiceBase {
     constructor(overlay, injector, defaultOptions, scrollStrategy, parentDialogService) {
         super(overlay, injector, defaultOptions, parentDialogService, scrollStrategy, DialogRef, DialogContainerComponent, DIALOG_DATA);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogService, deps: [{ token: i2.Overlay }, { token: i0.Injector }, { token: DIALOG_DEFAULT_OPTIONS, optional: true }, { token: DIALOG_SCROLL_STRATEGY }, { token: DialogService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogService, deps: [{ token: i2.Overlay }, { token: i0.Injector }, { token: DIALOG_DEFAULT_OPTIONS, optional: true }, { token: DIALOG_SCROLL_STRATEGY }, { token: DialogService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.Overlay }, { type: i0.Injector }, { type: undefined, decorators: [{
                     type: Optional
@@ -6648,10 +6631,10 @@ class DialogCloseDirective {
         }
         this._dialogRef._closeDialogVia(this._dialogRef, event.screenX === 0 && event.screenY === 0 ? 'keyboard' : 'mouse', this.dialogResult);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: DialogCloseDirective, isStandalone: true, selector: "[et-dialog-close], [etDialogClose]", inputs: { ariaLabel: ["aria-label", "ariaLabel"], type: "type", dialogResult: ["et-dialog-close", "dialogResult"], _etDialogClose: ["etDialogClose", "_etDialogClose"] }, host: { listeners: { "click": "_onButtonClick($event)" }, properties: { "attr.aria-label": "ariaLabel || null", "attr.type": "this.type" } }, exportAs: ["etDialogClose"], usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: DialogCloseDirective, isStandalone: true, selector: "[et-dialog-close], [etDialogClose]", inputs: { ariaLabel: ["aria-label", "ariaLabel"], type: "type", dialogResult: ["et-dialog-close", "dialogResult"], _etDialogClose: ["etDialogClose", "_etDialogClose"] }, host: { listeners: { "click": "_onButtonClick($event)" }, properties: { "attr.aria-label": "ariaLabel || null", "attr.type": "this.type" } }, exportAs: ["etDialogClose"], usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogCloseDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogCloseDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[et-dialog-close], [etDialogClose]',
@@ -6697,10 +6680,10 @@ class DialogContainerBaseComponent extends CdkDialogContainer {
             this._trapFocus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogContainerBaseComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: DIALOG_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: DialogContainerBaseComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogContainerBaseComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: DIALOG_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: DialogContainerBaseComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogContainerBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogContainerBaseComponent, decorators: [{
             type: Component,
             args: [{ template: '' }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$2.FocusTrapFactory }, { type: Document, decorators: [{
@@ -6741,10 +6724,10 @@ class DialogTitleDirective {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: DialogTitleDirective, isStandalone: true, selector: "[et-dialog-title], [etDialogTitle]", inputs: { id: "id" }, host: { properties: { "attr.id": "this.id" } }, exportAs: ["etDialogTitle"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: DialogTitleDirective, isStandalone: true, selector: "[et-dialog-title], [etDialogTitle]", inputs: { id: "id" }, host: { properties: { "attr.id": "this.id" } }, exportAs: ["etDialogTitle"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[et-dialog-title], [etDialogTitle]',
@@ -6769,10 +6752,10 @@ class DialogContainerComponent extends DialogContainerBaseComponent {
             this._animatedLifecycle.enter();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: DIALOG_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: DialogContainerComponent, isStandalone: true, selector: "et-dialog-container", host: { attributes: { "tabindex": "-1" }, properties: { "attr.aria-modal": "_config.ariaModal", "id": "_config.id", "attr.role": "_config.role", "attr.aria-labelledby": "_config.ariaLabel ? null : _ariaLabelledBy", "attr.aria-label": "_config.ariaLabel", "attr.aria-describedby": "_config.ariaDescribedBy || null", "class.et-with-default-animation": "!_config.customAnimated", "class": "_config.containerClass" }, classAttribute: "et-dialog" }, usesInheritance: true, hostDirectives: [{ directive: i1$1.AnimatedLifecycleDirective }], ngImport: i0, template: `<ng-template cdkPortalOutlet></ng-template>`, isInline: true, styles: [".et-dialog.et-with-default-animation{outline:none}.et-dialog.et-with-default-animation.et-animation-enter-from{opacity:0;transform:scale(1.15)}.et-dialog.et-with-default-animation.et-animation-leave-to{opacity:0;transform:scale(.8)}.et-dialog.et-with-default-animation.et-animation-enter-active{transition:transform .3s var(--ease-out-5),opacity .3s var(--ease-out-5)}.et-dialog.et-with-default-animation.et-animation-leave-active{transition:transform .15s var(--ease-out-5),opacity .15s var(--ease-out-5)}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: DIALOG_CONFIG }, { token: i1$2.InteractivityChecker }, { token: i0.NgZone }, { token: i2.OverlayRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: DialogContainerComponent, isStandalone: true, selector: "et-dialog-container", host: { attributes: { "tabindex": "-1" }, properties: { "attr.aria-modal": "_config.ariaModal", "id": "_config.id", "attr.role": "_config.role", "attr.aria-labelledby": "_config.ariaLabel ? null : _ariaLabelledBy", "attr.aria-label": "_config.ariaLabel", "attr.aria-describedby": "_config.ariaDescribedBy || null", "class.et-with-default-animation": "!_config.customAnimated", "class": "_config.containerClass" }, classAttribute: "et-dialog" }, usesInheritance: true, hostDirectives: [{ directive: i1$1.AnimatedLifecycleDirective }], ngImport: i0, template: `<ng-template cdkPortalOutlet></ng-template>`, isInline: true, styles: [".et-dialog.et-with-default-animation{outline:none}.et-dialog.et-with-default-animation.et-animation-enter-from{opacity:0;transform:scale(1.15)}.et-dialog.et-with-default-animation.et-animation-leave-to{opacity:0;transform:scale(.8)}.et-dialog.et-with-default-animation.et-animation-enter-active{transition:transform .3s var(--ease-out-5),opacity .3s var(--ease-out-5)}.et-dialog.et-with-default-animation.et-animation-leave-active{transition:transform .15s var(--ease-out-5),opacity .15s var(--ease-out-5)}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DialogContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DialogContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-dialog-container', template: `<ng-template cdkPortalOutlet></ng-template>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'et-dialog',
@@ -6911,15 +6894,15 @@ class ToggletipDirective {
             ],
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ToggletipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: ToggletipDirective, isStandalone: true, selector: "[etToggletip]", inputs: { toggletip: ["etToggletip", "toggletip"], showToggletip: "showToggletip" }, outputs: { toggletipClose: "toggletipClose" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ToggletipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: ToggletipDirective, isStandalone: true, selector: "[etToggletip]", inputs: { toggletip: ["etToggletip", "toggletip"], showToggletip: "showToggletip" }, outputs: { toggletipClose: "toggletipClose" }, providers: [
             {
                 provide: TOGGLETIP_DIRECTIVE,
                 useExisting: ToggletipDirective,
             },
         ], hostDirectives: [{ directive: i1$1.AnimatedOverlayDirective, inputs: ["placement", "placement"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ToggletipDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ToggletipDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etToggletip]',
@@ -6965,15 +6948,15 @@ class ToggletipComponent {
     _markForCheck() {
         this._cdr.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ToggletipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ToggletipComponent, isStandalone: true, selector: "et-toggletip", host: { properties: { "attr.aria-hidden": "this.attrAriaHidden", "class.et-with-default-animation": "this.usesDefaultAnimation", "class": "this.containerClass" }, classAttribute: "et-toggletip" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ToggletipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ToggletipComponent, isStandalone: true, selector: "et-toggletip", host: { properties: { "attr.aria-hidden": "this.attrAriaHidden", "class.et-with-default-animation": "this.usesDefaultAnimation", "class": "this.containerClass" }, classAttribute: "et-toggletip" }, providers: [
             {
                 provide: TOGGLETIP,
                 useExisting: ToggletipComponent,
             },
         ], viewQueries: [{ propertyName: "_animatedLifecycle", first: true, predicate: ANIMATED_LIFECYCLE_TOKEN, descendants: true, static: true }], ngImport: i0, template: "<div class=\"et-toggletip-container\" etAnimatedLifecycle>\n  <ng-container *ngIf=\"toggletipText\">\n    {{ toggletipText }}\n  </ng-container>\n\n  <ng-container *ngIf=\"toggletipTemplate\">\n    <ng-container *ngTemplateOutlet=\"toggletipTemplate; injector: injector\" />\n  </ng-container>\n\n  <div class=\"toggletip-arrow\" data-popper-arrow></div>\n</div>\n", styles: [":where(.et-toggletip){--background-color: hsl(0 0% 20%);--foreground-color: CanvasText;--border-radius: 4px;--padding-inline: 1.5ch;--padding-block: .75ch;--inline-max-size: 25ch;--arrow-size: 10px;--arrow-radius: 2px}.et-toggletip[data-popper-placement^=top] .toggletip-arrow{bottom:-4px}.et-toggletip[data-popper-placement^=right] .toggletip-arrow{left:-4px}.et-toggletip[data-popper-placement^=bottom] .toggletip-arrow{top:-4px}.et-toggletip[data-popper-placement^=left] .toggletip-arrow{right:-4px}.et-toggletip-container{z-index:1;inline-size:max-content;max-inline-size:var(--inline-max-size);padding:var(--padding-block) var(--padding-inline);border-radius:var(--border-radius);background:var(--background-color);color:var(--foreground-color)}.et-toggletip-container:before{content:\"; Has toggletip: \";clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.toggletip-arrow{inline-size:var(--arrow-size);block-size:var(--arrow-size);position:absolute;z-index:-1}.toggletip-arrow:before{inline-size:var(--arrow-size);block-size:var(--arrow-size);border-radius:var(--arrow-radius);position:absolute;z-index:-1;transform:rotate(45deg);background:var(--background-color);top:0;left:0;content:\"\"}.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-enter-from,.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-leave-to{opacity:0}.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-enter-from .toggletip-arrow:before,.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-leave-to .toggletip-arrow:before{transform:rotate(45deg) scale(0)}.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-enter-active{transition:transform .2s var(--ease-out-5),opacity .2s var(--ease-out-5)}.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-enter-active .toggletip-arrow:before{transition:transform .2s var(--ease-out-5)}.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-leave-active{transition:transform .15s var(--ease-in-5),opacity .15s var(--ease-in-5)}.et-toggletip.et-with-default-animation .et-toggletip-container.et-animation-leave-active .toggletip-arrow:before{transition:transform .15s var(--ease-in-5)}.et-toggletip.et-with-default-animation[data-popper-placement^=top] .et-toggletip-container.et-animation-enter-from,.et-toggletip.et-with-default-animation[data-popper-placement^=top] .et-toggletip-container.et-animation-leave-to{transform:translateY(5px)}.et-toggletip.et-with-default-animation[data-popper-placement^=right] .et-toggletip-container.et-animation-enter-from,.et-toggletip.et-with-default-animation[data-popper-placement^=right] .et-toggletip-container.et-animation-leave-to{transform:translate(-5px)}.et-toggletip.et-with-default-animation[data-popper-placement^=bottom] .et-toggletip-container.et-animation-enter-from,.et-toggletip.et-with-default-animation[data-popper-placement^=bottom] .et-toggletip-container.et-animation-leave-to{transform:translateY(-5px)}.et-toggletip.et-with-default-animation[data-popper-placement^=left] .et-toggletip-container.et-animation-enter-from,.et-toggletip.et-with-default-animation[data-popper-placement^=left] .et-toggletip-container.et-animation-leave-to{transform:translate(5px)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AnimatedLifecycleDirective, selector: "[etAnimatedLifecycle]", exportAs: ["etAnimatedLifecycle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ToggletipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ToggletipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-toggletip', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [NgIf, NgTemplateOutlet, AnimatedLifecycleDirective], host: {
                         class: 'et-toggletip',
@@ -7145,15 +7128,15 @@ class TooltipDirective {
                 ? this.tooltip
                 : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: TooltipDirective, isStandalone: true, selector: "[etTooltip]", inputs: { tooltip: ["etTooltip", "tooltip"], tooltipAriaDescription: "tooltipAriaDescription" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: TooltipDirective, isStandalone: true, selector: "[etTooltip]", inputs: { tooltip: ["etTooltip", "tooltip"], tooltipAriaDescription: "tooltipAriaDescription" }, providers: [
             {
                 provide: TOOLTIP_DIRECTIVE,
                 useExisting: TooltipDirective,
             },
         ], hostDirectives: [{ directive: i1$1.AnimatedOverlayDirective, inputs: ["placement", "placement"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TooltipDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TooltipDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etTooltip]',
@@ -7195,15 +7178,15 @@ class TooltipComponent {
     _markForCheck() {
         this._cdr.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: TooltipComponent, isStandalone: true, selector: "et-tooltip", host: { properties: { "attr.aria-hidden": "this.attrAriaHidden", "class.et-with-default-animation": "this.usesDefaultAnimation", "class": "this.containerClass" }, classAttribute: "et-tooltip" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: TooltipComponent, isStandalone: true, selector: "et-tooltip", host: { properties: { "attr.aria-hidden": "this.attrAriaHidden", "class.et-with-default-animation": "this.usesDefaultAnimation", "class": "this.containerClass" }, classAttribute: "et-tooltip" }, providers: [
             {
                 provide: TOOLTIP,
                 useExisting: TooltipComponent,
             },
         ], viewQueries: [{ propertyName: "_animatedLifecycle", first: true, predicate: ANIMATED_LIFECYCLE_TOKEN, descendants: true, static: true }], ngImport: i0, template: "<div class=\"et-tooltip-container\" etAnimatedLifecycle>\n  <ng-container *ngIf=\"tooltipText\">\n    {{ tooltipText }}\n  </ng-container>\n\n  <ng-container *ngIf=\"tooltipTemplate\">\n    <ng-container *ngTemplateOutlet=\"tooltipTemplate; injector: injector\" />\n  </ng-container>\n\n  <div class=\"tooltip-arrow\" data-popper-arrow></div>\n</div>\n", styles: [":where(.et-tooltip){--background-color: hsl(0 0% 20%);--foreground-color: CanvasText;--border-radius: 4px;--padding-inline: 1.5ch;--padding-block: .75ch;--inline-max-size: 25ch;--arrow-size: 10px;--arrow-radius: 2px}.et-tooltip{pointer-events:none;-webkit-user-select:none;user-select:none}.et-tooltip[data-popper-placement^=top] .tooltip-arrow{bottom:-4px}.et-tooltip[data-popper-placement^=right] .tooltip-arrow{left:-4px}.et-tooltip[data-popper-placement^=bottom] .tooltip-arrow{top:-4px}.et-tooltip[data-popper-placement^=left] .tooltip-arrow{right:-4px}.et-tooltip-container{z-index:1;inline-size:max-content;max-inline-size:var(--inline-max-size);padding:var(--padding-block) var(--padding-inline);border-radius:var(--border-radius);background:var(--background-color);color:var(--foreground-color)}.et-tooltip-container:before{content:\"; Has tooltip: \";clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.tooltip-arrow{inline-size:var(--arrow-size);block-size:var(--arrow-size);position:absolute;z-index:-1}.tooltip-arrow:before{inline-size:var(--arrow-size);block-size:var(--arrow-size);border-radius:var(--arrow-radius);position:absolute;z-index:-1;transform:rotate(45deg);background:var(--background-color);top:0;left:0;content:\"\"}.et-tooltip.et-with-default-animation .et-tooltip-container.et-animation-enter-from,.et-tooltip.et-with-default-animation .et-tooltip-container.et-animation-leave-to{opacity:0}.et-tooltip.et-with-default-animation .et-tooltip-container.et-animation-enter-active{transition:transform .3s var(--ease-out-5),opacity .3s var(--ease-out-5)}.et-tooltip.et-with-default-animation .et-tooltip-container.et-animation-leave-active{transition:transform .15s var(--ease-in-5),opacity .15s var(--ease-in-5)}.et-tooltip.et-with-default-animation[data-popper-placement^=top] .et-tooltip-container.et-animation-enter-from,.et-tooltip.et-with-default-animation[data-popper-placement^=top] .et-tooltip-container.et-animation-leave-to{transform:translateY(5px)}.et-tooltip.et-with-default-animation[data-popper-placement^=right] .et-tooltip-container.et-animation-enter-from,.et-tooltip.et-with-default-animation[data-popper-placement^=right] .et-tooltip-container.et-animation-leave-to{transform:translate(-5px)}.et-tooltip.et-with-default-animation[data-popper-placement^=bottom] .et-tooltip-container.et-animation-enter-from,.et-tooltip.et-with-default-animation[data-popper-placement^=bottom] .et-tooltip-container.et-animation-leave-to{transform:translateY(-5px)}.et-tooltip.et-with-default-animation[data-popper-placement^=left] .et-tooltip-container.et-animation-enter-from,.et-tooltip.et-with-default-animation[data-popper-placement^=left] .et-tooltip-container.et-animation-leave-to{transform:translate(5px)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AnimatedLifecycleDirective, selector: "[etAnimatedLifecycle]", exportAs: ["etAnimatedLifecycle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TooltipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TooltipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-tooltip', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [NgIf, NgTemplateOutlet, AnimatedLifecycleDirective], host: {
                         class: 'et-tooltip',
@@ -7242,10 +7225,10 @@ class DynamicOverlayService {
         }
         return this._bottomSheetService.open(componentOrTemplateRef, config.bottomSheetConfig);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DynamicOverlayService, deps: [{ token: DialogService }, { token: BottomSheetService }, { token: i1$1.ViewportService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DynamicOverlayService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DynamicOverlayService, deps: [{ token: DialogService }, { token: BottomSheetService }, { token: i1$1.ViewportService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DynamicOverlayService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: DynamicOverlayService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: DynamicOverlayService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -7263,10 +7246,10 @@ class PaginationLinkDirective {
         }
         this.pageClick.emit(this.page);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginationLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: PaginationLinkDirective, isStandalone: true, selector: "[etPaginationLink]", inputs: { page: ["etPaginationLink", "page"] }, outputs: { pageClick: "pageClick" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginationLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: PaginationLinkDirective, isStandalone: true, selector: "[etPaginationLink]", inputs: { page: ["etPaginationLink", "page"] }, outputs: { pageClick: "pageClick" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginationLinkDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginationLinkDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etPaginationLink]',
@@ -7330,10 +7313,10 @@ class PaginationHeadService {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginationHeadService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginationHeadService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginationHeadService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginationHeadService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginationHeadService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginationHeadService, decorators: [{
             type: Injectable
         }] });
 
@@ -7488,10 +7471,10 @@ class PaginationComponent {
             this._paginationHeadService._updateHead(this.pageControl.value);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: PaginationComponent, isStandalone: true, selector: "et-pagination", inputs: { pageControl: "pageControl", totalPages: "totalPages", headTitleTemplate: "headTitleTemplate", headFirstPageTitle: "headFirstPageTitle", headAddCanonicalTag: "headAddCanonicalTag", ariaLabel: "ariaLabel", pageChangeScrollAnchor: "pageChangeScrollAnchor" }, host: { classAttribute: "et-pagination" }, providers: [PaginationHeadService], ngImport: i0, template: "<nav *ngIf=\"pages$ | async as pages\" [attr.aria-label]=\"ariaLabel\" class=\"et-pagination-nav\">\n  <ul class=\"et-pagination-list\">\n    <li\n      *ngFor=\"let page of pages; trackBy: trackByPage\"\n      [class.et-pagination-hot-link]=\"page.type === 'hotLink'\"\n      [class.et-pagination-page-link]=\"page.type === 'page'\"\n      [class.et-pagination-item-disabled]=\"page.disabled\"\n      class=\"et-pagination-list-item et-pagination-{{ page.explicitType }}\"\n    >\n      <a\n        [attr.aria-current]=\"page.current ? 'page' : null\"\n        [attr.aria-label]=\"page.ariaLabel\"\n        [attr.aria-disabled]=\"page.disabled ? 'true' : null\"\n        [etPaginationLink]=\"page\"\n        [href]=\"page.disabled ? '#' : page.url\"\n        (pageClick)=\"onPageClick($event)\"\n        class=\"et-pagination-anchor\"\n      >\n        <ng-container *ngIf=\"page.type === 'page'\">\n          {{ page.page }}\n        </ng-container>\n      </a>\n    </li>\n  </ul>\n</nav>\n", styles: [""], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PaginationLinkDirective, selector: "[etPaginationLink]", inputs: ["etPaginationLink"], outputs: ["pageClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: PaginationComponent, isStandalone: true, selector: "et-pagination", inputs: { pageControl: "pageControl", totalPages: "totalPages", headTitleTemplate: "headTitleTemplate", headFirstPageTitle: "headFirstPageTitle", headAddCanonicalTag: "headAddCanonicalTag", ariaLabel: "ariaLabel", pageChangeScrollAnchor: "pageChangeScrollAnchor" }, host: { classAttribute: "et-pagination" }, providers: [PaginationHeadService], ngImport: i0, template: "<nav *ngIf=\"pages$ | async as pages\" [attr.aria-label]=\"ariaLabel\" class=\"et-pagination-nav\">\n  <ul class=\"et-pagination-list\">\n    <li\n      *ngFor=\"let page of pages; trackBy: trackByPage\"\n      [class.et-pagination-hot-link]=\"page.type === 'hotLink'\"\n      [class.et-pagination-page-link]=\"page.type === 'page'\"\n      [class.et-pagination-item-disabled]=\"page.disabled\"\n      class=\"et-pagination-list-item et-pagination-{{ page.explicitType }}\"\n    >\n      <a\n        [attr.aria-current]=\"page.current ? 'page' : null\"\n        [attr.aria-label]=\"page.ariaLabel\"\n        [attr.aria-disabled]=\"page.disabled ? 'true' : null\"\n        [etPaginationLink]=\"page\"\n        [href]=\"page.disabled ? '#' : page.url\"\n        (pageClick)=\"onPageClick($event)\"\n        class=\"et-pagination-anchor\"\n      >\n        <ng-container *ngIf=\"page.type === 'page'\">\n          {{ page.page }}\n        </ng-container>\n      </a>\n    </li>\n  </ul>\n</nav>\n", styles: [""], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PaginationLinkDirective, selector: "[etPaginationLink]", inputs: ["etPaginationLink"], outputs: ["pageClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-pagination', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgForOf, AsyncPipe, NgIf, PaginationLinkDirective], providers: [PaginationHeadService], host: {
                         class: 'et-pagination',
@@ -7534,10 +7517,10 @@ class PictureDataDirective {
     set hasPriority(value) {
         this._hasPriority = coerceBooleanProperty(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PictureDataDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: PictureDataDirective, isStandalone: true, inputs: { hasPriority: "hasPriority", imgClass: "imgClass", figureClass: "figureClass", figcaptionClass: "figcaptionClass", pictureClass: "pictureClass", defaultSrc: "defaultSrc", alt: "alt", figcaption: "figcaption", width: "width", height: "height", sizes: "sizes" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PictureDataDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: PictureDataDirective, isStandalone: true, inputs: { hasPriority: "hasPriority", imgClass: "imgClass", figureClass: "figureClass", figcaptionClass: "figcaptionClass", pictureClass: "pictureClass", defaultSrc: "defaultSrc", alt: "alt", figcaption: "figcaption", width: "width", height: "height", sizes: "sizes" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PictureDataDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PictureDataDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -7572,10 +7555,10 @@ class PictureComponent {
         this.sources = [];
         this.trackBySrc = (_, item) => item.srcset;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PictureComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: "sources" }, host: { classAttribute: "et-picture" }, hostDirectives: [{ directive: PictureDataDirective, inputs: ["imgClass", "imgClass", "hasPriority", "hasPriority", "figureClass", "figureClass", "pictureClass", "pictureClass", "figcaptionClass", "figcaptionClass", "defaultSrc", "defaultSrc", "alt", "alt", "figcaption", "figcaption", "width", "width", "height", "height", "sizes", "sizes"] }], ngImport: i0, template: "<figure [ngClass]=\"pictureData.figureClass\" class=\"et-picture-figure\">\n  <picture [ngClass]=\"pictureData.pictureClass\" class=\"et-picture-picture\">\n    <source\n      *ngFor=\"let source of sources; trackBy: trackBySrc\"\n      [type]=\"source.type\"\n      [attr.srcset]=\"source.srcset\"\n      [attr.sizes]=\"pictureData.sizes\"\n    />\n\n    <img\n      *ngIf=\"pictureData.defaultSrc\"\n      [attr.loading]=\"pictureData.hasPriority ? 'eager' : 'lazy'\"\n      [attr.fetchpriority]=\"pictureData.hasPriority ? 'high' : 'auto'\"\n      [ngClass]=\"pictureData.imgClass\"\n      [src]=\"pictureData.defaultSrc.srcset\"\n      [attr.type]=\"pictureData.defaultSrc.type\"\n      [attr.alt]=\"pictureData.alt\"\n      [attr.width]=\"pictureData.width\"\n      [attr.height]=\"pictureData.height\"\n      [attr.sizes]=\"pictureData.sizes\"\n      class=\"et-picture-img\"\n    />\n  </picture>\n\n  <figcaption *ngIf=\"pictureData.figcaption\" [ngClass]=\"pictureData.figcaptionClass\" class=\"et-picture-figcaption\">\n    {{ pictureData.figcaption }}\n  </figcaption>\n</figure>\n", dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PictureComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: "sources" }, host: { classAttribute: "et-picture" }, hostDirectives: [{ directive: PictureDataDirective, inputs: ["imgClass", "imgClass", "hasPriority", "hasPriority", "figureClass", "figureClass", "pictureClass", "pictureClass", "figcaptionClass", "figcaptionClass", "defaultSrc", "defaultSrc", "alt", "alt", "figcaption", "figcaption", "width", "width", "height", "height", "sizes", "sizes"] }], ngImport: i0, template: "<figure [ngClass]=\"pictureData.figureClass\" class=\"et-picture-figure\">\n  <picture [ngClass]=\"pictureData.pictureClass\" class=\"et-picture-picture\">\n    <source\n      *ngFor=\"let source of sources; trackBy: trackBySrc\"\n      [type]=\"source.type\"\n      [attr.srcset]=\"source.srcset\"\n      [attr.sizes]=\"pictureData.sizes\"\n    />\n\n    <img\n      *ngIf=\"pictureData.defaultSrc\"\n      [attr.loading]=\"pictureData.hasPriority ? 'eager' : 'lazy'\"\n      [attr.fetchpriority]=\"pictureData.hasPriority ? 'high' : 'auto'\"\n      [ngClass]=\"pictureData.imgClass\"\n      [src]=\"pictureData.defaultSrc.srcset\"\n      [attr.type]=\"pictureData.defaultSrc.type\"\n      [attr.alt]=\"pictureData.alt\"\n      [attr.width]=\"pictureData.width\"\n      [attr.height]=\"pictureData.height\"\n      [attr.sizes]=\"pictureData.sizes\"\n      class=\"et-picture-img\"\n    />\n  </picture>\n\n  <figcaption *ngIf=\"pictureData.figcaption\" [ngClass]=\"pictureData.figcaptionClass\" class=\"et-picture-figcaption\">\n    {{ pictureData.figcaption }}\n  </figcaption>\n</figure>\n", dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PictureComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PictureComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-picture', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgForOf, NgClass, NgIf], host: {
                         class: 'et-picture',
@@ -7671,10 +7654,10 @@ class ProgressSpinnerComponent {
     _circleStrokeWidth() {
         return (this.strokeWidth / this.diameter) * 100;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ProgressSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ProgressSpinnerComponent, isStandalone: true, selector: "et-progress-spinner, et-spinner", inputs: { multiColor: "multiColor", mode: "mode", value: "value", diameter: "diameter", strokeWidth: "strokeWidth" }, host: { attributes: { "role": "progressbar", "tabindex": "-1" }, properties: { "class.et-circular-progress--indeterminate": "mode === \"indeterminate\"", "class.et-progress-spinner--multi-color": "multiColor", "style.width.px": "diameter", "style.height.px": "diameter", "attr.aria-valuemin": "0", "attr.aria-valuemax": "100", "attr.aria-valuenow": "mode === \"determinate\" ? value : null", "attr.mode": "mode" }, classAttribute: "et-progress-spinner" }, ngImport: i0, template: "<ng-template #circle>\n  <svg\n    [attr.viewBox]=\"_viewBox()\"\n    class=\"et-circular-progress__indeterminate-circle-graphic\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    focusable=\"false\"\n  >\n    <circle\n      [attr.r]=\"_circleRadius()\"\n      [style.stroke-dasharray.px]=\"_strokeCircumference()\"\n      [style.stroke-dashoffset.px]=\"_strokeCircumference() / 2\"\n      [style.stroke-width.%]=\"_circleStrokeWidth()\"\n      cx=\"50%\"\n      cy=\"50%\"\n    />\n  </svg>\n</ng-template>\n\n<ng-template #spinner>\n  <div class=\"et-circular-progress__circle-clipper et-circular-progress__circle-left\">\n    <ng-container [ngTemplateOutlet]=\"circle\" />\n  </div>\n  <div class=\"et-circular-progress__gap-patch\">\n    <ng-container [ngTemplateOutlet]=\"circle\" />\n  </div>\n  <div class=\"et-circular-progress__circle-clipper et-circular-progress__circle-right\">\n    <ng-container [ngTemplateOutlet]=\"circle\" />\n  </div>\n</ng-template>\n\n<div class=\"et-circular-progress__determinate-container\" aria-hidden=\"true\">\n  <svg\n    [attr.viewBox]=\"_viewBox()\"\n    class=\"et-circular-progress__determinate-circle-graphic\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    focusable=\"false\"\n  >\n    <circle\n      [attr.r]=\"_circleRadius()\"\n      [style.stroke-dasharray.px]=\"_strokeCircumference()\"\n      [style.stroke-dashoffset.px]=\"_strokeDashOffset()\"\n      [style.stroke-width.%]=\"_circleStrokeWidth()\"\n      class=\"et-circular-progress__determinate-circle\"\n      cx=\"50%\"\n      cy=\"50%\"\n    />\n  </svg>\n</div>\n\n<div class=\"et-circular-progress__indeterminate-container\" aria-hidden=\"true\">\n  <div [class.et-circular-progress__color-1]=\"multiColor\" class=\"et-circular-progress__spinner-layer\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n\n  <div class=\"et-circular-progress__spinner-layer et-circular-progress__color-2\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n\n  <div class=\"et-circular-progress__spinner-layer et-circular-progress__color-3\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n\n  <div class=\"et-circular-progress__spinner-layer et-circular-progress__color-4\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n</div>\n", styles: [":where(.et-progress-spinner){--et-progress-spinner-edges: round;--et-progress-spinner-color: #1e88e5;--et-progress-spinner-color-1: var(--et-progress-spinner-color);--et-progress-spinner-color-2: #f44336;--et-progress-spinner-color-3: #ff9800;--et-progress-spinner-color-4: #4caf50}.et-progress-spinner{position:relative;direction:ltr;transition:opacity .25s 0ms cubic-bezier(.4,0,.6,1);display:block;overflow:hidden;line-height:0}.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-2,.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-3,.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-4{visibility:visible}.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-1 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-1)}.et-circular-progress__determinate-circle,.et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color);stroke-linecap:var(--et-progress-spinner-edges)}.et-circular-progress__color-2 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-2)}.et-circular-progress__color-3 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-3)}.et-circular-progress__color-4 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-4)}.et-circular-progress__color-2,.et-circular-progress__color-3,.et-circular-progress__color-4{visibility:hidden}.et-circular-progress__determinate-container,.et-circular-progress__indeterminate-circle-graphic,.et-circular-progress__indeterminate-container,.et-circular-progress__spinner-layer{position:absolute;width:100%;height:100%}.et-circular-progress__determinate-container{transform:rotate(-90deg)}.et-circular-progress__indeterminate-container{font-size:0;letter-spacing:0;white-space:nowrap;opacity:0}.et-circular-progress__determinate-circle-graphic,.et-circular-progress__indeterminate-circle-graphic{fill:#0000}.et-circular-progress__determinate-circle{transition:stroke-dashoffset .5s 0ms cubic-bezier(0,0,.2,1)}.et-circular-progress__gap-patch{position:absolute;top:0;left:47.5%;box-sizing:border-box;width:5%;height:100%;overflow:hidden}.et-circular-progress__gap-patch .et-circular-progress__indeterminate-circle-graphic{left:-900%;width:2000%;transform:rotate(180deg)}.et-circular-progress__circle-clipper{display:inline-flex;position:relative;width:50%;height:100%;overflow:hidden}.et-circular-progress__circle-clipper .et-circular-progress__indeterminate-circle-graphic{width:200%}.et-circular-progress__circle-right .et-circular-progress__indeterminate-circle-graphic{left:-100%}.et-circular-progress--indeterminate .et-circular-progress__determinate-container{opacity:0}.et-circular-progress--indeterminate .et-circular-progress__indeterminate-container{opacity:1}.et-circular-progress--indeterminate .et-circular-progress__indeterminate-container{animation:et-circular-progress-container-rotate 1.5682352941176s linear infinite}.et-circular-progress--indeterminate .et-circular-progress__spinner-layer{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-1{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-2{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-3{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-4{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__circle-left .et-circular-progress__indeterminate-circle-graphic{animation:et-circular-progress-left-spin 1333ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__circle-right .et-circular-progress__indeterminate-circle-graphic{animation:et-circular-progress-right-spin 1333ms cubic-bezier(.4,0,.2,1) infinite both}@keyframes et-circular-progress-container-rotate{to{transform:rotate(360deg)}}@keyframes et-circular-progress-spinner-layer-rotate{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}to{transform:rotate(1080deg)}}@keyframes et-circular-progress-color-1-fade-in-out{0%{opacity:.99}25%{opacity:.99}26%{opacity:0}50%{opacity:0}90%{opacity:.99}to{opacity:.99}}@keyframes et-circular-progress-color-2-fade-in-out{0%{opacity:0}15%{opacity:0}25%{opacity:.99}50%{opacity:.99}51%{opacity:0}to{opacity:0}}@keyframes et-circular-progress-color-3-fade-in-out{0%{opacity:0}40%{opacity:0}50%{opacity:.99}75%{opacity:.99}76%{opacity:0}to{opacity:0}}@keyframes et-circular-progress-color-4-fade-in-out{0%{opacity:0}65%{opacity:0}75%{opacity:.99}90%{opacity:.99}to{opacity:0}}@keyframes et-circular-progress-left-spin{0%{transform:rotate(260deg)}50%{transform:rotate(130deg)}to{transform:rotate(260deg)}}@keyframes et-circular-progress-right-spin{0%{transform:rotate(-260deg)}50%{transform:rotate(-130deg)}to{transform:rotate(-260deg)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ProgressSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ProgressSpinnerComponent, isStandalone: true, selector: "et-progress-spinner, et-spinner", inputs: { multiColor: "multiColor", mode: "mode", value: "value", diameter: "diameter", strokeWidth: "strokeWidth" }, host: { attributes: { "role": "progressbar", "tabindex": "-1" }, properties: { "class.et-circular-progress--indeterminate": "mode === \"indeterminate\"", "class.et-progress-spinner--multi-color": "multiColor", "style.width.px": "diameter", "style.height.px": "diameter", "attr.aria-valuemin": "0", "attr.aria-valuemax": "100", "attr.aria-valuenow": "mode === \"determinate\" ? value : null", "attr.mode": "mode" }, classAttribute: "et-progress-spinner" }, ngImport: i0, template: "<ng-template #circle>\n  <svg\n    [attr.viewBox]=\"_viewBox()\"\n    class=\"et-circular-progress__indeterminate-circle-graphic\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    focusable=\"false\"\n  >\n    <circle\n      [attr.r]=\"_circleRadius()\"\n      [style.stroke-dasharray.px]=\"_strokeCircumference()\"\n      [style.stroke-dashoffset.px]=\"_strokeCircumference() / 2\"\n      [style.stroke-width.%]=\"_circleStrokeWidth()\"\n      cx=\"50%\"\n      cy=\"50%\"\n    />\n  </svg>\n</ng-template>\n\n<ng-template #spinner>\n  <div class=\"et-circular-progress__circle-clipper et-circular-progress__circle-left\">\n    <ng-container [ngTemplateOutlet]=\"circle\" />\n  </div>\n  <div class=\"et-circular-progress__gap-patch\">\n    <ng-container [ngTemplateOutlet]=\"circle\" />\n  </div>\n  <div class=\"et-circular-progress__circle-clipper et-circular-progress__circle-right\">\n    <ng-container [ngTemplateOutlet]=\"circle\" />\n  </div>\n</ng-template>\n\n<div class=\"et-circular-progress__determinate-container\" aria-hidden=\"true\">\n  <svg\n    [attr.viewBox]=\"_viewBox()\"\n    class=\"et-circular-progress__determinate-circle-graphic\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    focusable=\"false\"\n  >\n    <circle\n      [attr.r]=\"_circleRadius()\"\n      [style.stroke-dasharray.px]=\"_strokeCircumference()\"\n      [style.stroke-dashoffset.px]=\"_strokeDashOffset()\"\n      [style.stroke-width.%]=\"_circleStrokeWidth()\"\n      class=\"et-circular-progress__determinate-circle\"\n      cx=\"50%\"\n      cy=\"50%\"\n    />\n  </svg>\n</div>\n\n<div class=\"et-circular-progress__indeterminate-container\" aria-hidden=\"true\">\n  <div [class.et-circular-progress__color-1]=\"multiColor\" class=\"et-circular-progress__spinner-layer\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n\n  <div class=\"et-circular-progress__spinner-layer et-circular-progress__color-2\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n\n  <div class=\"et-circular-progress__spinner-layer et-circular-progress__color-3\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n\n  <div class=\"et-circular-progress__spinner-layer et-circular-progress__color-4\">\n    <ng-container [ngTemplateOutlet]=\"spinner\" />\n  </div>\n</div>\n", styles: [":where(.et-progress-spinner){--et-progress-spinner-edges: round;--et-progress-spinner-color: #1e88e5;--et-progress-spinner-color-1: var(--et-progress-spinner-color);--et-progress-spinner-color-2: #f44336;--et-progress-spinner-color-3: #ff9800;--et-progress-spinner-color-4: #4caf50}.et-progress-spinner{position:relative;direction:ltr;transition:opacity .25s 0ms cubic-bezier(.4,0,.6,1);display:block;overflow:hidden;line-height:0}.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-2,.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-3,.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-4{visibility:visible}.et-progress-spinner.et-progress-spinner--multi-color .et-circular-progress__color-1 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-1)}.et-circular-progress__determinate-circle,.et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color);stroke-linecap:var(--et-progress-spinner-edges)}.et-circular-progress__color-2 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-2)}.et-circular-progress__color-3 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-3)}.et-circular-progress__color-4 .et-circular-progress__indeterminate-circle-graphic{stroke:var(--et-progress-spinner-color-4)}.et-circular-progress__color-2,.et-circular-progress__color-3,.et-circular-progress__color-4{visibility:hidden}.et-circular-progress__determinate-container,.et-circular-progress__indeterminate-circle-graphic,.et-circular-progress__indeterminate-container,.et-circular-progress__spinner-layer{position:absolute;width:100%;height:100%}.et-circular-progress__determinate-container{transform:rotate(-90deg)}.et-circular-progress__indeterminate-container{font-size:0;letter-spacing:0;white-space:nowrap;opacity:0}.et-circular-progress__determinate-circle-graphic,.et-circular-progress__indeterminate-circle-graphic{fill:#0000}.et-circular-progress__determinate-circle{transition:stroke-dashoffset .5s 0ms cubic-bezier(0,0,.2,1)}.et-circular-progress__gap-patch{position:absolute;top:0;left:47.5%;box-sizing:border-box;width:5%;height:100%;overflow:hidden}.et-circular-progress__gap-patch .et-circular-progress__indeterminate-circle-graphic{left:-900%;width:2000%;transform:rotate(180deg)}.et-circular-progress__circle-clipper{display:inline-flex;position:relative;width:50%;height:100%;overflow:hidden}.et-circular-progress__circle-clipper .et-circular-progress__indeterminate-circle-graphic{width:200%}.et-circular-progress__circle-right .et-circular-progress__indeterminate-circle-graphic{left:-100%}.et-circular-progress--indeterminate .et-circular-progress__determinate-container{opacity:0}.et-circular-progress--indeterminate .et-circular-progress__indeterminate-container{opacity:1}.et-circular-progress--indeterminate .et-circular-progress__indeterminate-container{animation:et-circular-progress-container-rotate 1.5682352941176s linear infinite}.et-circular-progress--indeterminate .et-circular-progress__spinner-layer{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-1{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-2{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-3{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__color-4{animation:et-circular-progress-spinner-layer-rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both,et-circular-progress-color-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__circle-left .et-circular-progress__indeterminate-circle-graphic{animation:et-circular-progress-left-spin 1333ms cubic-bezier(.4,0,.2,1) infinite both}.et-circular-progress--indeterminate .et-circular-progress__circle-right .et-circular-progress__indeterminate-circle-graphic{animation:et-circular-progress-right-spin 1333ms cubic-bezier(.4,0,.2,1) infinite both}@keyframes et-circular-progress-container-rotate{to{transform:rotate(360deg)}}@keyframes et-circular-progress-spinner-layer-rotate{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}to{transform:rotate(1080deg)}}@keyframes et-circular-progress-color-1-fade-in-out{0%{opacity:.99}25%{opacity:.99}26%{opacity:0}50%{opacity:0}90%{opacity:.99}to{opacity:.99}}@keyframes et-circular-progress-color-2-fade-in-out{0%{opacity:0}15%{opacity:0}25%{opacity:.99}50%{opacity:.99}51%{opacity:0}to{opacity:0}}@keyframes et-circular-progress-color-3-fade-in-out{0%{opacity:0}40%{opacity:0}50%{opacity:.99}75%{opacity:.99}76%{opacity:0}to{opacity:0}}@keyframes et-circular-progress-color-4-fade-in-out{0%{opacity:0}65%{opacity:0}75%{opacity:.99}90%{opacity:.99}to{opacity:0}}@keyframes et-circular-progress-left-spin{0%{transform:rotate(260deg)}50%{transform:rotate(130deg)}to{transform:rotate(260deg)}}@keyframes et-circular-progress-right-spin{0%{transform:rotate(-260deg)}50%{transform:rotate(-130deg)}to{transform:rotate(-260deg)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ProgressSpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ProgressSpinnerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-progress-spinner, et-spinner', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-progress-spinner',
@@ -7820,10 +7803,10 @@ class ScrollableComponent {
             behavior: 'smooth',
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ScrollableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: ScrollableComponent, isStandalone: true, selector: "et-scrollable", inputs: { itemSize: "itemSize", direction: "direction", scrollableRole: "scrollableRole", scrollableClass: "scrollableClass", renderMasks: "renderMasks", renderButtons: "renderButtons", renderScrollbars: "renderScrollbars", stickyButtons: "stickyButtons", cursorDragScroll: "cursorDragScroll", activeElementScrollMargin: "activeElementScrollMargin", disableActiveElementScrolling: "disableActiveElementScrolling" }, host: { properties: { "attr.item-size": "this.itemSize", "attr.direction": "this.direction", "attr.render-scrollbars": "this.renderScrollbars", "attr.sticky-buttons": "this.stickyButtons" }, classAttribute: "et-scrollable" }, queries: [{ propertyName: "activeElements", predicate: IS_ACTIVE_ELEMENT, descendants: true }], viewQueries: [{ propertyName: "scrollable", first: true, predicate: ["scrollable"], descendants: true, static: true }], ngImport: i0, template: "<div\n  #scrollable\n  [attr.role]=\"scrollableRole ?? undefined\"\n  [ngClass]=\"scrollableClass\"\n  [etCursorDragScroll]=\"cursorDragScroll\"\n  (etObserveScrollState)=\"_scrollStateChanged($event)\"\n  class=\"et-scrollable-container\"\n>\n  <ng-content />\n</div>\n\n<div *ngIf=\"renderMasks\" class=\"et-scrollable-masks\">\n  <div class=\"et-scrollable-mask et-scrollable-mask--start\"></div>\n  <div class=\"et-scrollable-mask et-scrollable-mask--end\"></div>\n</div>\n\n<div *ngIf=\"renderButtons\" class=\"et-scrollable-buttons\">\n  <button\n    (click)=\"scrollOneContainerSizeToStart()\"\n    class=\"et-scrollable-button et-scrollable-button--start\"\n    aria-hidden=\"true\"\n    type=\"button\"\n    tabindex=\"-1\"\n  >\n    <et-chevron-icon />\n  </button>\n  <button\n    (click)=\"scrollOneContainerSizeToEnd()\"\n    class=\"et-scrollable-button et-scrollable-button--end\"\n    aria-hidden=\"true\"\n    type=\"button\"\n    tabindex=\"-1\"\n  >\n    <et-chevron-icon />\n  </button>\n</div>\n", styles: [".et-scrollable{--mask: #121212 0, transparent 100%;--mask-size: 25px;--_auto-size: min-content;--_flow: column;display:grid;position:relative}.et-scrollable[item-size=same]{--auto-size: 1fr}.et-scrollable[render-scrollbars=false] .et-scrollable-container{scrollbar-width:none}.et-scrollable[render-scrollbars=false] .et-scrollable-container::-webkit-scrollbar{display:none}.et-scrollable[direction=horizontal] .et-scrollable-container{grid-auto-columns:var(--_auto-size)}.et-scrollable[direction=horizontal] .et-scrollable-mask,.et-scrollable[direction=horizontal] .et-scrollable-button{inline-size:var(--mask-size);block-size:100%}.et-scrollable[direction=horizontal] .et-scrollable-mask--start,.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:0;inset-inline:0 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--end,.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:0;inset-inline:calc(100% - 40px) 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--start{background:linear-gradient(to right,var(--mask))}.et-scrollable[direction=horizontal] .et-scrollable-mask--end{background:linear-gradient(to left,var(--mask));inset-inline:calc(100% - var(--mask-size)) 100%}.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:calc(50% - 20px);transform:rotate(-90deg)}.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:calc(50% - 20px);transform:rotate(90deg)}.et-scrollable[direction=vertical]{--_flow: row}.et-scrollable[direction=vertical] .et-scrollable-container{grid-auto-rows:var(--_auto-size)}.et-scrollable[direction=vertical] .et-scrollable-mask,.et-scrollable[direction=vertical] .et-scrollable-button{block-size:var(--mask-size);inline-size:100%}.et-scrollable[direction=vertical] .et-scrollable-mask--start,.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-block-start:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--end,.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-block-end:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--start{background:linear-gradient(to bottom,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-mask--end{background:linear-gradient(to top,var(--mask))}.et-scrollable[at-start=false] .et-scrollable-masks .et-scrollable-mask--start,.et-scrollable[at-start=false] .et-scrollable-buttons .et-scrollable-button--start{opacity:1}.et-scrollable[at-start=false] .et-scrollable-buttons .et-scrollable-button--start{pointer-events:all}.et-scrollable[at-end=false] .et-scrollable-masks .et-scrollable-mask--end,.et-scrollable[at-end=false] .et-scrollable-buttons .et-scrollable-button--end{opacity:1}.et-scrollable[at-end=false] .et-scrollable-buttons .et-scrollable-button--end{pointer-events:all}.et-scrollable .et-scrollable-container{display:grid;grid-auto-flow:var(--_flow);overflow:auto;grid-row:1/1;grid-column:1/1}.et-scrollable .et-scrollable-masks,.et-scrollable .et-scrollable-buttons{grid-row:1/1;grid-column:1/1;pointer-events:none}.et-scrollable .et-scrollable-masks .et-scrollable-mask,.et-scrollable .et-scrollable-masks .et-scrollable-button,.et-scrollable .et-scrollable-buttons .et-scrollable-mask,.et-scrollable .et-scrollable-buttons .et-scrollable-button{position:absolute;opacity:0;transition:opacity .3s var(--ease-5)}.et-scrollable .et-scrollable-buttons .et-scrollable-button{background:transparent;border:none;padding:12px;inline-size:40px;block-size:40px;border-radius:4px;cursor:pointer}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-chevron-icon{pointer-events:none}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--start{inset-inline:0 0}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--end{inset-inline:calc(100% - 40px) 0}.et-scrollable[sticky-buttons=true] .et-scrollable-buttons{margin-block:10%}.et-scrollable[sticky-buttons=true] .et-scrollable-buttons .et-scrollable-button{position:sticky}\n"], dependencies: [{ kind: "directive", type: CursorDragScrollDirective, selector: "[etCursorDragScroll]", inputs: ["etCursorDragScroll"], exportAs: ["etCursorDragScroll"] }, { kind: "directive", type: ObserveScrollStateDirective, selector: "[etObserveScrollState]", inputs: ["observerRootMargin", "observerThreshold"], outputs: ["etObserveScrollState"], exportAs: ["etObserveScrollState"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ScrollableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: ScrollableComponent, isStandalone: true, selector: "et-scrollable", inputs: { itemSize: "itemSize", direction: "direction", scrollableRole: "scrollableRole", scrollableClass: "scrollableClass", renderMasks: "renderMasks", renderButtons: "renderButtons", renderScrollbars: "renderScrollbars", stickyButtons: "stickyButtons", cursorDragScroll: "cursorDragScroll", activeElementScrollMargin: "activeElementScrollMargin", disableActiveElementScrolling: "disableActiveElementScrolling" }, host: { properties: { "attr.item-size": "this.itemSize", "attr.direction": "this.direction", "attr.render-scrollbars": "this.renderScrollbars", "attr.sticky-buttons": "this.stickyButtons" }, classAttribute: "et-scrollable" }, queries: [{ propertyName: "activeElements", predicate: IS_ACTIVE_ELEMENT, descendants: true }], viewQueries: [{ propertyName: "scrollable", first: true, predicate: ["scrollable"], descendants: true, static: true }], ngImport: i0, template: "<div\n  #scrollable\n  [attr.role]=\"scrollableRole ?? undefined\"\n  [ngClass]=\"scrollableClass\"\n  [etCursorDragScroll]=\"cursorDragScroll\"\n  (etObserveScrollState)=\"_scrollStateChanged($event)\"\n  class=\"et-scrollable-container\"\n>\n  <ng-content />\n</div>\n\n<div *ngIf=\"renderMasks\" class=\"et-scrollable-masks\">\n  <div class=\"et-scrollable-mask et-scrollable-mask--start\"></div>\n  <div class=\"et-scrollable-mask et-scrollable-mask--end\"></div>\n</div>\n\n<div *ngIf=\"renderButtons\" class=\"et-scrollable-buttons\">\n  <button\n    (click)=\"scrollOneContainerSizeToStart()\"\n    class=\"et-scrollable-button et-scrollable-button--start\"\n    aria-hidden=\"true\"\n    type=\"button\"\n    tabindex=\"-1\"\n  >\n    <et-chevron-icon />\n  </button>\n  <button\n    (click)=\"scrollOneContainerSizeToEnd()\"\n    class=\"et-scrollable-button et-scrollable-button--end\"\n    aria-hidden=\"true\"\n    type=\"button\"\n    tabindex=\"-1\"\n  >\n    <et-chevron-icon />\n  </button>\n</div>\n", styles: [".et-scrollable{--mask: #121212 0, transparent 100%;--mask-size: 25px;--_auto-size: min-content;--_flow: column;display:grid;position:relative}.et-scrollable[item-size=same]{--auto-size: 1fr}.et-scrollable[render-scrollbars=false] .et-scrollable-container{scrollbar-width:none}.et-scrollable[render-scrollbars=false] .et-scrollable-container::-webkit-scrollbar{display:none}.et-scrollable[direction=horizontal] .et-scrollable-container{grid-auto-columns:var(--_auto-size)}.et-scrollable[direction=horizontal] .et-scrollable-mask,.et-scrollable[direction=horizontal] .et-scrollable-button{inline-size:var(--mask-size);block-size:100%}.et-scrollable[direction=horizontal] .et-scrollable-mask--start,.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:0;inset-inline:0 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--end,.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:0;inset-inline:calc(100% - 40px) 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--start{background:linear-gradient(to right,var(--mask))}.et-scrollable[direction=horizontal] .et-scrollable-mask--end{background:linear-gradient(to left,var(--mask));inset-inline:calc(100% - var(--mask-size)) 100%}.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:calc(50% - 20px);transform:rotate(-90deg)}.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:calc(50% - 20px);transform:rotate(90deg)}.et-scrollable[direction=vertical]{--_flow: row}.et-scrollable[direction=vertical] .et-scrollable-container{grid-auto-rows:var(--_auto-size)}.et-scrollable[direction=vertical] .et-scrollable-mask,.et-scrollable[direction=vertical] .et-scrollable-button{block-size:var(--mask-size);inline-size:100%}.et-scrollable[direction=vertical] .et-scrollable-mask--start,.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-block-start:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--end,.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-block-end:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--start{background:linear-gradient(to bottom,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-mask--end{background:linear-gradient(to top,var(--mask))}.et-scrollable[at-start=false] .et-scrollable-masks .et-scrollable-mask--start,.et-scrollable[at-start=false] .et-scrollable-buttons .et-scrollable-button--start{opacity:1}.et-scrollable[at-start=false] .et-scrollable-buttons .et-scrollable-button--start{pointer-events:all}.et-scrollable[at-end=false] .et-scrollable-masks .et-scrollable-mask--end,.et-scrollable[at-end=false] .et-scrollable-buttons .et-scrollable-button--end{opacity:1}.et-scrollable[at-end=false] .et-scrollable-buttons .et-scrollable-button--end{pointer-events:all}.et-scrollable .et-scrollable-container{display:grid;grid-auto-flow:var(--_flow);overflow:auto;grid-row:1/1;grid-column:1/1}.et-scrollable .et-scrollable-masks,.et-scrollable .et-scrollable-buttons{grid-row:1/1;grid-column:1/1;pointer-events:none}.et-scrollable .et-scrollable-masks .et-scrollable-mask,.et-scrollable .et-scrollable-masks .et-scrollable-button,.et-scrollable .et-scrollable-buttons .et-scrollable-mask,.et-scrollable .et-scrollable-buttons .et-scrollable-button{position:absolute;opacity:0;transition:opacity .3s var(--ease-5)}.et-scrollable .et-scrollable-buttons .et-scrollable-button{background:transparent;border:none;padding:12px;inline-size:40px;block-size:40px;border-radius:4px;cursor:pointer}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-chevron-icon{pointer-events:none}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--start{inset-inline:0 0}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--end{inset-inline:calc(100% - 40px) 0}.et-scrollable[sticky-buttons=true] .et-scrollable-buttons{margin-block:10%}.et-scrollable[sticky-buttons=true] .et-scrollable-buttons .et-scrollable-button{position:sticky}\n"], dependencies: [{ kind: "directive", type: CursorDragScrollDirective, selector: "[etCursorDragScroll]", inputs: ["etCursorDragScroll"], exportAs: ["etCursorDragScroll"] }, { kind: "directive", type: ObserveScrollStateDirective, selector: "[etObserveScrollState]", inputs: ["observerRootMargin", "observerThreshold"], outputs: ["etObserveScrollState"], exportAs: ["etObserveScrollState"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ScrollableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ScrollableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-scrollable', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CursorDragScrollDirective, ObserveScrollStateDirective, NgClass, NgIf, LetDirective, ChevronIconComponent], host: {
                         class: 'et-scrollable',
@@ -7883,10 +7866,10 @@ class SkeletonComponent {
     set animated(value) {
         this._animated = coerceBooleanProperty(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SkeletonComponent, isStandalone: true, selector: "et-skeleton", inputs: { loadingAllyText: "loadingAllyText", animated: "animated" }, host: { properties: { "class.et-skeleton--animated": "this.animated" }, classAttribute: "et-skeleton" }, ngImport: i0, template: ` <span class="cdk-visually-hidden"> {{ loadingAllyText }} </span> <ng-content />`, isInline: true, styles: [":where(.et-skeleton){--et-skeleton-gradient: linear-gradient( 90deg, rgba(190, 190, 190, 0) 15%, rgba(129, 129, 129, .5) 37%, rgba(190, 190, 190, 0) 63% );--et-skeleton-animation-duration: 3s;--et-skeleton-animation-timing-function: var(--ease-3)}.et-skeleton{display:block;cursor:progress}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SkeletonComponent, isStandalone: true, selector: "et-skeleton", inputs: { loadingAllyText: "loadingAllyText", animated: "animated" }, host: { properties: { "class.et-skeleton--animated": "this.animated" }, classAttribute: "et-skeleton" }, ngImport: i0, template: ` <span class="cdk-visually-hidden"> {{ loadingAllyText }} </span> <ng-content />`, isInline: true, styles: [":where(.et-skeleton){--et-skeleton-gradient: linear-gradient( 90deg, rgba(190, 190, 190, 0) 15%, rgba(129, 129, 129, .5) 37%, rgba(190, 190, 190, 0) 63% );--et-skeleton-animation-duration: 3s;--et-skeleton-animation-timing-function: var(--ease-3)}.et-skeleton{display:block;cursor:progress}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SkeletonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SkeletonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-skeleton', template: ` <span class="cdk-visually-hidden"> {{ loadingAllyText }} </span> <ng-content />`, standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-skeleton',
@@ -7904,10 +7887,10 @@ class SkeletonItemComponent {
     constructor() {
         this.ariaHidden = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SkeletonItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SkeletonItemComponent, isStandalone: true, selector: "et-skeleton-item", host: { properties: { "attr.aria-hidden": "this.ariaHidden" }, classAttribute: "et-skeleton-item" }, ngImport: i0, template: ``, isInline: true, styles: [".et-skeleton-item{display:block;overflow:hidden;position:relative}.et-skeleton--animated .et-skeleton-item:before{content:\"\";height:100%;left:0;position:absolute;right:0;top:0;transform:translate(-100%);z-index:1;background:var(--et-skeleton-gradient)}@media (prefers-reduced-motion: no-preference){.et-skeleton--animated .et-skeleton-item:before{animation:skeleton-loading var(--et-skeleton-animation-duration) infinite var(--et-skeleton-animation-timing-function)}}@keyframes skeleton-loading{0%{transform:translate(-100%)}to{transform:translate(100%)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SkeletonItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SkeletonItemComponent, isStandalone: true, selector: "et-skeleton-item", host: { properties: { "attr.aria-hidden": "this.ariaHidden" }, classAttribute: "et-skeleton-item" }, ngImport: i0, template: ``, isInline: true, styles: [".et-skeleton-item{display:block;overflow:hidden;position:relative}.et-skeleton--animated .et-skeleton-item:before{content:\"\";height:100%;left:0;position:absolute;right:0;top:0;transform:translate(-100%);z-index:1;background:var(--et-skeleton-gradient)}@media (prefers-reduced-motion: no-preference){.et-skeleton--animated .et-skeleton-item:before{animation:skeleton-loading var(--et-skeleton-animation-duration) infinite var(--et-skeleton-animation-timing-function)}}@keyframes skeleton-loading{0%{transform:translate(-100%)}to{transform:translate(100%)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SkeletonItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SkeletonItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-skeleton-item', template: ``, standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'et-skeleton-item',
@@ -7920,10 +7903,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
 const SkeletonImports = [SkeletonComponent, SkeletonItemComponent];
 
 class CellDirective extends CdkCell {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CellDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: CellDirective, isStandalone: true, selector: "et-cell, td[et-cell]", host: { classAttribute: "et-cell et-data-table__cell" }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CellDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: CellDirective, isStandalone: true, selector: "et-cell, td[et-cell]", host: { classAttribute: "et-cell et-data-table__cell" }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CellDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CellDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'et-cell, td[et-cell]',
@@ -7935,10 +7918,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class CellDefDirective extends CdkCellDef {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CellDefDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: CellDefDirective, isStandalone: true, selector: "[etCellDef]", providers: [{ provide: CdkCellDef, useExisting: CellDefDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CellDefDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: CellDefDirective, isStandalone: true, selector: "[etCellDef]", providers: [{ provide: CdkCellDef, useExisting: CellDefDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: CellDefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: CellDefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etCellDef]',
@@ -7962,13 +7945,13 @@ class ColumnDefDirective extends CdkColumnDef {
         super._updateColumnCssClassName();
         this._columnCssClassName?.push(`et-column-${this.cssClassFriendlyName}`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ColumnDefDirective, deps: [{ token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: ColumnDefDirective, isStandalone: true, selector: "[etColumnDef]", inputs: { name: ["etColumnDef", "name"] }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ColumnDefDirective, deps: [{ token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: ColumnDefDirective, isStandalone: true, selector: "[etColumnDef]", inputs: { name: ["etColumnDef", "name"] }, providers: [
             { provide: CdkColumnDef, useExisting: ColumnDefDirective },
             { provide: SORT_HEADER_COLUMN_DEF, useExisting: ColumnDefDirective },
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ColumnDefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ColumnDefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etColumnDef]',
@@ -7989,10 +7972,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
             }] } });
 
 class FooterCellDirective extends CdkFooterCell {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterCellDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: FooterCellDirective, isStandalone: true, selector: "et-footer-cell, td[et-footer-cell]", host: { classAttribute: "et-footer-cell et-data-table__cell" }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterCellDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: FooterCellDirective, isStandalone: true, selector: "et-footer-cell, td[et-footer-cell]", host: { classAttribute: "et-footer-cell et-data-table__cell" }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterCellDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterCellDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'et-footer-cell, td[et-footer-cell]',
@@ -8004,10 +7987,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class FooterCellDefDirective extends CdkFooterCellDef {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterCellDefDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: FooterCellDefDirective, isStandalone: true, selector: "[etFooterCellDef]", providers: [{ provide: CdkFooterCellDef, useExisting: FooterCellDefDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterCellDefDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: FooterCellDefDirective, isStandalone: true, selector: "[etFooterCellDef]", providers: [{ provide: CdkFooterCellDef, useExisting: FooterCellDefDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterCellDefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterCellDefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etFooterCellDef]',
@@ -8017,10 +8000,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class HeaderCellDirective extends CdkHeaderCell {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderCellDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: HeaderCellDirective, isStandalone: true, selector: "et-header-cell, th[et-header-cell]", host: { attributes: { "role": "columnheader" }, classAttribute: "et-header-cell et-data-table__header-cell" }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderCellDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: HeaderCellDirective, isStandalone: true, selector: "et-header-cell, th[et-header-cell]", host: { attributes: { "role": "columnheader" }, classAttribute: "et-header-cell et-data-table__header-cell" }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderCellDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderCellDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'et-header-cell, th[et-header-cell]',
@@ -8033,10 +8016,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class HeaderCellDefDirective extends CdkHeaderCellDef {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderCellDefDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: HeaderCellDefDirective, isStandalone: true, selector: "[etHeaderCellDef]", providers: [{ provide: CdkHeaderCellDef, useExisting: HeaderCellDefDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderCellDefDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: HeaderCellDefDirective, isStandalone: true, selector: "[etHeaderCellDef]", providers: [{ provide: CdkHeaderCellDef, useExisting: HeaderCellDefDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderCellDefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderCellDefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etHeaderCellDef]',
@@ -8049,8 +8032,8 @@ class TextColumnComponent extends CdkTextColumn {
     constructor(_table, _options) {
         super(_table, _options);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextColumnComponent, deps: [{ token: i1$3.CdkTable, optional: true }, { token: TEXT_COLUMN_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: TextColumnComponent, isStandalone: true, selector: "et-text-column", usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextColumnComponent, deps: [{ token: i1$3.CdkTable, optional: true }, { token: TEXT_COLUMN_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: TextColumnComponent, isStandalone: true, selector: "et-text-column", usesInheritance: true, ngImport: i0, template: `
     <ng-container etColumnDef>
       <th *etHeaderCellDef [style.text-align]="justify" et-header-cell>
         {{ headerText }}
@@ -8062,7 +8045,7 @@ class TextColumnComponent extends CdkTextColumn {
     </ng-container>
   `, isInline: true, dependencies: [{ kind: "directive", type: ColumnDefDirective, selector: "[etColumnDef]", inputs: ["etColumnDef"] }, { kind: "directive", type: HeaderCellDefDirective, selector: "[etHeaderCellDef]" }, { kind: "directive", type: HeaderCellDirective, selector: "et-header-cell, th[et-header-cell]" }, { kind: "directive", type: CellDefDirective, selector: "[etCellDef]" }, { kind: "directive", type: CellDirective, selector: "et-cell, td[et-cell]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TextColumnComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TextColumnComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-text-column',
@@ -8092,10 +8075,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                 }] }]; } });
 
 class FooterRowComponent extends CdkFooterRow {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: FooterRowComponent, isStandalone: true, selector: "et-footer-row, tr[et-footer-row]", host: { attributes: { "role": "row" }, classAttribute: "et-footer-row et-data-table__row" }, providers: [{ provide: CdkFooterRow, useExisting: FooterRowComponent }], exportAs: ["etFooterRow"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "ngmodule", type: CdkTableModule }, { kind: "directive", type: i1$3.CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: FooterRowComponent, isStandalone: true, selector: "et-footer-row, tr[et-footer-row]", host: { attributes: { "role": "row" }, classAttribute: "et-footer-row et-data-table__row" }, providers: [{ provide: CdkFooterRow, useExisting: FooterRowComponent }], exportAs: ["etFooterRow"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "ngmodule", type: CdkTableModule }, { kind: "directive", type: i1$3.CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterRowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterRowComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-footer-row, tr[et-footer-row]',
@@ -8117,10 +8100,10 @@ class FooterRowDefDirective extends CdkFooterRowDef {
     constructor(template, _differs, _table) {
         super(template, _differs, _table);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterRowDefDirective, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: FooterRowDefDirective, isStandalone: true, selector: "[etFooterRowDef]", inputs: { columns: ["etFooterRowDef", "columns"], sticky: ["etFooterRowDefSticky", "sticky"] }, providers: [{ provide: CdkFooterRowDef, useExisting: FooterRowDefDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterRowDefDirective, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: FooterRowDefDirective, isStandalone: true, selector: "[etFooterRowDef]", inputs: { columns: ["etFooterRowDef", "columns"], sticky: ["etFooterRowDefSticky", "sticky"] }, providers: [{ provide: CdkFooterRowDef, useExisting: FooterRowDefDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: FooterRowDefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: FooterRowDefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etFooterRowDef]',
@@ -8137,10 +8120,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                 }] }]; } });
 
 class HeaderRowComponent extends CdkHeaderRow {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: HeaderRowComponent, isStandalone: true, selector: "et-header-row, tr[et-header-row]", host: { attributes: { "role": "row" }, classAttribute: "et-header-row et-data-table__header-row" }, providers: [{ provide: CdkHeaderRow, useExisting: HeaderRowComponent }], exportAs: ["etHeaderRow"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "ngmodule", type: CdkTableModule }, { kind: "directive", type: i1$3.CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: HeaderRowComponent, isStandalone: true, selector: "et-header-row, tr[et-header-row]", host: { attributes: { "role": "row" }, classAttribute: "et-header-row et-data-table__header-row" }, providers: [{ provide: CdkHeaderRow, useExisting: HeaderRowComponent }], exportAs: ["etHeaderRow"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "ngmodule", type: CdkTableModule }, { kind: "directive", type: i1$3.CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderRowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderRowComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-header-row, tr[et-header-row]',
@@ -8162,10 +8145,10 @@ class HeaderRowDefDirective extends CdkHeaderRowDef {
     constructor(template, _differs, _table) {
         super(template, _differs, _table);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderRowDefDirective, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: HeaderRowDefDirective, isStandalone: true, selector: "[etHeaderRowDef]", inputs: { columns: ["etHeaderRowDef", "columns"], sticky: ["etHeaderRowDefSticky", "sticky"] }, providers: [{ provide: CdkHeaderRowDef, useExisting: HeaderRowDefDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderRowDefDirective, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: HeaderRowDefDirective, isStandalone: true, selector: "[etHeaderRowDef]", inputs: { columns: ["etHeaderRowDef", "columns"], sticky: ["etHeaderRowDefSticky", "sticky"] }, providers: [{ provide: CdkHeaderRowDef, useExisting: HeaderRowDefDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: HeaderRowDefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: HeaderRowDefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etHeaderRowDef]',
@@ -8186,10 +8169,10 @@ class NoDataRowDirective extends CdkNoDataRow {
         super(...arguments);
         this._contentClassName = 'et-no-data-row';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NoDataRowDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: NoDataRowDirective, isStandalone: true, selector: "ng-template[etNoDataRow]", providers: [{ provide: CdkNoDataRow, useExisting: NoDataRowDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NoDataRowDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: NoDataRowDirective, isStandalone: true, selector: "ng-template[etNoDataRow]", providers: [{ provide: CdkNoDataRow, useExisting: NoDataRowDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NoDataRowDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NoDataRowDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[etNoDataRow]',
@@ -8199,10 +8182,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class RecycleRowsDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RecycleRowsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: RecycleRowsDirective, isStandalone: true, selector: "et-table[recycleRows], table[et-table][recycleRows]", providers: [{ provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RecycleRowsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: RecycleRowsDirective, isStandalone: true, selector: "et-table[recycleRows], table[et-table][recycleRows]", providers: [{ provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RecycleRowsDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RecycleRowsDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'et-table[recycleRows], table[et-table][recycleRows]',
@@ -8212,10 +8195,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
         }] });
 
 class RowComponent extends CdkRow {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: RowComponent, isStandalone: true, selector: "et-row, [et-row], [et-row]", host: { attributes: { "role": "row" }, classAttribute: "et-row et-data-table__row" }, providers: [{ provide: CdkRow, useExisting: RowComponent }], exportAs: ["etRow"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "ngmodule", type: CdkTableModule }, { kind: "directive", type: i1$3.CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: RowComponent, isStandalone: true, selector: "et-row, [et-row], [et-row]", host: { attributes: { "role": "row" }, classAttribute: "et-row et-data-table__row" }, providers: [{ provide: CdkRow, useExisting: RowComponent }], exportAs: ["etRow"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "ngmodule", type: CdkTableModule }, { kind: "directive", type: i1$3.CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RowComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'et-row, [et-row], [et-row]',
@@ -8237,10 +8220,10 @@ class RowDefDirective extends CdkRowDef {
     constructor(template, _differs, _table) {
         super(template, _differs, _table);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RowDefDirective, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: RowDefDirective, isStandalone: true, selector: "[etRowDef]", inputs: { columns: ["etRowDefColumns", "columns"], when: ["etRowDefWhen", "when"] }, providers: [{ provide: CdkRowDef, useExisting: RowDefDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RowDefDirective, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: RowDefDirective, isStandalone: true, selector: "[etRowDef]", inputs: { columns: ["etRowDefColumns", "columns"], when: ["etRowDefWhen", "when"] }, providers: [{ provide: CdkRowDef, useExisting: RowDefDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: RowDefDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: RowDefDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etRowDef]',
@@ -8261,10 +8244,10 @@ class TableBusyDirective {
         this.templateRef = templateRef;
         this._contentClassName = 'et-table-busy';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableBusyDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: TableBusyDirective, isStandalone: true, selector: "ng-template[etTableBusy]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TableBusyDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: TableBusyDirective, isStandalone: true, selector: "ng-template[etTableBusy]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableBusyDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TableBusyDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[etTableBusy]',
@@ -8277,10 +8260,10 @@ class TableBusyOutletDirective {
         this.viewContainer = viewContainer;
         this.elementRef = elementRef;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableBusyOutletDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: TableBusyOutletDirective, isStandalone: true, selector: "[tableBusyOutlet]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TableBusyOutletDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: TableBusyOutletDirective, isStandalone: true, selector: "[tableBusyOutlet]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableBusyOutletDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TableBusyOutletDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[tableBusyOutlet]', standalone: true }]
         }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ElementRef }]; } });
@@ -8337,8 +8320,8 @@ class TableComponent extends CdkTable {
         this._isShowingTableBusy = shouldShow;
         this._cdr.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableComponent, deps: [{ token: i0.IterableDiffers }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: 'role', attribute: true }, { token: i1$4.Directionality, optional: true }, { token: DOCUMENT }, { token: i2$1.Platform }, { token: _VIEW_REPEATER_STRATEGY }, { token: _COALESCED_STYLE_SCHEDULER }, { token: i1$5.ViewportRuler }, { token: STICKY_POSITIONING_LISTENER, optional: true, skipSelf: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: TableComponent, isStandalone: true, selector: "et-table, table[et-table]", inputs: { busy: "busy" }, host: { properties: { "class.et-table-fixed-layout": "fixedLayout", "attr.aria-busy": "this._attrAriaBusy" }, classAttribute: "et-table et-data-table__table" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TableComponent, deps: [{ token: i0.IterableDiffers }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: 'role', attribute: true }, { token: i1$4.Directionality, optional: true }, { token: DOCUMENT }, { token: i2$1.Platform }, { token: _VIEW_REPEATER_STRATEGY }, { token: _COALESCED_STYLE_SCHEDULER }, { token: i1$5.ViewportRuler }, { token: STICKY_POSITIONING_LISTENER, optional: true, skipSelf: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: TableComponent, isStandalone: true, selector: "et-table, table[et-table]", inputs: { busy: "busy" }, host: { properties: { "class.et-table-fixed-layout": "fixedLayout", "attr.aria-busy": "this._attrAriaBusy" }, classAttribute: "et-table et-data-table__table" }, providers: [
             { provide: CdkTable, useExisting: TableComponent },
             { provide: CDK_TABLE, useExisting: TableComponent },
             { provide: _COALESCED_STYLE_SCHEDULER, useClass: _CoalescedStyleScheduler },
@@ -8356,7 +8339,7 @@ class TableComponent extends CdkTable {
     <ng-container footerRowOutlet />
   `, isInline: true, styles: [":where(.et-table){--et-table-separator-color: #4c4c4c;--et-table-separator-width: 1px;--et-table-separator-style: solid;--et-table-header-row-min-height: 56px;--et-table-row-display: flex;--et-table-row-min-height: 48px;--et-table-row-inline-padding: 24px;--et-table-cell-display: flex;--et-table-cell-inline-padding: 0;--et-table-cell-block-padding: 0}.et-table{display:block;position:relative}.et-header-row{min-height:var(--et-table-header-row-min-height)}.et-row,.et-footer-row{min-height:var(--et-table-row-min-height)}.et-row,.et-header-row,.et-footer-row{display:var(--et-table-row-display);border-width:0;border-bottom-width:var(--et-table-separator-width);border-style:var(--et-table-separator-style);border-color:var(--et-table-separator-color);align-items:center;box-sizing:border-box}.et-cell,.et-header-cell,.et-footer-cell{padding-inline:var(--et-table-cell-inline-padding);padding-block:var(--et-table-cell-block-padding)}.et-cell:first-of-type,.et-header-cell:first-of-type,.et-footer-cell:first-of-type{padding-inline-start:var(--et-table-row-inline-padding)}.et-cell:last-of-type,.et-header-cell:last-of-type,.et-footer-cell:last-of-type{padding-inline-end:var(--et-table-row-inline-padding)}.et-cell,.et-header-cell,.et-footer-cell{flex:1;display:var(--et-table-cell-display);align-items:center;overflow:hidden;word-wrap:break-word;min-height:inherit;box-sizing:border-box}.et-table-sticky{position:sticky!important}.et-table{table-layout:auto;white-space:normal}.et-table tbody,.et-table tfoot,.et-table thead,.et-cell,.et-footer-cell,.et-header-row,.et-row,.et-footer-row,.et-table .et-header-cell{background:inherit}.et-table et-header-row.et-header-row,.et-table et-row.et-row,.et-table et-footer-row.et-footer-cell{height:unset}et-header-cell.et-header-cell,et-cell.et-cell,et-footer-cell.et-footer-cell{align-self:stretch}\n"], dependencies: [{ kind: "ngmodule", type: CdkTableModule }, { kind: "directive", type: i1$3.DataRowOutlet, selector: "[rowOutlet]" }, { kind: "directive", type: i1$3.HeaderRowOutlet, selector: "[headerRowOutlet]" }, { kind: "directive", type: i1$3.FooterRowOutlet, selector: "[footerRowOutlet]" }, { kind: "directive", type: i1$3.NoDataRowOutlet, selector: "[noDataRowOutlet]" }, { kind: "directive", type: TableBusyOutletDirective, selector: "[tableBusyOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-table, table[et-table]', exportAs: 'etTable', template: `
     <ng-content select="caption" />
@@ -8698,10 +8681,10 @@ class SortDirective {
         subscriber.next();
         subscriber.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SortDirective, deps: [{ token: SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: SortDirective, isStandalone: true, selector: "[etSort]", inputs: { disabled: ["etSortDisabled", "disabled"], active: ["etSortActive", "active"], start: ["etSortStart", "start"], direction: ["etSortDirection", "direction"], disableClear: ["etSortDisableClear", "disableClear"], sortControl: "sortControl", sortByControl: "sortByControl", sortDirectionControl: "sortDirectionControl" }, outputs: { sortChange: "etSortChange" }, host: { classAttribute: "et-sort" }, exportAs: ["etSort"], usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SortDirective, deps: [{ token: SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: SortDirective, isStandalone: true, selector: "[etSort]", inputs: { disabled: ["etSortDisabled", "disabled"], active: ["etSortActive", "active"], start: ["etSortStart", "start"], direction: ["etSortDirection", "direction"], disableClear: ["etSortDisableClear", "disableClear"], sortControl: "sortControl", sortByControl: "sortByControl", sortDirectionControl: "sortDirectionControl" }, outputs: { sortChange: "etSortChange" }, host: { classAttribute: "et-sort" }, exportAs: ["etSort"], usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SortDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SortDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etSort]',
@@ -8755,10 +8738,10 @@ class SortHeaderIntl {
     constructor() {
         this.changes = new Subject();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SortHeaderIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SortHeaderIntl, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SortHeaderIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SortHeaderIntl, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SortHeaderIntl, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SortHeaderIntl, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -8928,10 +8911,10 @@ class SortHeaderComponent {
             this._changeDetectorRef.markForCheck();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SortHeaderComponent, deps: [{ token: SortHeaderIntl }, { token: i0.ChangeDetectorRef }, { token: SortDirective, optional: true }, { token: SORT_HEADER_COLUMN_DEF, optional: true }, { token: i1$2.FocusMonitor }, { token: i0.ElementRef }, { token: i1$2.AriaDescriber }, { token: SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: SortHeaderComponent, isStandalone: true, selector: "[et-sort-header]", inputs: { disabled: "disabled", id: ["et-sort-header", "id"], arrowPosition: "arrowPosition", start: "start", sortActionDescription: "sortActionDescription", disableClear: "disableClear" }, host: { listeners: { "mouseenter": "_handleMouseEnter()", "mouseleave": "_handleMouseLeave()", "click": "_handleClick()", "keydown": "_handleKeydown($event)" }, properties: { "class.et-sort-header-disabled": "this.disabled", "attr.aria-sort": "this._ariaSortAttr" }, classAttribute: "et-sort-header" }, exportAs: ["etSortHeader"], ngImport: i0, template: "<div\n  [class.et-sort-header-sorted]=\"_isSorted\"\n  [class.et-sort-header-position-before]=\"arrowPosition === 'before'\"\n  [attr.tabindex]=\"_isDisabled ? null : 0\"\n  [attr.role]=\"_isDisabled ? null : 'button'\"\n  class=\"et-sort-header-container\"\n>\n  <div class=\"et-sort-header-content\">\n    <ng-content />\n  </div>\n\n  <div *ngIf=\"_renderArrow\" class=\"et-sort-header-arrow {{ _getArrowDirectionState }} {{ _getArrowViewState }}\">\n    <et-chevron-icon />\n  </div>\n</div>\n", styles: [":where(.et-sort-header){--et-sort-header-arrow-size: 10px;--et-sort-header-gap: 8px}.et-sort-header{cursor:pointer}.et-sort-header.et-sort-header-disabled{cursor:default}.et-sort-header-container{display:flex;align-items:center;letter-spacing:normal;outline:0;gap:var(--et-sort-header-gap)}.et-sort-header-content{text-align:center;display:flex;align-items:center}.et-sort-header-position-before{flex-direction:row-reverse}.et-sort-header:hover .et-sort-header-arrow,.et-sort-header.cdk-keyboard-focused .et-sort-header-arrow{opacity:.5}.et-sort-header .et-sort-header-arrow{transition:opacity .2s var(--ease-out-5)}.et-sort-header .et-sort-header-arrow .et-chevron-icon svg{transition:transform .2s var(--ease-out-5)}.et-sort-header .et-sort-header-arrow{inline-size:var(--et-sort-header-arrow-size);opacity:0}.et-sort-header .et-sort-header-arrow.active-desc,.et-sort-header .et-sort-header-arrow.active-asc{opacity:1}.et-sort-header .et-sort-header-arrow.desc .et-chevron-icon svg,.et-sort-header .et-sort-header-arrow.asc .et-chevron-icon svg,.et-sort-header .et-sort-header-arrow.active-desc .et-chevron-icon svg{transform:rotate(180deg)}.et-sort-header .et-sort-header-arrow.active-asc .et-chevron-icon svg{transform:rotate(0)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SortHeaderComponent, deps: [{ token: SortHeaderIntl }, { token: i0.ChangeDetectorRef }, { token: SortDirective, optional: true }, { token: SORT_HEADER_COLUMN_DEF, optional: true }, { token: i1$2.FocusMonitor }, { token: i0.ElementRef }, { token: i1$2.AriaDescriber }, { token: SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: SortHeaderComponent, isStandalone: true, selector: "[et-sort-header]", inputs: { disabled: "disabled", id: ["et-sort-header", "id"], arrowPosition: "arrowPosition", start: "start", sortActionDescription: "sortActionDescription", disableClear: "disableClear" }, host: { listeners: { "mouseenter": "_handleMouseEnter()", "mouseleave": "_handleMouseLeave()", "click": "_handleClick()", "keydown": "_handleKeydown($event)" }, properties: { "class.et-sort-header-disabled": "this.disabled", "attr.aria-sort": "this._ariaSortAttr" }, classAttribute: "et-sort-header" }, exportAs: ["etSortHeader"], ngImport: i0, template: "<div\n  [class.et-sort-header-sorted]=\"_isSorted\"\n  [class.et-sort-header-position-before]=\"arrowPosition === 'before'\"\n  [attr.tabindex]=\"_isDisabled ? null : 0\"\n  [attr.role]=\"_isDisabled ? null : 'button'\"\n  class=\"et-sort-header-container\"\n>\n  <div class=\"et-sort-header-content\">\n    <ng-content />\n  </div>\n\n  <div *ngIf=\"_renderArrow\" class=\"et-sort-header-arrow {{ _getArrowDirectionState }} {{ _getArrowViewState }}\">\n    <et-chevron-icon />\n  </div>\n</div>\n", styles: [":where(.et-sort-header){--et-sort-header-arrow-size: 10px;--et-sort-header-gap: 8px}.et-sort-header{cursor:pointer}.et-sort-header.et-sort-header-disabled{cursor:default}.et-sort-header-container{display:flex;align-items:center;letter-spacing:normal;outline:0;gap:var(--et-sort-header-gap)}.et-sort-header-content{text-align:center;display:flex;align-items:center}.et-sort-header-position-before{flex-direction:row-reverse}.et-sort-header:hover .et-sort-header-arrow,.et-sort-header.cdk-keyboard-focused .et-sort-header-arrow{opacity:.5}.et-sort-header .et-sort-header-arrow{transition:opacity .2s var(--ease-out-5)}.et-sort-header .et-sort-header-arrow .et-chevron-icon svg{transition:transform .2s var(--ease-out-5)}.et-sort-header .et-sort-header-arrow{inline-size:var(--et-sort-header-arrow-size);opacity:0}.et-sort-header .et-sort-header-arrow.active-desc,.et-sort-header .et-sort-header-arrow.active-asc{opacity:1}.et-sort-header .et-sort-header-arrow.desc .et-chevron-icon svg,.et-sort-header .et-sort-header-arrow.asc .et-chevron-icon svg,.et-sort-header .et-sort-header-arrow.active-desc .et-chevron-icon svg{transform:rotate(180deg)}.et-sort-header .et-sort-header-arrow.active-asc .et-chevron-icon svg{transform:rotate(0)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: SortHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: SortHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: '[et-sort-header]', exportAs: 'etSortHeader', host: {
                         class: 'et-sort-header',
@@ -9015,10 +8998,10 @@ class InlineTabBodyHostDirective extends CdkPortalOutlet {
     constructor(componentFactoryResolver, viewContainerRef, _document) {
         super(componentFactoryResolver, viewContainerRef, _document);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabBodyHostDirective, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabBodyHostDirective, isStandalone: true, selector: "[etInlineTabBodyHost]", host: { classAttribute: "et-inline-tab-body-host" }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabBodyHostDirective, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabBodyHostDirective, isStandalone: true, selector: "[etInlineTabBodyHost]", host: { classAttribute: "et-inline-tab-body-host" }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabBodyHostDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabBodyHostDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etInlineTabBodyHost]',
@@ -9123,10 +9106,10 @@ class InlineTabBodyComponent {
         }
         return 'right-origin-center';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabBodyComponent, deps: [{ token: i0.ElementRef }, { token: i1$4.Directionality, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabBodyComponent, isStandalone: true, selector: "et-inline-tab-body", inputs: { _content: ["content", "_content"], origin: "origin", animationDuration: "animationDuration", preserveContent: "preserveContent", position: "position" }, outputs: { _onCentering: "_onCentering", _beforeCentering: "_beforeCentering", _afterLeavingCenter: "_afterLeavingCenter", _onCentered: "_onCentered" }, host: { classAttribute: "et-inline-tab-body" }, viewQueries: [{ propertyName: "_portalHost", first: true, predicate: InlineTabBodyHostDirective, descendants: true, static: true }], ngImport: i0, template: "<div\n  #content\n  [@translateTab]=\"{\n    value: _position,\n    params: { animationDuration: '0ms' }\n  }\"\n  (@translateTab.start)=\"_onTranslateTabStarted($event)\"\n  (@translateTab.done)=\"_translateTabComplete.next($event)\"\n  cdkScrollable\n>\n  <ng-template etInlineTabBodyHost />\n</div>\n", dependencies: [{ kind: "ngmodule", type: CdkScrollableModule }, { kind: "directive", type: i1$5.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: InlineTabBodyHostDirective, selector: "[etInlineTabBodyHost]" }], animations: [tabAnimations.translateTab], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabBodyComponent, deps: [{ token: i0.ElementRef }, { token: i1$4.Directionality, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabBodyComponent, isStandalone: true, selector: "et-inline-tab-body", inputs: { _content: ["content", "_content"], origin: "origin", animationDuration: "animationDuration", preserveContent: "preserveContent", position: "position" }, outputs: { _onCentering: "_onCentering", _beforeCentering: "_beforeCentering", _afterLeavingCenter: "_afterLeavingCenter", _onCentered: "_onCentered" }, host: { classAttribute: "et-inline-tab-body" }, viewQueries: [{ propertyName: "_portalHost", first: true, predicate: InlineTabBodyHostDirective, descendants: true, static: true }], ngImport: i0, template: "<div\n  #content\n  [@translateTab]=\"{\n    value: _position,\n    params: { animationDuration: '0ms' }\n  }\"\n  (@translateTab.start)=\"_onTranslateTabStarted($event)\"\n  (@translateTab.done)=\"_translateTabComplete.next($event)\"\n  cdkScrollable\n>\n  <ng-template etInlineTabBodyHost />\n</div>\n", dependencies: [{ kind: "ngmodule", type: CdkScrollableModule }, { kind: "directive", type: i1$5.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: InlineTabBodyHostDirective, selector: "[etInlineTabBodyHost]" }], animations: [tabAnimations.translateTab], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-inline-tab-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, animations: [tabAnimations.translateTab], standalone: true, imports: [CdkScrollableModule, InlineTabBodyHostDirective], host: {
                         class: 'et-inline-tab-body',
@@ -9162,10 +9145,10 @@ class InlineTabContentDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabContentDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabContentDirective, isStandalone: true, selector: "[etInlineTabContent]", host: { classAttribute: "et-inline-tab-content" }, providers: [{ provide: TAB_CONTENT, useExisting: InlineTabContentDirective }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabContentDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabContentDirective, isStandalone: true, selector: "[etInlineTabContent]", host: { classAttribute: "et-inline-tab-content" }, providers: [{ provide: TAB_CONTENT, useExisting: InlineTabContentDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabContentDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etInlineTabContent]',
@@ -9264,10 +9247,10 @@ class ActiveTabUnderlineDirective {
         }
         parentElement.appendChild(this._underlineElement);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ActiveTabUnderlineDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: ActiveTabUnderlineDirective, isStandalone: true, inputs: { fitUnderlineToContent: "fitUnderlineToContent" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ActiveTabUnderlineDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: ActiveTabUnderlineDirective, isStandalone: true, inputs: { fitUnderlineToContent: "fitUnderlineToContent" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ActiveTabUnderlineDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: ActiveTabUnderlineDirective, decorators: [{
             type: Directive,
             args: [{ standalone: true }]
         }], propDecorators: { fitUnderlineToContent: [{
@@ -9531,10 +9514,10 @@ class PaginatedTabHeaderDirective {
         this._scrollDistanceChanged = true;
         return { maxScrollDistance, distance: this._scrollDistance };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginatedTabHeaderDirective, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$5.ViewportRuler }, { token: i1$4.Directionality, optional: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: PaginatedTabHeaderDirective, inputs: { selectedIndex: "selectedIndex", itemSize: "itemSize", scrollableClass: "scrollableClass", renderMasks: "renderMasks", renderButtons: "renderButtons", renderScrollbars: "renderScrollbars" }, outputs: { selectFocusedIndex: "selectFocusedIndex", indexFocused: "indexFocused" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginatedTabHeaderDirective, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$5.ViewportRuler }, { token: i1$4.Directionality, optional: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: PaginatedTabHeaderDirective, inputs: { selectedIndex: "selectedIndex", itemSize: "itemSize", scrollableClass: "scrollableClass", renderMasks: "renderMasks", renderButtons: "renderButtons", renderScrollbars: "renderScrollbars" }, outputs: { selectFocusedIndex: "selectFocusedIndex", indexFocused: "indexFocused" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: PaginatedTabHeaderDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: PaginatedTabHeaderDirective, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$5.ViewportRuler }, { type: i1$4.Directionality, decorators: [{
                     type: Optional
@@ -9579,10 +9562,10 @@ class InlineTabLabelWrapperDirective {
     getOffsetWidth() {
         return this.elementRef.nativeElement.offsetWidth;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabLabelWrapperDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabLabelWrapperDirective, isStandalone: true, selector: "[etInlineTabLabelWrapper]", inputs: { disabled: "disabled" }, host: { properties: { "attr.aria-disabled": "this.attrAriaDisabled" }, classAttribute: "et-inline-tab-label-wrapper" }, hostDirectives: [{ directive: ActiveTabUnderlineDirective, inputs: ["fitUnderlineToContent", "fitUnderlineToContent"] }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabLabelWrapperDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabLabelWrapperDirective, isStandalone: true, selector: "[etInlineTabLabelWrapper]", inputs: { disabled: "disabled" }, host: { properties: { "attr.aria-disabled": "this.attrAriaDisabled" }, classAttribute: "et-inline-tab-label-wrapper" }, hostDirectives: [{ directive: ActiveTabUnderlineDirective, inputs: ["fitUnderlineToContent", "fitUnderlineToContent"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabLabelWrapperDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabLabelWrapperDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[etInlineTabLabelWrapper]',
@@ -9610,10 +9593,10 @@ class InlineTabHeaderComponent extends PaginatedTabHeaderDirective {
     _itemSelected(event) {
         event.preventDefault();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabHeaderComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$5.ViewportRuler }, { token: i1$4.Directionality, optional: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabHeaderComponent, isStandalone: true, selector: "et-inline-tab-header", host: { classAttribute: "et-inline-tab-header" }, queries: [{ propertyName: "_items", predicate: InlineTabLabelWrapperDirective }, { propertyName: "_inkBars", predicate: i0.forwardRef(function () { return ActiveTabUnderlineDirective; }), descendants: true }], viewQueries: [{ propertyName: "_scrollable", first: true, predicate: ScrollableComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<et-scrollable\n  [itemSize]=\"itemSize\"\n  [renderButtons]=\"renderButtons\"\n  [scrollableClass]=\"scrollableClass\"\n  [renderMasks]=\"renderMasks\"\n  [renderScrollbars]=\"renderScrollbars\"\n  (keydown)=\"_handleKeydown($event)\"\n  (contentChanged)=\"_onContentChanges()\"\n>\n  <ng-content />\n</et-scrollable>\n", dependencies: [{ kind: "component", type: ScrollableComponent, selector: "et-scrollable", inputs: ["itemSize", "direction", "scrollableRole", "scrollableClass", "renderMasks", "renderButtons", "renderScrollbars", "stickyButtons", "cursorDragScroll", "activeElementScrollMargin", "disableActiveElementScrolling"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabHeaderComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$5.ViewportRuler }, { token: i1$4.Directionality, optional: true }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabHeaderComponent, isStandalone: true, selector: "et-inline-tab-header", host: { classAttribute: "et-inline-tab-header" }, queries: [{ propertyName: "_items", predicate: InlineTabLabelWrapperDirective }, { propertyName: "_inkBars", predicate: i0.forwardRef(function () { return ActiveTabUnderlineDirective; }), descendants: true }], viewQueries: [{ propertyName: "_scrollable", first: true, predicate: ScrollableComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<et-scrollable\n  [itemSize]=\"itemSize\"\n  [renderButtons]=\"renderButtons\"\n  [scrollableClass]=\"scrollableClass\"\n  [renderMasks]=\"renderMasks\"\n  [renderScrollbars]=\"renderScrollbars\"\n  (keydown)=\"_handleKeydown($event)\"\n  (contentChanged)=\"_onContentChanges()\"\n>\n  <ng-content />\n</et-scrollable>\n", dependencies: [{ kind: "component", type: ScrollableComponent, selector: "et-scrollable", inputs: ["itemSize", "direction", "scrollableRole", "scrollableClass", "renderMasks", "renderButtons", "renderScrollbars", "stickyButtons", "cursorDragScroll", "activeElementScrollMargin", "disableActiveElementScrolling"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-inline-tab-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ScrollableComponent, NgClass, ObserveContentDirective, ScrollObserverIgnoreTargetDirective], host: {
                         class: 'et-inline-tab-header',
@@ -9638,10 +9621,10 @@ class InlineTabLabelDirective extends CdkPortal {
         super(templateRef, viewContainerRef);
         this._closestTab = _closestTab;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabLabelDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: TAB, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabLabelDirective, isStandalone: true, selector: "[et-inline-tab-label]", host: { classAttribute: "et-inline-tab-label" }, providers: [{ provide: TAB_LABEL, useExisting: InlineTabLabelDirective }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabLabelDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: TAB, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabLabelDirective, isStandalone: true, selector: "[et-inline-tab-label]", host: { classAttribute: "et-inline-tab-label" }, providers: [{ provide: TAB_LABEL, useExisting: InlineTabLabelDirective }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabLabelDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabLabelDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[et-inline-tab-label]',
@@ -9710,10 +9693,10 @@ class InlineTabComponent {
             this._templateLabel = value;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabComponent, deps: [{ token: i0.ViewContainerRef }, { token: TAB_GROUP, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabComponent, isStandalone: true, selector: "et-inline-tab", inputs: { fitUnderlineToContent: "fitUnderlineToContent", textLabel: ["label", "textLabel"], ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], labelClass: "labelClass", bodyClass: "bodyClass", disabled: "disabled" }, host: { classAttribute: "et-inline-tab" }, providers: [{ provide: TAB, useExisting: InlineTabComponent }], queries: [{ propertyName: "templateLabel", first: true, predicate: TAB_LABEL, descendants: true }, { propertyName: "_explicitContent", first: true, predicate: TAB_CONTENT, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "_implicitContent", first: true, predicate: TemplateRef, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template><ng-content /></ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabComponent, deps: [{ token: i0.ViewContainerRef }, { token: TAB_GROUP, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabComponent, isStandalone: true, selector: "et-inline-tab", inputs: { fitUnderlineToContent: "fitUnderlineToContent", textLabel: ["label", "textLabel"], ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], labelClass: "labelClass", bodyClass: "bodyClass", disabled: "disabled" }, host: { classAttribute: "et-inline-tab" }, providers: [{ provide: TAB, useExisting: InlineTabComponent }], queries: [{ propertyName: "templateLabel", first: true, predicate: TAB_LABEL, descendants: true }, { propertyName: "_explicitContent", first: true, predicate: TAB_CONTENT, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "_implicitContent", first: true, predicate: TemplateRef, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template><ng-content /></ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-inline-tab', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, providers: [{ provide: TAB, useExisting: InlineTabComponent }], standalone: true, host: {
                         class: 'et-inline-tab',
@@ -9765,10 +9748,10 @@ class NavTabsOutletComponent {
     get _attrId() {
         return this.id;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NavTabsOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: NavTabsOutletComponent, isStandalone: true, selector: "et-nav-tabs-outlet", inputs: { id: "id" }, host: { properties: { "attr.aria-labelledby": "this._attrAriaLabelledBy", "attr.role": "this._attrRole", "attr.id": "this._attrId" }, classAttribute: "et-nav-tabs-outlet" }, ngImport: i0, template: '<ng-content />', isInline: true, styles: [".et-nav-tabs{display:block}.et-nav-tabs .et-nav-tab-link{white-space:nowrap}.et-nav-tabs .et-nav-tab-link:not([aria-disabled=true]){cursor:pointer}.et-nav-tabs .et-scrollable-container{position:relative}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NavTabsOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: NavTabsOutletComponent, isStandalone: true, selector: "et-nav-tabs-outlet", inputs: { id: "id" }, host: { properties: { "attr.aria-labelledby": "this._attrAriaLabelledBy", "attr.role": "this._attrRole", "attr.id": "this._attrId" }, classAttribute: "et-nav-tabs-outlet" }, ngImport: i0, template: '<ng-content />', isInline: true, styles: [".et-nav-tabs{display:block}.et-nav-tabs .et-nav-tab-link{white-space:nowrap}.et-nav-tabs .et-nav-tab-link:not([aria-disabled=true]){cursor:pointer}.et-nav-tabs .et-scrollable-container{position:relative}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NavTabsOutletComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NavTabsOutletComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-nav-tabs-outlet', template: '<ng-content />', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, host: {
                         class: 'et-nav-tabs-outlet',
@@ -9835,10 +9818,10 @@ class NavTabsComponent extends PaginatedTabHeaderDirective {
     _getRole() {
         return this.tabOutlet ? 'tablist' : this._elementRef.nativeElement.getAttribute('role');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NavTabsComponent, deps: [{ token: i0.ElementRef }, { token: i1$4.Directionality, optional: true }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1$5.ViewportRuler }, { token: i3.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: NavTabsComponent, isStandalone: true, selector: "[et-nav-tabs]", inputs: { tabOutlet: "tabOutlet" }, host: { properties: { "attr.role": "this._attrRole" }, classAttribute: "et-nav-tabs" }, queries: [{ propertyName: "_items", predicate: i0.forwardRef(function () { return NavTabLinkComponent; }), descendants: true }, { propertyName: "_inkBars", predicate: i0.forwardRef(function () { return ActiveTabUnderlineDirective; }), descendants: true }], viewQueries: [{ propertyName: "_scrollable", first: true, predicate: ScrollableComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<et-scrollable\n  [itemSize]=\"itemSize\"\n  [renderButtons]=\"renderButtons\"\n  [scrollableClass]=\"scrollableClass\"\n  [renderMasks]=\"renderMasks\"\n  [renderScrollbars]=\"renderScrollbars\"\n  (keydown)=\"_handleKeydown($event)\"\n  (contentChanged)=\"_onContentChanges()\"\n>\n  <ng-content />\n</et-scrollable>\n", dependencies: [{ kind: "component", type: ScrollableComponent, selector: "et-scrollable", inputs: ["itemSize", "direction", "scrollableRole", "scrollableClass", "renderMasks", "renderButtons", "renderScrollbars", "stickyButtons", "cursorDragScroll", "activeElementScrollMargin", "disableActiveElementScrolling"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NavTabsComponent, deps: [{ token: i0.ElementRef }, { token: i1$4.Directionality, optional: true }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1$5.ViewportRuler }, { token: i3.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: NavTabsComponent, isStandalone: true, selector: "[et-nav-tabs]", inputs: { tabOutlet: "tabOutlet" }, host: { properties: { "attr.role": "this._attrRole" }, classAttribute: "et-nav-tabs" }, queries: [{ propertyName: "_items", predicate: i0.forwardRef(function () { return NavTabLinkComponent; }), descendants: true }, { propertyName: "_inkBars", predicate: i0.forwardRef(function () { return ActiveTabUnderlineDirective; }), descendants: true }], viewQueries: [{ propertyName: "_scrollable", first: true, predicate: ScrollableComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<et-scrollable\n  [itemSize]=\"itemSize\"\n  [renderButtons]=\"renderButtons\"\n  [scrollableClass]=\"scrollableClass\"\n  [renderMasks]=\"renderMasks\"\n  [renderScrollbars]=\"renderScrollbars\"\n  (keydown)=\"_handleKeydown($event)\"\n  (contentChanged)=\"_onContentChanges()\"\n>\n  <ng-content />\n</et-scrollable>\n", dependencies: [{ kind: "component", type: ScrollableComponent, selector: "et-scrollable", inputs: ["itemSize", "direction", "scrollableRole", "scrollableClass", "renderMasks", "renderButtons", "renderScrollbars", "stickyButtons", "cursorDragScroll", "activeElementScrollMargin", "disableActiveElementScrolling"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NavTabsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NavTabsComponent, decorators: [{
             type: Component,
             args: [{ selector: '[et-nav-tabs]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, standalone: true, imports: [ScrollableComponent, NgClass, ScrollObserverIgnoreTargetDirective], host: {
                         class: 'et-nav-tabs',
@@ -9983,14 +9966,14 @@ class NavTabLinkComponent {
     _markForCheck() {
         this._cdr.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NavTabLinkComponent, deps: [{ token: NavTabsComponent }, { token: i0.ElementRef }, { token: 'tabindex', attribute: true }, { token: i1$2.FocusMonitor }, { token: i3.Router }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i3.RouterLink, optional: true }, { token: i3.RouterLink, optional: true }, { token: i3.RouterLinkActive, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: NavTabLinkComponent, isStandalone: true, selector: "[et-nav-tab-link]", inputs: { tabIndex: "tabIndex", disabled: "disabled", id: "id" }, host: { listeners: { "focus": "_handleFocus()", "keydown": "_handleKeydown($event)" }, properties: { "attr.id": "this.id", "attr.aria-controls": "this._attrAriaControls", "attr.aria-current": "this._attrAriaCurrent", "attr.aria-disabled": "this._attrAriaDisabled", "attr.aria-selected": "this._attrAriaSelected", "attr.tabIndex": "this._attrTabIndex", "attr.role": "this._attrRole" }, classAttribute: "et-nav-tab-link" }, hostDirectives: [{ directive: ActiveTabUnderlineDirective, inputs: ["fitUnderlineToContent", "fitUnderlineToContent"] }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NavTabLinkComponent, deps: [{ token: NavTabsComponent }, { token: i0.ElementRef }, { token: 'tabindex', attribute: true }, { token: i1$2.FocusMonitor }, { token: i3.Router }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i3.RouterLink, optional: true }, { token: i3.RouterLink, optional: true }, { token: i3.RouterLinkActive, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: NavTabLinkComponent, isStandalone: true, selector: "[et-nav-tab-link]", inputs: { tabIndex: "tabIndex", disabled: "disabled", id: "id" }, host: { listeners: { "focus": "_handleFocus()", "keydown": "_handleKeydown($event)" }, properties: { "attr.id": "this.id", "attr.aria-controls": "this._attrAriaControls", "attr.aria-current": "this._attrAriaCurrent", "attr.aria-disabled": "this._attrAriaDisabled", "attr.aria-selected": "this._attrAriaSelected", "attr.tabIndex": "this._attrTabIndex", "attr.role": "this._attrRole" }, classAttribute: "et-nav-tab-link" }, hostDirectives: [{ directive: ActiveTabUnderlineDirective, inputs: ["fitUnderlineToContent", "fitUnderlineToContent"] }], ngImport: i0, template: `
     <span class="et-tab-content">
       <ng-content />
     </span>
   `, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: NavTabLinkComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: NavTabLinkComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[et-nav-tab-link]',
@@ -10252,15 +10235,15 @@ class InlineTabsComponent {
         }
         return event;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: InlineTabsComponent, isStandalone: true, selector: "et-inline-tabs", inputs: { selectedIndex: "selectedIndex", contentTabIndex: "contentTabIndex", preserveContent: "preserveContent", tabHeaderClasses: "tabHeaderClasses", itemSize: "itemSize", scrollableClass: "scrollableClass", renderMasks: "renderMasks", renderButtons: "renderButtons", renderScrollbars: "renderScrollbars" }, outputs: { selectedIndexChange: "selectedIndexChange", focusChange: "focusChange", selectedTabChange: "selectedTabChange" }, host: { classAttribute: "et-inline-tabs" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.4", type: InlineTabsComponent, isStandalone: true, selector: "et-inline-tabs", inputs: { selectedIndex: "selectedIndex", contentTabIndex: "contentTabIndex", preserveContent: "preserveContent", tabHeaderClasses: "tabHeaderClasses", itemSize: "itemSize", scrollableClass: "scrollableClass", renderMasks: "renderMasks", renderButtons: "renderButtons", renderScrollbars: "renderScrollbars" }, outputs: { selectedIndexChange: "selectedIndexChange", focusChange: "focusChange", selectedTabChange: "selectedTabChange" }, host: { classAttribute: "et-inline-tabs" }, providers: [
             {
                 provide: TAB_GROUP,
                 useExisting: InlineTabsComponent,
             },
         ], queries: [{ propertyName: "_allTabs", predicate: InlineTabComponent, descendants: true }], viewQueries: [{ propertyName: "_tabBodyWrapper", first: true, predicate: ["tabBodyWrapper"], descendants: true }, { propertyName: "_tabHeader", first: true, predicate: ["tabHeader"], descendants: true }], ngImport: i0, template: "<et-inline-tab-header\n  #tabHeader\n  [selectedIndex]=\"selectedIndex || 0\"\n  [ngClass]=\"tabHeaderClasses\"\n  [itemSize]=\"itemSize\"\n  [renderButtons]=\"renderButtons\"\n  [scrollableClass]=\"scrollableClass\"\n  [renderMasks]=\"renderMasks\"\n  [renderScrollbars]=\"renderScrollbars\"\n  (indexFocused)=\"_focusChanged($event)\"\n  (selectFocusedIndex)=\"selectedIndex = $event\"\n>\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\n  <div\n    *ngFor=\"let tab of _tabs; let i = index; trackBy: trackByTabFn\"\n    [id]=\"_getTabLabelId(i)\"\n    [attr.tabIndex]=\"_getTabIndex(tab, i)\"\n    [attr.aria-posinset]=\"i + 1\"\n    [attr.aria-setsize]=\"_tabs.length\"\n    [attr.aria-controls]=\"_getTabContentId(i)\"\n    [attr.aria-selected]=\"selectedIndex === i\"\n    [attr.aria-label]=\"tab.ariaLabel || null\"\n    [attr.aria-labelledby]=\"!tab.ariaLabel && tab.ariaLabelledby ? tab.ariaLabelledby : null\"\n    [disabled]=\"tab.disabled\"\n    [class.et-inline-tab-label--active]=\"selectedIndex === i\"\n    [class.et-inline-tab-label--is-text]=\"!!tab.textLabel\"\n    [fitUnderlineToContent]=\"tab.fitUnderlineToContent\"\n    (click)=\"_handleClick(tab, tabHeader, i)\"\n    (cdkFocusChange)=\"_tabFocusChanged($event, i)\"\n    role=\"tab\"\n    etInlineTabLabelWrapper\n    cdkMonitorElementFocus\n  >\n    <span class=\"et-tab-content\">\n      <ng-template [ngIf]=\"tab.templateLabel\" [ngIfElse]=\"tabTextLabel\">\n        <ng-template [cdkPortalOutlet]=\"tab.templateLabel\" />\n      </ng-template>\n\n      <ng-template #tabTextLabel>{{ tab.textLabel }}</ng-template>\n    </span>\n  </div>\n</et-inline-tab-header>\n\n<div #tabBodyWrapper>\n  <et-inline-tab-body\n    *ngFor=\"let tab of _tabs; let i = index; trackBy: trackByTabFn\"\n    [id]=\"_getTabContentId(i)\"\n    [attr.tabindex]=\"contentTabIndex !== null && selectedIndex === i ? contentTabIndex : null\"\n    [attr.aria-labelledby]=\"_getTabLabelId(i)\"\n    [class.cdk-visually-hidden]=\"selectedIndex !== i\"\n    [ngClass]=\"tab.bodyClass\"\n    [class.sr-only]=\"selectedIndex !== i\"\n    [content]=\"tab.content!\"\n    [position]=\"tab.position!\"\n    [origin]=\"tab.origin\"\n    [preserveContent]=\"preserveContent\"\n    role=\"tabpanel\"\n    animationDuration=\"0ms\"\n  />\n</div>\n", styles: [".et-inline-tabs{display:block}.et-inline-tabs .et-inline-tab-label--is-text{white-space:nowrap}.et-inline-tabs .et-inline-tab-label-wrapper:not([aria-disabled=true]){cursor:pointer}.et-inline-tabs .et-scrollable-container{position:relative}\n"], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InlineTabHeaderComponent, selector: "et-inline-tab-header" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: InlineTabLabelWrapperDirective, selector: "[etInlineTabLabelWrapper]", inputs: ["disabled"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$2.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: InlineTabBodyComponent, selector: "et-inline-tab-body", inputs: ["content", "origin", "animationDuration", "preserveContent", "position"], outputs: ["_onCentering", "_beforeCentering", "_afterLeavingCenter", "_onCentered"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: InlineTabsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.4", ngImport: i0, type: InlineTabsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-inline-tabs', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, providers: [
                         {
@@ -10334,5 +10317,5 @@ const TABS_CONFIG = new InjectionToken('TABS_CONFIG');
  * Generated bundle index. Do not edit.
  */
 
-export { ACCORDION_COMPONENT, ACCORDION_HINT_WRAPPER_DIRECTIVE, ACCORDION_LABEL_WRAPPER_DIRECTIVE, AccordionComponent, AccordionGroupComponent, AccordionHintDirective, AccordionHintWrapperDirective, AccordionImports, AccordionLabelDirective, AccordionLabelWrapperDirective, ActiveTabUnderlineBarManager, ActiveTabUnderlineDirective, AutosizeTextareaDirective, BOTTOM_SHEET_CONFIG, BOTTOM_SHEET_DATA, BOTTOM_SHEET_DEFAULT_CONFIG, BOTTOM_SHEET_DEFAULT_OPTIONS, BOTTOM_SHEET_MIN_SWIPE_TO_CLOSE_LENGTH, BOTTOM_SHEET_MIN_VELOCITY_TO_CLOSE, BOTTOM_SHEET_SCROLL_STRATEGY, BOTTOM_SHEET_SCROLL_STRATEGY_PROVIDER, BOTTOM_SHEET_SCROLL_STRATEGY_PROVIDER_FACTORY, BRACKET_CONFIG_TOKEN, BRACKET_DEFAULT_CONFIG, BRACKET_MATCH_ID_TOKEN, BRACKET_ROUND_ID_TOKEN, BRACKET_TOKEN, BottomSheetContainerBaseComponent, BottomSheetContainerComponent, BottomSheetDragHandleComponent, BottomSheetImports, BottomSheetRef, BottomSheetService, BottomSheetServiceBase, BottomSheetSwipeHandlerService, BottomSheetTitleDirective, Bracket, BracketComponent, BracketImports, BracketMatchComponent, BracketMatchDirective, BracketRoundDirective, BracketRoundHeaderComponent, ButtonComponent, ButtonDirective, ButtonImports, CHECKBOX_FIELD_TOKEN, CHECKBOX_GROUP_CONTROL_TOKEN, CHECKBOX_GROUP_TOKEN, CHECKBOX_TOKEN, COMBOBOX_DIR_TOKEN, COMBOBOX_TOKEN, CellDefDirective, CellDirective, CheckboxComponent, CheckboxDirective, CheckboxFieldComponent, CheckboxFieldDirective, CheckboxGroupComponent, CheckboxGroupControlDirective, CheckboxGroupDirective, CheckboxImports, ChevronIconComponent, ColumnDefDirective, ComboboxComponent, ComboboxDirective, ComboboxImports, DIALOG_CONFIG, DIALOG_DATA, DIALOG_DEFAULT_CONFIG, DIALOG_DEFAULT_OPTIONS, DIALOG_SCROLL_STRATEGY, DIALOG_SCROLL_STRATEGY_PROVIDER, DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY, DYNAMIC_FORM_FIELD_TOKEN, DYNAMIC_FORM_GROUP_TOKEN, DecoratedFormFieldBase, DecoratedInputBase, DefaultValidatorErrorsService, DialogCloseDirective, DialogContainerBaseComponent, DialogContainerComponent, DialogImports, DialogRef, DialogService, DialogServiceBase, DialogTitleDirective, DynamicFormFieldDirective, DynamicFormGroupDirective, DynamicOverlayService, EMAIL_INPUT_TOKEN, EmailInputComponent, EmailInputDirective, ErrorComponent, FooterCellDefDirective, FooterCellDirective, FooterRowComponent, FooterRowDefDirective, FormFieldStateService, FormGroupStateService, HeaderCellDefDirective, HeaderCellDirective, HeaderRowComponent, HeaderRowDefDirective, INPUT_PREFIX_TOKEN, INPUT_SUFFIX_TOKEN, INPUT_TOKEN, IconImports, IfInputEmptyDirective, IfInputFilledDirective, InlineTabBodyComponent, InlineTabBodyHostDirective, InlineTabChangeEvent, InlineTabComponent, InlineTabContentDirective, InlineTabHeaderComponent, InlineTabLabelDirective, InlineTabLabelWrapperDirective, InlineTabsComponent, InputBase, InputDirective, InputFieldComponent, InputImports, InputPrefixDirective, InputStateService, InputSuffixDirective, LABEL_TOKEN, LabelComponent, LabelImports, LabelSuffixDirective, MASONRY_ITEM_TOKEN, MAX_SAFE_INTEGER, MasonryComponent, MasonryImports, MasonryItemComponent, NATIVE_INPUT_REF_TOKEN, NATIVE_SELECT_INPUT_TOKEN, NATIVE_SELECT_OPTION_TOKEN, NUMBER_INPUT_TOKEN, NativeInputRefDirective, NativeSelectImports, NativeSelectInputComponent, NativeSelectInputDirective, NativeSelectOptionComponent, NativeSelectOptionDirective, NavTabLinkComponent, NavTabsComponent, NavTabsOutletComponent, NoDataRowDirective, NumberInputComponent, NumberInputDirective, PASSWORD_INPUT_TOKEN, PROGRESS_SPINNER_DEFAULT_OPTIONS, PROGRESS_SPINNER_DEFAULT_OPTIONS_FACTORY, PaginatedTabHeaderDirective, PaginationComponent, PaginationImports, PasswordInputComponent, PasswordInputDirective, PasswordInputToggleComponent, PictureComponent, PictureDataDirective, ProgressSpinnerComponent, QueryButtonComponent, QueryButtonDirective, RADIO_FIELD_TOKEN, RADIO_GROUP_TOKEN, RADIO_TOKEN, RadioComponent, RadioDirective, RadioFieldComponent, RadioFieldDirective, RadioGroupComponent, RadioGroupDirective, RadioImports, RecycleRowsDirective, RowComponent, RowDefDirective, RuntimeError, SEARCH_INPUT_TOKEN, SEGMENTED_BUTTON_FIELD_TOKEN, SEGMENTED_BUTTON_GROUP_TOKEN, SEGMENTED_BUTTON_TOKEN, SELECT_BODY_TOKEN, SELECT_OPTION_TOKEN, SELECT_TOKEN, SLIDE_TOGGLE_TOKEN, SORT_DEFAULT_OPTIONS, SORT_HEADER_COLUMN_DEF, SORT_HEADER_INTL_PROVIDER, SORT_HEADER_INTL_PROVIDER_FACTORY, STATIC_FORM_FIELD_TOKEN, STATIC_FORM_GROUP_TOKEN, ScrollableComponent, ScrollableImports, SearchInputClearComponent, SearchInputComponent, SearchInputDirective, SegmentedButtonComponent, SegmentedButtonDirective, SegmentedButtonFieldComponent, SegmentedButtonFieldDirective, SegmentedButtonGroupComponent, SegmentedButtonGroupDirective, SegmentedButtonImports, SelectBodyComponent, SelectBodyDirective, SelectComponent, SelectDirective, SelectFieldComponent, SelectImports, SelectOptionComponent, SelectOptionDirective, SkeletonComponent, SkeletonImports, SkeletonItemComponent, SlideToggleComponent, SlideToggleDirective, SlideToggleFieldComponent, SlideToggleImports, SliderComponent, SliderFieldComponent, SliderImports, SortDirective, SortHeaderComponent, SortHeaderIntl, SortImports, StaticFormFieldDirective, StaticFormGroupDirective, SwipeHandlerService, TAB, TABS_CONFIG, TAB_CONTENT, TAB_GROUP, TAB_LABEL, TEXTAREA_INPUT_TOKEN, TEXT_INPUT_TOKEN, TOGGLETIP, TOGGLETIP_CONFIG, TOGGLETIP_DEFAULT_CONFIG, TOGGLETIP_DIRECTIVE, TOGGLETIP_TEMPLATE, TOGGLETIP_TEXT, TOOLTIP, TOOLTIP_CONFIG, TOOLTIP_DEFAULT_CONFIG, TOOLTIP_DIRECTIVE, TOOLTIP_TEMPLATE, TOOLTIP_TEXT, TabImports, TableBusyDirective, TableBusyOutletDirective, TableComponent, TableDataSource, TableImports, TextColumnComponent, TextInputComponent, TextInputDirective, TextareaInputComponent, TextareaInputDirective, ToggletipComponent, ToggletipDirective, ToggletipImports, TooltipComponent, TooltipDirective, TooltipImports, VALIDATOR_ERROR_SERVICE_TOKEN, WRITEABLE_INPUT_TOKEN, WRITEABLE_INPUT_VALUE_ACCESSOR, WriteableInputDirective, _MAT_INK_BAR_POSITIONER, _MAT_INK_BAR_POSITIONER_FACTORY, accordionAnimations, createBottomSheetConfig, createBracketConfig, createDialogConfig, createToggletipConfig, createTooltipConfig, formatRuntimeError, getClosestBottomSheet, getClosestDialog, isUpperBracketMatch, normalizeRoundType, orderRounds, orderRoundsByRoundNumber, paginate, provideBottomSheet, provideBottomSheetDefaultConfig, provideBracketConfig, provideDialog, provideDialogDefaultConfig, provideSort, provideToggletipConfig, provideTooltipConfig, provideValidatorErrorsService, tabAnimations };
+export { ACCORDION_COMPONENT, ACCORDION_HINT_WRAPPER_DIRECTIVE, ACCORDION_LABEL_WRAPPER_DIRECTIVE, AccordionComponent, AccordionGroupComponent, AccordionHintDirective, AccordionHintWrapperDirective, AccordionImports, AccordionLabelDirective, AccordionLabelWrapperDirective, ActiveTabUnderlineBarManager, ActiveTabUnderlineDirective, AutosizeTextareaDirective, BOTTOM_SHEET_CONFIG, BOTTOM_SHEET_DATA, BOTTOM_SHEET_DEFAULT_CONFIG, BOTTOM_SHEET_DEFAULT_OPTIONS, BOTTOM_SHEET_MIN_SWIPE_TO_CLOSE_LENGTH, BOTTOM_SHEET_MIN_VELOCITY_TO_CLOSE, BOTTOM_SHEET_SCROLL_STRATEGY, BOTTOM_SHEET_SCROLL_STRATEGY_PROVIDER, BOTTOM_SHEET_SCROLL_STRATEGY_PROVIDER_FACTORY, BRACKET_CONFIG_TOKEN, BRACKET_DEFAULT_CONFIG, BRACKET_MATCH_ID_TOKEN, BRACKET_ROUND_ID_TOKEN, BRACKET_TOKEN, BottomSheetContainerBaseComponent, BottomSheetContainerComponent, BottomSheetDragHandleComponent, BottomSheetImports, BottomSheetRef, BottomSheetService, BottomSheetServiceBase, BottomSheetSwipeHandlerService, BottomSheetTitleDirective, Bracket, BracketComponent, BracketImports, BracketMatchComponent, BracketMatchDirective, BracketRoundDirective, BracketRoundHeaderComponent, ButtonComponent, ButtonDirective, ButtonImports, CHECKBOX_FIELD_TOKEN, CHECKBOX_GROUP_CONTROL_TOKEN, CHECKBOX_GROUP_TOKEN, CHECKBOX_TOKEN, COMBOBOX_DIR_TOKEN, COMBOBOX_TOKEN, CellDefDirective, CellDirective, CheckboxComponent, CheckboxDirective, CheckboxFieldComponent, CheckboxFieldDirective, CheckboxGroupComponent, CheckboxGroupControlDirective, CheckboxGroupDirective, CheckboxImports, ChevronIconComponent, ColumnDefDirective, ComboboxComponent, ComboboxDirective, ComboboxImports, DIALOG_CONFIG, DIALOG_DATA, DIALOG_DEFAULT_CONFIG, DIALOG_DEFAULT_OPTIONS, DIALOG_SCROLL_STRATEGY, DIALOG_SCROLL_STRATEGY_PROVIDER, DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY, DYNAMIC_FORM_FIELD_TOKEN, DYNAMIC_FORM_GROUP_TOKEN, DecoratedFormFieldBase, DecoratedInputBase, DefaultValidatorErrorsService, DialogCloseDirective, DialogContainerBaseComponent, DialogContainerComponent, DialogImports, DialogRef, DialogService, DialogServiceBase, DialogTitleDirective, DynamicFormFieldDirective, DynamicFormGroupDirective, DynamicOverlayService, EMAIL_INPUT_TOKEN, EmailInputComponent, EmailInputDirective, ErrorComponent, FooterCellDefDirective, FooterCellDirective, FooterRowComponent, FooterRowDefDirective, FormFieldStateService, FormGroupStateService, HeaderCellDefDirective, HeaderCellDirective, HeaderRowComponent, HeaderRowDefDirective, INPUT_PREFIX_TOKEN, INPUT_SUFFIX_TOKEN, INPUT_TOKEN, IconImports, IfInputEmptyDirective, IfInputFilledDirective, InlineTabBodyComponent, InlineTabBodyHostDirective, InlineTabChangeEvent, InlineTabComponent, InlineTabContentDirective, InlineTabHeaderComponent, InlineTabLabelDirective, InlineTabLabelWrapperDirective, InlineTabsComponent, InputBase, InputDirective, InputFieldComponent, InputImports, InputPrefixDirective, InputStateService, InputSuffixDirective, LABEL_TOKEN, LabelComponent, LabelImports, LabelSuffixDirective, MASONRY_ITEM_TOKEN, MAX_SAFE_INTEGER, MasonryComponent, MasonryImports, MasonryItemComponent, NATIVE_INPUT_REF_TOKEN, NATIVE_SELECT_INPUT_TOKEN, NATIVE_SELECT_OPTION_TOKEN, NUMBER_INPUT_TOKEN, NativeInputRefDirective, NativeSelectImports, NativeSelectInputComponent, NativeSelectInputDirective, NativeSelectOptionComponent, NativeSelectOptionDirective, NavTabLinkComponent, NavTabsComponent, NavTabsOutletComponent, NoDataRowDirective, NumberInputComponent, NumberInputDirective, PASSWORD_INPUT_TOKEN, PROGRESS_SPINNER_DEFAULT_OPTIONS, PROGRESS_SPINNER_DEFAULT_OPTIONS_FACTORY, PaginatedTabHeaderDirective, PaginationComponent, PaginationImports, PasswordInputComponent, PasswordInputDirective, PasswordInputToggleComponent, PictureComponent, PictureDataDirective, ProgressSpinnerComponent, QueryButtonComponent, QueryButtonDirective, RADIO_FIELD_TOKEN, RADIO_GROUP_TOKEN, RADIO_TOKEN, RadioComponent, RadioDirective, RadioFieldComponent, RadioFieldDirective, RadioGroupComponent, RadioGroupDirective, RadioImports, RecycleRowsDirective, RowComponent, RowDefDirective, SEARCH_INPUT_TOKEN, SEGMENTED_BUTTON_FIELD_TOKEN, SEGMENTED_BUTTON_GROUP_TOKEN, SEGMENTED_BUTTON_TOKEN, SELECT_BODY_TOKEN, SELECT_FIELD_TOKEN, SELECT_OPTION_TOKEN, SELECT_TOKEN, SLIDE_TOGGLE_TOKEN, SORT_DEFAULT_OPTIONS, SORT_HEADER_COLUMN_DEF, SORT_HEADER_INTL_PROVIDER, SORT_HEADER_INTL_PROVIDER_FACTORY, STATIC_FORM_FIELD_TOKEN, STATIC_FORM_GROUP_TOKEN, ScrollableComponent, ScrollableImports, SearchInputClearComponent, SearchInputComponent, SearchInputDirective, SegmentedButtonComponent, SegmentedButtonDirective, SegmentedButtonFieldComponent, SegmentedButtonFieldDirective, SegmentedButtonGroupComponent, SegmentedButtonGroupDirective, SegmentedButtonImports, SelectBodyComponent, SelectBodyDirective, SelectComponent, SelectDirective, SelectFieldComponent, SelectFieldDirective, SelectImports, SelectOptionComponent, SelectOptionDirective, SkeletonComponent, SkeletonImports, SkeletonItemComponent, SlideToggleComponent, SlideToggleDirective, SlideToggleFieldComponent, SlideToggleImports, SliderComponent, SliderFieldComponent, SliderImports, SortDirective, SortHeaderComponent, SortHeaderIntl, SortImports, StaticFormFieldDirective, StaticFormGroupDirective, SwipeHandlerService, TAB, TABS_CONFIG, TAB_CONTENT, TAB_GROUP, TAB_LABEL, TEXTAREA_INPUT_TOKEN, TEXT_INPUT_TOKEN, TOGGLETIP, TOGGLETIP_CONFIG, TOGGLETIP_DEFAULT_CONFIG, TOGGLETIP_DIRECTIVE, TOGGLETIP_TEMPLATE, TOGGLETIP_TEXT, TOOLTIP, TOOLTIP_CONFIG, TOOLTIP_DEFAULT_CONFIG, TOOLTIP_DIRECTIVE, TOOLTIP_TEMPLATE, TOOLTIP_TEXT, TabImports, TableBusyDirective, TableBusyOutletDirective, TableComponent, TableDataSource, TableImports, TextColumnComponent, TextInputComponent, TextInputDirective, TextareaInputComponent, TextareaInputDirective, ToggletipComponent, ToggletipDirective, ToggletipImports, TooltipComponent, TooltipDirective, TooltipImports, VALIDATOR_ERROR_SERVICE_TOKEN, WRITEABLE_INPUT_TOKEN, WRITEABLE_INPUT_VALUE_ACCESSOR, WriteableInputDirective, _MAT_INK_BAR_POSITIONER, _MAT_INK_BAR_POSITIONER_FACTORY, accordionAnimations, createBottomSheetConfig, createBracketConfig, createDialogConfig, createToggletipConfig, createTooltipConfig, getClosestBottomSheet, getClosestDialog, isUpperBracketMatch, normalizeRoundType, orderRounds, orderRoundsByRoundNumber, paginate, provideBottomSheet, provideBottomSheetDefaultConfig, provideBracketConfig, provideDialog, provideDialogDefaultConfig, provideSort, provideToggletipConfig, provideTooltipConfig, provideValidatorErrorsService, tabAnimations };
 //# sourceMappingURL=ethlete-cdk.mjs.map