@ardium-ui/ui 3.2.1 → 3.2.3

package/fesm2022/ardium-ui-ui.mjs

@@ -11,6 +11,7 @@ import { Overlay, ScrollStrategyOptions, OverlayConfig, OverlayModule } from '@a
 import { TemplatePortal, ComponentPortal } from '@angular/cdk/portal';
 import { resolvePath } from 'resolve-object-path';
 import { Subject, merge, takeUntil, startWith, BehaviorSubject } from 'rxjs';
+import Random from 'take-chance';
 import { roundToPrecision, roundToMultiple } from 'more-rounding';
 import * as Color from 'color';
 import { keyToString } from 'key-display-names';
@@ -43,10 +44,10 @@ class _DisablableComponentBase {
     get _disabledHostAttribute() {
         return this.disabled();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _DisablableComponentBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: _DisablableComponentBase, inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, _disabled: { classPropertyName: "_disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null } }, host: { properties: { "attr.readonly": "this._readonlyHostAttribute", "class.ard-readonly": "this._readonlyHostAttribute", "attr.disabled": "this._disabledHostAttribute", "class.ard-disabled": "this._disabledHostAttribute" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _DisablableComponentBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: _DisablableComponentBase, inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, _disabled: { classPropertyName: "_disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null } }, host: { properties: { "attr.readonly": "this._readonlyHostAttribute", "class.ard-readonly": "this._readonlyHostAttribute", "attr.disabled": "this._disabledHostAttribute", "class.ard-disabled": "this._disabledHostAttribute" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _DisablableComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _DisablableComponentBase, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: undefined }], propDecorators: { _disabled: [{
                 type: Input,
@@ -136,10 +137,10 @@ class _FocusableComponentBase extends _DisablableComponentBase {
         this.isFocused = false;
         this.blurEvent.emit(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _FocusableComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: _FocusableComponentBase, inputs: { _tabIndex: { classPropertyName: "_tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { focusEvent: "focus", blurEvent: "blur" }, viewQueries: [{ propertyName: "_focusableElement", predicate: ["focusableElement"], descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _FocusableComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: _FocusableComponentBase, inputs: { _tabIndex: { classPropertyName: "_tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { focusEvent: "focus", blurEvent: "blur" }, viewQueries: [{ propertyName: "_focusableElement", predicate: ["focusableElement"], descendants: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _FocusableComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _FocusableComponentBase, decorators: [{
             type: Directive
         }], propDecorators: { _focusableElement: [{
                 type: ViewChildren,
@@ -179,10 +180,10 @@ class _NgModelComponentBase extends _FocusableComponentBase {
         super.onBlur(event);
         this._onTouchedRegistered?.();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _NgModelComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: _NgModelComponentBase, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _NgModelComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: _NgModelComponentBase, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _NgModelComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _NgModelComponentBase, decorators: [{
             type: Directive
         }] });
 
@@ -614,8 +615,8 @@ class ArdiumDigitInputComponent extends _NgModelComponentBase {
                 return;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDigitInputComponent, deps: [{ token: ARD_DIGIT_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumDigitInputComponent, selector: "ard-digit-input", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, outputAsString: { classPropertyName: "outputAsString", publicName: "outputAsString", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", finishedValue: "finishedValue", focusIndexEvent: "focusIndex", blurIndexEvent: "blurIndex" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDigitInputComponent, deps: [{ token: ARD_DIGIT_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumDigitInputComponent, selector: "ard-digit-input", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, outputAsString: { classPropertyName: "outputAsString", publicName: "outputAsString", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", finishedValue: "finishedValue", focusIndexEvent: "focusIndex", blurIndexEvent: "blurIndex" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumDigitInputComponent),
@@ -623,7 +624,7 @@ class ArdiumDigitInputComponent extends _NgModelComponentBase {
             },
         ], viewQueries: [{ propertyName: "inputs", predicate: ["input"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-digit-input\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (data of configArrayData(); track $index) {\n    <div class=\"ard-digit-input__item\">\n      @if (data.type === 'input') {\n        <input\n          #input\n          #focusableElement\n          class=\"ard-digit-input__input\"\n          type=\"text\"\n          autocomplete=\"off\"\n          [readonly]=\"data.readonly\"\n          [class.ard-digit-input__input-readonly]=\"data.readonly\"\n          [class.ard-digit-input__input-empty]=\"isInputEmpty(data.index!)\"\n          (paste)=\"onPaste($event, data.index!)\"\n          (input)=\"onInput($event, data.index!)\"\n          (focus)=\"onFocusMaster($event, data.index!)\"\n          (blur)=\"onBlurMaster($event, data.index!)\"\n          (keydown)=\"onKeydown($event, data.index!)\"\n        />\n      } @else {\n        <div class=\"ard-digit-input__static\">\n          {{ data.char }}\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDigitInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDigitInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-digit-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -640,11 +641,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumDigitInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDigitInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDigitInputModule, declarations: [ArdiumDigitInputComponent], imports: [CommonModule], exports: [ArdiumDigitInputComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDigitInputModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDigitInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDigitInputModule, declarations: [ArdiumDigitInputComponent], imports: [CommonModule], exports: [ArdiumDigitInputComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDigitInputModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDigitInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDigitInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumDigitInputComponent],
@@ -657,20 +658,20 @@ class _ClearButtonComponent extends _FocusableComponentBase {
     constructor() {
         super(_focusableComponentDefaults);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ClearButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: _ClearButtonComponent, selector: "ard-clear-button", usesInheritance: true, ngImport: i0, template: "<button\n  #focusableElement\n  class=\"ard-clear-btn-wrapper\"\n  type=\"button\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-hitbox\"></div>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-clear-btn\"\n    aria-hidden=\"true\"\n  ></div>\n</button>\n", styles: [""] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ClearButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: _ClearButtonComponent, selector: "ard-clear-button", usesInheritance: true, ngImport: i0, template: "<button\n  #focusableElement\n  class=\"ard-clear-btn-wrapper\"\n  type=\"button\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-hitbox\"></div>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-clear-btn\"\n    aria-hidden=\"true\"\n  ></div>\n</button>\n", styles: [""] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ClearButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ClearButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-clear-button', template: "<button\n  #focusableElement\n  class=\"ard-clear-btn-wrapper\"\n  type=\"button\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-hitbox\"></div>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-clear-btn\"\n    aria-hidden=\"true\"\n  ></div>\n</button>\n" }]
         }], ctorParameters: () => [] });
 
 class _ClearButtonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ClearButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: _ClearButtonModule, declarations: [_ClearButtonComponent], imports: [CommonModule], exports: [_ClearButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ClearButtonModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ClearButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: _ClearButtonModule, declarations: [_ClearButtonComponent], imports: [CommonModule], exports: [_ClearButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ClearButtonModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ClearButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ClearButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [_ClearButtonComponent],
@@ -801,10 +802,10 @@ class ArdiumDropdownPanelComponent {
         const leftPadd = paddings[3] ?? rightPadd ?? topPadd;
         return new DOMRect(elRect.x + leftPadd, elRect.y + topPadd, elRect.width - leftPadd - rightPadd, elRect.height - topPadd - bottomPadd);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDropdownPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: { panelId: { classPropertyName: "panelId", publicName: "panelId", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, footerTemplate: { classPropertyName: "footerTemplate", publicName: "footerTemplate", isSignal: true, isRequired: false, transformFunction: null }, filterValue: { classPropertyName: "filterValue", publicName: "filterValue", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { scrollEvent: "scroll", scrollToEndEvent: "scrollToEnd" }, host: { properties: { "class.ard-open": "isOpen()" } }, viewQueries: [{ propertyName: "_scrollElementRef", first: true, predicate: ["scroll"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-dropdown-panel-container\"\n  [ngClass]=\"ngClasses()\"\n>\n  @if (headerTemplate()) {\n    <div class=\"ard-dropdown-header\">\n      <ng-template\n        [ngTemplateOutlet]=\"headerTemplate()\"\n        [ngTemplateOutletContext]=\"{ searchTerm: filterValue() }\"\n      >\n      </ng-template>\n    </div>\n  }\n  <div\n    #scroll\n    class=\"ard-dropdown-panel-content\"\n    [attr.id]=\"panelId()\"\n    (scroll)=\"onScroll()\"\n  >\n    <ng-content></ng-content>\n  </div>\n  @if (footerTemplate()) {\n    <div class=\"ard-dropdown-footer\">\n      <ng-template\n        [ngTemplateOutlet]=\"footerTemplate()\"\n        [ngTemplateOutletContext]=\"{ searchTerm: filterValue() }\"\n      >\n      </ng-template>\n    </div>\n  }\n</div>\n", styles: [".ard-dropdown-panel{display:none}.ard-dropdown-panel.ard-open{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.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: "18.2.13", ngImport: i0, type: ArdiumDropdownPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: { panelId: { classPropertyName: "panelId", publicName: "panelId", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, footerTemplate: { classPropertyName: "footerTemplate", publicName: "footerTemplate", isSignal: true, isRequired: false, transformFunction: null }, filterValue: { classPropertyName: "filterValue", publicName: "filterValue", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { scrollEvent: "scroll", scrollToEndEvent: "scrollToEnd" }, host: { properties: { "class.ard-open": "isOpen()" } }, viewQueries: [{ propertyName: "_scrollElementRef", first: true, predicate: ["scroll"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-dropdown-panel-container\"\n  [ngClass]=\"ngClasses()\"\n>\n  @if (headerTemplate()) {\n    <div class=\"ard-dropdown-header\">\n      <ng-template\n        [ngTemplateOutlet]=\"headerTemplate()\"\n        [ngTemplateOutletContext]=\"{ searchTerm: filterValue() }\"\n      >\n      </ng-template>\n    </div>\n  }\n  <div\n    #scroll\n    class=\"ard-dropdown-panel-content\"\n    [attr.id]=\"panelId()\"\n    (scroll)=\"onScroll()\"\n  >\n    <ng-content></ng-content>\n  </div>\n  @if (footerTemplate()) {\n    <div class=\"ard-dropdown-footer\">\n      <ng-template\n        [ngTemplateOutlet]=\"footerTemplate()\"\n        [ngTemplateOutletContext]=\"{ searchTerm: filterValue() }\"\n      >\n      </ng-template>\n    </div>\n  }\n</div>\n", styles: [".ard-dropdown-panel{display:none}.ard-dropdown-panel.ard-open{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDropdownPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDropdownPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-dropdown-panel', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.ard-open]': 'isOpen()',
@@ -812,11 +813,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumDropdownPanelModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDropdownPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDropdownPanelModule, declarations: [ArdiumDropdownPanelComponent], imports: [CommonModule], exports: [ArdiumDropdownPanelComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDropdownPanelModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDropdownPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDropdownPanelModule, declarations: [ArdiumDropdownPanelComponent], imports: [CommonModule], exports: [ArdiumDropdownPanelComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDropdownPanelModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDropdownPanelModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDropdownPanelModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumDropdownPanelComponent],
@@ -844,10 +845,10 @@ class ArdFormFieldPrefixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFormFieldPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdFormFieldPrefixTemplateDirective, selector: "ard-form-field-frame > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFormFieldPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdFormFieldPrefixTemplateDirective, selector: "ard-form-field-frame > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFormFieldPrefixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFormFieldPrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-form-field-frame > ng-template[ard-prefix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -855,10 +856,10 @@ class ArdFormFieldSuffixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFormFieldSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdFormFieldSuffixTemplateDirective, selector: "ard-form-field-frame > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFormFieldSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdFormFieldSuffixTemplateDirective, selector: "ard-form-field-frame > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFormFieldSuffixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFormFieldSuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-form-field-frame > ng-template[ard-suffix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -893,10 +894,10 @@ class ArdiumFormFieldFrameComponent extends _FocusableComponentBase {
         this.prefixTemplate = contentChild(ArdFormFieldPrefixTemplateDirective);
         this.suffixTemplate = contentChild(ArdFormFieldSuffixTemplateDirective);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFormFieldFrameComponent, deps: [{ token: ARD_FORM_FIELD_FRAME_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: { isFocused: { classPropertyName: "isFocused", publicName: "isFocused", isSignal: false, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, prefixTemplateInput: { classPropertyName: "prefixTemplateInput", publicName: "prefixTemplate", isSignal: true, isRequired: false, transformFunction: null }, suffixTemplateInput: { classPropertyName: "suffixTemplateInput", publicName: "suffixTemplate", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "prefixTemplate", first: true, predicate: ArdFormFieldPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdFormFieldSuffixTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-form-field-frame\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-form-field-overlay\"></div>\n  @if (prefixTemplateInput() ?? prefixTemplate()) {\n    <div class=\"ard-form-field-prefix-container\">\n      <ng-template [ngTemplateOutlet]=\"prefixTemplateInput() ?? prefixTemplate()?.template ?? null\"></ng-template>\n    </div>\n  }\n  <div class=\"ard-form-field-content-container\">\n    <ng-content></ng-content>\n  </div>\n  @if (suffixTemplateInput() ?? suffixTemplate()) {\n    <div class=\"ard-form-field-suffix-container\">\n      <ng-template [ngTemplateOutlet]=\"suffixTemplateInput() ?? suffixTemplate()?.template ?? null\"></ng-template>\n    </div>\n  }\n</div>\n", styles: [".ard-form-field-frame{position:relative}.ard-form-field-overlay{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.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: "18.2.13", ngImport: i0, type: ArdiumFormFieldFrameComponent, deps: [{ token: ARD_FORM_FIELD_FRAME_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: { isFocused: { classPropertyName: "isFocused", publicName: "isFocused", isSignal: false, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, prefixTemplateInput: { classPropertyName: "prefixTemplateInput", publicName: "prefixTemplate", isSignal: true, isRequired: false, transformFunction: null }, suffixTemplateInput: { classPropertyName: "suffixTemplateInput", publicName: "suffixTemplate", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "prefixTemplate", first: true, predicate: ArdFormFieldPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdFormFieldSuffixTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-form-field-frame\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-form-field-overlay\"></div>\n  @if (prefixTemplateInput() ?? prefixTemplate()) {\n    <div class=\"ard-form-field-prefix-container\">\n      <ng-template [ngTemplateOutlet]=\"prefixTemplateInput() ?? prefixTemplate()?.template ?? null\"></ng-template>\n    </div>\n  }\n  <div class=\"ard-form-field-content-container\">\n    <ng-content></ng-content>\n  </div>\n  @if (suffixTemplateInput() ?? suffixTemplate()) {\n    <div class=\"ard-form-field-suffix-container\">\n      <ng-template [ngTemplateOutlet]=\"suffixTemplateInput() ?? suffixTemplate()?.template ?? null\"></ng-template>\n    </div>\n  }\n</div>\n", styles: [".ard-form-field-frame{position:relative}.ard-form-field-overlay{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFormFieldFrameComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFormFieldFrameComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-form-field-frame', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-form-field-frame\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-form-field-overlay\"></div>\n  @if (prefixTemplateInput() ?? prefixTemplate()) {\n    <div class=\"ard-form-field-prefix-container\">\n      <ng-template [ngTemplateOutlet]=\"prefixTemplateInput() ?? prefixTemplate()?.template ?? null\"></ng-template>\n    </div>\n  }\n  <div class=\"ard-form-field-content-container\">\n    <ng-content></ng-content>\n  </div>\n  @if (suffixTemplateInput() ?? suffixTemplate()) {\n    <div class=\"ard-form-field-suffix-container\">\n      <ng-template [ngTemplateOutlet]=\"suffixTemplateInput() ?? suffixTemplate()?.template ?? null\"></ng-template>\n    </div>\n  }\n</div>\n", styles: [".ard-form-field-frame{position:relative}.ard-form-field-overlay{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -907,11 +908,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumFormFieldFrameModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFormFieldFrameModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFormFieldFrameModule, declarations: [ArdiumFormFieldFrameComponent, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective], imports: [CommonModule], exports: [ArdiumFormFieldFrameComponent, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFormFieldFrameModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFormFieldFrameModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFormFieldFrameModule, declarations: [ArdiumFormFieldFrameComponent, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective], imports: [CommonModule], exports: [ArdiumFormFieldFrameComponent, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFormFieldFrameModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFormFieldFrameModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFormFieldFrameModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumFormFieldFrameComponent, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective],
@@ -1470,10 +1471,10 @@ class _SimpleInputComponentBase extends _NgModelComponentBase {
             input.setAttribute(key, String(attributes[key]));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _SimpleInputComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.0.2", type: _SimpleInputComponentBase, inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignText: { classPropertyName: "alignText", publicName: "alignText", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", inputEvent: "input", changeEvent: "change", clearEvent: "clear" }, viewQueries: [{ propertyName: "textInputEl", first: true, predicate: ["textInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _SimpleInputComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.2.13", type: _SimpleInputComponentBase, inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignText: { classPropertyName: "alignText", publicName: "alignText", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", inputEvent: "input", changeEvent: "change", clearEvent: "clear" }, viewQueries: [{ propertyName: "textInputEl", first: true, predicate: ["textInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _SimpleInputComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _SimpleInputComponentBase, decorators: [{
             type: Directive
         }], propDecorators: { value: [{
                 type: Input
@@ -1498,10 +1499,10 @@ class ArdInputSuggestionTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputSuggestionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdInputSuggestionTemplateDirective, selector: "ard-input > ng-template[ard-suggestion-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputSuggestionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdInputSuggestionTemplateDirective, selector: "ard-input > ng-template[ard-suggestion-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputSuggestionTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputSuggestionTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-input > ng-template[ard-suggestion-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1509,10 +1510,10 @@ class ArdInputPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdInputPlaceholderTemplateDirective, selector: "ard-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdInputPlaceholderTemplateDirective, selector: "ard-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-input > ng-template[ard-placeholder-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1520,10 +1521,10 @@ class ArdInputLoadingTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputLoadingTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdInputLoadingTemplateDirective, selector: "ard-input > ng-template[ard-loading-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputLoadingTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdInputLoadingTemplateDirective, selector: "ard-input > ng-template[ard-loading-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputLoadingTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputLoadingTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-input > ng-template[ard-loading-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1531,10 +1532,10 @@ class ArdInputPrefixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdInputPrefixTemplateDirective, selector: "ard-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdInputPrefixTemplateDirective, selector: "ard-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputPrefixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputPrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-input > ng-template[ard-prefix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1542,10 +1543,10 @@ class ArdInputSuffixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdInputSuffixTemplateDirective, selector: "ard-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdInputSuffixTemplateDirective, selector: "ard-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdInputSuffixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdInputSuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-input > ng-template[ard-suffix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1762,8 +1763,8 @@ class ArdiumInputComponent extends _SimpleInputComponentBase {
         this._isMouseBeingUsed = false;
         this.suggestionStorage.highlightNextItem(-1);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumInputComponent, deps: [{ token: ARD_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumInputComponent, selector: "ard-input", inputs: { charlistFromInput: { classPropertyName: "charlistFromInput", publicName: "charlist", isSignal: true, isRequired: false, transformFunction: null }, charlistCaseInsensitive: { classPropertyName: "charlistCaseInsensitive", publicName: "charlistCaseInsensitive", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, valueFrom: { classPropertyName: "valueFrom", publicName: "suggValueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "suggLabelFrom", isSignal: true, isRequired: false, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: false, isRequired: false, transformFunction: null }, areSuggestionsLoading: { classPropertyName: "areSuggestionsLoading", publicName: "areSuggestionsLoading", isSignal: true, isRequired: false, transformFunction: null }, suggestionsLoadingText: { classPropertyName: "suggestionsLoadingText", publicName: "suggestionsLoadingText", isSignal: true, isRequired: false, transformFunction: null }, dropdownAppearance: { classPropertyName: "dropdownAppearance", publicName: "dropdownAppearance", isSignal: true, isRequired: false, transformFunction: null }, dropdownVariant: { classPropertyName: "dropdownVariant", publicName: "dropdownVariant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { acceptAutocompleteEvent: "acceptAutocomplete", acceptSuggestionEvent: "acceptSuggestion" }, host: { listeners: { "window:resize": "setOverlaySize()", "mousemove": "onMouseMove()", "keydown": "onKeyPress($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumInputComponent, deps: [{ token: ARD_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumInputComponent, selector: "ard-input", inputs: { charlistFromInput: { classPropertyName: "charlistFromInput", publicName: "charlist", isSignal: true, isRequired: false, transformFunction: null }, charlistCaseInsensitive: { classPropertyName: "charlistCaseInsensitive", publicName: "charlistCaseInsensitive", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, valueFrom: { classPropertyName: "valueFrom", publicName: "suggValueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "suggLabelFrom", isSignal: true, isRequired: false, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: false, isRequired: false, transformFunction: null }, areSuggestionsLoading: { classPropertyName: "areSuggestionsLoading", publicName: "areSuggestionsLoading", isSignal: true, isRequired: false, transformFunction: null }, suggestionsLoadingText: { classPropertyName: "suggestionsLoadingText", publicName: "suggestionsLoadingText", isSignal: true, isRequired: false, transformFunction: null }, dropdownAppearance: { classPropertyName: "dropdownAppearance", publicName: "dropdownAppearance", isSignal: true, isRequired: false, transformFunction: null }, dropdownVariant: { classPropertyName: "dropdownVariant", publicName: "dropdownVariant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { acceptAutocompleteEvent: "acceptAutocomplete", acceptSuggestionEvent: "acceptSuggestion" }, host: { listeners: { "window:resize": "setOverlaySize()", "mousemove": "onMouseMove()", "keydown": "onKeyPress($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumInputComponent),
@@ -1771,7 +1772,7 @@ class ArdiumInputComponent extends _SimpleInputComponentBase {
             },
         ], queries: [{ propertyName: "prefixTemplate", first: true, predicate: ArdInputPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdInputSuffixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "placeholderTemplate", first: true, predicate: ArdInputPlaceholderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suggestionTemplate", first: true, predicate: ArdInputSuggestionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suggestionLoadingTemplate", first: true, predicate: ArdInputLoadingTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "dropdownHost", first: true, predicate: ["suggestionsHost"], descendants: true, isSignal: true }, { propertyName: "dropdownTemplate", first: true, predicate: ["suggestionsTemplate"], descendants: true, read: TemplateRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [isFocused]=\"isFocused\"\n  [prefixTemplate]=\"prefixTemplate()?.template\"\n  [suffixTemplate]=\"suffixTemplate()?.template\"\n>\n  <div\n    class=\"ard-input\"\n    #suggestionsHost\n    [ngClass]=\"ngClasses()\"\n    [class.ard-has-value]=\"value\"\n    (click)=\"focus()\"\n  >\n    <div class=\"ard-input-container\">\n      @if (shouldDisplayAutocomplete()) {\n        <div class=\"ard-autocomplete\">{{ autocomplete() }}</div>\n      }\n      @if (shouldDisplayPlaceholder()) {\n        <ng-template #defaultPlaceholderTemplate>\n          <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n        </ng-template>\n\n        <ng-template [ngTemplateOutlet]=\"placeholderTemplate()?.template || defaultPlaceholderTemplate\"></ng-template>\n      }\n      <input\n        #textInput\n        #focusableElement\n        type=\"text\"\n        [attr.id]=\"inputId()\"\n        [attr.tabindex]=\"tabIndex()\"\n        [readonly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onInput(textInput.value)\"\n        (focus)=\"onFocus($event)\"\n        (blur)=\"onBlur($event)\"\n        (copy)=\"onCopy($event)\"\n      />\n    </div>\n\n    @if (shouldShowClearButton()) {\n      <ard-clear-button\n        [title]=\"clearButtonTitle()\"\n        (click)=\"onClearButtonClick($event)\"\n      />\n    }\n  </div>\n</ard-form-field-frame>\n\n<ng-template #suggestionsTemplate>\n  <ard-dropdown-panel\n    class=\"ard-dropdown-panel ard-input-suggestions-panel\"\n    role=\"listbox\"\n    [compact]=\"compact\"\n    aria-label=\"Suggestions\"\n    [appearance]=\"dropdownAppearanceOrDefault()\"\n    [variant]=\"dropdownVariantOrDefault()\"\n    [isOpen]=\"shouldDisplaySuggestions()\"\n    (ardClickOutside)=\"handleSuggestionClickOutside($event)\"\n    (mousemove)=\"onMouseMove()\"\n  >\n    @for (item of suggestionItems(); track item.index) {\n      <div\n        class=\"ard-option\"\n        role=\"option\"\n        [class.ard-option-selected]=\"item.selected()\"\n        [class.ard-option-highlighted]=\"item.highlighted()\"\n        [attr.aria-selected]=\"item.selected()\"\n        (click)=\"selectSuggestion(item, $event)\"\n        (mouseenter)=\"onSuggestionMouseEnter(item, $event)\"\n        (mouseleave)=\"onSuggestionMouseLeave(item, $event)\"\n      >\n        <span class=\"ard-option-label\">\n          <ng-template #defaultOptionTemplate>\n            {{ item.label() }}\n          </ng-template>\n\n          <ng-template\n            [ngTemplateOutlet]=\"suggestionTemplate()?.template || defaultOptionTemplate\"\n            [ngTemplateOutletContext]=\"getOptionContext(item)\"\n          ></ng-template>\n        </span>\n      </div>\n    }\n    @if (areSuggestionsLoading()) {\n      <ng-template #defaultLoadingPlaceholderTemplate>\n        <div class=\"ard-option ard-option-disabled\">{{ suggestionsLoadingText() }}</div>\n      </ng-template>\n\n      <ng-template [ngTemplateOutlet]=\"suggestionLoadingTemplate()?.template || defaultLoadingPlaceholderTemplate\"></ng-template>\n    }\n  </ard-dropdown-panel>\n</ng-template>\n", styles: [".ard-input-container{position:relative}.ard-placeholder{position:absolute;left:0;right:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;pointer-events:none}.ard-text-align-left input,.ard-text-align-left .ard-placeholder{text-align:left}.ard-text-align-center input,.ard-text-align-center .ard-placeholder{text-align:center}.ard-text-align-right input,.ard-text-align-right .ard-placeholder{text-align:right}.ard-autocomplete{position:absolute}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: _ClearButtonComponent, selector: "ard-clear-button" }, { kind: "component", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: ["panelId", "headerTemplate", "footerTemplate", "filterValue", "appearance", "variant", "compact", "isOpen"], outputs: ["scroll", "scrollToEnd"] }, { kind: "directive", type: i4.ClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -1797,8 +1798,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumInputModule, declarations: [ArdiumInputComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumInputModule, declarations: [ArdiumInputComponent,
             ArdInputSuggestionTemplateDirective,
             ArdInputPlaceholderTemplateDirective,
             ArdInputLoadingTemplateDirective,
@@ -1813,13 +1814,13 @@ class ArdiumInputModule {
             ArdInputLoadingTemplateDirective,
             ArdInputPrefixTemplateDirective,
             ArdInputSuffixTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumInputModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumInputModule, imports: [CommonModule,
             ArdiumFormFieldFrameModule,
             _ClearButtonModule,
             ArdiumDropdownPanelModule,
             ArdiumClickOutsideEventModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -1873,10 +1874,10 @@ class ArdPasswordInputPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdPasswordInputPlaceholderTemplateDirective, selector: "ard-password-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdPasswordInputPlaceholderTemplateDirective, selector: "ard-password-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-password-input > ng-template[ard-placeholder-tmp]',
@@ -1886,10 +1887,10 @@ class ArdPasswordInputPrefixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdPasswordInputPrefixTemplateDirective, selector: "ard-password-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdPasswordInputPrefixTemplateDirective, selector: "ard-password-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputPrefixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputPrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-password-input > ng-template[ard-prefix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1897,10 +1898,10 @@ class ArdPasswordInputSuffixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdPasswordInputSuffixTemplateDirective, selector: "ard-password-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdPasswordInputSuffixTemplateDirective, selector: "ard-password-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputSuffixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputSuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-password-input > ng-template[ard-suffix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1908,10 +1909,10 @@ class ArdPasswordInputRevealButtonTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputRevealButtonTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdPasswordInputRevealButtonTemplateDirective, selector: "ard-password-input > ng-template[ard-reveal-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputRevealButtonTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdPasswordInputRevealButtonTemplateDirective, selector: "ard-password-input > ng-template[ard-reveal-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdPasswordInputRevealButtonTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdPasswordInputRevealButtonTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-password-input > ng-template[ard-reveal-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -1938,10 +1939,10 @@ class ArdiumIconPipe {
         value = value.replace(/[ -]/g, '_');
         return value;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconPipe, name: "icon" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconPipe, name: "icon" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'icon',
@@ -1986,10 +1987,10 @@ class ArdiumIconComponent {
             console.warn(`ARD-FT9000: Using <ard-icon> without specifying the [icon] field.`);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.2", type: ArdiumIconComponent, selector: "ard-icon", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null }, weight: { classPropertyName: "weight", publicName: "weight", isSignal: true, isRequired: false, transformFunction: null }, grade: { classPropertyName: "grade", publicName: "grade", isSignal: true, isRequired: false, transformFunction: null }, opticalSize: { classPropertyName: "opticalSize", publicName: "opticalSize", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapperEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<span\n  class=\"ard-icon material-symbols-outlined\"\n  [attr.aria-hidden]=\"ariaLabel() !== undefined\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [style]=\"fontVariationSettings()\"\n>\n  {{ icon() ?? contentWrapperEl.innerText | icon }}\n</span>\n\n<div\n  #contentWrapperEl\n  class=\"ard-icon-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200\";ard-icon{font-variation-settings:\"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 48;font-size:1.5em;width:1em;height:1em;display:inline-block;-webkit-user-select:none;user-select:none;background-repeat:no-repeat;fill:currentColor;overflow:hidden;flex-shrink:0}ard-icon .ard-icon{font-variation-settings:inherit;font-size:inherit}ard-icon .ard-icon-content-wrapper{display:none}\n"], dependencies: [{ kind: "pipe", type: ArdiumIconPipe, name: "icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: ArdiumIconComponent, selector: "ard-icon", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null }, weight: { classPropertyName: "weight", publicName: "weight", isSignal: true, isRequired: false, transformFunction: null }, grade: { classPropertyName: "grade", publicName: "grade", isSignal: true, isRequired: false, transformFunction: null }, opticalSize: { classPropertyName: "opticalSize", publicName: "opticalSize", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapperEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<span\n  class=\"ard-icon material-symbols-outlined\"\n  [attr.aria-hidden]=\"ariaLabel() !== undefined\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [style]=\"fontVariationSettings()\"\n>\n  {{ icon() ?? contentWrapperEl.innerText | icon }}\n</span>\n\n<div\n  #contentWrapperEl\n  class=\"ard-icon-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200\";ard-icon{font-variation-settings:\"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 48;font-size:1.5em;width:1em;height:1em;display:inline-block;-webkit-user-select:none;user-select:none;background-repeat:no-repeat;fill:currentColor;overflow:hidden;flex-shrink:0}ard-icon .ard-icon{font-variation-settings:inherit;font-size:inherit}ard-icon .ard-icon-content-wrapper{display:none}\n"], dependencies: [{ kind: "pipe", type: ArdiumIconPipe, name: "icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-icon', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n  class=\"ard-icon material-symbols-outlined\"\n  [attr.aria-hidden]=\"ariaLabel() !== undefined\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [style]=\"fontVariationSettings()\"\n>\n  {{ icon() ?? contentWrapperEl.innerText | icon }}\n</span>\n\n<div\n  #contentWrapperEl\n  class=\"ard-icon-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200\";ard-icon{font-variation-settings:\"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 48;font-size:1.5em;width:1em;height:1em;display:inline-block;-webkit-user-select:none;user-select:none;background-repeat:no-repeat;fill:currentColor;overflow:hidden;flex-shrink:0}ard-icon .ard-icon{font-variation-settings:inherit;font-size:inherit}ard-icon .ard-icon-content-wrapper{display:none}\n"] }]
         }] });
@@ -2116,8 +2117,8 @@ class ArdiumPasswordInputComponent extends _NgModelComponentBase {
             input.setAttribute(key, String(attributes[key]));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumPasswordInputComponent, deps: [{ token: ARD_PASSWORD_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumPasswordInputComponent, selector: "ard-password-input", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, revealable: { classPropertyName: "revealable", publicName: "revealable", isSignal: true, isRequired: false, transformFunction: null }, holdToReveal: { classPropertyName: "holdToReveal", publicName: "holdToReveal", isSignal: true, isRequired: false, transformFunction: null }, autoHideTimeoutMs: { classPropertyName: "autoHideTimeoutMs", publicName: "autoHideTimeoutMs", isSignal: true, isRequired: false, transformFunction: null }, revealed: { classPropertyName: "revealed", publicName: "revealed", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { revealed: "revealedChange", value: "valueChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumPasswordInputComponent, deps: [{ token: ARD_PASSWORD_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumPasswordInputComponent, selector: "ard-password-input", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, revealable: { classPropertyName: "revealable", publicName: "revealable", isSignal: true, isRequired: false, transformFunction: null }, holdToReveal: { classPropertyName: "holdToReveal", publicName: "holdToReveal", isSignal: true, isRequired: false, transformFunction: null }, autoHideTimeoutMs: { classPropertyName: "autoHideTimeoutMs", publicName: "autoHideTimeoutMs", isSignal: true, isRequired: false, transformFunction: null }, revealed: { classPropertyName: "revealed", publicName: "revealed", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { revealed: "revealedChange", value: "valueChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumPasswordInputComponent),
@@ -2125,7 +2126,7 @@ class ArdiumPasswordInputComponent extends _NgModelComponentBase {
             },
         ], queries: [{ propertyName: "prefixTemplate", first: true, predicate: ArdPasswordInputPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdPasswordInputSuffixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "placeholderTemplate", first: true, predicate: ArdPasswordInputPlaceholderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "revealTemplate", first: true, predicate: ArdPasswordInputRevealButtonTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "textInputEl", first: true, predicate: ["textInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [isFocused]=\"isFocused\"\n  [prefixTemplate]=\"prefixTemplate()?.template\"\n  [suffixTemplate]=\"suffixTemplate()?.template\"\n>\n  <div\n    class=\"ard-password-input\"\n    [ngClass]=\"ngClasses()\"\n    [class.ard-has-value]=\"value()\"\n    (click)=\"focus()\"\n  >\n    <div class=\"ard-input-container\">\n      @if (shouldDisplayPlaceholder()) {\n        <ng-template #defaultPlaceholderTemplate>\n          <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n        </ng-template>\n\n        <ng-template [ngTemplateOutlet]=\"placeholderTemplate()?.template || defaultPlaceholderTemplate\" />\n      }\n\n      <input\n        #textInput\n        #focusableElement\n        [type]=\"!revealable() || !revealed() ? 'password' : 'text'\"\n        [attr.id]=\"inputId()\"\n        [attr.tabindex]=\"tabIndex()\"\n        [readonly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onInput(textInput.value)\"\n        (focus)=\"onFocus($event)\"\n        (blur)=\"onBlur($event)\"\n        (change)=\"onChange($event)\"\n        (copy)=\"onCopy($event)\"\n        [class.ard-revealed]=\"revealable() && revealed()\"\n      />\n    </div>\n\n    @if (revealable()) {\n      <button\n        class=\"ard-reveal-button\"\n        type=\"button\"\n        (click)=\"!holdToReveal() && toggleReveal()\"\n        (mousedown)=\"holdToReveal() && revealed.set(true)\"\n        (mouseup)=\"holdToReveal() && revealed.set(false)\"\n      >\n        <ng-template\n          #defaultRevealTemplate\n          let-revealed\n        >\n          <ard-icon [icon]=\"revealed ? 'visibility' : 'visibility_off'\"></ard-icon>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"revealTemplate()?.template || defaultRevealTemplate\"\n          [ngTemplateOutletContext]=\"revealButtonContext()\"\n        />\n      </button>\n    }\n  </div>\n</ard-form-field-frame>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumPasswordInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumPasswordInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-password-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -2140,11 +2141,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumIconModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconModule, declarations: [ArdiumIconComponent, ArdiumIconPipe], imports: [CommonModule], exports: [ArdiumIconComponent, ArdiumIconPipe] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconModule, declarations: [ArdiumIconComponent, ArdiumIconPipe], imports: [CommonModule], exports: [ArdiumIconComponent, ArdiumIconPipe] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumIconComponent, ArdiumIconPipe],
@@ -2154,8 +2155,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumPasswordInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumPasswordInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumPasswordInputModule, declarations: [ArdiumPasswordInputComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumPasswordInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumPasswordInputModule, declarations: [ArdiumPasswordInputComponent,
             ArdPasswordInputPlaceholderTemplateDirective,
             ArdPasswordInputPrefixTemplateDirective,
             ArdPasswordInputSuffixTemplateDirective,
@@ -2164,9 +2165,9 @@ class ArdiumPasswordInputModule {
             ArdPasswordInputPrefixTemplateDirective,
             ArdPasswordInputSuffixTemplateDirective,
             ArdPasswordInputRevealButtonTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumPasswordInputModule, imports: [CommonModule, ArdiumFormFieldFrameModule, ArdiumIconModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumPasswordInputModule, imports: [CommonModule, ArdiumFormFieldFrameModule, ArdiumIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumPasswordInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumPasswordInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -2212,10 +2213,10 @@ class ArdSimpleInputPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSimpleInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSimpleInputPlaceholderTemplateDirective, selector: "ard-simple-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSimpleInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSimpleInputPlaceholderTemplateDirective, selector: "ard-simple-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSimpleInputPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSimpleInputPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-simple-input > ng-template[ard-placeholder-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2223,10 +2224,10 @@ class ArdSimpleInputPrefixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSimpleInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSimpleInputPrefixTemplateDirective, selector: "ard-simple-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSimpleInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSimpleInputPrefixTemplateDirective, selector: "ard-simple-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSimpleInputPrefixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSimpleInputPrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-simple-input > ng-template[ard-prefix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2234,10 +2235,10 @@ class ArdSimpleInputSuffixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSimpleInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSimpleInputSuffixTemplateDirective, selector: "ard-simple-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSimpleInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSimpleInputSuffixTemplateDirective, selector: "ard-simple-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSimpleInputSuffixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSimpleInputSuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-simple-input > ng-template[ard-suffix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2251,8 +2252,8 @@ class ArdiumSimpleInputComponent extends _SimpleInputComponentBase {
         //! placeholder
         this.placeholderTemplate = contentChild(ArdSimpleInputPlaceholderTemplateDirective);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSimpleInputComponent, deps: [{ token: ARD_SIMPLE_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumSimpleInputComponent, selector: "ard-simple-input", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSimpleInputComponent, deps: [{ token: ARD_SIMPLE_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumSimpleInputComponent, selector: "ard-simple-input", providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumSimpleInputComponent),
@@ -2260,7 +2261,7 @@ class ArdiumSimpleInputComponent extends _SimpleInputComponentBase {
             },
         ], queries: [{ propertyName: "prefixTemplate", first: true, predicate: ArdSimpleInputPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdSimpleInputSuffixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "placeholderTemplate", first: true, predicate: ArdSimpleInputPlaceholderTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact\"\n  [isFocused]=\"isFocused\"\n  [prefixTemplate]=\"prefixTemplate()?.template\"\n  [suffixTemplate]=\"suffixTemplate()?.template\"\n>\n  <div\n    class=\"ard-simple-input\"\n    [ngClass]=\"ngClasses()\"\n    [class.ard-has-value]=\"value\"\n    (click)=\"focus()\"\n  >\n    <div class=\"ard-input-container\">\n      @if (shouldDisplayPlaceholder()) {\n        <ng-template #defaultPlaceholderTemplate>\n          <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n        </ng-template>\n\n        <ng-template [ngTemplateOutlet]=\"placeholderTemplate()?.template || defaultPlaceholderTemplate\"></ng-template>\n      }\n\n      <input\n        #textInput\n        #focusableElement\n        type=\"text\"\n        [attr.id]=\"inputId()\"\n        [attr.tabindex]=\"tabIndex()\"\n        [readonly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onInput(textInput.value)\"\n        (focus)=\"onFocusMaster($event)\"\n        (blur)=\"onBlurMaster($event)\"\n        (change)=\"onChange($event)\"\n        (copy)=\"onCopy($event)\"\n      />\n    </div>\n\n    @if (shouldShowClearButton()) {\n      <ard-clear-button\n        [title]=\"clearButtonTitle()\"\n        (click)=\"onClearButtonClick($event)\"\n      />\n    }\n  </div>\n</ard-form-field-frame>\n", styles: [".ard-input-container{position:relative}.ard-placeholder{position:absolute;left:0;right:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;pointer-events:none}.ard-text-align-left input,.ard-text-align-left .ard-placeholder{text-align:left}.ard-text-align-center input,.ard-text-align-center .ard-placeholder{text-align:center}.ard-text-align-right input,.ard-text-align-right .ard-placeholder{text-align:right}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: _ClearButtonComponent, selector: "ard-clear-button" }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSimpleInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSimpleInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-simple-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -2275,17 +2276,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumSimpleInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSimpleInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSimpleInputModule, declarations: [ArdiumSimpleInputComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSimpleInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSimpleInputModule, declarations: [ArdiumSimpleInputComponent,
             ArdSimpleInputPlaceholderTemplateDirective,
             ArdSimpleInputPrefixTemplateDirective,
             ArdSimpleInputSuffixTemplateDirective], imports: [CommonModule, _ClearButtonModule, ArdiumFormFieldFrameModule], exports: [ArdiumSimpleInputComponent,
             ArdSimpleInputPlaceholderTemplateDirective,
             ArdSimpleInputPrefixTemplateDirective,
             ArdSimpleInputSuffixTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSimpleInputModule, imports: [CommonModule, _ClearButtonModule, ArdiumFormFieldFrameModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSimpleInputModule, imports: [CommonModule, _ClearButtonModule, ArdiumFormFieldFrameModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSimpleInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSimpleInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -2342,10 +2343,10 @@ class ArdiumOptionComponent {
     ngOnDestroy() {
         this.stateChange$.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumOptionComponent, selector: "ard-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumOptionComponent, selector: "ard-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumOptionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ard-option',
@@ -2356,11 +2357,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumOptionModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumOptionModule, declarations: [ArdiumOptionComponent], imports: [CommonModule], exports: [ArdiumOptionComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumOptionModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumOptionModule, declarations: [ArdiumOptionComponent], imports: [CommonModule], exports: [ArdiumOptionComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumOptionModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumOptionModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumOptionModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumOptionComponent],
@@ -2935,10 +2936,10 @@ class ArdSelectPrefixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSelectPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSelectPrefixTemplateDirective, selector: "ard-select > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSelectPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSelectPrefixTemplateDirective, selector: "ard-select > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSelectPrefixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSelectPrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-prefix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2946,10 +2947,10 @@ class ArdSelectSuffixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSelectSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSelectSuffixTemplateDirective, selector: "ard-select > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSelectSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSelectSuffixTemplateDirective, selector: "ard-select > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSelectSuffixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSelectSuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-suffix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2957,10 +2958,10 @@ class ArdValueTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdValueTemplateDirective, selector: "ard-select > ng-template[ard-value-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdValueTemplateDirective, selector: "ard-select > ng-template[ard-value-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdValueTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdValueTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-value-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2968,10 +2969,10 @@ class ArdValueChipTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdValueChipTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdValueChipTemplateDirective, selector: "ard-select > ng-template[ard-value-chip-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdValueChipTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdValueChipTemplateDirective, selector: "ard-select > ng-template[ard-value-chip-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdValueChipTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdValueChipTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-value-chip-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2979,10 +2980,10 @@ class ArdOptionTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdOptionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdOptionTemplateDirective, selector: "ard-select > ng-template[ard-option-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdOptionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdOptionTemplateDirective, selector: "ard-select > ng-template[ard-option-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdOptionTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdOptionTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-option-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -2990,10 +2991,10 @@ class ArdOptgroupTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdOptgroupTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdOptgroupTemplateDirective, selector: "ard-select > ng-template[ard-optgroup-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdOptgroupTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdOptgroupTemplateDirective, selector: "ard-select > ng-template[ard-optgroup-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdOptgroupTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdOptgroupTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-optgroup-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3001,10 +3002,10 @@ class ArdSelectPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSelectPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSelectPlaceholderTemplateDirective, selector: "ard-select > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSelectPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSelectPlaceholderTemplateDirective, selector: "ard-select > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSelectPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSelectPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-placeholder-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3012,10 +3013,10 @@ class ArdLoadingSpinnerTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdLoadingSpinnerTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdLoadingSpinnerTemplateDirective, selector: "ard-select > ng-template[ard-loading-spinner-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdLoadingSpinnerTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdLoadingSpinnerTemplateDirective, selector: "ard-select > ng-template[ard-loading-spinner-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdLoadingSpinnerTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdLoadingSpinnerTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-loading-spinner-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3023,10 +3024,10 @@ class ArdLoadingPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdLoadingPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdLoadingPlaceholderTemplateDirective, selector: "ard-select > ng-template[ard-loading-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdLoadingPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdLoadingPlaceholderTemplateDirective, selector: "ard-select > ng-template[ard-loading-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdLoadingPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdLoadingPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-select > ng-template[ard-loading-placeholder-tmp]',
@@ -3036,10 +3037,10 @@ class ArdDropdownHeaderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdDropdownHeaderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdDropdownHeaderTemplateDirective, selector: "ard-select > ng-template[ard-dropdown-header-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdDropdownHeaderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdDropdownHeaderTemplateDirective, selector: "ard-select > ng-template[ard-dropdown-header-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdDropdownHeaderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdDropdownHeaderTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-dropdown-header-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3047,10 +3048,10 @@ class ArdDropdownFooterTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdDropdownFooterTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdDropdownFooterTemplateDirective, selector: "ard-select > ng-template[ard-dropdown-footer-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdDropdownFooterTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdDropdownFooterTemplateDirective, selector: "ard-select > ng-template[ard-dropdown-footer-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdDropdownFooterTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdDropdownFooterTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-dropdown-footer-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3058,10 +3059,10 @@ class ArdNoItemsFoundTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdNoItemsFoundTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdNoItemsFoundTemplateDirective, selector: "ard-select > ng-template[ard-no-items-found-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdNoItemsFoundTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdNoItemsFoundTemplateDirective, selector: "ard-select > ng-template[ard-no-items-found-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdNoItemsFoundTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdNoItemsFoundTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-no-items-found-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3069,10 +3070,10 @@ class ArdAddCustomTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdAddCustomTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdAddCustomTemplateDirective, selector: "ard-select > ng-template[ard-add-custom-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdAddCustomTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdAddCustomTemplateDirective, selector: "ard-select > ng-template[ard-add-custom-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdAddCustomTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdAddCustomTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-add-custom-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3080,10 +3081,10 @@ class ArdItemLimitReachedTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdItemLimitReachedTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdItemLimitReachedTemplateDirective, selector: "ard-select > ng-template[ard-item-limit-reached-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdItemLimitReachedTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdItemLimitReachedTemplateDirective, selector: "ard-select > ng-template[ard-item-limit-reached-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdItemLimitReachedTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdItemLimitReachedTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-item-limit-reached-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3091,10 +3092,10 @@ class ArdItemDisplayLimitTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdItemDisplayLimitTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdItemDisplayLimitTemplateDirective, selector: "ard-select > ng-template[ard-item-display-limit-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdItemDisplayLimitTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdItemDisplayLimitTemplateDirective, selector: "ard-select > ng-template[ard-item-display-limit-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdItemDisplayLimitTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdItemDisplayLimitTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-select > ng-template[ard-item-display-limit-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -3193,8 +3194,8 @@ class ArdiumDeletableChipComponent extends _FocusableComponentBase {
         //! events
         this.deleteEvent = output({ alias: 'delete' });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDeletableChipComponent, deps: [{ token: ARD_DELETABLE_CHIP_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumDeletableChipComponent, selector: "ard-deletable-chip", inputs: { deleteButtonTitle: { classPropertyName: "deleteButtonTitle", publicName: "deleteButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, contentAlignment: { classPropertyName: "contentAlignment", publicName: "contentAlignment", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { deleteEvent: "delete" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDeletableChipComponent, deps: [{ token: ARD_DELETABLE_CHIP_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumDeletableChipComponent, selector: "ard-deletable-chip", inputs: { deleteButtonTitle: { classPropertyName: "deleteButtonTitle", publicName: "deleteButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, contentAlignment: { classPropertyName: "contentAlignment", publicName: "contentAlignment", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { deleteEvent: "delete" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumDeletableChipComponent),
@@ -3202,7 +3203,7 @@ class ArdiumDeletableChipComponent extends _FocusableComponentBase {
             },
         ], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-chip-wrapper ard-chip-deletable\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <ard-clear-button\n    [title]=\"deleteButtonTitle()\"\n    (click)=\"deleteEvent.emit($event)\"\n    [tabIndex]=\"tabIndex()\"\n  ></ard-clear-button>\n  <div class=\"ard-chip-content-wrapper\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".ard-chip-wrapper{display:flex;width:max-content}.ard-chip-left{flex-direction:row}.ard-chip-right{flex-direction:row-reverse}.ard-chip-selectable .ard-chip-selection-icon{display:none}.ard-chip-selectable.ard-chip-selected .ard-chip-selection-icon{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: _ClearButtonComponent, selector: "ard-clear-button" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDeletableChipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDeletableChipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-deletable-chip', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -3251,7 +3252,7 @@ class ArdiumSelectComponent extends _NgModelComponentBase {
         this.inputAttrs = input(this._DEFAULTS.inputAttrs);
         //! other inputs
         this.isLoading = input(this._DEFAULTS.isLoading, { transform: v => coerceBooleanProperty(v) });
-        this.htmlId = input(crypto.randomUUID());
+        this.htmlId = input(Random.id());
         //! boolean settings
         this.itemsAlreadyGrouped = input(this._DEFAULTS.itemsAlreadyGrouped, {
             transform: v => coerceBooleanProperty(v),
@@ -3971,8 +3972,8 @@ class ArdiumSelectComponent extends _NgModelComponentBase {
     _onCtrlAPress() {
         this.itemStorage.highlightAllItems();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectComponent, deps: [{ token: ARD_SELECT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumSelectComponent, selector: "ard-select", inputs: { valueFrom: { classPropertyName: "valueFrom", publicName: "valueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "labelFrom", isSignal: true, isRequired: false, transformFunction: null }, disabledFrom: { classPropertyName: "disabledFrom", publicName: "disabledFrom", isSignal: true, isRequired: false, transformFunction: null }, groupLabelFrom: { classPropertyName: "groupLabelFrom", publicName: "groupLabelFrom", isSignal: true, isRequired: false, transformFunction: null }, groupDisabledFrom: { classPropertyName: "groupDisabledFrom", publicName: "groupDisabledFrom", isSignal: true, isRequired: false, transformFunction: null }, childrenFrom: { classPropertyName: "childrenFrom", publicName: "childrenFrom", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, dropdownPosition: { classPropertyName: "dropdownPosition", publicName: "dropdownPosition", isSignal: true, isRequired: false, transformFunction: null }, noItemsFoundText: { classPropertyName: "noItemsFoundText", publicName: "noItemsFoundText", isSignal: true, isRequired: false, transformFunction: null }, loadingPlaceholderText: { classPropertyName: "loadingPlaceholderText", publicName: "loadingPlaceholderText", isSignal: true, isRequired: false, transformFunction: null }, searchInputId: { classPropertyName: "searchInputId", publicName: "searchInputId", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, itemsAlreadyGrouped: { classPropertyName: "itemsAlreadyGrouped", publicName: "itemsAlreadyGrouped", isSignal: true, isRequired: false, transformFunction: null }, invertDisabled: { classPropertyName: "invertDisabled", publicName: "invertDisabled", isSignal: true, isRequired: false, transformFunction: null }, noGroupActions: { classPropertyName: "noGroupActions", publicName: "noGroupActions", isSignal: true, isRequired: false, transformFunction: null }, autoHighlightFirst: { classPropertyName: "autoHighlightFirst", publicName: "autoHighlightFirst", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, keepOpen: { classPropertyName: "keepOpen", publicName: "keepOpen", isSignal: true, isRequired: false, transformFunction: null }, hideSelected: { classPropertyName: "hideSelected", publicName: "hideSelected", isSignal: true, isRequired: false, transformFunction: null }, noBackspaceClear: { classPropertyName: "noBackspaceClear", publicName: "noBackspaceClear", isSignal: true, isRequired: false, transformFunction: null }, sortMultipleValues: { classPropertyName: "sortMultipleValues", publicName: "sortMultipleValues", isSignal: true, isRequired: false, transformFunction: null }, searchCaseSensitive: { classPropertyName: "searchCaseSensitive", publicName: "searchCaseSensitive", isSignal: true, isRequired: false, transformFunction: null }, keepSearchAfterSelect: { classPropertyName: "keepSearchAfterSelect", publicName: "keepSearchAfterSelect", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, itemDisplayLimit: { classPropertyName: "itemDisplayLimit", publicName: "itemDisplayLimit", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, dropdownAppearance: { classPropertyName: "dropdownAppearance", publicName: "dropdownAppearance", isSignal: true, isRequired: false, transformFunction: null }, dropdownVariant: { classPropertyName: "dropdownVariant", publicName: "dropdownVariant", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, multiselectable: { classPropertyName: "multiselectable", publicName: "multiselectable", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, addCustom: { classPropertyName: "addCustom", publicName: "addCustom", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", addEvent: "add", failedToAddEvent: "failedToAdd", removeEvent: "remove", clearEvent: "clear", openEvent: "open", closeEvent: "close", scrollEvent: "scroll", scrollToEndEvent: "scrollToEnd", searchEvent: "search", isOpen: "isOpenChange" }, host: { listeners: { "window:resize": "onWindowResize()", "mouseup": "onMouseup()", "keydown": "onKeyPress($event)" }, properties: { "class.ard-group-items": "this._groupItemsHostAttribute" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectComponent, deps: [{ token: ARD_SELECT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumSelectComponent, selector: "ard-select", inputs: { valueFrom: { classPropertyName: "valueFrom", publicName: "valueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "labelFrom", isSignal: true, isRequired: false, transformFunction: null }, disabledFrom: { classPropertyName: "disabledFrom", publicName: "disabledFrom", isSignal: true, isRequired: false, transformFunction: null }, groupLabelFrom: { classPropertyName: "groupLabelFrom", publicName: "groupLabelFrom", isSignal: true, isRequired: false, transformFunction: null }, groupDisabledFrom: { classPropertyName: "groupDisabledFrom", publicName: "groupDisabledFrom", isSignal: true, isRequired: false, transformFunction: null }, childrenFrom: { classPropertyName: "childrenFrom", publicName: "childrenFrom", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, dropdownPosition: { classPropertyName: "dropdownPosition", publicName: "dropdownPosition", isSignal: true, isRequired: false, transformFunction: null }, noItemsFoundText: { classPropertyName: "noItemsFoundText", publicName: "noItemsFoundText", isSignal: true, isRequired: false, transformFunction: null }, loadingPlaceholderText: { classPropertyName: "loadingPlaceholderText", publicName: "loadingPlaceholderText", isSignal: true, isRequired: false, transformFunction: null }, searchInputId: { classPropertyName: "searchInputId", publicName: "searchInputId", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, itemsAlreadyGrouped: { classPropertyName: "itemsAlreadyGrouped", publicName: "itemsAlreadyGrouped", isSignal: true, isRequired: false, transformFunction: null }, invertDisabled: { classPropertyName: "invertDisabled", publicName: "invertDisabled", isSignal: true, isRequired: false, transformFunction: null }, noGroupActions: { classPropertyName: "noGroupActions", publicName: "noGroupActions", isSignal: true, isRequired: false, transformFunction: null }, autoHighlightFirst: { classPropertyName: "autoHighlightFirst", publicName: "autoHighlightFirst", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, keepOpen: { classPropertyName: "keepOpen", publicName: "keepOpen", isSignal: true, isRequired: false, transformFunction: null }, hideSelected: { classPropertyName: "hideSelected", publicName: "hideSelected", isSignal: true, isRequired: false, transformFunction: null }, noBackspaceClear: { classPropertyName: "noBackspaceClear", publicName: "noBackspaceClear", isSignal: true, isRequired: false, transformFunction: null }, sortMultipleValues: { classPropertyName: "sortMultipleValues", publicName: "sortMultipleValues", isSignal: true, isRequired: false, transformFunction: null }, searchCaseSensitive: { classPropertyName: "searchCaseSensitive", publicName: "searchCaseSensitive", isSignal: true, isRequired: false, transformFunction: null }, keepSearchAfterSelect: { classPropertyName: "keepSearchAfterSelect", publicName: "keepSearchAfterSelect", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, itemDisplayLimit: { classPropertyName: "itemDisplayLimit", publicName: "itemDisplayLimit", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, dropdownAppearance: { classPropertyName: "dropdownAppearance", publicName: "dropdownAppearance", isSignal: true, isRequired: false, transformFunction: null }, dropdownVariant: { classPropertyName: "dropdownVariant", publicName: "dropdownVariant", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, multiselectable: { classPropertyName: "multiselectable", publicName: "multiselectable", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, addCustom: { classPropertyName: "addCustom", publicName: "addCustom", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", addEvent: "add", failedToAddEvent: "failedToAdd", removeEvent: "remove", clearEvent: "clear", openEvent: "open", closeEvent: "close", scrollEvent: "scroll", scrollToEndEvent: "scrollToEnd", searchEvent: "search", isOpen: "isOpenChange" }, host: { listeners: { "window:resize": "onWindowResize()", "mouseup": "onMouseup()", "keydown": "onKeyPress($event)" }, properties: { "class.ard-group-items": "this._groupItemsHostAttribute" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumSelectComponent),
@@ -3980,7 +3981,7 @@ class ArdiumSelectComponent extends _NgModelComponentBase {
             },
         ], queries: [{ propertyName: "optionTemplate", first: true, predicate: ArdOptionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "optgroupTemplate", first: true, predicate: ArdOptgroupTemplateDirective, descendants: true, isSignal: true }, { propertyName: "valueTemplate", first: true, predicate: ArdValueTemplateDirective, descendants: true, isSignal: true }, { propertyName: "placeholderTemplate", first: true, predicate: ArdSelectPlaceholderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "loadingSpinnerTemplate", first: true, predicate: ArdLoadingSpinnerTemplateDirective, descendants: true, isSignal: true }, { propertyName: "loadingPlaceholderTemplate", first: true, predicate: ArdLoadingPlaceholderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "dropdownHeaderTemplate", first: true, predicate: ArdDropdownHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "dropdownFooterTemplate", first: true, predicate: ArdDropdownFooterTemplateDirective, descendants: true, isSignal: true }, { propertyName: "noItemsFoundTemplate", first: true, predicate: ArdNoItemsFoundTemplateDirective, descendants: true, isSignal: true }, { propertyName: "addCustomTemplate", first: true, predicate: ArdAddCustomTemplateDirective, descendants: true, isSignal: true }, { propertyName: "itemLimitReachedTemplate", first: true, predicate: ArdItemLimitReachedTemplateDirective, descendants: true, isSignal: true }, { propertyName: "itemDisplayLimitTemplate", first: true, predicate: ArdItemDisplayLimitTemplateDirective, descendants: true, isSignal: true }, { propertyName: "prefixTemplate", first: true, predicate: ArdSelectPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdSelectSuffixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "optionComponents", predicate: ArdiumOptionComponent }], viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }, { propertyName: "dropdownPanel", first: true, predicate: ArdiumDropdownPanelComponent, descendants: true, isSignal: true }, { propertyName: "dropdownHost", first: true, predicate: ["dropdownHost"], descendants: true, read: ElementRef }, { propertyName: "dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, read: TemplateRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ard-form-field-frame\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [isFocused]=\"isFocused\"\n  [prefixTemplate]=\"prefixTemplate()?.template\"\n  [suffixTemplate]=\"suffixTemplate()?.template\"\n>\n  <div\n    class=\"ard-select\"\n    #dropdownHost\n    (click)=\"handleAnywhereClick($event)\"\n    [class.ard-has-value]=\"itemStorage.isAnyItemSelected()\"\n    [ngClass]=\"ngClasses()\"\n  >\n    <div class=\"ard-select-value-container\">\n      @if (shouldDisplayPlaceholder()) {\n        <ng-template #defaultPlaceholderTemplate>\n          <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n        </ng-template>\n\n        <ng-template [ngTemplateOutlet]=\"placeholderTemplate()?.template || defaultPlaceholderTemplate\" />\n      }\n      @if (shouldDisplayValue()) {\n        @for (item of itemStorage.selectedItems(); track item.index) {\n          <div\n            class=\"ard-select-value\"\n            [class.ard-value-disabled]=\"item.disabled()\"\n            [attr.hidden]=\"!isValueWithinDisplayLimit($index)\"\n          >\n            <ng-template\n              *ngIf=\"isValueWithinDisplayLimit($index)\"\n              [ngTemplateOutlet]=\"\n                valueTemplate()?.template || (multiselectable() ? defaultMultiValueTemplate : defaultValueTemplate)\n              \"\n              [ngTemplateOutletContext]=\"getValueContext(item)\"\n            />\n          </div>\n        }\n\n        <ng-template\n          #defaultValueTemplate\n          let-item\n        >\n          <div\n            [ardInnerHTML]=\"item.label()\"\n            [ardEscapeInnerHTML]=\"isItemsInputUsed\"\n          ></div>\n        </ng-template>\n        <ng-template\n          #defaultMultiValueTemplate\n          let-item\n          let-unselect=\"unselect\"\n        >\n          <ard-deletable-chip\n            (delete)=\"unselect(item)\"\n            [variant]=\"variant()\"\n            compact\n            appearance=\"outlined-strong\"\n          >\n            <div\n              [ardInnerHTML]=\"item.label()\"\n              [ardEscapeInnerHTML]=\"isItemsInputUsed\"\n            ></div>\n            <!-- TODO check if can remove div -->\n          </ard-deletable-chip>\n        </ng-template>\n      }\n      @if (itemStorage.isAnyItemSelected() && shouldShowItemDisplayLimit()) {\n        <div class=\"ard-overflow-indicator\">\n          <ng-template\n            [ngTemplateOutlet]=\"itemDisplayLimitTemplate()?.template || defaultItemDisplayLimitTemplate\"\n            [ngTemplateOutletContext]=\"getItemDisplayLimitContext()\"\n          />\n\n          <ng-template\n            #defaultItemDisplayLimitTemplate\n            let-count=\"overflowCount\"\n          >\n            <div>{{ count }} more...</div>\n          </ng-template>\n        </div>\n      }\n\n      <div\n        class=\"ard-search-input\"\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-owns]=\"isOpen() ? htmlId() : null\"\n      >\n        <input\n          #searchInput\n          #focusableElement\n          type=\"text\"\n          [attr.id]=\"searchInputId()\"\n          [attr.tabindex]=\"tabIndex()\"\n          [readonly]=\"isInputElementReadonly()\"\n          [disabled]=\"disabled()\"\n          [value]=\"searchTerm()\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"isOpen() ? htmlId() : null\"\n          (input)=\"filter(searchInput.value)\"\n          (change)=\"$event.stopPropagation()\"\n          (focus)=\"onFocus($event)\"\n          (focus)=\"onSearchInputFocus()\"\n          (blur)=\"onBlur($event)\"\n          (blur)=\"onSearchInputBlur()\"\n        />\n      </div>\n    </div>\n\n    <div class=\"ard-select-controls\">\n      @if (isLoading()) {\n        <ng-template #defaultLoadingSpinnerTemplate>\n          <div class=\"ard-simple-spinner\"></div>\n        </ng-template>\n\n        <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate()?.template || defaultLoadingSpinnerTemplate\" />\n      }\n      @if (shouldShowClearButton()) {\n        <ard-clear-button\n          [title]=\"clearButtonTitle()\"\n          (click)=\"handleClearButtonClick($event)\"\n        />\n      }\n\n      <button\n        type=\"button\"\n        class=\"ard-dropdown-arrow-wrapper\"\n        (click)=\"handleDropdownArrowClick($event)\"\n      >\n        <span class=\"ard-dropdown-arrow\"></span>\n        <div class=\"ard-hitbox\"></div>\n      </button>\n    </div>\n  </div>\n</ard-form-field-frame>\n\n<ng-template #dropdownTemplate>\n  <ard-dropdown-panel\n    class=\"ard-dropdown-panel ard-select-dropdown-panel\"\n    role=\"listbox\"\n    aria-label=\"Options list\"\n    [headerTemplate]=\"dropdownHeaderTemplate()?.template ?? null\"\n    [footerTemplate]=\"dropdownFooterTemplate()?.template ?? null\"\n    [appearance]=\"dropdownAppearanceOrDefault()\"\n    [variant]=\"dropdownVariantOrDefault()\"\n    [isOpen]=\"true\"\n    [filterValue]=\"searchTerm()\"\n    [panelId]=\"htmlId()\"\n    [compact]=\"compact()\"\n    (ardClickOutside)=\"handleOutsideClick($event)\"\n    (mousemove)=\"onMouseMove()\"\n    (scroll)=\"scrollEvent.emit($event)\"\n    (scrollToEnd)=\"scrollToEndEvent.emit($event)\"\n  >\n    @if (!shouldShowNoItemsFound()) {\n      @for (group of itemStorage.groups(); track $index) {\n        <div\n          class=\"ard-optgroup\"\n          role=\"group\"\n          [class.ard-group-disabled]=\"group.disabled()\"\n          [class.ard-group-selected]=\"group.selected()\"\n          [class.ard-group-highlighted]=\"group.highlighted()\"\n          (mouseover)=\"onGroupMouseover(group)\"\n          (click)=\"onGroupClick(group)\"\n        >\n          @if (group.label() !== '' && group.label() !== undefined) {\n            <ng-template\n              #defaultOptgroupTemplate\n              let-group\n            >\n              <span\n                class=\"ard-optgroup-label\"\n                [ardInnerHTML]=\"group.label()\"\n                [ardEscapeInnerHTML]=\"isItemsInputUsed\"\n              ></span>\n            </ng-template>\n\n            <ng-template\n              [ngTemplateOutlet]=\"optgroupTemplate()?.template || defaultOptgroupTemplate\"\n              [ngTemplateOutletContext]=\"getGroupContext(group)\"\n            />\n          }\n\n          <div class=\"ard-optgroup-children\">\n            @for (option of group.children(); track option.index) {\n              <div\n                class=\"ard-option\"\n                role=\"option\"\n                [class.ard-option-disabled]=\"option.disabled()\"\n                [class.ard-option-selected]=\"option.selected()\"\n                [class.ard-option-highlighted]=\"option.highlighted()\"\n                [class.ard-option-highlighted-recent]=\"option.highlighted_recently()\"\n                [attr.aria-selected]=\"option.selected()\"\n                [attr.id]=\"htmlId() + '-' + option.index\"\n                (click)=\"onItemClick(option, $event)\"\n                (mouseover)=\"onItemMouseOver($event)\"\n                (mouseenter)=\"onItemMouseEnter(option, $event)\"\n                (mouseleave)=\"onItemMouseLeave(option, $event)\"\n              >\n                <div class=\"ard-option-label\">\n                  <ng-template\n                    #defaultOptionTemplate\n                    let-option\n                  >\n                    <span\n                      [ardInnerHTML]=\"option.label()\"\n                      [ardEscapeInnerHTML]=\"isItemsInputUsed\"\n                    ></span>\n                  </ng-template>\n\n                  <ng-template\n                    [ngTemplateOutlet]=\"optionTemplate()?.template || defaultOptionTemplate\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option)\"\n                  />\n                </div>\n              </div>\n            }\n          </div>\n        </div>\n      }\n    }\n    @if (shouldShowNoItemsFound()) {\n      <ng-template #defaultNoItemsFoundTemplate>\n        <div class=\"ard-option ard-option-disabled\">{{ noItemsFoundText() }}</div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"noItemsFoundTemplate()?.template || defaultNoItemsFoundTemplate\"\n        [ngTemplateOutletContext]=\"getSearchContext()\"\n      />\n    }\n    @if (shouldShowAddCustom()) {\n      <ng-template\n        #defaultAddCustomTemplate\n        let-searchTerm\n      >\n        <div\n          class=\"ard-option ard-option-highlighted ard-add-custom\"\n          (click)=\"addCustomOption(searchTerm)\"\n        >\n          <span class=\"ard-add-custom-label\">Add option</span>\n          <span class=\"ard-add-custom-value\">\"{{ searchTerm }}\"</span>\n        </div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"addCustomTemplate()?.template || defaultAddCustomTemplate\"\n        [ngTemplateOutletContext]=\"getCustomOptionContext()\"\n      />\n    }\n    @if (isLoading()) {\n      <ng-template #defaultLoadingPlaceholderTemplate>\n        <div class=\"ard-option ard-option-disabled\">{{ loadingPlaceholderText() }}</div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"loadingPlaceholderTemplate()?.template || defaultLoadingPlaceholderTemplate\"\n        [ngTemplateOutletContext]=\"getSearchContext()\"\n      />\n    }\n  </ard-dropdown-panel>\n</ng-template>\n", styles: [".ard-select .ard-select-container{display:flex;cursor:pointer}.ard-select .ard-placeholder,.ard-select .ard-value,.ard-select .ard-dropdown-arrow-wrapper,.ard-select .ard-clear-btn-wrapper{-webkit-user-select:none;user-select:none}.ard-select .ard-clear-btn,.ard-select .ard-dropdown-arrow{border:none;background:transparent;padding:0;box-sizing:content-box}.ard-select .ard-option-disabled{pointer-events:none}.ard-select .ard-select-value{display:block}.ard-select .ard-select-value[hidden=true]{display:none}.ard-select .ard-searchable .ard-select-value-container{cursor:text}.ard-select .ard-dropdown-arrow-wrapper{position:relative}.ard-select .ard-dropdown-arrow-wrapper .ard-hitbox{position:absolute;left:-4px;right:-4px;aspect-ratio:1}.ard-select-dropdown-panel .ard-optgroup,.ard-select-dropdown-panel .ard-option{-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: ["panelId", "headerTemplate", "footerTemplate", "filterValue", "appearance", "variant", "compact", "isOpen"], outputs: ["scroll", "scrollToEnd"] }, { kind: "component", type: ArdiumDeletableChipComponent, selector: "ard-deletable-chip", inputs: ["deleteButtonTitle", "contentAlignment", "appearance", "variant", "color", "compact", "wrapperClasses"], outputs: ["delete"] }, { kind: "directive", type: i4.ClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }, { kind: "component", type: _ClearButtonComponent, selector: "ard-clear-button" }, { kind: "directive", type: i4.ArdiumInnerHTMLDirective, selector: "[ardInnerHTML]", inputs: ["ardInnerHTML", "ardEscapeInnerHTML"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-select', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -4038,10 +4039,10 @@ class ArdiumChipComponent extends _DisablableComponentBase {
             this.compact() ? 'ard-compact' : '',
         ].join(' '));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumChipComponent, deps: [{ token: ARD_CHIP_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumChipComponent, selector: "ard-chip", inputs: { contentAlignment: { classPropertyName: "contentAlignment", publicName: "contentAlignment", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-chip-wrapper ard-chip\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-chip-content-wrapper\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".ard-chip-wrapper{display:flex;width:max-content}.ard-chip-left{flex-direction:row}.ard-chip-right{flex-direction:row-reverse}.ard-chip-selectable .ard-chip-selection-icon{display:none}.ard-chip-selectable.ard-chip-selected .ard-chip-selection-icon{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumChipComponent, deps: [{ token: ARD_CHIP_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumChipComponent, selector: "ard-chip", inputs: { contentAlignment: { classPropertyName: "contentAlignment", publicName: "contentAlignment", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-chip-wrapper ard-chip\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-chip-content-wrapper\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".ard-chip-wrapper{display:flex;width:max-content}.ard-chip-left{flex-direction:row}.ard-chip-right{flex-direction:row-reverse}.ard-chip-selectable .ard-chip-selection-icon{display:none}.ard-chip-selectable.ard-chip-selected .ard-chip-selection-icon{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumChipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumChipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-chip', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-chip-wrapper ard-chip\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-chip-content-wrapper\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".ard-chip-wrapper{display:flex;width:max-content}.ard-chip-left{flex-direction:row}.ard-chip-right{flex-direction:row-reverse}.ard-chip-selectable .ard-chip-selection-icon{display:none}.ard-chip-selectable.ard-chip-selected .ard-chip-selection-icon{display:block}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -4124,10 +4125,10 @@ class _BooleanComponentBase extends _NgModelComponentBase {
         this.selected.set(false);
         this._emitChange();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _BooleanComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: _BooleanComponentBase, inputs: { _selected: ["selected", "_selected"] }, outputs: { selectEvent: "select", unselectEvent: "unselect", changeEvent: "change", selectedChange: "selectedChange" }, host: { properties: { "attr.selected": "this._selectedHostAttribute", "class.ard-selected": "this._selectedHostAttribute" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _BooleanComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: _BooleanComponentBase, inputs: { _selected: ["selected", "_selected"] }, outputs: { selectEvent: "select", unselectEvent: "unselect", changeEvent: "change", selectedChange: "selectedChange" }, host: { properties: { "attr.selected": "this._selectedHostAttribute", "class.ard-selected": "this._selectedHostAttribute" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _BooleanComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _BooleanComponentBase, decorators: [{
             type: Directive
         }], propDecorators: { _selected: [{
                 type: Input,
@@ -4178,8 +4179,8 @@ class ArdiumSelectableChipComponent extends _BooleanComponentBase {
             this.compact() ? 'ard-compact' : '',
         ].join(' '));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectableChipComponent, deps: [{ token: ARD_SELECTABLE_CHIP_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumSelectableChipComponent, selector: "ard-selectable-chip", inputs: { chipTitle: { classPropertyName: "chipTitle", publicName: "chipTitle", isSignal: true, isRequired: false, transformFunction: null }, hideSelectionIcon: { classPropertyName: "hideSelectionIcon", publicName: "hideSelectionIcon", isSignal: true, isRequired: false, transformFunction: null }, contentAlignment: { classPropertyName: "contentAlignment", publicName: "contentAlignment", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectableChipComponent, deps: [{ token: ARD_SELECTABLE_CHIP_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumSelectableChipComponent, selector: "ard-selectable-chip", inputs: { chipTitle: { classPropertyName: "chipTitle", publicName: "chipTitle", isSignal: true, isRequired: false, transformFunction: null }, hideSelectionIcon: { classPropertyName: "hideSelectionIcon", publicName: "hideSelectionIcon", isSignal: true, isRequired: false, transformFunction: null }, contentAlignment: { classPropertyName: "contentAlignment", publicName: "contentAlignment", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumSelectableChipComponent),
@@ -4187,7 +4188,7 @@ class ArdiumSelectableChipComponent extends _BooleanComponentBase {
             },
         ], usesInheritance: true, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"ard-chip-wrapper ard-chip-selectable\"\n  [class.ard-chip-selected]=\"selected()\"\n  [ngClass]=\"ngClasses()\"\n  [title]=\"chipTitle()\"\n  [tabindex]=\"tabIndex()\"\n  (click)=\"toggleSelected()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-chip-selection-icon\"\n    role=\"img\"\n  ></div>\n  <div class=\"ard-chip-content-wrapper\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-chip-wrapper{display:flex;width:max-content}.ard-chip-left{flex-direction:row}.ard-chip-right{flex-direction:row-reverse}.ard-chip-selectable .ard-chip-selection-icon{display:none}.ard-chip-selectable.ard-chip-selected .ard-chip-selection-icon{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectableChipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectableChipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-selectable-chip', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -4202,11 +4203,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumChipModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumChipModule, declarations: [ArdiumChipComponent, ArdiumSelectableChipComponent, ArdiumDeletableChipComponent], imports: [CommonModule, _ClearButtonModule], exports: [ArdiumChipComponent, ArdiumSelectableChipComponent, ArdiumDeletableChipComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumChipModule, imports: [CommonModule, _ClearButtonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumChipModule, declarations: [ArdiumChipComponent, ArdiumSelectableChipComponent, ArdiumDeletableChipComponent], imports: [CommonModule, _ClearButtonModule], exports: [ArdiumChipComponent, ArdiumSelectableChipComponent, ArdiumDeletableChipComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumChipModule, imports: [CommonModule, _ClearButtonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumChipModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumChipModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumChipComponent, ArdiumSelectableChipComponent, ArdiumDeletableChipComponent],
@@ -4216,8 +4217,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumSelectModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectModule, declarations: [ArdiumSelectComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectModule, declarations: [ArdiumSelectComponent,
             //tempalate directives
             ArdOptionTemplateDirective,
             ArdOptgroupTemplateDirective,
@@ -4256,7 +4257,7 @@ class ArdiumSelectModule {
             ArdAddCustomTemplateDirective,
             ArdSelectPrefixTemplateDirective,
             ArdSelectSuffixTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectModule, imports: [CommonModule,
             ArdiumFormFieldFrameModule,
             ArdiumDropdownPanelModule,
             ArdiumChipModule,
@@ -4264,7 +4265,7 @@ class ArdiumSelectModule {
             _ClearButtonModule,
             ArdiumInnerHTMLModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSelectModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSelectModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -4321,7 +4322,7 @@ class _FileInputComponentBase extends _NgModelComponentBase {
     constructor() {
         super(...arguments);
         this.fileInputEl = viewChild('fileInput');
-        this.htmlId = input(crypto.randomUUID());
+        this.htmlId = input(Random.id());
         this.name = input('');
         this._wasViewInit = false;
         //! appearance
@@ -4456,10 +4457,10 @@ class _FileInputComponentBase extends _NgModelComponentBase {
         }
         inputEl.files = dataTransfer.files;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _FileInputComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.0.2", type: _FileInputComponentBase, inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, blockAfterUpload: { classPropertyName: "blockAfterUpload", publicName: "blockAfterUpload", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", dragFilesEvent: "dragFiles" }, viewQueries: [{ propertyName: "fileInputEl", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _FileInputComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.2.13", type: _FileInputComponentBase, inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, blockAfterUpload: { classPropertyName: "blockAfterUpload", publicName: "blockAfterUpload", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", dragFilesEvent: "dragFiles" }, viewQueries: [{ propertyName: "fileInputEl", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _FileInputComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _FileInputComponentBase, decorators: [{
             type: Directive
         }], propDecorators: { value: [{
                 type: Input
@@ -4490,10 +4491,10 @@ class ArdiumFileDropAreaIdleContentTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaIdleContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumFileDropAreaIdleContentTemplateDirective, selector: "ard-file-drop-area > ng-template[ard-idle-content-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaIdleContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumFileDropAreaIdleContentTemplateDirective, selector: "ard-file-drop-area > ng-template[ard-idle-content-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaIdleContentTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaIdleContentTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-file-drop-area > ng-template[ard-idle-content-tmp]',
@@ -4503,10 +4504,10 @@ class ArdiumFileDropAreaDragoverContentTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaDragoverContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumFileDropAreaDragoverContentTemplateDirective, selector: "ard-file-drop-area > ng-template[ard-dragover-content-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaDragoverContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumFileDropAreaDragoverContentTemplateDirective, selector: "ard-file-drop-area > ng-template[ard-dragover-content-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaDragoverContentTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaDragoverContentTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-file-drop-area > ng-template[ard-dragover-content-tmp]',
@@ -4516,10 +4517,10 @@ class ArdiumFileDropAreaUploadedContentTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaUploadedContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumFileDropAreaUploadedContentTemplateDirective, selector: "ard-file-drop-area > ng-template[ard-dropped-content-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaUploadedContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumFileDropAreaUploadedContentTemplateDirective, selector: "ard-file-drop-area > ng-template[ard-dropped-content-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaUploadedContentTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaUploadedContentTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-file-drop-area > ng-template[ard-dropped-content-tmp]',
@@ -4538,10 +4539,10 @@ class _ButtonBase extends _FocusableComponentBase {
         this.compact = input(this._DEFAULTS.compact, { transform: v => coerceBooleanProperty(v) });
         this._DEFAULTS = defaults;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ButtonBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: _ButtonBase, inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ButtonBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: _ButtonBase, inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ButtonBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ButtonBase, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: undefined }] });
 
@@ -4650,10 +4651,10 @@ class ArdiumButtonComponent extends _ButtonBase {
             this.vertical() ? 'ard-button-vertical' : '',
         ].join(' '));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumButtonComponent, deps: [{ token: ARD_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumButtonComponent, selector: "ard-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignIcon: { classPropertyName: "alignIcon", publicName: "alignIcon", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  #buttonElement\n  class=\"ard-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (icon()) {\n    <div class=\"ard-button-icon\">\n      {{ icon() }}\n    </div>\n  }\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-button{display:flex;align-items:center;position:relative;cursor:pointer}.ard-button.ard-button-align-left{flex-direction:row}.ard-button.ard-button-align-right{flex-direction:row-reverse}.ard-button.ard-button-vertical{flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonComponent, deps: [{ token: ARD_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumButtonComponent, selector: "ard-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignIcon: { classPropertyName: "alignIcon", publicName: "alignIcon", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  #buttonElement\n  class=\"ard-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (icon()) {\n    <div class=\"ard-button-icon\">\n      {{ icon() }}\n    </div>\n  }\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-button{display:flex;align-items:center;position:relative;cursor:pointer}.ard-button.ard-button-align-left{flex-direction:row}.ard-button.ard-button-align-right{flex-direction:row-reverse}.ard-button.ard-button-vertical{flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  #buttonElement\n  class=\"ard-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (icon()) {\n    <div class=\"ard-button-icon\">\n      {{ icon() }}\n    </div>\n  }\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-button{display:flex;align-items:center;position:relative;cursor:pointer}.ard-button.ard-button-align-left{flex-direction:row}.ard-button.ard-button-align-right{flex-direction:row-reverse}.ard-button.ard-button-vertical{flex-direction:column}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -4705,10 +4706,10 @@ class ArdiumFileDropAreaComponent extends _FileInputComponentBase {
             files,
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaComponent, deps: [{ token: ARD_FILE_DROP_AREA_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumFileDropAreaComponent, selector: "ard-file-drop-area", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "idleTemplate", first: true, predicate: ArdiumFileDropAreaIdleContentTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "dragoverTemplate", first: true, predicate: ArdiumFileDropAreaDragoverContentTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "uploadedTemplate", first: true, predicate: ArdiumFileDropAreaUploadedContentTemplateDirective, descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-file-drop-area\"\n  (ardClickOutside)=\"onDragleave()\"\n  (dragleave)=\"onDragleave()\"\n  (dragover)=\"onDragover($event)\"\n  (drop)=\"onDrop($event)\"\n  [ngClass]=\"ngClasses\"\n>\n  <div class=\"ard-file-drop-area-outline\">\n    <div class=\"ard-file-drop-area-content\">\n      @if (currentViewState() === 'idle') {\n        <ng-template\n          [ngTemplateOutlet]=\"idleTemplate ?? defaultIdleTemplate\"\n          [ngTemplateOutletContext]=\"getIdleContext()\"\n        />\n      }\n      <ng-template\n        *ngIf=\"currentViewState() === 'dragover'\"\n        [ngTemplateOutlet]=\"dragoverTemplate ?? defaultDragoverTemplate\"\n        [ngTemplateOutletContext]=\"getDragoverContext()\"\n      ></ng-template>\n      <ng-template\n        *ngIf=\"currentViewState() === 'uploaded'\"\n        [ngTemplateOutlet]=\"uploadedTemplate ?? defaultUploadedTemplate\"\n        [ngTemplateOutletContext]=\"getUploadedContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</div>\n<input\n  #fileInput\n  class=\"ard-file-drop-area-input-element\"\n  type=\"file\"\n  [name]=\"name()\"\n  [multiple]=\"multiple()\"\n  [id]=\"htmlId()\"\n  (change)=\"onInputChange()\"\n/>\n\n<ng-template\n  #defaultIdleTemplate\n  let-browse=\"browse\"\n>\n  <ard-icon class=\"ard-file-drop-area-icon\">upload</ard-icon>\n  <strong class=\"ard-file-drop-area-drop-text\">\n    <span *ngIf=\"!multiple\">Drag & Drop a file</span>\n    <span *ngIf=\"multiple\">Drag & Drop files</span>\n    here\n  </strong>\n  <span class=\"ard-file-drop-area-or-text\">or</span>\n  <ard-button\n    class=\"ard-file-drop-area-browse-button\"\n    appearance=\"transparent\"\n    [compact]=\"compact()\"\n    [variant]=\"variant()\"\n    [color]=\"color()\"\n    (click)=\"browse()\"\n    >Browse files</ard-button\n  >\n</ng-template>\n\n<ng-template\n  #defaultDragoverTemplate\n  let-amount=\"amount\"\n>\n  <span class=\"ard-file-drop-area-dragover-text\">Drop </span>\n  <span class=\"ard-file-drop-area-dragover-amount\">\n    {{ amount }}\n    <ng-container [ngPlural]=\"amount\">\n      <ng-template ngPluralCase=\"=1\">file</ng-template>\n      <ng-template ngPluralCase=\"other\">files</ng-template>\n    </ng-container>\n  </span>\n  <span class=\"ard-file-drop-area-dragover-text\"> here to upload. </span>\n  @if (amount > 1 && !multiple()) {\n    <strong class=\"ard-file-drop-area-dragover-warning\"> Only the first file will be uploaded! </strong>\n  }\n</ng-template>\n\n<ng-template\n  #defaultUploadedTemplate\n  let-amount=\"amount\"\n  let-files=\"files\"\n>\n  <div class=\"ard-file-drop-area-uploaded-container\">\n    <div class=\"ard-file-drop-area-uploaded-message\">\n      <span class=\"ard-file-drop-area-uploaded-amount\">\n        {{ amount }}\n        <ng-container [ngPlural]=\"amount\">\n          <ng-template ngPluralCase=\"=1\">file</ng-template>\n          <ng-template ngPluralCase=\"other\">files</ng-template>\n        </ng-container>\n      </span>\n      <span class=\"ard-file-drop-area-uploaded-text\"> uploaded.</span>\n    </div>\n    <div class=\"ard-file-drop-area-uploaded-files\">\n      @for (file of files; track $index) {\n        <div class=\"ard-file-drop-area-file\">\n          <ard-icon>draft</ard-icon>\n          <div class=\"ard-file-drop-area-file-info\">\n            <span class=\"ard-file-drop-area-filename\">\n              <span class=\"ard-file-drop-area-filename-name\">{{ file | filename }}</span>\n              <span class=\"ard-file-drop-area-filename-ext\">{{ file | fileext: true }}</span>\n            </span>\n            <span class=\"ard-file-drop-area-filesize\">{{ file.size | filesize }}</span>\n          </div>\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-file-drop-area-input-element{position:absolute;appearance:none;opacity:0;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgPlural, selector: "[ngPlural]", inputs: ["ngPlural"] }, { kind: "directive", type: i1.NgPluralCase, selector: "[ngPluralCase]" }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: i4.ClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }, { kind: "pipe", type: i4.ArdiumFilesizePipe, name: "filesize" }, { kind: "pipe", type: i4.ArdiumFilenamePipe, name: "filename" }, { kind: "pipe", type: i4.ArdiumFileextPipe, name: "fileext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaComponent, deps: [{ token: ARD_FILE_DROP_AREA_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumFileDropAreaComponent, selector: "ard-file-drop-area", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "idleTemplate", first: true, predicate: ArdiumFileDropAreaIdleContentTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "dragoverTemplate", first: true, predicate: ArdiumFileDropAreaDragoverContentTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "uploadedTemplate", first: true, predicate: ArdiumFileDropAreaUploadedContentTemplateDirective, descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-file-drop-area\"\n  (ardClickOutside)=\"onDragleave()\"\n  (dragleave)=\"onDragleave()\"\n  (dragover)=\"onDragover($event)\"\n  (drop)=\"onDrop($event)\"\n  [ngClass]=\"ngClasses\"\n>\n  <div class=\"ard-file-drop-area-outline\">\n    <div class=\"ard-file-drop-area-content\">\n      @if (currentViewState() === 'idle') {\n        <ng-template\n          [ngTemplateOutlet]=\"idleTemplate ?? defaultIdleTemplate\"\n          [ngTemplateOutletContext]=\"getIdleContext()\"\n        />\n      }\n      <ng-template\n        *ngIf=\"currentViewState() === 'dragover'\"\n        [ngTemplateOutlet]=\"dragoverTemplate ?? defaultDragoverTemplate\"\n        [ngTemplateOutletContext]=\"getDragoverContext()\"\n      ></ng-template>\n      <ng-template\n        *ngIf=\"currentViewState() === 'uploaded'\"\n        [ngTemplateOutlet]=\"uploadedTemplate ?? defaultUploadedTemplate\"\n        [ngTemplateOutletContext]=\"getUploadedContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</div>\n<input\n  #fileInput\n  class=\"ard-file-drop-area-input-element\"\n  type=\"file\"\n  [name]=\"name()\"\n  [multiple]=\"multiple()\"\n  [id]=\"htmlId()\"\n  (change)=\"onInputChange()\"\n/>\n\n<ng-template\n  #defaultIdleTemplate\n  let-browse=\"browse\"\n>\n  <ard-icon class=\"ard-file-drop-area-icon\">upload</ard-icon>\n  <strong class=\"ard-file-drop-area-drop-text\">\n    <span *ngIf=\"!multiple\">Drag & Drop a file</span>\n    <span *ngIf=\"multiple\">Drag & Drop files</span>\n    here\n  </strong>\n  <span class=\"ard-file-drop-area-or-text\">or</span>\n  <ard-button\n    class=\"ard-file-drop-area-browse-button\"\n    appearance=\"transparent\"\n    [compact]=\"compact()\"\n    [variant]=\"variant()\"\n    [color]=\"color()\"\n    (click)=\"browse()\"\n    >Browse files</ard-button\n  >\n</ng-template>\n\n<ng-template\n  #defaultDragoverTemplate\n  let-amount=\"amount\"\n>\n  <span class=\"ard-file-drop-area-dragover-text\">Drop </span>\n  <span class=\"ard-file-drop-area-dragover-amount\">\n    {{ amount }}\n    <ng-container [ngPlural]=\"amount\">\n      <ng-template ngPluralCase=\"=1\">file</ng-template>\n      <ng-template ngPluralCase=\"other\">files</ng-template>\n    </ng-container>\n  </span>\n  <span class=\"ard-file-drop-area-dragover-text\"> here to upload. </span>\n  @if (amount > 1 && !multiple()) {\n    <strong class=\"ard-file-drop-area-dragover-warning\"> Only the first file will be uploaded! </strong>\n  }\n</ng-template>\n\n<ng-template\n  #defaultUploadedTemplate\n  let-amount=\"amount\"\n  let-files=\"files\"\n>\n  <div class=\"ard-file-drop-area-uploaded-container\">\n    <div class=\"ard-file-drop-area-uploaded-message\">\n      <span class=\"ard-file-drop-area-uploaded-amount\">\n        {{ amount }}\n        <ng-container [ngPlural]=\"amount\">\n          <ng-template ngPluralCase=\"=1\">file</ng-template>\n          <ng-template ngPluralCase=\"other\">files</ng-template>\n        </ng-container>\n      </span>\n      <span class=\"ard-file-drop-area-uploaded-text\"> uploaded.</span>\n    </div>\n    <div class=\"ard-file-drop-area-uploaded-files\">\n      @for (file of files; track $index) {\n        <div class=\"ard-file-drop-area-file\">\n          <ard-icon>draft</ard-icon>\n          <div class=\"ard-file-drop-area-file-info\">\n            <span class=\"ard-file-drop-area-filename\">\n              <span class=\"ard-file-drop-area-filename-name\">{{ file | filename }}</span>\n              <span class=\"ard-file-drop-area-filename-ext\">{{ file | fileext: true }}</span>\n            </span>\n            <span class=\"ard-file-drop-area-filesize\">{{ file.size | filesize }}</span>\n          </div>\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-file-drop-area-input-element{position:absolute;appearance:none;opacity:0;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgPlural, selector: "[ngPlural]", inputs: ["ngPlural"] }, { kind: "directive", type: i1.NgPluralCase, selector: "[ngPluralCase]" }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: i4.ClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }, { kind: "pipe", type: i4.ArdiumFilesizePipe, name: "filesize" }, { kind: "pipe", type: i4.ArdiumFilenamePipe, name: "filename" }, { kind: "pipe", type: i4.ArdiumFileextPipe, name: "fileext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-file-drop-area', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-file-drop-area\"\n  (ardClickOutside)=\"onDragleave()\"\n  (dragleave)=\"onDragleave()\"\n  (dragover)=\"onDragover($event)\"\n  (drop)=\"onDrop($event)\"\n  [ngClass]=\"ngClasses\"\n>\n  <div class=\"ard-file-drop-area-outline\">\n    <div class=\"ard-file-drop-area-content\">\n      @if (currentViewState() === 'idle') {\n        <ng-template\n          [ngTemplateOutlet]=\"idleTemplate ?? defaultIdleTemplate\"\n          [ngTemplateOutletContext]=\"getIdleContext()\"\n        />\n      }\n      <ng-template\n        *ngIf=\"currentViewState() === 'dragover'\"\n        [ngTemplateOutlet]=\"dragoverTemplate ?? defaultDragoverTemplate\"\n        [ngTemplateOutletContext]=\"getDragoverContext()\"\n      ></ng-template>\n      <ng-template\n        *ngIf=\"currentViewState() === 'uploaded'\"\n        [ngTemplateOutlet]=\"uploadedTemplate ?? defaultUploadedTemplate\"\n        [ngTemplateOutletContext]=\"getUploadedContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</div>\n<input\n  #fileInput\n  class=\"ard-file-drop-area-input-element\"\n  type=\"file\"\n  [name]=\"name()\"\n  [multiple]=\"multiple()\"\n  [id]=\"htmlId()\"\n  (change)=\"onInputChange()\"\n/>\n\n<ng-template\n  #defaultIdleTemplate\n  let-browse=\"browse\"\n>\n  <ard-icon class=\"ard-file-drop-area-icon\">upload</ard-icon>\n  <strong class=\"ard-file-drop-area-drop-text\">\n    <span *ngIf=\"!multiple\">Drag & Drop a file</span>\n    <span *ngIf=\"multiple\">Drag & Drop files</span>\n    here\n  </strong>\n  <span class=\"ard-file-drop-area-or-text\">or</span>\n  <ard-button\n    class=\"ard-file-drop-area-browse-button\"\n    appearance=\"transparent\"\n    [compact]=\"compact()\"\n    [variant]=\"variant()\"\n    [color]=\"color()\"\n    (click)=\"browse()\"\n    >Browse files</ard-button\n  >\n</ng-template>\n\n<ng-template\n  #defaultDragoverTemplate\n  let-amount=\"amount\"\n>\n  <span class=\"ard-file-drop-area-dragover-text\">Drop </span>\n  <span class=\"ard-file-drop-area-dragover-amount\">\n    {{ amount }}\n    <ng-container [ngPlural]=\"amount\">\n      <ng-template ngPluralCase=\"=1\">file</ng-template>\n      <ng-template ngPluralCase=\"other\">files</ng-template>\n    </ng-container>\n  </span>\n  <span class=\"ard-file-drop-area-dragover-text\"> here to upload. </span>\n  @if (amount > 1 && !multiple()) {\n    <strong class=\"ard-file-drop-area-dragover-warning\"> Only the first file will be uploaded! </strong>\n  }\n</ng-template>\n\n<ng-template\n  #defaultUploadedTemplate\n  let-amount=\"amount\"\n  let-files=\"files\"\n>\n  <div class=\"ard-file-drop-area-uploaded-container\">\n    <div class=\"ard-file-drop-area-uploaded-message\">\n      <span class=\"ard-file-drop-area-uploaded-amount\">\n        {{ amount }}\n        <ng-container [ngPlural]=\"amount\">\n          <ng-template ngPluralCase=\"=1\">file</ng-template>\n          <ng-template ngPluralCase=\"other\">files</ng-template>\n        </ng-container>\n      </span>\n      <span class=\"ard-file-drop-area-uploaded-text\"> uploaded.</span>\n    </div>\n    <div class=\"ard-file-drop-area-uploaded-files\">\n      @for (file of files; track $index) {\n        <div class=\"ard-file-drop-area-file\">\n          <ard-icon>draft</ard-icon>\n          <div class=\"ard-file-drop-area-file-info\">\n            <span class=\"ard-file-drop-area-filename\">\n              <span class=\"ard-file-drop-area-filename-name\">{{ file | filename }}</span>\n              <span class=\"ard-file-drop-area-filename-ext\">{{ file | fileext: true }}</span>\n            </span>\n            <span class=\"ard-file-drop-area-filesize\">{{ file.size | filesize }}</span>\n          </div>\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-file-drop-area-input-element{position:absolute;appearance:none;opacity:0;pointer-events:none}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -4732,11 +4733,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumButtonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumButtonModule, declarations: [ArdiumButtonComponent], imports: [CommonModule], exports: [ArdiumButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumButtonModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonModule, declarations: [ArdiumButtonComponent], imports: [CommonModule], exports: [ArdiumButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumButtonComponent],
@@ -4746,8 +4747,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumFileDropAreaModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaModule, declarations: [ArdiumFileDropAreaComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaModule, declarations: [ArdiumFileDropAreaComponent,
             ArdiumFileDropAreaIdleContentTemplateDirective,
             ArdiumFileDropAreaDragoverContentTemplateDirective,
             ArdiumFileDropAreaUploadedContentTemplateDirective], imports: [CommonModule,
@@ -4760,7 +4761,7 @@ class ArdiumFileDropAreaModule {
             ArdiumFileDropAreaIdleContentTemplateDirective,
             ArdiumFileDropAreaDragoverContentTemplateDirective,
             ArdiumFileDropAreaUploadedContentTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaModule, imports: [CommonModule,
             ArdiumButtonModule,
             ArdiumIconModule,
             ArdiumFilesizePipeModule,
@@ -4768,7 +4769,7 @@ class ArdiumFileDropAreaModule {
             ArdiumFileextPipeModule,
             ArdiumClickOutsideEventModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileDropAreaModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileDropAreaModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -4818,10 +4819,10 @@ class ArdFileInputPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFileInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdFileInputPlaceholderTemplateDirective, selector: "ard-file-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFileInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdFileInputPlaceholderTemplateDirective, selector: "ard-file-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFileInputPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFileInputPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-file-input > ng-template[ard-placeholder-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -4829,10 +4830,10 @@ class ArdFileInputPrefixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFileInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdFileInputPrefixTemplateDirective, selector: "ard-file-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFileInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdFileInputPrefixTemplateDirective, selector: "ard-file-input > ng-template[ard-prefix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFileInputPrefixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFileInputPrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-file-input > ng-template[ard-prefix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -4840,10 +4841,10 @@ class ArdFileInputSuffixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFileInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdFileInputSuffixTemplateDirective, selector: "ard-file-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFileInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdFileInputSuffixTemplateDirective, selector: "ard-file-input > ng-template[ard-suffix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdFileInputSuffixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdFileInputSuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-file-input > ng-template[ard-suffix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -4851,10 +4852,10 @@ class ArdiumFileInputIdleContentTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputIdleContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumFileInputIdleContentTemplateDirective, selector: "ard-file-input > ng-template[ard-idle-content-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputIdleContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumFileInputIdleContentTemplateDirective, selector: "ard-file-input > ng-template[ard-idle-content-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputIdleContentTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputIdleContentTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-file-input > ng-template[ard-idle-content-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -4862,10 +4863,10 @@ class ArdiumFileInputDragoverContentTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputDragoverContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumFileInputDragoverContentTemplateDirective, selector: "ard-file-input > ng-template[ard-dragover-content-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputDragoverContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumFileInputDragoverContentTemplateDirective, selector: "ard-file-input > ng-template[ard-dragover-content-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputDragoverContentTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputDragoverContentTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-file-input > ng-template[ard-dragover-content-tmp]',
@@ -4875,10 +4876,10 @@ class ArdiumFileInputUploadedContentTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputUploadedContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumFileInputUploadedContentTemplateDirective, selector: "ard-file-input > ng-template[ard-dropped-content-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputUploadedContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumFileInputUploadedContentTemplateDirective, selector: "ard-file-input > ng-template[ard-dropped-content-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputUploadedContentTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputUploadedContentTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-file-input > ng-template[ard-dropped-content-tmp]',
@@ -4950,8 +4951,8 @@ class ArdiumFileInputComponent extends _FileInputComponentBase {
             files,
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputComponent, deps: [{ token: ARD_FILE_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumFileInputComponent, selector: "ard-file-input", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clearEvent: "clear" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputComponent, deps: [{ token: ARD_FILE_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumFileInputComponent, selector: "ard-file-input", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clearEvent: "clear" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumFileInputComponent),
@@ -4959,7 +4960,7 @@ class ArdiumFileInputComponent extends _FileInputComponentBase {
             },
         ], queries: [{ propertyName: "placeholderTemplate", first: true, predicate: ArdFileInputPlaceholderTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "prefixTemplate", first: true, predicate: ArdFileInputPrefixTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "suffixTemplate", first: true, predicate: ArdFileInputSuffixTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "idleTemplate", first: true, predicate: ArdiumFileInputIdleContentTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "dragoverTemplate", first: true, predicate: ArdiumFileInputDragoverContentTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "uploadedTemplate", first: true, predicate: ArdiumFileInputUploadedContentTemplateDirective, descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\n  class=\"ard-file-input-form-field-frame\"\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [isFocused]=\"isFocused\"\n  [prefixTemplate]=\"prefixTemplate\"\n  [suffixTemplate]=\"suffixTemplate\"\n  (dragover)=\"onDragover($event)\"\n  (dragleave)=\"onDragleave()\"\n  (drop)=\"onDrop($event)\"\n  (ardClickOutside)=\"onDragleave()\"\n>\n  <div\n    class=\"ard-file-input\"\n    [ngClass]=\"ngClasses()\"\n  >\n    <div class=\"ard-input-container\">\n      @if (shouldDisplayPlaceholder) {\n        <ng-template #defaultPlaceholderTemplate>\n          <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n        </ng-template>\n\n        <ng-template [ngTemplateOutlet]=\"placeholderTemplate || defaultPlaceholderTemplate\" />\n      }\n\n      <div class=\"ard-file-input__value\">\n        @if (currentViewState() === 'idle') {\n          <ng-template\n            [ngTemplateOutlet]=\"idleTemplate ?? defaultIdleTemplate\"\n            [ngTemplateOutletContext]=\"getIdleContext()\"\n          />\n        }\n        @if (currentViewState() === 'dragover') {\n          <ng-template\n            [ngTemplateOutlet]=\"dragoverTemplate ?? defaultDragoverTemplate\"\n            [ngTemplateOutletContext]=\"getDragoverContext()\"\n          />\n        }\n        @if (currentViewState() === 'uploaded') {\n          <ng-template\n            [ngTemplateOutlet]=\"uploadedTemplate ?? defaultUploadedTemplate\"\n            [ngTemplateOutletContext]=\"getUploadedContext()\"\n          />\n        }\n      </div>\n    </div>\n\n    @if (shouldShowClearButton) {\n      <ard-clear-button\n        #focusableElement\n        [title]=\"clearButtonTitle()\"\n        (mouseup)=\"onClearButtonClick($event)\"\n      />\n    }\n    @if (!shouldBeBlocked) {\n      <button\n        #focusableElement\n        type=\"button\"\n        class=\"ard-browse-button\"\n        (focus)=\"onFocus($event)\"\n        (blur)=\"onBlur($event)\"\n        (click)=\"openBrowseDialog()\"\n      >\n        <div class=\"ard-focus-overlay\"></div>\n        <ard-icon>folder</ard-icon>\n      </button>\n    }\n  </div>\n</ard-form-field-frame>\n\n<input\n  #fileInput\n  class=\"ard-file-input__input\"\n  type=\"file\"\n  [name]=\"name()\"\n  [multiple]=\"multiple()\"\n  [attr.id]=\"htmlId()\"\n  (change)=\"onInputChange()\"\n/>\n\n<ng-template\n  #defaultIdleTemplate\n  let-browse=\"browse\"\n>\n  <span class=\"ard-file-input__idle\">\n    @if (multiple()) {\n      <span>Upload a file</span>\n    } @else {\n      <span>Upload files</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template\n  #defaultDragoverTemplate\n  let-amount=\"amount\"\n>\n  <span class=\"ard-file-input__dragover-text\">Drop </span>\n  @if (multiple()) {\n    <span class=\"ard-file-input__dragover-amount\">\n      {{ amount }}\n      <ng-container [ngPlural]=\"amount\">\n        <ng-template ngPluralCase=\"=1\">file</ng-template>\n        <ng-template ngPluralCase=\"other\">files</ng-template>\n      </ng-container>\n    </span>\n  } @else {\n    <span class=\"ard-file-input__dragover-amount\"> a file </span>\n  }\n  <span class=\"ard-file-input__dragover-text\"> here to upload </span>\n</ng-template>\n\n<ng-template\n  #defaultUploadedTemplate\n  let-amount=\"amount\"\n>\n  <div class=\"ard-file-input__uploaded\">\n    <span class=\"ard-file-input__uploaded-amount\">\n      {{ amount }}\n      <ng-container [ngPlural]=\"amount\">\n        <ng-template ngPluralCase=\"=1\">file</ng-template>\n        <ng-template ngPluralCase=\"other\">files</ng-template>\n      </ng-container>\n    </span>\n    <span class=\"ard-file-input__uploaded-text\"> uploaded.</span>\n  </div>\n</ng-template>\n", styles: [".ard-file-input__input{position:absolute;appearance:none;opacity:0;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgPlural, selector: "[ngPlural]", inputs: ["ngPlural"] }, { kind: "directive", type: i1.NgPluralCase, selector: "[ngPluralCase]" }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: _ClearButtonComponent, selector: "ard-clear-button" }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-file-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -5000,11 +5001,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumFileInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputModule, declarations: [ArdiumFileInputComponent], imports: [CommonModule, ArdiumFormFieldFrameModule, _ClearButtonModule, ArdiumIconModule], exports: [ArdiumFileInputComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputModule, imports: [CommonModule, ArdiumFormFieldFrameModule, _ClearButtonModule, ArdiumIconModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputModule, declarations: [ArdiumFileInputComponent], imports: [CommonModule, ArdiumFormFieldFrameModule, _ClearButtonModule, ArdiumIconModule], exports: [ArdiumFileInputComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputModule, imports: [CommonModule, ArdiumFormFieldFrameModule, _ClearButtonModule, ArdiumIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFileInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFileInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumFileInputComponent],
@@ -5045,10 +5046,10 @@ class ArdHexInputPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdHexInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdHexInputPlaceholderTemplateDirective, selector: "ard-hex-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdHexInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdHexInputPlaceholderTemplateDirective, selector: "ard-hex-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdHexInputPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdHexInputPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-hex-input > ng-template[ard-placeholder-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -5056,10 +5057,10 @@ class ArdHexInputPrefixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdHexInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdHexInputPrefixTemplateDirective, selector: "ard-hex-input ng-template[ard-prefix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdHexInputPrefixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdHexInputPrefixTemplateDirective, selector: "ard-hex-input ng-template[ard-prefix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdHexInputPrefixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdHexInputPrefixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-hex-input ng-template[ard-prefix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -5067,10 +5068,10 @@ class ArdHexInputSuffixTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdHexInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdHexInputSuffixTemplateDirective, selector: "ard-hex-input ng-template[ard-suffix-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdHexInputSuffixTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdHexInputSuffixTemplateDirective, selector: "ard-hex-input ng-template[ard-suffix-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdHexInputSuffixTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdHexInputSuffixTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-hex-input ng-template[ard-suffix-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -5303,8 +5304,8 @@ class ArdiumHexInputComponent extends _NgModelComponentBase {
             input.setAttribute(key, String(attributes[key]));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumHexInputComponent, deps: [{ token: ARD_HEX_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumHexInputComponent, selector: "ard-hex-input", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, case: { classPropertyName: "case", publicName: "case", isSignal: true, isRequired: false, transformFunction: null }, maxDigits: { classPropertyName: "maxDigits", publicName: "maxDigits", isSignal: true, isRequired: false, transformFunction: null }, hideHash: { classPropertyName: "hideHash", publicName: "hideHash", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", inputEvent: "input", changeEvent: "change", clearEvent: "clear" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumHexInputComponent, deps: [{ token: ARD_HEX_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumHexInputComponent, selector: "ard-hex-input", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, case: { classPropertyName: "case", publicName: "case", isSignal: true, isRequired: false, transformFunction: null }, maxDigits: { classPropertyName: "maxDigits", publicName: "maxDigits", isSignal: true, isRequired: false, transformFunction: null }, hideHash: { classPropertyName: "hideHash", publicName: "hideHash", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearButtonTitle: { classPropertyName: "clearButtonTitle", publicName: "clearButtonTitle", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", inputEvent: "input", changeEvent: "change", clearEvent: "clear" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumHexInputComponent),
@@ -5312,7 +5313,7 @@ class ArdiumHexInputComponent extends _NgModelComponentBase {
             },
         ], queries: [{ propertyName: "prefixTemplate", first: true, predicate: ArdHexInputPrefixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "suffixTemplate", first: true, predicate: ArdHexInputSuffixTemplateDirective, descendants: true, isSignal: true }, { propertyName: "placeholderTemplate", first: true, predicate: ArdHexInputPlaceholderTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "textInputEl", first: true, predicate: ["textInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [isFocused]=\"isFocused\"\n  [prefixTemplate]=\"prefixTemplate()?.template\"\n  [suffixTemplate]=\"suffixTemplate()?.template\"\n>\n  <div\n    class=\"ard-hex-input\"\n    [class.ard-has-value]=\"value\"\n    (mouseup)=\"onMouseup()\"\n  >\n    <div\n      class=\"ard-hash-container\"\n      *ngIf=\"showHash\"\n    >\n      #\n    </div>\n    <div class=\"ard-input-container\">\n      @if (shouldDisplayPlaceholder()) {\n        <ng-template #defaultPlaceholderTemplate>\n          <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n        </ng-template>\n\n        <ng-template [ngTemplateOutlet]=\"placeholderTemplate()?.template || defaultPlaceholderTemplate\"></ng-template>\n      }\n\n      <input\n        #textInput\n        #focusableElement\n        type=\"text\"\n        [attr.id]=\"inputId()\"\n        [attr.tabindex]=\"tabIndex()\"\n        [readonly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onInput(textInput.value, $event)\"\n        (focus)=\"onFocus($event)\"\n        (blur)=\"onBlur($event)\"\n        (change)=\"onChange($event)\"\n        (mouseup)=\"$event.stopPropagation()\"\n        (copy)=\"onCopy($event)\"\n      />\n    </div>\n\n    @if (shouldShowClearButton()) {\n      <ard-clear-button\n        [title]=\"clearButtonTitle()\"\n        (click)=\"onClearButtonClick($event)\"\n      />\n    }\n  </div>\n</ard-form-field-frame>\n", styles: [".ard-input-container{position:relative}.ard-placeholder{position:absolute;left:0;right:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: _ClearButtonComponent, selector: "ard-clear-button" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumHexInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumHexInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-hex-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -5329,17 +5330,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumHexInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumHexInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumHexInputModule, declarations: [ArdiumHexInputComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumHexInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumHexInputModule, declarations: [ArdiumHexInputComponent,
             ArdHexInputPlaceholderTemplateDirective,
             ArdHexInputPrefixTemplateDirective,
             ArdHexInputSuffixTemplateDirective], imports: [CommonModule, ArdiumFormFieldFrameModule, _ClearButtonModule], exports: [ArdiumHexInputComponent,
             ArdHexInputPlaceholderTemplateDirective,
             ArdHexInputPrefixTemplateDirective,
             ArdHexInputSuffixTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumHexInputModule, imports: [CommonModule, ArdiumFormFieldFrameModule, _ClearButtonModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumHexInputModule, imports: [CommonModule, ArdiumFormFieldFrameModule, _ClearButtonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumHexInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumHexInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -5385,10 +5386,10 @@ class ArdNumberInputPlaceholderTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdNumberInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdNumberInputPlaceholderTemplateDirective, selector: "ard-number-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdNumberInputPlaceholderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdNumberInputPlaceholderTemplateDirective, selector: "ard-number-input > ng-template[ard-placeholder-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdNumberInputPlaceholderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdNumberInputPlaceholderTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-number-input > ng-template[ard-placeholder-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -5580,16 +5581,16 @@ class ArdiumNumberInputComponent extends _NgModelComponentBase {
             input.setAttribute(key, String(attributes[key]));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumNumberInputComponent, deps: [{ token: ARD_NUMBER_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumNumberInputComponent, selector: "ard-number-input", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignText: { classPropertyName: "alignText", publicName: "alignText", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, allowFloat: { classPropertyName: "allowFloat", publicName: "allowFloat", isSignal: true, isRequired: false, transformFunction: null }, noButtons: { classPropertyName: "noButtons", publicName: "noButtons", isSignal: true, isRequired: false, transformFunction: null }, stepSize: { classPropertyName: "stepSize", publicName: "stepSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", inputEvent: "input", changeEvent: "change", clearEvent: "clear", quickChangeEvent: "quickChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumNumberInputComponent, deps: [{ token: ARD_NUMBER_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumNumberInputComponent, selector: "ard-number-input", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alignText: { classPropertyName: "alignText", publicName: "alignText", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, allowFloat: { classPropertyName: "allowFloat", publicName: "allowFloat", isSignal: true, isRequired: false, transformFunction: null }, noButtons: { classPropertyName: "noButtons", publicName: "noButtons", isSignal: true, isRequired: false, transformFunction: null }, stepSize: { classPropertyName: "stepSize", publicName: "stepSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", inputEvent: "input", changeEvent: "change", clearEvent: "clear", quickChangeEvent: "quickChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumNumberInputComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "placeholderTemplate", first: true, predicate: ArdNumberInputPlaceholderTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["textInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-number-input\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-has-value]=\"value\"\n  (mousedown)=\"$event.preventDefault()\"\n  (mouseup)=\"onMouseup()\"\n>\n  @if (!noButtons()) {\n    <ard-button\n      class=\"ard-quick-change-button decrement\"\n      [variant]=\"buttonVariant()\"\n      [appearance]=\"buttonAppearance()\"\n      color=\"none\"\n      [disabled]=\"!canDecrement()\"\n      [tabIndex]=\"!canDecrement() ? -1 : tabIndex()\"\n      (click)=\"onQuickChangeButtonClick(-1, $event)\"\n      (ardHold)=\"onQuickChangeButtonClick(-1)\"\n      ardHoldSpaceKey\n    >\n      -\n    </ard-button>\n  }\n  <div class=\"ard-input-container\">\n    @if (shouldDisplayPlaceholder()) {\n      <ng-template\n        #defaultPlaceholderTemplate\n        let-plchldr\n      >\n        <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n      </ng-template>\n\n      <ng-template [ngTemplateOutlet]=\"placeholderTemplate()?.template || defaultPlaceholderTemplate\"></ng-template>\n    }\n\n    <input\n      #textInput\n      #focusableElement\n      type=\"text\"\n      [attr.id]=\"inputId()\"\n      [attr.tabindex]=\"tabIndex()\"\n      [readonly]=\"readonly()\"\n      [disabled]=\"disabled()\"\n      (input)=\"onInput(textInput.value)\"\n      (focus)=\"onFocusMaster($event)\"\n      (blur)=\"onBlurMaster($event)\"\n      (change)=\"onChange($event)\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (mouseup)=\"$event.stopPropagation()\"\n      (copy)=\"onCopy($event)\"\n    />\n  </div>\n  @if (!noButtons()) {\n    <ard-button\n      class=\"ard-quick-change-button increment\"\n      [variant]=\"buttonVariant()\"\n      [appearance]=\"buttonAppearance()\"\n      color=\"none\"\n      [disabled]=\"!canIncrement()\"\n      [tabIndex]=\"!canIncrement() ? -1 : tabIndex()\"\n      (click)=\"onQuickChangeButtonClick(1, $event)\"\n      (ardHold)=\"onQuickChangeButtonClick(1)\"\n      ardHoldSpaceKey\n    >\n      +\n    </ard-button>\n  }\n</div>\n", styles: [".ard-number-input{display:flex;max-width:100%}.ard-number-input .ard-input-container{position:relative}.ard-number-input .ard-placeholder{position:absolute;left:0;right:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;pointer-events:none}.ard-text-align-left input,.ard-text-align-left .ard-placeholder{text-align:left}.ard-text-align-middle input,.ard-text-align-middle .ard-placeholder{text-align:center}.ard-text-align-right input,.ard-text-align-right .ard-placeholder{text-align:right}.ard-quick-change-button{-webkit-user-select:none;user-select:none;height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.HoldDirective, selector: "[ardHold]", inputs: ["disabled", "readonly", "ardHoldDelay", "ardHoldRepeat", "ardHoldSpaceKey", "ardHoldEnterKey"], outputs: ["ardHold"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "placeholderTemplate", first: true, predicate: ArdNumberInputPlaceholderTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["textInput"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-number-input\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-has-value]=\"value\"\n  (mousedown)=\"$event.preventDefault()\"\n  (mouseup)=\"onMouseup()\"\n>\n  @if (!noButtons()) {\n    <ard-button\n      class=\"ard-quick-change-button decrement\"\n      [variant]=\"buttonVariant()\"\n      [appearance]=\"buttonAppearance()\"\n      color=\"none\"\n      [disabled]=\"!canDecrement()\"\n      [tabIndex]=\"!canDecrement() ? -1 : tabIndex()\"\n      (click)=\"onQuickChangeButtonClick(-1, $event)\"\n      (ardHold)=\"onQuickChangeButtonClick(-1)\"\n      ardHoldSpaceKey\n    >\n      -\n    </ard-button>\n  }\n  <div class=\"ard-input-container\">\n    @if (shouldDisplayPlaceholder()) {\n      <ng-template\n        #defaultPlaceholderTemplate\n        let-plchldr\n      >\n        <div class=\"ard-placeholder\">{{ placeholder() }}</div>\n      </ng-template>\n\n      <ng-template [ngTemplateOutlet]=\"placeholderTemplate()?.template || defaultPlaceholderTemplate\"></ng-template>\n    }\n\n    <input\n      #textInput\n      #focusableElement\n      type=\"text\"\n      [attr.id]=\"inputId()\"\n      [attr.tabindex]=\"tabIndex()\"\n      [readonly]=\"readonly()\"\n      [disabled]=\"disabled()\"\n      (input)=\"onInput(textInput.value)\"\n      (focus)=\"onFocusMaster($event)\"\n      (blur)=\"onBlurMaster($event)\"\n      (change)=\"onChange($event)\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (mouseup)=\"$event.stopPropagation()\"\n      (copy)=\"onCopy($event)\"\n    />\n  </div>\n  @if (!noButtons()) {\n    <ard-button\n      class=\"ard-quick-change-button increment\"\n      [variant]=\"buttonVariant()\"\n      [appearance]=\"buttonAppearance()\"\n      color=\"none\"\n      [disabled]=\"!canIncrement()\"\n      [tabIndex]=\"!canIncrement() ? -1 : tabIndex()\"\n      (click)=\"onQuickChangeButtonClick(1, $event)\"\n      (ardHold)=\"onQuickChangeButtonClick(1)\"\n      ardHoldSpaceKey\n    >\n      +\n    </ard-button>\n  }\n</div>\n", styles: [".ard-number-input{display:flex;max-width:100%}.ard-number-input .ard-input-container{position:relative}.ard-number-input .ard-placeholder{position:absolute;left:0;right:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;pointer-events:none}.ard-text-align-left input,.ard-text-align-left .ard-placeholder{text-align:left}.ard-text-align-middle input,.ard-text-align-middle .ard-placeholder{text-align:center}.ard-text-align-right input,.ard-text-align-right .ard-placeholder{text-align:right}.ard-quick-change-button{-webkit-user-select:none;user-select:none;height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.HoldDirective, selector: "[ardHold]", inputs: ["disabled", "readonly", "ardHoldDelay", "ardHoldRepeat", "ardAllowSpaceKey", "ardAllowEnterKey"], outputs: ["ardHold"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumNumberInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumNumberInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-number-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -5606,11 +5607,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumNumberInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumNumberInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumNumberInputModule, declarations: [ArdiumNumberInputComponent, ArdNumberInputPlaceholderTemplateDirective], imports: [CommonModule, ArdiumHoldEventModule, ArdiumButtonModule], exports: [ArdiumNumberInputComponent, ArdNumberInputPlaceholderTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumNumberInputModule, imports: [CommonModule, ArdiumHoldEventModule, ArdiumButtonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumNumberInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumNumberInputModule, declarations: [ArdiumNumberInputComponent, ArdNumberInputPlaceholderTemplateDirective], imports: [CommonModule, ArdiumHoldEventModule, ArdiumButtonModule], exports: [ArdiumNumberInputComponent, ArdNumberInputPlaceholderTemplateDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumNumberInputModule, imports: [CommonModule, ArdiumHoldEventModule, ArdiumButtonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumNumberInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumNumberInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumNumberInputComponent, ArdNumberInputPlaceholderTemplateDirective],
@@ -5647,10 +5648,10 @@ class ArdiumFabComponent extends _ButtonBase {
             // this.extended() ? 'ard-fab-extended' : '',
         ].join(' '));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFabComponent, deps: [{ token: ARD_FAB_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumFabComponent, selector: "ard-fab", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-fab\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-button-content\"\n    #content\n  >\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-fab{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;border-radius:9999px}.ard-fab .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}.ard-fab:not(.ard-fab-extended){aspect-ratio:1}.ard-fab:not(.ard-fab-extended) .ard-button-content{aspect-ratio:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabComponent, deps: [{ token: ARD_FAB_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumFabComponent, selector: "ard-fab", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-fab\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-button-content\"\n    #content\n  >\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-fab{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;border-radius:9999px}.ard-fab .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}.ard-fab:not(.ard-fab-extended){aspect-ratio:1}.ard-fab:not(.ard-fab-extended) .ard-button-content{aspect-ratio:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFabComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-fab', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  class=\"ard-fab\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div\n    class=\"ard-button-content\"\n    #content\n  >\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-fab{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;border-radius:9999px}.ard-fab .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}.ard-fab:not(.ard-fab-extended){aspect-ratio:1}.ard-fab:not(.ard-fab-extended) .ard-button-content{aspect-ratio:1}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -5659,11 +5660,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumFabModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFabModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFabModule, declarations: [ArdiumFabComponent], imports: [CommonModule], exports: [ArdiumFabComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFabModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabModule, declarations: [ArdiumFabComponent], imports: [CommonModule], exports: [ArdiumFabComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumFabModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumFabModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumFabComponent],
@@ -5695,10 +5696,10 @@ class ArdiumIconButtonComponent extends _FocusableComponentBase {
             this.compact() ? 'ard-compact' : '',
         ].join(' '));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconButtonComponent, deps: [{ token: ARD_ICON_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-icon-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-icon-button{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative}.ard-icon-button .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonComponent, deps: [{ token: ARD_ICON_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, lightColoring: { classPropertyName: "lightColoring", publicName: "lightColoring", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-icon-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-icon-button{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative}.ard-icon-button .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-icon-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  class=\"ard-icon-button\"\n  [type]=\"type()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (focus)=\"focusEvent.emit($event)\"\n  (blur)=\"blurEvent.emit($event)\"\n>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-button-content\">\n    <ng-content></ng-content>\n  </div>\n</button>\n", styles: [".ard-icon-button{display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative}.ard-icon-button .ard-button-content{max-height:100%;display:flex;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -5707,11 +5708,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumIconButtonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconButtonModule, declarations: [ArdiumIconButtonComponent], imports: [CommonModule], exports: [ArdiumIconButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconButtonModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonModule, declarations: [ArdiumIconButtonComponent], imports: [CommonModule], exports: [ArdiumIconButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumIconButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumIconButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumIconButtonComponent],
@@ -5766,8 +5767,8 @@ class ArdiumCheckboxComponent extends _BooleanComponentBase {
         this.selected.set(this.state() === CheckboxState.Selected);
         this._emitChange();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxComponent, deps: [{ token: ARD_CHECKBOX_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumCheckboxComponent, selector: "ard-checkbox", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, unselectedColor: { classPropertyName: "unselectedColor", publicName: "unselectedColor", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { state: "stateChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxComponent, deps: [{ token: ARD_CHECKBOX_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumCheckboxComponent, selector: "ard-checkbox", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, unselectedColor: { classPropertyName: "unselectedColor", publicName: "unselectedColor", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { state: "stateChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumCheckboxComponent),
@@ -5775,7 +5776,7 @@ class ArdiumCheckboxComponent extends _BooleanComponentBase {
             },
         ], usesInheritance: true, ngImport: i0, template: "<button\n  class=\"ard-checkbox\"\n  role=\"checkbox\"\n  type=\"button\"\n  [id]=\"htmlId()\"\n  [ariaChecked]=\"selected()\"\n  [tabindex]=\"tabIndex()\"\n  [ngClass]=\"ngClasses()\"\n  (click)=\"toggleState()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n>\n  <div class=\"ard-hitbox\"></div>\n  <div class=\"ard-focus-overlay\"></div>\n  <div class=\"ard-checkbox-icon ard-icon-for-selected\"></div>\n  <div class=\"ard-checkbox-icon ard-icon-for-indeterminate\"></div>\n  <div class=\"ard-checkbox-icon ard-icon-for-unselected\"></div>\n</button>\n", styles: ["ard-checkbox{display:inline}.ard-checkbox{font-size:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-checkbox', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -5790,11 +5791,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumCheckboxModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxModule, declarations: [ArdiumCheckboxComponent], imports: [CommonModule], exports: [ArdiumCheckboxComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxModule, declarations: [ArdiumCheckboxComponent], imports: [CommonModule], exports: [ArdiumCheckboxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumCheckboxComponent],
@@ -5820,7 +5821,7 @@ class ArdiumRadioComponent extends _BooleanComponentBase {
     constructor(defaults) {
         super(defaults);
         this._changeDetector = inject(ChangeDetectorRef);
-        this.htmlId = input(crypto.randomUUID());
+        this.htmlId = input(Random.id());
         this.value = input();
         //! appearance
         this.color = input(this._DEFAULTS.color);
@@ -5847,10 +5848,10 @@ class ArdiumRadioComponent extends _BooleanComponentBase {
         // update radio button's status
         this._changeDetector.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioComponent, deps: [{ token: ARD_RADIO_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumRadioComponent, selector: "ard-radio", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  #focusableElement\n  class=\"ard-radio\"\n  type=\"button\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  (mousedown)=\"onMousedown()\"\n  (mouseup)=\"onMouseup()\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-radio-circles\">\n    <div class=\"ard-radio-outer-circle\"></div>\n    <div class=\"ard-radio-inner-circle\"></div>\n    <div class=\"ard-focus-overlay\"></div>\n    <div class=\"ard-hitbox\"></div>\n  </div>\n  <label [for]=\"htmlId()\">\n    <ng-content></ng-content>\n  </label>\n</button>\n\n<input\n  class=\"ard-radio-input-element\"\n  type=\"radio\"\n  [name]=\"name()\"\n  [id]=\"htmlId()\"\n  [checked]=\"selected()\"\n  #radio\n/>\n", styles: [".ard-radio{border:none;background:none}.ard-radio>label{pointer-events:none}ard-radio>.ard-radio-input-element{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioComponent, deps: [{ token: ARD_RADIO_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumRadioComponent, selector: "ard-radio", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<button\n  #focusableElement\n  class=\"ard-radio\"\n  type=\"button\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  (mousedown)=\"onMousedown()\"\n  (mouseup)=\"onMouseup()\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-radio-circles\">\n    <div class=\"ard-radio-outer-circle\"></div>\n    <div class=\"ard-radio-inner-circle\"></div>\n    <div class=\"ard-focus-overlay\"></div>\n    <div class=\"ard-hitbox\"></div>\n  </div>\n  <label [for]=\"htmlId()\">\n    <ng-content></ng-content>\n  </label>\n</button>\n\n<input\n  class=\"ard-radio-input-element\"\n  type=\"radio\"\n  [name]=\"name()\"\n  [id]=\"htmlId()\"\n  [checked]=\"selected()\"\n  #radio\n/>\n", styles: [".ard-radio{border:none;background:none}.ard-radio>label{pointer-events:none}ard-radio>.ard-radio-input-element{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-radio', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  #focusableElement\n  class=\"ard-radio\"\n  type=\"button\"\n  [ngClass]=\"ngClasses()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  (mousedown)=\"onMousedown()\"\n  (mouseup)=\"onMouseup()\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-radio-circles\">\n    <div class=\"ard-radio-outer-circle\"></div>\n    <div class=\"ard-radio-inner-circle\"></div>\n    <div class=\"ard-focus-overlay\"></div>\n    <div class=\"ard-hitbox\"></div>\n  </div>\n  <label [for]=\"htmlId()\">\n    <ng-content></ng-content>\n  </label>\n</button>\n\n<input\n  class=\"ard-radio-input-element\"\n  type=\"radio\"\n  [name]=\"name()\"\n  [id]=\"htmlId()\"\n  [checked]=\"selected()\"\n  #radio\n/>\n", styles: [".ard-radio{border:none;background:none}.ard-radio>label{pointer-events:none}ard-radio>.ard-radio-input-element{display:none}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -5875,7 +5876,7 @@ class ArdiumRadioGroupComponent extends _NgModelComponentBase {
         this.selected = model(null);
         //! name
         /** Name of the radio button group. All radio buttons inside this group will use this name. */
-        this.name = input(crypto.randomUUID());
+        this.name = input(Random.id());
         //! hooks
         this._childEventSubs = [];
         this._isContentInit = false;
@@ -6008,8 +6009,8 @@ class ArdiumRadioGroupComponent extends _NgModelComponentBase {
         }
         this._childEventSubs = [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.2", type: ArdiumRadioGroupComponent, selector: "ard-radio-group", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", selected: "selectedChange" }, host: { attributes: { "role": "radiogroup" }, properties: { "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.aria-describedby": "null", "attr.id": "this._htmlIdHostAttribute" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: ArdiumRadioGroupComponent, selector: "ard-radio-group", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", selected: "selectedChange" }, host: { attributes: { "role": "radiogroup" }, properties: { "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.aria-describedby": "null", "attr.id": "this._htmlIdHostAttribute" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumRadioGroupComponent),
@@ -6017,7 +6018,7 @@ class ArdiumRadioGroupComponent extends _NgModelComponentBase {
             },
         ], queries: [{ propertyName: "_radios", predicate: ArdiumRadioComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioGroupComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ard-radio-group',
@@ -6047,11 +6048,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumRadioModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioModule, declarations: [ArdiumRadioGroupComponent, ArdiumRadioComponent], imports: [CommonModule], exports: [ArdiumRadioGroupComponent, ArdiumRadioComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioModule, declarations: [ArdiumRadioGroupComponent, ArdiumRadioComponent], imports: [CommonModule], exports: [ArdiumRadioGroupComponent, ArdiumRadioComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRadioModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRadioModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumRadioGroupComponent, ArdiumRadioComponent],
@@ -6416,7 +6417,7 @@ class _SelectableListComponentBase extends _NgModelComponentBase {
         super(...arguments);
         //! public constants
         this.itemStorage = new SimpleItemStorage(this);
-        this.htmlId = crypto.randomUUID();
+        this.htmlId = Random.id();
         this.DEFAULTS = this._DEFAULTS;
         this._cd = inject(ChangeDetectorRef);
         //! binding-related inputs
@@ -6638,10 +6639,10 @@ class _SelectableListComponentBase extends _NgModelComponentBase {
     _highlightAll() {
         this.itemStorage.highlightAllItems();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _SelectableListComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: _SelectableListComponentBase, inputs: { valueFrom: { classPropertyName: "valueFrom", publicName: "valueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "labelFrom", isSignal: true, isRequired: false, transformFunction: null }, disabledFrom: { classPropertyName: "disabledFrom", publicName: "disabledFrom", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, multiselectable: { classPropertyName: "multiselectable", publicName: "multiselectable", isSignal: true, isRequired: false, transformFunction: null }, requireValue: { classPropertyName: "requireValue", publicName: "requireValue", isSignal: true, isRequired: false, transformFunction: null }, invertDisabled: { classPropertyName: "invertDisabled", publicName: "invertDisabled", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", addEvent: "add", removeEvent: "remove" }, host: { listeners: { "mousemove": "onMouseMove()", "keydown": "onKeyPress($event)" }, properties: { "attr.multiple": "this._multiselectableHostAttribute", "class.ard-multiselect": "this._multiselectableHostAttribute", "class.ard-require-value": "this._requireValueHostAttribute", "class.ard-touched": "this._touchedHostAttribute" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _SelectableListComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: _SelectableListComponentBase, inputs: { valueFrom: { classPropertyName: "valueFrom", publicName: "valueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "labelFrom", isSignal: true, isRequired: false, transformFunction: null }, disabledFrom: { classPropertyName: "disabledFrom", publicName: "disabledFrom", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, multiselectable: { classPropertyName: "multiselectable", publicName: "multiselectable", isSignal: true, isRequired: false, transformFunction: null }, requireValue: { classPropertyName: "requireValue", publicName: "requireValue", isSignal: true, isRequired: false, transformFunction: null }, invertDisabled: { classPropertyName: "invertDisabled", publicName: "invertDisabled", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change", addEvent: "add", removeEvent: "remove" }, host: { listeners: { "mousemove": "onMouseMove()", "keydown": "onKeyPress($event)" }, properties: { "attr.multiple": "this._multiselectableHostAttribute", "class.ard-multiselect": "this._multiselectableHostAttribute", "class.ard-require-value": "this._requireValueHostAttribute", "class.ard-touched": "this._touchedHostAttribute" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _SelectableListComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _SelectableListComponentBase, decorators: [{
             type: Directive
         }], propDecorators: { items: [{
                 type: Input
@@ -6704,10 +6705,10 @@ class ArdSegmentOptionTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSegmentOptionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSegmentOptionTemplateDirective, selector: "ng-template[ard-segm-option-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSegmentOptionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSegmentOptionTemplateDirective, selector: "ng-template[ard-segm-option-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSegmentOptionTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSegmentOptionTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[ard-segm-option-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -6797,10 +6798,10 @@ class ArdiumSegmentComponent extends _SelectableListComponentBase {
         super.onBlur(event);
         this.itemStorage.unhighlightAll();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSegmentComponent, deps: [{ token: ARD_SEGMENT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumSegmentComponent, selector: "ard-segment", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, iconBased: { classPropertyName: "iconBased", publicName: "iconBased", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, uniformWidths: { classPropertyName: "uniformWidths", publicName: "uniformWidths", isSignal: true, isRequired: false, transformFunction: null }, itemsPerRow: { classPropertyName: "itemsPerRow", publicName: "itemsPerRow", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "optionTemplate", first: true, predicate: ArdSegmentOptionTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  #focusableElement\n  class=\"ard-segment-container\"\n  [class.ard-disabled]=\"disabled()\"\n  [ariaDisabled]=\"disabled()\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-focus-visible]=\"isFocused && !isMouseBeingUsed\"\n  [class.ard-using-keyboard]=\"!isMouseBeingUsed\"\n  [attr.tabindex]=\"tabIndex()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n>\n  @for (row of itemRows(); track $index) {\n    <div\n      class=\"ard-segment-row\"\n      [class.ard-segment-row-partial]=\"row.isNotFull\"\n      [class.ard-segment-row-uniform]=\"uniformWidths() || itemsPerRow() < items.length\"\n      [style]=\"{ '--ard-_segment-row-items': itemsInActualRow }\"\n    >\n      @for (option of row.options; track $index) {\n        <button\n          type=\"button\"\n          class=\"ard-segment-option\"\n          tabindex=\"-1\"\n          [class.ard-option-disabled]=\"option.disabled() || (isItemLimitReached() && !option.selected())\"\n          [class.ard-option-selected]=\"option.selected()\"\n          [class.ard-option-highlighted]=\"option.highlighted()\"\n          [ariaSelected]=\"option.selected()\"\n          (mouseenter)=\"onItemMouseEnter(option, $event)\"\n          (mouseleave)=\"onItemMouseLeave(option, $event)\"\n          (click)=\"onItemClick(option, $event)\"\n        >\n          <div class=\"ard-focus-overlay\"></div>\n          <div class=\"ard-button-content\">\n            <span class=\"ard-option-label\">\n              <ng-template #defaultOptionTemplate>\n                {{ option.label() }}\n              </ng-template>\n\n              <ng-template\n                [ngTemplateOutlet]=\"optionTemplate()?.template || defaultOptionTemplate\"\n                [ngTemplateOutletContext]=\"getOptionContext(option)\"\n              />\n            </span>\n          </div>\n        </button>\n      }\n    </div>\n  }\n</div>\n", styles: [".ard-segment-container{display:flex;flex-direction:column}.ard-segment-container.ard-align-left .ard-segment-option{justify-content:left}.ard-segment-container.ard-align-middle .ard-segment-option{justify-content:center}.ard-segment-container.ard-align-right .ard-segment-option{justify-content:right}.ard-segment-row{width:100%;display:flex;align-items:center}.ard-segment-row.ard-segment-row-uniform{display:grid;grid-template-columns:repeat(var(--ard-_segment-row-items),1fr)}.ard-segment-option{-webkit-user-select:none;user-select:none}.ard-option-disabled{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.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: "18.2.13", ngImport: i0, type: ArdiumSegmentComponent, deps: [{ token: ARD_SEGMENT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumSegmentComponent, selector: "ard-segment", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, iconBased: { classPropertyName: "iconBased", publicName: "iconBased", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, uniformWidths: { classPropertyName: "uniformWidths", publicName: "uniformWidths", isSignal: true, isRequired: false, transformFunction: null }, itemsPerRow: { classPropertyName: "itemsPerRow", publicName: "itemsPerRow", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "optionTemplate", first: true, predicate: ArdSegmentOptionTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  #focusableElement\n  class=\"ard-segment-container\"\n  [class.ard-disabled]=\"disabled()\"\n  [ariaDisabled]=\"disabled()\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-focus-visible]=\"isFocused && !isMouseBeingUsed\"\n  [class.ard-using-keyboard]=\"!isMouseBeingUsed\"\n  [attr.tabindex]=\"tabIndex()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n>\n  @for (row of itemRows(); track $index) {\n    <div\n      class=\"ard-segment-row\"\n      [class.ard-segment-row-partial]=\"row.isNotFull\"\n      [class.ard-segment-row-uniform]=\"uniformWidths() || itemsPerRow() < items.length\"\n      [style]=\"{ '--ard-_segment-row-items': itemsInActualRow }\"\n    >\n      @for (option of row.options; track $index) {\n        <button\n          type=\"button\"\n          class=\"ard-segment-option\"\n          tabindex=\"-1\"\n          [class.ard-option-disabled]=\"option.disabled() || (isItemLimitReached() && !option.selected())\"\n          [class.ard-option-selected]=\"option.selected()\"\n          [class.ard-option-highlighted]=\"option.highlighted()\"\n          [ariaSelected]=\"option.selected()\"\n          (mouseenter)=\"onItemMouseEnter(option, $event)\"\n          (mouseleave)=\"onItemMouseLeave(option, $event)\"\n          (click)=\"onItemClick(option, $event)\"\n        >\n          <div class=\"ard-focus-overlay\"></div>\n          <div class=\"ard-button-content\">\n            <span class=\"ard-option-label\">\n              <ng-template #defaultOptionTemplate>\n                {{ option.label() }}\n              </ng-template>\n\n              <ng-template\n                [ngTemplateOutlet]=\"optionTemplate()?.template || defaultOptionTemplate\"\n                [ngTemplateOutletContext]=\"getOptionContext(option)\"\n              />\n            </span>\n          </div>\n        </button>\n      }\n    </div>\n  }\n</div>\n", styles: [".ard-segment-container{display:flex;flex-direction:column}.ard-segment-container.ard-align-left .ard-segment-option{justify-content:left}.ard-segment-container.ard-align-middle .ard-segment-option{justify-content:center}.ard-segment-container.ard-align-right .ard-segment-option{justify-content:right}.ard-segment-row{width:100%;display:flex;align-items:center}.ard-segment-row.ard-segment-row-uniform{display:grid;grid-template-columns:repeat(var(--ard-_segment-row-items),1fr)}.ard-segment-option{-webkit-user-select:none;user-select:none}.ard-option-disabled{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSegmentComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSegmentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-segment', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  #focusableElement\n  class=\"ard-segment-container\"\n  [class.ard-disabled]=\"disabled()\"\n  [ariaDisabled]=\"disabled()\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-focus-visible]=\"isFocused && !isMouseBeingUsed\"\n  [class.ard-using-keyboard]=\"!isMouseBeingUsed\"\n  [attr.tabindex]=\"tabIndex()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n>\n  @for (row of itemRows(); track $index) {\n    <div\n      class=\"ard-segment-row\"\n      [class.ard-segment-row-partial]=\"row.isNotFull\"\n      [class.ard-segment-row-uniform]=\"uniformWidths() || itemsPerRow() < items.length\"\n      [style]=\"{ '--ard-_segment-row-items': itemsInActualRow }\"\n    >\n      @for (option of row.options; track $index) {\n        <button\n          type=\"button\"\n          class=\"ard-segment-option\"\n          tabindex=\"-1\"\n          [class.ard-option-disabled]=\"option.disabled() || (isItemLimitReached() && !option.selected())\"\n          [class.ard-option-selected]=\"option.selected()\"\n          [class.ard-option-highlighted]=\"option.highlighted()\"\n          [ariaSelected]=\"option.selected()\"\n          (mouseenter)=\"onItemMouseEnter(option, $event)\"\n          (mouseleave)=\"onItemMouseLeave(option, $event)\"\n          (click)=\"onItemClick(option, $event)\"\n        >\n          <div class=\"ard-focus-overlay\"></div>\n          <div class=\"ard-button-content\">\n            <span class=\"ard-option-label\">\n              <ng-template #defaultOptionTemplate>\n                {{ option.label() }}\n              </ng-template>\n\n              <ng-template\n                [ngTemplateOutlet]=\"optionTemplate()?.template || defaultOptionTemplate\"\n                [ngTemplateOutletContext]=\"getOptionContext(option)\"\n              />\n            </span>\n          </div>\n        </button>\n      }\n    </div>\n  }\n</div>\n", styles: [".ard-segment-container{display:flex;flex-direction:column}.ard-segment-container.ard-align-left .ard-segment-option{justify-content:left}.ard-segment-container.ard-align-middle .ard-segment-option{justify-content:center}.ard-segment-container.ard-align-right .ard-segment-option{justify-content:right}.ard-segment-row{width:100%;display:flex;align-items:center}.ard-segment-row.ard-segment-row-uniform{display:grid;grid-template-columns:repeat(var(--ard-_segment-row-items),1fr)}.ard-segment-option{-webkit-user-select:none;user-select:none}.ard-option-disabled{pointer-events:none}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -6809,11 +6810,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumSegmentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSegmentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSegmentModule, declarations: [ArdiumSegmentComponent, ArdSegmentOptionTemplateDirective], imports: [CommonModule], exports: [ArdiumSegmentComponent, ArdSegmentOptionTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSegmentModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSegmentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSegmentModule, declarations: [ArdiumSegmentComponent, ArdSegmentOptionTemplateDirective], imports: [CommonModule], exports: [ArdiumSegmentComponent, ArdSegmentOptionTemplateDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSegmentModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSegmentModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSegmentModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumSegmentComponent, ArdSegmentOptionTemplateDirective],
@@ -6858,8 +6859,8 @@ class ArdiumSlideToggleComponent extends _BooleanComponentBase {
             return [`ard-color-${this.color()}`, `ard-appearance-${this.appearance()}`, this.wrapperClass() ?? ''].join(' ');
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSlideToggleComponent, deps: [{ token: ARD_SLIDE_TOGGLE_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumSlideToggleComponent, selector: "ard-slide-toggle", inputs: { wrapperClass: { classPropertyName: "wrapperClass", publicName: "wrapperClass", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, selectedIcon: { classPropertyName: "selectedIcon", publicName: "selectedIcon", isSignal: true, isRequired: false, transformFunction: null }, unselectedIcon: { classPropertyName: "unselectedIcon", publicName: "unselectedIcon", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSlideToggleComponent, deps: [{ token: ARD_SLIDE_TOGGLE_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumSlideToggleComponent, selector: "ard-slide-toggle", inputs: { wrapperClass: { classPropertyName: "wrapperClass", publicName: "wrapperClass", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, selectedIcon: { classPropertyName: "selectedIcon", publicName: "selectedIcon", isSignal: true, isRequired: false, transformFunction: null }, unselectedIcon: { classPropertyName: "unselectedIcon", publicName: "unselectedIcon", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumSlideToggleComponent),
@@ -6867,7 +6868,7 @@ class ArdiumSlideToggleComponent extends _BooleanComponentBase {
             },
         ], usesInheritance: true, ngImport: i0, template: "<button\n  type=\"button\"\n  role=\"checkbox\"\n  [ariaChecked]=\"selected()\"\n  class=\"ard-slide-toggle\"\n  [class.ard-slide-toggle-selected]=\"selected()\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (click)=\"toggleSelected()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n>\n  <div class=\"ard-hitbox\"></div>\n  <div class=\"ard-slide-toggle-track\">\n    <div class=\"ard-slide-toggle-track-overlay\"></div>\n  </div>\n  <div class=\"ard-slide-toggle-handle\">\n    <div class=\"ard-focus-overlay\"></div>\n    @if (selectedIcon() ?? icon()) {\n      <div class=\"ard-slide-toggle-icon ard-icon-for-selected\">{{ selectedIcon() ?? icon() }}</div>\n    }\n    @if (unselectedIcon() ?? icon()) {\n      <div class=\"ard-slide-toggle-icon ard-icon-for-unselected\">{{ unselectedIcon() ?? icon() }}</div>\n    }\n  </div>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSlideToggleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSlideToggleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-slide-toggle', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -6882,11 +6883,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumSlideToggleModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSlideToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSlideToggleModule, declarations: [ArdiumSlideToggleComponent], imports: [CommonModule], exports: [ArdiumSlideToggleComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSlideToggleModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSlideToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSlideToggleModule, declarations: [ArdiumSlideToggleComponent], imports: [CommonModule], exports: [ArdiumSlideToggleComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSlideToggleModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSlideToggleModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSlideToggleModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumSlideToggleComponent],
@@ -6899,10 +6900,10 @@ class ArdSliderTooltipDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSliderTooltipDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdSliderTooltipDirective, selector: "ng-template[ard-slider-tooltip-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSliderTooltipDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdSliderTooltipDirective, selector: "ng-template[ard-slider-tooltip-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdSliderTooltipDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdSliderTooltipDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[ard-slider-tooltip-tmp]',
@@ -7141,10 +7142,10 @@ class _AbstractSlider extends _NgModelComponentBase {
     _increment(event, steps = 1) {
         this._offset(+steps, event.shiftKey);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _AbstractSlider, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.0.2", type: _AbstractSlider, inputs: { noTooltip: { classPropertyName: "noTooltip", publicName: "noTooltip", isSignal: true, isRequired: false, transformFunction: null }, tooltipFormatFn: { classPropertyName: "tooltipFormatFn", publicName: "tooltipFormatFn", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, shiftMultiplier: { classPropertyName: "shiftMultiplier", publicName: "shiftMultiplier", isSignal: true, isRequired: false, transformFunction: null }, showValueTicks: { classPropertyName: "showValueTicks", publicName: "showValueTicks", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, tooltipBehavior: { classPropertyName: "tooltipBehavior", publicName: "tooltipBehavior", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:pointerup": "onPointerUp($event)", "document:touchend": "onPointerUp($event)", "keydown": "onKeyPress($event)" } }, queries: [{ propertyName: "tooltipTemplate", first: true, predicate: ArdSliderTooltipDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["track"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _AbstractSlider, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.2.13", type: _AbstractSlider, inputs: { noTooltip: { classPropertyName: "noTooltip", publicName: "noTooltip", isSignal: true, isRequired: false, transformFunction: null }, tooltipFormatFn: { classPropertyName: "tooltipFormatFn", publicName: "tooltipFormatFn", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, shiftMultiplier: { classPropertyName: "shiftMultiplier", publicName: "shiftMultiplier", isSignal: true, isRequired: false, transformFunction: null }, showValueTicks: { classPropertyName: "showValueTicks", publicName: "showValueTicks", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, tooltipBehavior: { classPropertyName: "tooltipBehavior", publicName: "tooltipBehavior", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:pointerup": "onPointerUp($event)", "document:touchend": "onPointerUp($event)", "keydown": "onKeyPress($event)" } }, queries: [{ propertyName: "tooltipTemplate", first: true, predicate: ArdSliderTooltipDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["track"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _AbstractSlider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _AbstractSlider, decorators: [{
             type: Directive
         }], propDecorators: { value: [{
                 type: Input
@@ -7297,10 +7298,10 @@ class ArdiumRangeSliderComponent extends _AbstractSlider {
         super.onBlur(event);
         this.currentHandle.set(null);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRangeSliderComponent, deps: [{ token: ARD_SLIDER_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumRangeSliderComponent, selector: "ard-range-slider", host: { listeners: { "document:mousemove": "onPointerMove($event)", "document:touchmove": "onPointerMove($event)" } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-range-slider-container-master\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-slider-handle-grabbed]=\"isSliderHandleGrabbed()\"\n  [style]=\"{ '--_ard-slider-transition': sliderTransition() }\"\n>\n  <div class=\"ard-slider-container\">\n    <div\n      #track\n      class=\"ard-slider-track\"\n      (pointerdown)=\"onTrackHitboxPointerDown($event)\"\n    >\n      <div class=\"ard-hitbox\"></div>\n      <div class=\"ard-slider-track-overlay ard-slider-track-inactive\"></div>\n      <div\n        class=\"ard-slider-track-overlay ard-slider-track-active\"\n        [style]=\"{\n          left: trackOverlayLeft,\n          width: trackOverlayWidth\n        }\"\n      ></div>\n      @if (showValueTicks()) {\n        <div class=\"ard-value-tick-container\">\n          @for (tick of _tickArray(); track tick) {\n            <div\n              class=\"ard-value-tick\"\n              [style]=\"{ left: tick }\"\n            ></div>\n          }\n        </div>\n      }\n    </div>\n    <button\n      #focusableElement\n      type=\"button\"\n      class=\"ard-slider-handle\"\n      [tabindex]=\"tabIndex()\"\n      [class.ard-grabbed]=\"isSliderHandleGrabbed() && currentHandle() === 1\"\n      (pointerdown)=\"onPointerDownOnHandle($event, 1)\"\n      (focus)=\"onHandleFocus($event, 1)\"\n      (blur)=\"onBlur($event)\"\n      [style]=\"{ left: getHandlePosition(1) }\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <div class=\"ard-hitbox\"></div>\n    </button>\n    @if (tooltipBehavior() !== 'never') {\n      <div\n        class=\"ard-slider-tooltip-wrapper\"\n        [class.ard-tooltip-always]=\"tooltipBehavior() === 'always'\"\n        [style]=\"{ left: getHandlePosition(1) }\"\n      >\n        <ng-template\n          #defaultTooltipTemplate\n          let-value\n        >\n          <div class=\"ard-slider-tooltip\">{{ value }}</div>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"tooltipTemplate()?.template || defaultTooltipTemplate\"\n          [ngTemplateOutletContext]=\"getTooltipContext('low')\"\n        >\n        </ng-template>\n      </div>\n    }\n    <button\n      #focusableElement\n      type=\"button\"\n      class=\"ard-slider-handle\"\n      [tabindex]=\"tabIndex()\"\n      [class.ard-grabbed]=\"isSliderHandleGrabbed() && currentHandle() === 2\"\n      (pointerdown)=\"onPointerDownOnHandle($event, 2)\"\n      (focus)=\"onHandleFocus($event, 2)\"\n      (blur)=\"onBlur($event)\"\n      [style]=\"{ left: getHandlePosition(2) }\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <div class=\"ard-hitbox\"></div>\n    </button>\n    @if (tooltipBehavior() !== 'never') {\n      <div\n        class=\"ard-slider-tooltip-wrapper\"\n        [class.ard-tooltip-always]=\"tooltipBehavior() === 'always'\"\n        [style]=\"{ left: getHandlePosition(2) }\"\n      >\n        <ng-template\n          #defaultTooltipTemplate\n          let-value\n        >\n          <div class=\"ard-slider-tooltip\">{{ value }}</div>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"tooltipTemplate()?.template || defaultTooltipTemplate\"\n          [ngTemplateOutletContext]=\"getTooltipContext('high')\"\n        >\n        </ng-template>\n      </div>\n    }\n  </div>\n  @if (labelObjects().length) {\n    <div\n      class=\"ard-slider-label-container\"\n      *ngIf=\"labelObjects.length\"\n    >\n      @for (label of labelObjects(); track $index) {\n        <div\n          class=\"ard-slider-label\"\n          [style]=\"{ left: label.positionPercent }\"\n        >\n          {{ label.label }}\n        </div>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #handleThumbBase>\n  <div class=\"ard-slide-thumb\"></div>\n</ng-template>\n", styles: ["body.ard-prevent-touch-actions,body.ard-prevent-touch-actions *{touch-action:none}.ard-range-slider-container-master{display:flex;flex-direction:column}.ard-range-slider-container-master.ard-labels-top{flex-direction:column-reverse}.ard-range-slider-container-master .ard-slider-tooltip-wrapper{position:absolute;transform:translate(-50%);pointer-events:none}.ard-range-slider-container-master.ard-tooltip-top .ard-slider-tooltip-wrapper{bottom:100%}.ard-range-slider-container-master.ard-tooltip-bottom .ard-slider-tooltip-wrapper{top:100%}.ard-range-slider-container-master .ard-slider-handle{position:absolute;left:0;transform:translate(-50%)}.ard-range-slider-container-master .ard-slider-tooltip,.ard-range-slider-container-master .ard-slider-track,.ard-range-slider-container-master .ard-value-tick-container{position:relative}.ard-range-slider-container-master .ard-value-tick{position:absolute}.ard-range-slider-container-master .ard-slider-label-container{position:relative;width:100%;height:1em}.ard-range-slider-container-master .ard-slider-label{position:absolute;line-height:1em}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.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: "18.2.13", ngImport: i0, type: ArdiumRangeSliderComponent, deps: [{ token: ARD_SLIDER_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumRangeSliderComponent, selector: "ard-range-slider", host: { listeners: { "document:mousemove": "onPointerMove($event)", "document:touchmove": "onPointerMove($event)" } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-range-slider-container-master\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-slider-handle-grabbed]=\"isSliderHandleGrabbed()\"\n  [style]=\"{ '--_ard-slider-transition': sliderTransition() }\"\n>\n  <div class=\"ard-slider-container\">\n    <div\n      #track\n      class=\"ard-slider-track\"\n      (pointerdown)=\"onTrackHitboxPointerDown($event)\"\n    >\n      <div class=\"ard-hitbox\"></div>\n      <div class=\"ard-slider-track-overlay ard-slider-track-inactive\"></div>\n      <div\n        class=\"ard-slider-track-overlay ard-slider-track-active\"\n        [style]=\"{\n          left: trackOverlayLeft,\n          width: trackOverlayWidth\n        }\"\n      ></div>\n      @if (showValueTicks()) {\n        <div class=\"ard-value-tick-container\">\n          @for (tick of _tickArray(); track tick) {\n            <div\n              class=\"ard-value-tick\"\n              [style]=\"{ left: tick }\"\n            ></div>\n          }\n        </div>\n      }\n    </div>\n    <button\n      #focusableElement\n      type=\"button\"\n      class=\"ard-slider-handle\"\n      [tabindex]=\"tabIndex()\"\n      [class.ard-grabbed]=\"isSliderHandleGrabbed() && currentHandle() === 1\"\n      (pointerdown)=\"onPointerDownOnHandle($event, 1)\"\n      (focus)=\"onHandleFocus($event, 1)\"\n      (blur)=\"onBlur($event)\"\n      [style]=\"{ left: getHandlePosition(1) }\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <div class=\"ard-hitbox\"></div>\n    </button>\n    @if (tooltipBehavior() !== 'never') {\n      <div\n        class=\"ard-slider-tooltip-wrapper\"\n        [class.ard-tooltip-always]=\"tooltipBehavior() === 'always'\"\n        [style]=\"{ left: getHandlePosition(1) }\"\n      >\n        <ng-template\n          #defaultTooltipTemplate\n          let-value\n        >\n          <div class=\"ard-slider-tooltip\">{{ value }}</div>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"tooltipTemplate()?.template || defaultTooltipTemplate\"\n          [ngTemplateOutletContext]=\"getTooltipContext('low')\"\n        >\n        </ng-template>\n      </div>\n    }\n    <button\n      #focusableElement\n      type=\"button\"\n      class=\"ard-slider-handle\"\n      [tabindex]=\"tabIndex()\"\n      [class.ard-grabbed]=\"isSliderHandleGrabbed() && currentHandle() === 2\"\n      (pointerdown)=\"onPointerDownOnHandle($event, 2)\"\n      (focus)=\"onHandleFocus($event, 2)\"\n      (blur)=\"onBlur($event)\"\n      [style]=\"{ left: getHandlePosition(2) }\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <div class=\"ard-hitbox\"></div>\n    </button>\n    @if (tooltipBehavior() !== 'never') {\n      <div\n        class=\"ard-slider-tooltip-wrapper\"\n        [class.ard-tooltip-always]=\"tooltipBehavior() === 'always'\"\n        [style]=\"{ left: getHandlePosition(2) }\"\n      >\n        <ng-template\n          #defaultTooltipTemplate\n          let-value\n        >\n          <div class=\"ard-slider-tooltip\">{{ value }}</div>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"tooltipTemplate()?.template || defaultTooltipTemplate\"\n          [ngTemplateOutletContext]=\"getTooltipContext('high')\"\n        >\n        </ng-template>\n      </div>\n    }\n  </div>\n  @if (labelObjects().length) {\n    <div\n      class=\"ard-slider-label-container\"\n      *ngIf=\"labelObjects.length\"\n    >\n      @for (label of labelObjects(); track $index) {\n        <div\n          class=\"ard-slider-label\"\n          [style]=\"{ left: label.positionPercent }\"\n        >\n          {{ label.label }}\n        </div>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #handleThumbBase>\n  <div class=\"ard-slide-thumb\"></div>\n</ng-template>\n", styles: ["body.ard-prevent-touch-actions,body.ard-prevent-touch-actions *{touch-action:none}.ard-range-slider-container-master{display:flex;flex-direction:column}.ard-range-slider-container-master.ard-labels-top{flex-direction:column-reverse}.ard-range-slider-container-master .ard-slider-tooltip-wrapper{position:absolute;transform:translate(-50%);pointer-events:none}.ard-range-slider-container-master.ard-tooltip-top .ard-slider-tooltip-wrapper{bottom:100%}.ard-range-slider-container-master.ard-tooltip-bottom .ard-slider-tooltip-wrapper{top:100%}.ard-range-slider-container-master .ard-slider-handle{position:absolute;left:0;transform:translate(-50%)}.ard-range-slider-container-master .ard-slider-tooltip,.ard-range-slider-container-master .ard-slider-track,.ard-range-slider-container-master .ard-value-tick-container{position:relative}.ard-range-slider-container-master .ard-value-tick{position:absolute}.ard-range-slider-container-master .ard-slider-label-container{position:relative;width:100%;height:1em}.ard-range-slider-container-master .ard-slider-label{position:absolute;line-height:1em}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRangeSliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRangeSliderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-range-slider', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-range-slider-container-master\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-slider-handle-grabbed]=\"isSliderHandleGrabbed()\"\n  [style]=\"{ '--_ard-slider-transition': sliderTransition() }\"\n>\n  <div class=\"ard-slider-container\">\n    <div\n      #track\n      class=\"ard-slider-track\"\n      (pointerdown)=\"onTrackHitboxPointerDown($event)\"\n    >\n      <div class=\"ard-hitbox\"></div>\n      <div class=\"ard-slider-track-overlay ard-slider-track-inactive\"></div>\n      <div\n        class=\"ard-slider-track-overlay ard-slider-track-active\"\n        [style]=\"{\n          left: trackOverlayLeft,\n          width: trackOverlayWidth\n        }\"\n      ></div>\n      @if (showValueTicks()) {\n        <div class=\"ard-value-tick-container\">\n          @for (tick of _tickArray(); track tick) {\n            <div\n              class=\"ard-value-tick\"\n              [style]=\"{ left: tick }\"\n            ></div>\n          }\n        </div>\n      }\n    </div>\n    <button\n      #focusableElement\n      type=\"button\"\n      class=\"ard-slider-handle\"\n      [tabindex]=\"tabIndex()\"\n      [class.ard-grabbed]=\"isSliderHandleGrabbed() && currentHandle() === 1\"\n      (pointerdown)=\"onPointerDownOnHandle($event, 1)\"\n      (focus)=\"onHandleFocus($event, 1)\"\n      (blur)=\"onBlur($event)\"\n      [style]=\"{ left: getHandlePosition(1) }\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <div class=\"ard-hitbox\"></div>\n    </button>\n    @if (tooltipBehavior() !== 'never') {\n      <div\n        class=\"ard-slider-tooltip-wrapper\"\n        [class.ard-tooltip-always]=\"tooltipBehavior() === 'always'\"\n        [style]=\"{ left: getHandlePosition(1) }\"\n      >\n        <ng-template\n          #defaultTooltipTemplate\n          let-value\n        >\n          <div class=\"ard-slider-tooltip\">{{ value }}</div>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"tooltipTemplate()?.template || defaultTooltipTemplate\"\n          [ngTemplateOutletContext]=\"getTooltipContext('low')\"\n        >\n        </ng-template>\n      </div>\n    }\n    <button\n      #focusableElement\n      type=\"button\"\n      class=\"ard-slider-handle\"\n      [tabindex]=\"tabIndex()\"\n      [class.ard-grabbed]=\"isSliderHandleGrabbed() && currentHandle() === 2\"\n      (pointerdown)=\"onPointerDownOnHandle($event, 2)\"\n      (focus)=\"onHandleFocus($event, 2)\"\n      (blur)=\"onBlur($event)\"\n      [style]=\"{ left: getHandlePosition(2) }\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <div class=\"ard-hitbox\"></div>\n    </button>\n    @if (tooltipBehavior() !== 'never') {\n      <div\n        class=\"ard-slider-tooltip-wrapper\"\n        [class.ard-tooltip-always]=\"tooltipBehavior() === 'always'\"\n        [style]=\"{ left: getHandlePosition(2) }\"\n      >\n        <ng-template\n          #defaultTooltipTemplate\n          let-value\n        >\n          <div class=\"ard-slider-tooltip\">{{ value }}</div>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"tooltipTemplate()?.template || defaultTooltipTemplate\"\n          [ngTemplateOutletContext]=\"getTooltipContext('high')\"\n        >\n        </ng-template>\n      </div>\n    }\n  </div>\n  @if (labelObjects().length) {\n    <div\n      class=\"ard-slider-label-container\"\n      *ngIf=\"labelObjects.length\"\n    >\n      @for (label of labelObjects(); track $index) {\n        <div\n          class=\"ard-slider-label\"\n          [style]=\"{ left: label.positionPercent }\"\n        >\n          {{ label.label }}\n        </div>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #handleThumbBase>\n  <div class=\"ard-slide-thumb\"></div>\n</ng-template>\n", styles: ["body.ard-prevent-touch-actions,body.ard-prevent-touch-actions *{touch-action:none}.ard-range-slider-container-master{display:flex;flex-direction:column}.ard-range-slider-container-master.ard-labels-top{flex-direction:column-reverse}.ard-range-slider-container-master .ard-slider-tooltip-wrapper{position:absolute;transform:translate(-50%);pointer-events:none}.ard-range-slider-container-master.ard-tooltip-top .ard-slider-tooltip-wrapper{bottom:100%}.ard-range-slider-container-master.ard-tooltip-bottom .ard-slider-tooltip-wrapper{top:100%}.ard-range-slider-container-master .ard-slider-handle{position:absolute;left:0;transform:translate(-50%)}.ard-range-slider-container-master .ard-slider-tooltip,.ard-range-slider-container-master .ard-slider-track,.ard-range-slider-container-master .ard-value-tick-container{position:relative}.ard-range-slider-container-master .ard-value-tick{position:absolute}.ard-range-slider-container-master .ard-slider-label-container{position:relative;width:100%;height:1em}.ard-range-slider-container-master .ard-slider-label{position:absolute;line-height:1em}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -7315,11 +7316,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumRangeSliderModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRangeSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRangeSliderModule, declarations: [ArdiumRangeSliderComponent], imports: [CommonModule], exports: [ArdiumRangeSliderComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRangeSliderModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRangeSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRangeSliderModule, declarations: [ArdiumRangeSliderComponent], imports: [CommonModule], exports: [ArdiumRangeSliderComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRangeSliderModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumRangeSliderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumRangeSliderModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumRangeSliderComponent],
@@ -7392,8 +7393,8 @@ class ArdiumSliderComponent extends _AbstractSlider {
         //9 is an arbitrary number that just works well. ¯\_(ツ)_/¯
         return roundToPrecision(newVal, 9);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSliderComponent, deps: [{ token: ARD_SLIDER_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumSliderComponent, selector: "ard-slider", host: { listeners: { "document:mousemove": "onPointerMove($event)", "document:touchmove": "onPointerMove($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSliderComponent, deps: [{ token: ARD_SLIDER_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumSliderComponent, selector: "ard-slider", host: { listeners: { "document:mousemove": "onPointerMove($event)", "document:touchmove": "onPointerMove($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumSliderComponent),
@@ -7401,7 +7402,7 @@ class ArdiumSliderComponent extends _AbstractSlider {
             },
         ], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-slider-container-master\"\n  [ngClass]=\"ngClasses()\"\n  [class.ard-slider-handle-grabbed]=\"isSliderHandleGrabbed()\"\n  [style]=\"{ '--_ard-slider-transition': sliderTransition() }\"\n>\n  <div class=\"ard-slider-container\">\n    <div\n      #track\n      class=\"ard-slider-track\"\n      (pointerdown)=\"onTrackHitboxPointerDown($event)\"\n    >\n      <div class=\"ard-hitbox\"></div>\n      <div class=\"ard-slider-track-overlay ard-slider-track-inactive\"></div>\n      <div\n        class=\"ard-slider-track-overlay ard-slider-track-active\"\n        [style]=\"{ width: getHandlePosition(1) }\"\n      ></div>\n      @if (showValueTicks()) {\n        <div class=\"ard-value-tick-container\">\n          @for (tick of _tickArray(); track tick) {\n            <div\n              class=\"ard-value-tick\"\n              [style]=\"{ left: tick }\"\n            ></div>\n          }\n        </div>\n      }\n    </div>\n    <button\n      #focusableElement\n      type=\"button\"\n      class=\"ard-slider-handle\"\n      [tabindex]=\"tabIndex()\"\n      [class.ard-grabbed]=\"isSliderHandleGrabbed()\"\n      (pointerdown)=\"onPointerDownOnHandle($event)\"\n      (touchstart)=\"onPointerDownOnHandle($event)\"\n      (focus)=\"onFocus($event)\"\n      (blur)=\"onBlur($event)\"\n      [style]=\"{ left: getHandlePosition(1) }\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <div class=\"ard-hitbox\"></div>\n    </button>\n    @if (tooltipBehavior() !== 'never') {\n      <div\n        class=\"ard-slider-tooltip-wrapper\"\n        [class.ard-tooltip-always]=\"tooltipBehavior() === 'always'\"\n        [style]=\"{ left: getHandlePosition(1) }\"\n      >\n        <ng-template\n          #defaultTooltipTemplate\n          let-value\n        >\n          <div class=\"ard-slider-tooltip\">{{ value }}</div>\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"tooltipTemplate()?.template || defaultTooltipTemplate\"\n          [ngTemplateOutletContext]=\"getTooltipContext()\"\n        >\n        </ng-template>\n      </div>\n    }\n  </div>\n  @if (labelObjects().length) {\n    <div\n      class=\"ard-slider-label-container\"\n      *ngIf=\"labelObjects.length\"\n    >\n      @for (label of labelObjects(); track $index) {\n        <div\n          class=\"ard-slider-label\"\n          [style]=\"{ left: label.positionPercent }\"\n        >\n          {{ label.label }}\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: ["body.ard-prevent-touch-actions,body.ard-prevent-touch-actions *{touch-action:none}.ard-slider-container-master{display:flex;flex-direction:column}.ard-slider-container-master.ard-labels-top{flex-direction:column-reverse}.ard-slider-container-master .ard-slider-tooltip-wrapper{position:absolute;transform:translate(-50%);pointer-events:none}.ard-slider-container-master.ard-tooltip-top .ard-slider-tooltip-wrapper{bottom:100%}.ard-slider-container-master.ard-tooltip-bottom .ard-slider-tooltip-wrapper{top:100%}.ard-slider-container-master .ard-slider-handle{position:absolute;left:0;transform:translate(-50%)}.ard-slider-container-master .ard-slider-tooltip,.ard-slider-container-master .ard-slider-track,.ard-slider-container-master .ard-value-tick-container{position:relative}.ard-slider-container-master .ard-value-tick{position:absolute}.ard-slider-container-master .ard-slider-label-container{position:relative;width:100%;height:1em}.ard-slider-container-master .ard-slider-label{position:absolute;line-height:1em}.ard-disabled .ard-slider-container-master,.ard-disabled .ard-range-slider-container-master{pointer-events:none;opacity:60%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSliderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-slider', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -7422,11 +7423,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumSliderModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSliderModule, declarations: [ArdiumSliderComponent, ArdSliderTooltipDirective], imports: [CommonModule, OverlayModule], exports: [ArdiumSliderComponent, ArdSliderTooltipDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSliderModule, imports: [CommonModule, OverlayModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSliderModule, declarations: [ArdiumSliderComponent, ArdSliderTooltipDirective], imports: [CommonModule, OverlayModule], exports: [ArdiumSliderComponent, ArdSliderTooltipDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSliderModule, imports: [CommonModule, OverlayModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSliderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSliderModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumSliderComponent, ArdSliderTooltipDirective],
@@ -7503,10 +7504,10 @@ class ArdiumStarComponent {
     _transformFillMode(value) {
         return typeof value === 'boolean' ? (value ? StarFillMode.Filled : StarFillMode.None) : value;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumStarComponent, selector: "ard-star", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ard-star\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-star-icon ard-star-selected\"></div>\n  <div class=\"ard-star-icon ard-star-half\"></div>\n  <div class=\"ard-star-icon ard-star-unselected\"></div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumStarComponent, selector: "ard-star", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ard-star\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-star-icon ard-star-selected\"></div>\n  <div class=\"ard-star-icon ard-star-half\"></div>\n  <div class=\"ard-star-icon ard-star-unselected\"></div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-star', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-star\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-star-icon ard-star-selected\"></div>\n  <div class=\"ard-star-icon ard-star-half\"></div>\n  <div class=\"ard-star-icon ard-star-unselected\"></div>\n</div>\n" }]
         }] });
@@ -7526,8 +7527,8 @@ class ArdiumStarButtonComponent extends _BooleanComponentBase {
             return;
         this.toggleSelected();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarButtonComponent, deps: [{ token: ARD_STAR_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumStarButtonComponent, selector: "ard-star-button", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, clickStrategy: { classPropertyName: "clickStrategy", publicName: "clickStrategy", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarButtonComponent, deps: [{ token: ARD_STAR_BUTTON_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumStarButtonComponent, selector: "ard-star-button", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, clickStrategy: { classPropertyName: "clickStrategy", publicName: "clickStrategy", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumStarButtonComponent),
@@ -7535,7 +7536,7 @@ class ArdiumStarButtonComponent extends _BooleanComponentBase {
             },
         ], usesInheritance: true, ngImport: i0, template: "<button\n  #focusableElement\n  type=\"button\"\n  class=\"ard-star-button\"\n  [ngClass]=\"ngClasses()\"\n  (click)=\"onClick()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [tabindex]=\"tabIndex()\"\n>\n  <div class=\"ard-hitbox\"></div>\n  <div class=\"ard-focus-overlay\"></div>\n  <ard-star\n    [filled]=\"starFillState()\"\n    [color]=\"color()\"\n  ></ard-star>\n</button>\n", styles: [".ard-star-button{border:none;background:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumStarComponent, selector: "ard-star", inputs: ["wrapperClasses", "color", "filled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-star-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -7550,11 +7551,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumStarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarModule, declarations: [ArdiumStarComponent], imports: [CommonModule], exports: [ArdiumStarComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarModule, declarations: [ArdiumStarComponent], imports: [CommonModule], exports: [ArdiumStarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumStarComponent],
@@ -7564,11 +7565,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumStarButtonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarButtonModule, declarations: [ArdiumStarButtonComponent], imports: [CommonModule, ArdiumStarModule], exports: [ArdiumStarButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarButtonModule, imports: [CommonModule, ArdiumStarModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarButtonModule, declarations: [ArdiumStarButtonComponent], imports: [CommonModule, ArdiumStarModule], exports: [ArdiumStarButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarButtonModule, imports: [CommonModule, ArdiumStarModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumStarButtonComponent],
@@ -7745,8 +7746,8 @@ class ArdiumStarInputComponent extends _NgModelComponentBase {
     _onTabPress() {
         this.focusStarButtonByIndex(this.max() - 1);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarInputComponent, deps: [{ token: ARD_STAR_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumStarInputComponent, selector: "ard-star-input", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeEvent: "change", highlightEvent: "highlight", value: "valueChange" }, host: { listeners: { "keydown": "onKeyPress($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarInputComponent, deps: [{ token: ARD_STAR_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumStarInputComponent, selector: "ard-star-input", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeEvent: "change", highlightEvent: "highlight", value: "valueChange" }, host: { listeners: { "keydown": "onKeyPress($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumStarInputComponent),
@@ -7754,7 +7755,7 @@ class ArdiumStarInputComponent extends _NgModelComponentBase {
             },
         ], viewQueries: [{ propertyName: "starButtonInstances", predicate: ["starButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-star-input\"\n  [ngClass]=\"ngClasses()\"\n  (mouseleave)=\"setDisplayToValue()\"\n>\n  @for (object of starArray(); track $index) {\n    <ard-star-button\n      #starButton\n      [class.ard-star-not-in-value]=\"!object.isInValue\"\n      [color]=\"object.isInValue ? color() : 'none'\"\n      clickStrategy=\"noop\"\n      [selected]=\"object.filled\"\n      (click)=\"onStarClick($index)\"\n      (focus)=\"onStarButtonFocus($index, $event)\"\n      (blur)=\"onStarButtonBlur($event)\"\n      (mouseenter)=\"onStarHighlight($index)\"\n      [tabIndex]=\"tabIndex()\"\n    />\n  }\n</div>\n", styles: [".ard-star-input{width:max-content}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumStarButtonComponent, selector: "ard-star-button", inputs: ["wrapperClasses", "clickStrategy", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-star-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -7772,11 +7773,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumStarInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarInputModule, declarations: [ArdiumStarInputComponent], imports: [CommonModule, ArdiumStarButtonModule], exports: [ArdiumStarInputComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarInputModule, imports: [CommonModule, ArdiumStarButtonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarInputModule, declarations: [ArdiumStarInputComponent], imports: [CommonModule, ArdiumStarButtonModule], exports: [ArdiumStarInputComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarInputModule, imports: [CommonModule, ArdiumStarButtonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumStarInputComponent],
@@ -7885,8 +7886,8 @@ class ArdiumStateboxComponent extends _NgModelComponentBase {
     _emitChange() {
         this._onChangeRegistered?.(this.state());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStateboxComponent, deps: [{ token: ARD_STATEBOX_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumStateboxComponent, selector: "ard-statebox", inputs: { states: { classPropertyName: "states", publicName: "states", isSignal: true, isRequired: false, transformFunction: null }, clickStrategy: { classPropertyName: "clickStrategy", publicName: "clickStrategy", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { state: "stateChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStateboxComponent, deps: [{ token: ARD_STATEBOX_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumStateboxComponent, selector: "ard-statebox", inputs: { states: { classPropertyName: "states", publicName: "states", isSignal: true, isRequired: false, transformFunction: null }, clickStrategy: { classPropertyName: "clickStrategy", publicName: "clickStrategy", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { state: "stateChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ArdiumStarButtonComponent),
@@ -7894,7 +7895,7 @@ class ArdiumStateboxComponent extends _NgModelComponentBase {
             },
         ], usesInheritance: true, ngImport: i0, template: "<button\n  #focusableElement\n  type=\"button\"\n  class=\"ard-statebox\"\n  [ngClass]=\"ngClasses()\"\n  [tabindex]=\"tabIndex()\"\n  (click)=\"onClick()\"\n  (focus)=\"onFocus($event)\"\n  (blur)=\"onBlur($event)\"\n  [style]=\"ngStyle()\"\n>\n  <div class=\"ard-hitbox\"></div>\n  <div class=\"ard-focus-overlay\"></div>\n  @if (internalState().keepFrame) {\n    <div class=\"ard-statebox-frame\"></div>\n  }\n  <div [class]=\"internalState().displayAsIcon ? 'ard-statebox-icon' : 'ard-statebox-character'\">\n    {{ internalState().display }}\n  </div>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStateboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStateboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-statebox', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -7909,11 +7910,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumStateboxModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStateboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStateboxModule, declarations: [ArdiumStateboxComponent], imports: [CommonModule], exports: [ArdiumStateboxComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStateboxModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStateboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStateboxModule, declarations: [ArdiumStateboxComponent], imports: [CommonModule], exports: [ArdiumStateboxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStateboxModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStateboxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStateboxModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumStateboxComponent],
@@ -7953,7 +7954,7 @@ function provideCheckboxListDefaults(config) {
 class ArdiumCheckboxListComponent extends _NgModelComponentBase {
     constructor(defaults) {
         super(defaults);
-        this.htmlId = input(crypto.randomUUID());
+        this.htmlId = input(Random.id());
         this.DEFAULTS = this._DEFAULTS;
         // static values. Not meant to be changed.
         this.multiselectable = signal(true);
@@ -7966,7 +7967,9 @@ class ArdiumCheckboxListComponent extends _NgModelComponentBase {
         this.disabledFrom = input(this.DEFAULTS.disabledFrom);
         this.compareWith = input(this._DEFAULTS.compareWith);
         this.invertDisabled = input(this._DEFAULTS.invertDisabled, { transform: v => coerceBooleanProperty(v) });
-        this.maxSelectedItems = input(this._DEFAULTS.maxSelectedItems, { transform: v => coerceNumberProperty(v) });
+        this.maxSelectedItems = input(this._DEFAULTS.maxSelectedItems, {
+            transform: v => coerceNumberProperty(v, this._DEFAULTS.maxSelectedItems),
+        });
         //! appearance
         this.color = input(this._DEFAULTS.color);
         this.align = input(this._DEFAULTS.align);
@@ -8035,10 +8038,10 @@ class ArdiumCheckboxListComponent extends _NgModelComponentBase {
         }
         this.selectItem(v);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxListComponent, deps: [{ token: ARD_CHECKBOX_LIST_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumCheckboxListComponent, selector: "ard-checkbox-list", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, valueFrom: { classPropertyName: "valueFrom", publicName: "valueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "labelFrom", isSignal: true, isRequired: false, transformFunction: null }, disabledFrom: { classPropertyName: "disabledFrom", publicName: "disabledFrom", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, invertDisabled: { classPropertyName: "invertDisabled", publicName: "invertDisabled", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change" }, host: { properties: { "attr.id": "this._htmlIdHostAttribute" } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-checkbox-list\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (item of items; track item.index) {\n    <div\n      class=\"ard-checkbox-list__item\"\n      [class.ard-item-highlighted]=\"item.highlighted()\"\n      [class.ard-item-disabled]=\"item.disabled()\"\n      (mouseover)=\"onItemHighlight(item)\"\n      (mouseleave)=\"onItemBlur()\"\n      (click)=\"toggleItem(item)\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <ard-checkbox\n        [selected]=\"item.selected()\"\n        [disabled]=\"item.disabled()\"\n        [color]=\"color()\"\n        [htmlId]=\"htmlId() + item.index\"\n        [tabIndex]=\"tabIndex()\"\n        (focus)=\"onFocus($event)\"\n        (focus)=\"onItemFocus(item)\"\n        (blur)=\"onBlur($event)\"\n        (blur)=\"onItemBlur()\"\n        (select)=\"selectItem(item)\"\n        (unselect)=\"unselectItem(item)\"\n        (click)=\"$event.stopPropagation()\"\n      />\n      <label [for]=\"htmlId() + item.index\">\n        {{ item.label() }}\n      </label>\n    </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumCheckboxComponent, selector: "ard-checkbox", inputs: ["htmlId", "color", "unselectedColor", "state"], outputs: ["stateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxListComponent, deps: [{ token: ARD_CHECKBOX_LIST_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumCheckboxListComponent, selector: "ard-checkbox-list", inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, valueFrom: { classPropertyName: "valueFrom", publicName: "valueFrom", isSignal: true, isRequired: false, transformFunction: null }, labelFrom: { classPropertyName: "labelFrom", publicName: "labelFrom", isSignal: true, isRequired: false, transformFunction: null }, disabledFrom: { classPropertyName: "disabledFrom", publicName: "disabledFrom", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, invertDisabled: { classPropertyName: "invertDisabled", publicName: "invertDisabled", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", changeEvent: "change" }, host: { properties: { "attr.id": "this._htmlIdHostAttribute" } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-checkbox-list\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (item of items; track item.index) {\n    <div\n      class=\"ard-checkbox-list__item\"\n      [class.ard-item-highlighted]=\"item.highlighted()\"\n      [class.ard-item-disabled]=\"item.disabled()\"\n      (mouseover)=\"onItemHighlight(item)\"\n      (mouseleave)=\"onItemBlur()\"\n      (click)=\"toggleItem(item)\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <ard-checkbox\n        [selected]=\"item.selected()\"\n        [disabled]=\"item.disabled()\"\n        [color]=\"color()\"\n        [htmlId]=\"htmlId() + item.index\"\n        [tabIndex]=\"tabIndex()\"\n        (focus)=\"onFocus($event)\"\n        (focus)=\"onItemFocus(item)\"\n        (blur)=\"onBlur($event)\"\n        (blur)=\"onItemBlur()\"\n        (select)=\"selectItem(item)\"\n        (unselect)=\"unselectItem(item)\"\n        (click)=\"$event.stopPropagation()\"\n      />\n      <label [for]=\"htmlId() + item.index\">\n        {{ item.label() }}\n      </label>\n    </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumCheckboxComponent, selector: "ard-checkbox", inputs: ["htmlId", "color", "unselectedColor", "state"], outputs: ["stateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-checkbox-list', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-checkbox-list\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (item of items; track item.index) {\n    <div\n      class=\"ard-checkbox-list__item\"\n      [class.ard-item-highlighted]=\"item.highlighted()\"\n      [class.ard-item-disabled]=\"item.disabled()\"\n      (mouseover)=\"onItemHighlight(item)\"\n      (mouseleave)=\"onItemBlur()\"\n      (click)=\"toggleItem(item)\"\n    >\n      <div class=\"ard-focus-overlay\"></div>\n      <ard-checkbox\n        [selected]=\"item.selected()\"\n        [disabled]=\"item.disabled()\"\n        [color]=\"color()\"\n        [htmlId]=\"htmlId() + item.index\"\n        [tabIndex]=\"tabIndex()\"\n        (focus)=\"onFocus($event)\"\n        (focus)=\"onItemFocus(item)\"\n        (blur)=\"onBlur($event)\"\n        (blur)=\"onItemBlur()\"\n        (select)=\"selectItem(item)\"\n        (unselect)=\"unselectItem(item)\"\n        (click)=\"$event.stopPropagation()\"\n      />\n      <label [for]=\"htmlId() + item.index\">\n        {{ item.label() }}\n      </label>\n    </div>\n  }\n</div>\n" }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -8054,11 +8057,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumCheckboxListModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxListModule, declarations: [ArdiumCheckboxListComponent], imports: [CommonModule, ArdiumCheckboxModule], exports: [ArdiumCheckboxListComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxListModule, imports: [CommonModule, ArdiumCheckboxModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxListModule, declarations: [ArdiumCheckboxListComponent], imports: [CommonModule, ArdiumCheckboxModule], exports: [ArdiumCheckboxListComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxListModule, imports: [CommonModule, ArdiumCheckboxModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCheckboxListModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCheckboxListModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumCheckboxListComponent],
@@ -8181,10 +8184,10 @@ class ArdiumBadgeDirective {
         }
         this._renderer.removeClass(this._elRef.nativeElement, 'ard-badge-host');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumBadgeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumBadgeDirective, selector: "[ardBadge]", inputs: { text: { classPropertyName: "text", publicName: "ardBadge", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "ardBadgeColor", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "ardBadgeVariant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "ardBadgeSize", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "ardBadgePosition", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ardBadgeAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, hidden: { classPropertyName: "hidden", publicName: "ardBadgeHidden", isSignal: true, isRequired: false, transformFunction: null }, overlap: { classPropertyName: "overlap", publicName: "ardBadgeOverlap", isSignal: true, isRequired: false, transformFunction: null } }, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumBadgeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumBadgeDirective, selector: "[ardBadge]", inputs: { text: { classPropertyName: "text", publicName: "ardBadge", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "ardBadgeColor", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "ardBadgeVariant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "ardBadgeSize", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "ardBadgePosition", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ardBadgeAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, hidden: { classPropertyName: "hidden", publicName: "ardBadgeHidden", isSignal: true, isRequired: false, transformFunction: null }, overlap: { classPropertyName: "overlap", publicName: "ardBadgeOverlap", isSignal: true, isRequired: false, transformFunction: null } }, usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumBadgeDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumBadgeDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ardBadge]',
@@ -8192,11 +8195,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumBadgeModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumBadgeModule, declarations: [ArdiumBadgeDirective], imports: [CommonModule], exports: [ArdiumBadgeDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumBadgeModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumBadgeModule, declarations: [ArdiumBadgeDirective], imports: [CommonModule], exports: [ArdiumBadgeDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumBadgeModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumBadgeModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumBadgeModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumBadgeDirective],
@@ -8286,10 +8289,10 @@ class ArdiumProgressBarComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.2", type: ArdiumProgressBarComponent, selector: "ard-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, bufferValue: { classPropertyName: "bufferValue", publicName: "bufferValue", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, hideValue: { classPropertyName: "hideValue", publicName: "hideValue", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "valueTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-progress-bar\"\n  role=\"progressbar\"\n  [style]=\"cssVariables()\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-progress-bar__background\"></div>\n  <div class=\"ard-progress-bar__overlay-buffer\"></div>\n  <div class=\"ard-progress-bar__overlay\"></div>\n  <div class=\"ard-progress-bar__value\">\n    <ng-template\n      #defaultValueTemplate\n      let-value\n    >\n      {{ value * 100 | number: '1.0-0' }}%\n    </ng-template>\n\n    <ng-template\n      [ngTemplateOutlet]=\"valueTemplate() || defaultValueTemplate\"\n      [ngTemplateOutletContext]=\"getValueContext()\"\n    ></ng-template>\n  </div>\n</div>\n", styles: ["ard-progress-bar{display:block}.ard-progress-bar{position:relative}.ard-progress-bar .ard-progress-bar-background,.ard-progress-bar .ard-progress-bar-overlay,.ard-progress-bar .ard-progress-bar-overlay-secondary{position:absolute}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: ArdiumProgressBarComponent, selector: "ard-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, bufferValue: { classPropertyName: "bufferValue", publicName: "bufferValue", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, hideValue: { classPropertyName: "hideValue", publicName: "hideValue", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "valueTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-progress-bar\"\n  role=\"progressbar\"\n  [style]=\"cssVariables()\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-progress-bar__background\"></div>\n  <div class=\"ard-progress-bar__overlay-buffer\"></div>\n  <div class=\"ard-progress-bar__overlay\"></div>\n  <div class=\"ard-progress-bar__value\">\n    <ng-template\n      #defaultValueTemplate\n      let-value\n    >\n      {{ value * 100 | number: '1.0-0' }}%\n    </ng-template>\n\n    <ng-template\n      [ngTemplateOutlet]=\"valueTemplate() || defaultValueTemplate\"\n      [ngTemplateOutletContext]=\"getValueContext()\"\n    ></ng-template>\n  </div>\n</div>\n", styles: ["ard-progress-bar{display:block}.ard-progress-bar{position:relative}.ard-progress-bar .ard-progress-bar-background,.ard-progress-bar .ard-progress-bar-overlay,.ard-progress-bar .ard-progress-bar-overlay-secondary{position:absolute}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-progress-bar', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-progress-bar\"\n  role=\"progressbar\"\n  [style]=\"cssVariables()\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-progress-bar__background\"></div>\n  <div class=\"ard-progress-bar__overlay-buffer\"></div>\n  <div class=\"ard-progress-bar__overlay\"></div>\n  <div class=\"ard-progress-bar__value\">\n    <ng-template\n      #defaultValueTemplate\n      let-value\n    >\n      {{ value * 100 | number: '1.0-0' }}%\n    </ng-template>\n\n    <ng-template\n      [ngTemplateOutlet]=\"valueTemplate() || defaultValueTemplate\"\n      [ngTemplateOutletContext]=\"getValueContext()\"\n    ></ng-template>\n  </div>\n</div>\n", styles: ["ard-progress-bar{display:block}.ard-progress-bar{position:relative}.ard-progress-bar .ard-progress-bar-background,.ard-progress-bar .ard-progress-bar-overlay,.ard-progress-bar .ard-progress-bar-overlay-secondary{position:absolute}\n"] }]
         }], ctorParameters: () => [] });
@@ -8298,20 +8301,20 @@ class ArdProgressBarValueTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdProgressBarValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdProgressBarValueTemplateDirective, selector: "ard-progress-bar > ng-template[ard-value-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdProgressBarValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdProgressBarValueTemplateDirective, selector: "ard-progress-bar > ng-template[ard-value-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdProgressBarValueTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdProgressBarValueTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-progress-bar > ng-template[ard-value-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
 
 class ArdiumProgressBarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressBarModule, declarations: [ArdiumProgressBarComponent, ArdProgressBarValueTemplateDirective], imports: [CommonModule], exports: [ArdiumProgressBarComponent, ArdProgressBarValueTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressBarModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressBarModule, declarations: [ArdiumProgressBarComponent, ArdProgressBarValueTemplateDirective], imports: [CommonModule], exports: [ArdiumProgressBarComponent, ArdProgressBarValueTemplateDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressBarModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressBarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressBarModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumProgressBarComponent, ArdProgressBarValueTemplateDirective],
@@ -8380,10 +8383,10 @@ class ArdiumProgressCircleComponent {
             $implicit: this.percentValue(),
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.2", type: ArdiumProgressCircleComponent, selector: "ard-progress-circle", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, hideValue: { classPropertyName: "hideValue", publicName: "hideValue", isSignal: true, isRequired: false, transformFunction: null }, reverse: { classPropertyName: "reverse", publicName: "reverse", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "valueTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-progress-circle\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-progress-circle-background\"></div>\n  <div\n    class=\"ard-progress-circle-overlay\"\n    [style]=\"fillPercentVariable()\"\n  ></div>\n  <div class=\"ard-progress-circle-value\">\n    <ng-template\n      #defaultValueTemplate\n      let-percents\n    >\n      {{ percents | number: '1.0-0' }}%\n    </ng-template>\n\n    <ng-template\n      [ngTemplateOutlet]=\"valueTemplate() || defaultValueTemplate\"\n      [ngTemplateOutletContext]=\"getValueContext()\"\n    ></ng-template>\n  </div>\n</div>\n", styles: [".ard-progress-circle{position:relative;aspect-ratio:1}.ard-progress-circle .ard-progress-circle-background,.ard-progress-circle .ard-progress-circle-overlay{position:absolute;border-radius:9999px;inset:0}.ard-progress-circle .ard-progress-circle-overlay{background-size:100% 100%;background-position:0px 0px;background-image:conic-gradient(from 0deg at 50% 50%,var(--ard-_progress-circle-fill-color) 0%,var(--ard-_progress-circle-fill-color) var(--ard-_progress-circle-fill-amount),transparent var(--ard-_progress-circle-fill-amount),transparent 100%)}.ard-progress-circle.ard-progress-circle-reversed .ard-progress-circle-overlay{background-image:conic-gradient(from 0deg at 50% 50%,transparent 0%,transparent var(--ard-_progress-circle-fill-amount),var(--ard-_progress-circle-fill-color) var(--ard-_progress-circle-fill-amount),var(--ard-_progress-circle-fill-color) 100%)}.ard-progress-circle.ard-progress-circle-hide-value .ard-progress-circle-value{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: ArdiumProgressCircleComponent, selector: "ard-progress-circle", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, hideValue: { classPropertyName: "hideValue", publicName: "hideValue", isSignal: true, isRequired: false, transformFunction: null }, reverse: { classPropertyName: "reverse", publicName: "reverse", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "valueTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-progress-circle\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-progress-circle-background\"></div>\n  <div\n    class=\"ard-progress-circle-overlay\"\n    [style]=\"fillPercentVariable()\"\n  ></div>\n  <div class=\"ard-progress-circle-value\">\n    <ng-template\n      #defaultValueTemplate\n      let-percents\n    >\n      {{ percents | number: '1.0-0' }}%\n    </ng-template>\n\n    <ng-template\n      [ngTemplateOutlet]=\"valueTemplate() || defaultValueTemplate\"\n      [ngTemplateOutletContext]=\"getValueContext()\"\n    ></ng-template>\n  </div>\n</div>\n", styles: [".ard-progress-circle{position:relative;aspect-ratio:1}.ard-progress-circle .ard-progress-circle-background,.ard-progress-circle .ard-progress-circle-overlay{position:absolute;border-radius:9999px;inset:0}.ard-progress-circle .ard-progress-circle-overlay{background-size:100% 100%;background-position:0px 0px;background-image:conic-gradient(from 0deg at 50% 50%,var(--ard-_progress-circle-fill-color) 0%,var(--ard-_progress-circle-fill-color) var(--ard-_progress-circle-fill-amount),transparent var(--ard-_progress-circle-fill-amount),transparent 100%)}.ard-progress-circle.ard-progress-circle-reversed .ard-progress-circle-overlay{background-image:conic-gradient(from 0deg at 50% 50%,transparent 0%,transparent var(--ard-_progress-circle-fill-amount),var(--ard-_progress-circle-fill-color) var(--ard-_progress-circle-fill-amount),var(--ard-_progress-circle-fill-color) 100%)}.ard-progress-circle.ard-progress-circle-hide-value .ard-progress-circle-value{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressCircleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressCircleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-progress-circle', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-progress-circle\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-progress-circle-background\"></div>\n  <div\n    class=\"ard-progress-circle-overlay\"\n    [style]=\"fillPercentVariable()\"\n  ></div>\n  <div class=\"ard-progress-circle-value\">\n    <ng-template\n      #defaultValueTemplate\n      let-percents\n    >\n      {{ percents | number: '1.0-0' }}%\n    </ng-template>\n\n    <ng-template\n      [ngTemplateOutlet]=\"valueTemplate() || defaultValueTemplate\"\n      [ngTemplateOutletContext]=\"getValueContext()\"\n    ></ng-template>\n  </div>\n</div>\n", styles: [".ard-progress-circle{position:relative;aspect-ratio:1}.ard-progress-circle .ard-progress-circle-background,.ard-progress-circle .ard-progress-circle-overlay{position:absolute;border-radius:9999px;inset:0}.ard-progress-circle .ard-progress-circle-overlay{background-size:100% 100%;background-position:0px 0px;background-image:conic-gradient(from 0deg at 50% 50%,var(--ard-_progress-circle-fill-color) 0%,var(--ard-_progress-circle-fill-color) var(--ard-_progress-circle-fill-amount),transparent var(--ard-_progress-circle-fill-amount),transparent 100%)}.ard-progress-circle.ard-progress-circle-reversed .ard-progress-circle-overlay{background-image:conic-gradient(from 0deg at 50% 50%,transparent 0%,transparent var(--ard-_progress-circle-fill-amount),var(--ard-_progress-circle-fill-color) var(--ard-_progress-circle-fill-amount),var(--ard-_progress-circle-fill-color) 100%)}.ard-progress-circle.ard-progress-circle-hide-value .ard-progress-circle-value{display:none}\n"] }]
         }] });
@@ -8392,20 +8395,20 @@ class ArdProgressCircleValueTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdProgressCircleValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdProgressCircleValueTemplateDirective, selector: "ard-progress-circle > ng-template[ard-value-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdProgressCircleValueTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdProgressCircleValueTemplateDirective, selector: "ard-progress-circle > ng-template[ard-value-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdProgressCircleValueTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdProgressCircleValueTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-progress-circle > ng-template[ard-value-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
 
 class ArdiumProgressCircleModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressCircleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressCircleModule, declarations: [ArdiumProgressCircleComponent, ArdProgressCircleValueTemplateDirective], imports: [CommonModule, DecimalPipe], exports: [ArdiumProgressCircleComponent, ArdProgressCircleValueTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressCircleModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressCircleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressCircleModule, declarations: [ArdiumProgressCircleComponent, ArdProgressCircleValueTemplateDirective], imports: [CommonModule, DecimalPipe], exports: [ArdiumProgressCircleComponent, ArdProgressCircleValueTemplateDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressCircleModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumProgressCircleModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumProgressCircleModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumProgressCircleComponent, ArdProgressCircleValueTemplateDirective],
@@ -8433,20 +8436,20 @@ class ArdiumSpinnerComponent {
         this.color = input(this._DEFAULTS.color);
         this.ngClasses = computed(() => [`ard-color-${this.color()}`].join(' '));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumSpinnerComponent, selector: "ard-spinner", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<svg\n  class=\"ard-spinner\"\n  [ngClass]=\"ngClasses()\"\n  viewBox=\"0 0 100 100\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n>\n  <circle\n    class=\"ard-spinner-circle\"\n    cx=\"50\"\n    cy=\"50\"\n    r=\"20\"\n  ></circle>\n</svg>\n", styles: [".ard-spinner{animation:rotator var(--ard-_spinner-duration) linear infinite;pointer-events:none}@keyframes rotator{to{transform:rotate(360deg)}}.ard-spinner-circle{stroke-dasharray:1,200;stroke-dashoffset:0;animation:dash var(--ard-_spinner-duration) ease-in-out infinite 0s;stroke-linecap:round;fill:none;stroke-width:3}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:75,200;stroke-dashoffset:-35}to{stroke-dasharray:75,200;stroke-dashoffset:-124}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumSpinnerComponent, selector: "ard-spinner", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<svg\n  class=\"ard-spinner\"\n  [ngClass]=\"ngClasses()\"\n  viewBox=\"0 0 100 100\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n>\n  <circle\n    class=\"ard-spinner-circle\"\n    cx=\"50\"\n    cy=\"50\"\n    r=\"20\"\n  ></circle>\n</svg>\n", styles: [".ard-spinner{animation:rotator var(--ard-_spinner-duration) linear infinite;pointer-events:none}@keyframes rotator{to{transform:rotate(360deg)}}.ard-spinner-circle{stroke-dasharray:1,200;stroke-dashoffset:0;animation:dash var(--ard-_spinner-duration) ease-in-out infinite 0s;stroke-linecap:round;fill:none;stroke-width:3}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:75,200;stroke-dashoffset:-35}to{stroke-dasharray:75,200;stroke-dashoffset:-124}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSpinnerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-spinner', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg\n  class=\"ard-spinner\"\n  [ngClass]=\"ngClasses()\"\n  viewBox=\"0 0 100 100\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n>\n  <circle\n    class=\"ard-spinner-circle\"\n    cx=\"50\"\n    cy=\"50\"\n    r=\"20\"\n  ></circle>\n</svg>\n", styles: [".ard-spinner{animation:rotator var(--ard-_spinner-duration) linear infinite;pointer-events:none}@keyframes rotator{to{transform:rotate(360deg)}}.ard-spinner-circle{stroke-dasharray:1,200;stroke-dashoffset:0;animation:dash var(--ard-_spinner-duration) ease-in-out infinite 0s;stroke-linecap:round;fill:none;stroke-width:3}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:75,200;stroke-dashoffset:-35}to{stroke-dasharray:75,200;stroke-dashoffset:-124}}\n"] }]
         }] });
 
 class ArdiumSpinnerModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSpinnerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSpinnerModule, declarations: [ArdiumSpinnerComponent], imports: [CommonModule], exports: [ArdiumSpinnerComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSpinnerModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSpinnerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSpinnerModule, declarations: [ArdiumSpinnerComponent], imports: [CommonModule], exports: [ArdiumSpinnerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSpinnerModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSpinnerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSpinnerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumSpinnerComponent],
@@ -8496,20 +8499,20 @@ class ArdiumColorDisplayComponent {
         if (!this.color())
             console.warn(`ARD-WA3000: Using <ard-color-display> without specifying the [color] field.`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumColorDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumColorDisplayComponent, selector: "ard-color-display", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, withLabel: { classPropertyName: "withLabel", publicName: "withLabel", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ard-color-display-wrapper\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div\n    class=\"ard-color-display\"\n    [title]=\"color()\"\n    [style]=\"{ background: color() }\"\n  ></div>\n  @if (withLabel()) {\n    <span class=\"ard-color-display-label\">{{ color() }}</span>\n  }\n</div>\n", styles: [".ard-color-display-wrapper{display:flex}.ard-color-display-wrapper .ard-color-content-wrapper{display:none}ard-color-display{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumColorDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumColorDisplayComponent, selector: "ard-color-display", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, withLabel: { classPropertyName: "withLabel", publicName: "withLabel", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ard-color-display-wrapper\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div\n    class=\"ard-color-display\"\n    [title]=\"color()\"\n    [style]=\"{ background: color() }\"\n  ></div>\n  @if (withLabel()) {\n    <span class=\"ard-color-display-label\">{{ color() }}</span>\n  }\n</div>\n", styles: [".ard-color-display-wrapper{display:flex}.ard-color-display-wrapper .ard-color-content-wrapper{display:none}ard-color-display{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumColorDisplayComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumColorDisplayComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-color-display', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-color-display-wrapper\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div\n    class=\"ard-color-display\"\n    [title]=\"color()\"\n    [style]=\"{ background: color() }\"\n  ></div>\n  @if (withLabel()) {\n    <span class=\"ard-color-display-label\">{{ color() }}</span>\n  }\n</div>\n", styles: [".ard-color-display-wrapper{display:flex}.ard-color-display-wrapper .ard-color-content-wrapper{display:none}ard-color-display{display:inline-block}\n"] }]
         }] });
 
 class ArdiumColorDisplayModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumColorDisplayModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumColorDisplayModule, declarations: [ArdiumColorDisplayComponent], imports: [CommonModule], exports: [ArdiumColorDisplayComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumColorDisplayModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumColorDisplayModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumColorDisplayModule, declarations: [ArdiumColorDisplayComponent], imports: [CommonModule], exports: [ArdiumColorDisplayComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumColorDisplayModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumColorDisplayModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumColorDisplayModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumColorDisplayComponent],
@@ -8538,10 +8541,10 @@ class ArdiumKbdPipe {
     transform(value, useShort = !this._DEFAULTS.full) {
         return keyToString(value, useShort);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdPipe, name: "kbd" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdPipe, name: "kbd" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'kbd',
@@ -8563,10 +8566,10 @@ class ArdiumKbdComponent {
             throw new Error(`ARD-FT5030: Using <ard-kbd> without specifying the [key] field is not allowed.`);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.2", type: ArdiumKbdComponent, selector: "ard-kbd", inputs: { key: { classPropertyName: "key", publicName: "key", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapperEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<kbd\n  class=\"ard-kbd\"\n  [ngClass]=\"ngClasses()\"\n>\n  {{ key() || contentWrapper()?.nativeElement?.innerText || '' | kbd: !full() }}\n</kbd>\n\n<div\n  #contentWrapperEl\n  class=\"ard-kbd-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: [".ard-kbd-content-wrapper{display:none}.ard-kbd{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: ArdiumKbdPipe, name: "kbd" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: ArdiumKbdComponent, selector: "ard-kbd", inputs: { key: { classPropertyName: "key", publicName: "key", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapperEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<kbd\n  class=\"ard-kbd\"\n  [ngClass]=\"ngClasses()\"\n>\n  {{ key() || contentWrapper()?.nativeElement?.innerText || '' | kbd: !full() }}\n</kbd>\n\n<div\n  #contentWrapperEl\n  class=\"ard-kbd-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: [".ard-kbd-content-wrapper{display:none}.ard-kbd{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: ArdiumKbdPipe, name: "kbd" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-kbd', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<kbd\n  class=\"ard-kbd\"\n  [ngClass]=\"ngClasses()\"\n>\n  {{ key() || contentWrapper()?.nativeElement?.innerText || '' | kbd: !full() }}\n</kbd>\n\n<div\n  #contentWrapperEl\n  class=\"ard-kbd-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: [".ard-kbd-content-wrapper{display:none}.ard-kbd{display:inline-block}\n"] }]
         }] });
@@ -8591,10 +8594,10 @@ class ArdiumKbdDirective {
             this.renderer.addClass(element, cls);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumKbdDirective, selector: "[ardKbd]", inputs: { appearance: { classPropertyName: "appearance", publicName: "ardKbdAppearance", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumKbdDirective, selector: "[ardKbd]", inputs: { appearance: { classPropertyName: "appearance", publicName: "ardKbdAppearance", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ardKbd]',
@@ -8602,11 +8605,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }], ctorParameters: () => [] });
 
 class ArdiumKbdModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdModule, declarations: [ArdiumKbdComponent, ArdiumKbdPipe, ArdiumKbdDirective], imports: [CommonModule], exports: [ArdiumKbdComponent, ArdiumKbdPipe, ArdiumKbdDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdModule, declarations: [ArdiumKbdComponent, ArdiumKbdPipe, ArdiumKbdDirective], imports: [CommonModule], exports: [ArdiumKbdComponent, ArdiumKbdPipe, ArdiumKbdDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumKbdComponent, ArdiumKbdPipe, ArdiumKbdDirective],
@@ -8643,20 +8646,20 @@ class ArdiumKbdShortcutComponent {
             throw new Error(`ARD-FT5040: Using <ard-kbd-shortcut> without specifying the [keys] field is not allowed.`);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdShortcutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumKbdShortcutComponent, selector: "ard-kbd-shortcut", inputs: { keys: { classPropertyName: "keys", publicName: "keys", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapperEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-kbd-shortcut\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (key of keys() ?? contentWrapper()?.nativeElement?.innerText?.split(splitRegex); track $index) {\n    @if ($index !== 0) {\n      <span>+</span>\n    }\n    <ard-kbd\n      [appearance]=\"appearance()\"\n      [full]=\"full()\"\n      [key]=\"key\"\n    />\n  }\n</div>\n\n<div\n  #contentWrapperEl\n  class=\"ard-kbd-shortcut-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: [".ard-kbd-shortcut{display:inline}.ard-kbd-shortcut-content-wrapper{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumKbdComponent, selector: "ard-kbd", inputs: ["key", "full", "appearance"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdShortcutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumKbdShortcutComponent, selector: "ard-kbd-shortcut", inputs: { keys: { classPropertyName: "keys", publicName: "keys", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapperEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-kbd-shortcut\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (key of keys() ?? contentWrapper()?.nativeElement?.innerText?.split(splitRegex); track $index) {\n    @if ($index !== 0) {\n      <span>+</span>\n    }\n    <ard-kbd\n      [appearance]=\"appearance()\"\n      [full]=\"full()\"\n      [key]=\"key\"\n    />\n  }\n</div>\n\n<div\n  #contentWrapperEl\n  class=\"ard-kbd-shortcut-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: [".ard-kbd-shortcut{display:inline}.ard-kbd-shortcut-content-wrapper{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumKbdComponent, selector: "ard-kbd", inputs: ["key", "full", "appearance"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdShortcutComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdShortcutComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-kbd-shortcut', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-kbd-shortcut\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (key of keys() ?? contentWrapper()?.nativeElement?.innerText?.split(splitRegex); track $index) {\n    @if ($index !== 0) {\n      <span>+</span>\n    }\n    <ard-kbd\n      [appearance]=\"appearance()\"\n      [full]=\"full()\"\n      [key]=\"key\"\n    />\n  }\n</div>\n\n<div\n  #contentWrapperEl\n  class=\"ard-kbd-shortcut-content-wrapper\"\n>\n  <ng-content></ng-content>\n</div>\n", styles: [".ard-kbd-shortcut{display:inline}.ard-kbd-shortcut-content-wrapper{display:none}\n"] }]
         }] });
 
 class ArdiumKbdShortcutModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdShortcutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdShortcutModule, declarations: [ArdiumKbdShortcutComponent], imports: [CommonModule, ArdiumKbdModule], exports: [ArdiumKbdShortcutComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdShortcutModule, imports: [CommonModule, ArdiumKbdModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdShortcutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdShortcutModule, declarations: [ArdiumKbdShortcutComponent], imports: [CommonModule, ArdiumKbdModule], exports: [ArdiumKbdShortcutComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdShortcutModule, imports: [CommonModule, ArdiumKbdModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumKbdShortcutModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumKbdShortcutModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumKbdShortcutComponent],
@@ -8724,20 +8727,20 @@ class ArdiumStarDisplayComponent {
             return newArr;
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumStarDisplayComponent, selector: "ard-star-display", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ard-star-display\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (fillMode of starArray(); track $index) {\n    <ard-star\n      [filled]=\"fillMode\"\n      [color]=\"color()\"\n    />\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumStarComponent, selector: "ard-star", inputs: ["wrapperClasses", "color", "filled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumStarDisplayComponent, selector: "ard-star-display", inputs: { wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ard-star-display\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (fillMode of starArray(); track $index) {\n    <ard-star\n      [filled]=\"fillMode\"\n      [color]=\"color()\"\n    />\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumStarComponent, selector: "ard-star", inputs: ["wrapperClasses", "color", "filled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarDisplayComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarDisplayComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-star-display', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-star-display\"\n  [ngClass]=\"ngClasses()\"\n>\n  @for (fillMode of starArray(); track $index) {\n    <ard-star\n      [filled]=\"fillMode\"\n      [color]=\"color()\"\n    />\n  }\n</div>\n" }]
         }] });
 
 class ArdiumStarDisplayModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarDisplayModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarDisplayModule, declarations: [ArdiumStarDisplayComponent], imports: [CommonModule, ArdiumStarModule], exports: [ArdiumStarDisplayComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarDisplayModule, imports: [CommonModule, ArdiumStarModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarDisplayModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarDisplayModule, declarations: [ArdiumStarDisplayComponent], imports: [CommonModule, ArdiumStarModule], exports: [ArdiumStarDisplayComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarDisplayModule, imports: [CommonModule, ArdiumStarModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumStarDisplayModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumStarDisplayModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumStarDisplayComponent],
@@ -9554,10 +9557,10 @@ class ArdiumTablePaginationComponent extends _FocusableComponentBase {
             return;
         this._emitPageEvent();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationComponent, deps: [{ token: ARD_TABLE_PAGINATION_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumTablePaginationComponent, selector: "ard-table-pagination", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange", itemsPerPageChangeEvent: "itemsPerPageChange", pageChangeEvent: "pageChange" }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-pagination\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-pagination__items-per-page\">\n    <div class=\"ard-pagination__text\">{{ itemsPerPageText() }}</div>\n    <ard-select\n      [items]=\"options()\"\n      [compact]=\"compact()\"\n      [value]=\"itemsPerPage()\"\n      autoHighlightFirst=\"false\"\n      [disabled]=\"disabled()\"\n      (valueChange)=\"onItemsPerPageChange($event[0])\"\n      clearable=\"false\"\n    />\n  </div>\n  <div class=\"ard-pagination__current-page\">\n    <div class=\"ard-pagination__text\">\n      {{ currentItemsFormatFn()(getCurrentItemsContext()) }}\n    </div>\n    <div class=\"ard-pagination__buttons\">\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || firstPageDisabled()\"\n          (click)=\"onFirstPage()\"\n        >\n          <ard-icon>first page</ard-icon>\n        </ard-icon-button>\n      }\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || firstPageDisabled()\"\n        (click)=\"onPrevPage()\"\n      >\n        <ard-icon>navigate before</ard-icon>\n      </ard-icon-button>\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || lastPageDisabled()\"\n        (click)=\"onNextPage()\"\n      >\n        <ard-icon>navigate next</ard-icon>\n      </ard-icon-button>\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || lastPageDisabled()\"\n          (click)=\"onLastPage()\"\n        >\n          <ard-icon>last page</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumSelectComponent, selector: "ard-select", inputs: ["valueFrom", "labelFrom", "disabledFrom", "groupLabelFrom", "groupDisabledFrom", "childrenFrom", "placeholder", "searchPlaceholder", "clearButtonTitle", "dropdownPosition", "noItemsFoundText", "loadingPlaceholderText", "searchInputId", "inputAttrs", "isLoading", "htmlId", "itemsAlreadyGrouped", "invertDisabled", "noGroupActions", "autoHighlightFirst", "autoFocus", "keepOpen", "hideSelected", "noBackspaceClear", "sortMultipleValues", "searchCaseSensitive", "keepSearchAfterSelect", "maxSelectedItems", "itemDisplayLimit", "searchFn", "compareWith", "appearance", "variant", "compact", "dropdownAppearance", "dropdownVariant", "items", "multiselectable", "clearable", "searchable", "addCustom", "value", "isOpen"], outputs: ["valueChange", "change", "add", "failedToAdd", "remove", "clear", "open", "close", "scroll", "scrollToEnd", "search", "isOpenChange"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationComponent, deps: [{ token: ARD_TABLE_PAGINATION_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumTablePaginationComponent, selector: "ard-table-pagination", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange", itemsPerPageChangeEvent: "itemsPerPageChange", pageChangeEvent: "pageChange" }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ard-pagination\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-pagination__items-per-page\">\n    <div class=\"ard-pagination__text\">{{ itemsPerPageText() }}</div>\n    <ard-select\n      [items]=\"options()\"\n      [compact]=\"compact()\"\n      [value]=\"itemsPerPage()\"\n      autoHighlightFirst=\"false\"\n      [disabled]=\"disabled()\"\n      (valueChange)=\"onItemsPerPageChange($event[0])\"\n      clearable=\"false\"\n    />\n  </div>\n  <div class=\"ard-pagination__current-page\">\n    <div class=\"ard-pagination__text\">\n      {{ currentItemsFormatFn()(getCurrentItemsContext()) }}\n    </div>\n    <div class=\"ard-pagination__buttons\">\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || firstPageDisabled()\"\n          (click)=\"onFirstPage()\"\n        >\n          <ard-icon>first page</ard-icon>\n        </ard-icon-button>\n      }\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || firstPageDisabled()\"\n        (click)=\"onPrevPage()\"\n      >\n        <ard-icon>navigate before</ard-icon>\n      </ard-icon-button>\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || lastPageDisabled()\"\n        (click)=\"onNextPage()\"\n      >\n        <ard-icon>navigate next</ard-icon>\n      </ard-icon-button>\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || lastPageDisabled()\"\n          (click)=\"onLastPage()\"\n        >\n          <ard-icon>last page</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ArdiumSelectComponent, selector: "ard-select", inputs: ["valueFrom", "labelFrom", "disabledFrom", "groupLabelFrom", "groupDisabledFrom", "childrenFrom", "placeholder", "searchPlaceholder", "clearButtonTitle", "dropdownPosition", "noItemsFoundText", "loadingPlaceholderText", "searchInputId", "inputAttrs", "isLoading", "htmlId", "itemsAlreadyGrouped", "invertDisabled", "noGroupActions", "autoHighlightFirst", "autoFocus", "keepOpen", "hideSelected", "noBackspaceClear", "sortMultipleValues", "searchCaseSensitive", "keepSearchAfterSelect", "maxSelectedItems", "itemDisplayLimit", "searchFn", "compareWith", "appearance", "variant", "compact", "dropdownAppearance", "dropdownVariant", "items", "multiselectable", "clearable", "searchable", "addCustom", "value", "isOpen"], outputs: ["valueChange", "change", "add", "failedToAdd", "remove", "clear", "open", "close", "scroll", "scrollToEnd", "search", "isOpenChange"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-table-pagination', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-pagination\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div class=\"ard-pagination__items-per-page\">\n    <div class=\"ard-pagination__text\">{{ itemsPerPageText() }}</div>\n    <ard-select\n      [items]=\"options()\"\n      [compact]=\"compact()\"\n      [value]=\"itemsPerPage()\"\n      autoHighlightFirst=\"false\"\n      [disabled]=\"disabled()\"\n      (valueChange)=\"onItemsPerPageChange($event[0])\"\n      clearable=\"false\"\n    />\n  </div>\n  <div class=\"ard-pagination__current-page\">\n    <div class=\"ard-pagination__text\">\n      {{ currentItemsFormatFn()(getCurrentItemsContext()) }}\n    </div>\n    <div class=\"ard-pagination__buttons\">\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || firstPageDisabled()\"\n          (click)=\"onFirstPage()\"\n        >\n          <ard-icon>first page</ard-icon>\n        </ard-icon-button>\n      }\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || firstPageDisabled()\"\n        (click)=\"onPrevPage()\"\n      >\n        <ard-icon>navigate before</ard-icon>\n      </ard-icon-button>\n      <ard-icon-button\n        [color]=\"color()\"\n        [compact]=\"compact()\"\n        [disabled]=\"disabled() || lastPageDisabled()\"\n        (click)=\"onNextPage()\"\n      >\n        <ard-icon>navigate next</ard-icon>\n      </ard-icon-button>\n      @if (useFirstLastButtons()) {\n        <ard-icon-button\n          [color]=\"color()\"\n          [compact]=\"compact()\"\n          [disabled]=\"disabled() || lastPageDisabled()\"\n          (click)=\"onLastPage()\"\n        >\n          <ard-icon>last page</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -9566,11 +9569,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 }] }] });
 
 class ArdiumTablePaginationModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationModule, declarations: [ArdiumTablePaginationComponent], imports: [CommonModule, ArdiumSelectModule, ArdiumIconButtonModule, ArdiumIconModule], exports: [ArdiumTablePaginationComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationModule, imports: [CommonModule, ArdiumSelectModule, ArdiumIconButtonModule, ArdiumIconModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationModule, declarations: [ArdiumTablePaginationComponent], imports: [CommonModule, ArdiumSelectModule, ArdiumIconButtonModule, ArdiumIconModule], exports: [ArdiumTablePaginationComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationModule, imports: [CommonModule, ArdiumSelectModule, ArdiumIconButtonModule, ArdiumIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumTablePaginationComponent],
@@ -9631,10 +9634,10 @@ class ArdiumTableTemplateDirective {
         this.template = template;
         this.name = input.required({ alias: 'ard-table-tmp' });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumTableTemplateDirective, selector: "ard-table > ng-template[ard-table-tmp]", inputs: { name: { classPropertyName: "name", publicName: "ard-table-tmp", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumTableTemplateDirective, selector: "ard-table > ng-template[ard-table-tmp]", inputs: { name: { classPropertyName: "name", publicName: "ard-table-tmp", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-table > ng-template[ard-table-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -9642,10 +9645,10 @@ class ArdiumTableCheckboxTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableCheckboxTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumTableCheckboxTemplateDirective, selector: "ard-table > ng-template[ard-table-checkbox-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableCheckboxTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumTableCheckboxTemplateDirective, selector: "ard-table > ng-template[ard-table-checkbox-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableCheckboxTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableCheckboxTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-table > ng-template[ard-table-checkbox-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -9653,10 +9656,10 @@ class ArdiumTableHeaderCheckboxTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableHeaderCheckboxTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumTableHeaderCheckboxTemplateDirective, selector: "ard-table > ng-template[ard-table-header-checkbox-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableHeaderCheckboxTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumTableHeaderCheckboxTemplateDirective, selector: "ard-table > ng-template[ard-table-header-checkbox-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableHeaderCheckboxTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableHeaderCheckboxTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-table > ng-template[ard-table-header-checkbox-tmp]',
@@ -9666,10 +9669,10 @@ class ArdiumTableCaptionTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableCaptionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumTableCaptionTemplateDirective, selector: "ard-table > ng-template[ard-table-caption-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableCaptionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumTableCaptionTemplateDirective, selector: "ard-table > ng-template[ard-table-caption-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableCaptionTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableCaptionTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-table > ng-template[ard-table-caption-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -9678,10 +9681,10 @@ class ArdiumTablePaginationTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumTablePaginationTemplateDirective, selector: "ard-table > ng-template[ard-table-pagination-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumTablePaginationTemplateDirective, selector: "ard-table > ng-template[ard-table-pagination-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTablePaginationTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTablePaginationTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-table > ng-template[ard-table-pagination-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -10021,10 +10024,10 @@ class ArdiumTableComponent extends _FocusableComponentBase {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableComponent, deps: [{ token: ARD_TABLE_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumTableComponent, selector: "ard-table", inputs: { rowDisabledFrom: { classPropertyName: "rowDisabledFrom", publicName: "rowDisabledFrom", isSignal: true, isRequired: false, transformFunction: null }, rowBoldFrom: { classPropertyName: "rowBoldFrom", publicName: "rowBoldFrom", isSignal: true, isRequired: false, transformFunction: null }, invertRowDisabled: { classPropertyName: "invertRowDisabled", publicName: "invertRowDisabled", isSignal: true, isRequired: false, transformFunction: null }, invertRowBold: { classPropertyName: "invertRowBold", publicName: "invertRowBold", isSignal: true, isRequired: false, transformFunction: null }, selectableRows: { classPropertyName: "selectableRows", publicName: "selectableRows", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, clickableRows: { classPropertyName: "clickableRows", publicName: "clickableRows", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, loadingProgress: { classPropertyName: "loadingProgress", publicName: "loadingProgress", isSignal: true, isRequired: false, transformFunction: null }, loadingProgressBuffer: { classPropertyName: "loadingProgressBuffer", publicName: "loadingProgressBuffer", isSignal: true, isRequired: false, transformFunction: null }, loadingBarMode: { classPropertyName: "loadingBarMode", publicName: "loadingBarMode", isSignal: true, isRequired: false, transformFunction: null }, loadingBarColor: { classPropertyName: "loadingBarColor", publicName: "loadingBarColor", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, headerAlign: { classPropertyName: "headerAlign", publicName: "headerAlign", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, zebra: { classPropertyName: "zebra", publicName: "zebra", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, paginated: { classPropertyName: "paginated", publicName: "paginated", isSignal: true, isRequired: false, transformFunction: null }, paginationStrategy: { classPropertyName: "paginationStrategy", publicName: "paginationStrategy", isSignal: true, isRequired: false, transformFunction: null }, paginationOptions: { classPropertyName: "paginationOptions", publicName: "paginationOptions", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, paginationColor: { classPropertyName: "paginationColor", publicName: "paginationColor", isSignal: true, isRequired: false, transformFunction: null }, paginationAlign: { classPropertyName: "paginationAlign", publicName: "paginationAlign", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null }, pageFillRemaining: { classPropertyName: "pageFillRemaining", publicName: "pageFillRemaining", isSignal: true, isRequired: false, transformFunction: null }, paginationDisabled: { classPropertyName: "paginationDisabled", publicName: "paginationDisabled", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: false, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: false, isRequired: false, transformFunction: null }, treatDataSourceAsString: { classPropertyName: "treatDataSourceAsString", publicName: "treatDataSourceAsString", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange", selectedRowsChangeEvent: "selectedRowsChange", failedSelectRowEvent: "failedSelectRow", selectRowEvent: "selectRow", unselectRowEvent: "unselectRow", clickRowEvent: "clickRow" }, queries: [{ propertyName: "checkboxTemplate", first: true, predicate: ArdiumTableCheckboxTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerCheckboxTemplate", first: true, predicate: ArdiumTableHeaderCheckboxTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "captionTemplate", first: true, predicate: ArdiumTableCaptionTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "templateChildren", predicate: ArdiumTableTemplateDirective, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<table\n  class=\"ard-table\"\n  [ngClass]=\"ngClasses()\"\n>\n  @if (caption()) {\n    <caption class=\"ard-table__caption\">\n      <div class=\"ard-table__caption-container\">\n        <ng-template\n          #defaultCaptionTemplate\n          let-captionText\n        >\n          {{ captionText }}\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"captionTemplate() ?? defaultCaptionTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: caption() }\"\n        />\n      </div>\n    </caption>\n  }\n  <thead class=\"ard-table__header\">\n    @for (row of headerCells(); track $index) {\n      <tr class=\"ard-table__header-row\">\n        @for (cell of row; track $index) {\n          <th\n            class=\"ard-table__header-cell\"\n            [ngClass]=\"cell.cell().cellClass\"\n            [class.ard-table__checkbox-cell]=\"isHeaderCellCheckbox(cell)\"\n            [attr.colspan]=\"cell.colspan()\"\n            [attr.rowspan]=\"cell.rowspan()\"\n            [scope]=\"cell.colspan() > 1 ? 'colgroup' : 'col'\"\n          >\n            <div\n              class=\"ard-table__cell-container\"\n              [class.ard-table__sortable]=\"isHeaderCellSortable(cell)\"\n              [style.width]=\"cell.width\"\n              [style.minWidth]=\"cell.minWidth\"\n            >\n              @if (isHeaderCellCheckbox(cell)) {\n                <ng-template\n                  #defaultHeaderCheckboxTemplate\n                  let-state\n                  let-onChange=\"onChange\"\n                >\n                  <ard-checkbox\n                    [tabIndex]=\"isLoading() ? -1 : tabIndex()\"\n                    [state]=\"state\"\n                    [color]=\"getHeaderCheckboxColor()\"\n                    unselectedColor=\"currentColor\"\n                    (change)=\"onChange()\"\n                  />\n                </ng-template>\n\n                <ng-template\n                  [ngTemplateOutlet]=\"headerCheckboxTemplate() ?? defaultHeaderCheckboxTemplate\"\n                  [ngTemplateOutletContext]=\"getHeaderCheckboxContext()\"\n                />\n              } @else {\n                <ng-template\n                  #defaultHeaderCellTemplate\n                  let-content\n                  let-sortable=\"sortable\"\n                  let-sortType=\"sortType\"\n                  let-onTriggerSort=\"onTriggerSort\"\n                  let-onTriggerResetSort=\"onTriggerResetSort\"\n                >\n                  <div\n                    class=\"ard-table__header-template-container\"\n                    [class.ard-sortable]=\"sortable\"\n                    [class.ard-nonsortable]=\"!sortable\"\n                  >\n                    @if (sortable) {\n                      <button\n                        type=\"button\"\n                        class=\"ard-table__header-content-container\"\n                        (click)=\"onTriggerSort($event)\"\n                        [tabindex]=\"tabIndex()\"\n                        (keydown.Esc)=\"onTriggerResetSort($event)\"\n                      >\n                        <div class=\"ard-table__header-content\">{{ content }}</div>\n                        @if (sortType !== null) {\n                          <div class=\"ard-table__header-sort-icon\">\n                            @if (sortType === 'ascending') {\n                              <ard-icon>south</ard-icon>\n                            } @else if (sortType === 'descending') {\n                              <ard-icon>north</ard-icon>\n                            }\n                          </div>\n                        }\n                      </button>\n                    } @else {\n                      <div class=\"ard-table__header-content-container\">\n                        <div class=\"ard-table__header-content\">{{ content }}</div>\n                      </div>\n                    }\n                  </div>\n                </ng-template>\n\n                <ng-template\n                  [ngTemplateOutlet]=\"getHeaderTemplate(cell.cell().header) ?? defaultHeaderCellTemplate\"\n                  [ngTemplateOutletContext]=\"getHeaderContext(cell.cell(), $index)\"\n                />\n              }\n            </div>\n          </th>\n        }\n      </tr>\n    }\n    <tr class=\"ard-table__progress-bar-row\">\n      <th\n        class=\"ard-table__progress-bar-cell\"\n        colspan=\"9999\"\n      >\n        @if (isLoading()) {\n          <ard-progress-bar\n            [value]=\"loadingProgress()\"\n            [bufferValue]=\"loadingProgressBuffer()\"\n            [mode]=\"loadingBarMode()\"\n            [color]=\"loadingBarColor()\"\n            variant=\"sharp\"\n            hideValue\n          />\n        }\n      </th>\n    </tr>\n  </thead>\n  <tbody class=\"ard-table__body\">\n    @for (row of dataRows(); track $index) {\n      @if (row.isEmpty()) {\n        <tr class=\"ard-table__empty-row\">\n          <td\n            class=\"ard-table__empty-cell\"\n            colspan=\"9999\"\n          ></td>\n        </tr>\n      } @else {\n        <tr\n          class=\"ard-table__body-row\"\n          [class.ard-table__selected-row]=\"row.selected()\"\n          [class.ard-table__highlighted-row]=\"row.highlighted()\"\n          [class.ard-table__disabled-row]=\"row.disabled()\"\n          [class.ard-table__bold-row]=\"row.bold()\"\n          (click)=\"onRowClick(row, $event)\"\n          (mouseover)=\"onRowMouseOver($event)\"\n          (mouseenter)=\"onRowMouseEnter(row.index(), $event)\"\n          (mouseleave)=\"onRowMouseLeave(row.index(), $event)\"\n        >\n          @for (cell of row.data(); track $index) {\n            <ng-template #cellTmp>\n              <div\n                class=\"ard-table__cell-container\"\n                [style]=\"getCellStyle(row.dataColumns()[$index])\"\n              >\n                @if (isCellCheckbox(cell)) {\n                  <ng-template\n                    #defaultCheckboxTemplate\n                    let-isChecked\n                    let-onChange=\"onChange\"\n                    let-disabled=\"disabled\"\n                  >\n                    <ard-checkbox\n                      [tabIndex]=\"isLoading() ? -1 : tabIndex()\"\n                      [selected]=\"isChecked\"\n                      [color]=\"color()\"\n                      [disabled]=\"disabled\"\n                      (change)=\"onChange()\"\n                      (click)=\"$event.stopPropagation()\"\n                    />\n                  </ng-template>\n\n                  <ng-template\n                    [ngTemplateOutlet]=\"checkboxTemplate() ?? defaultCheckboxTemplate\"\n                    [ngTemplateOutletContext]=\"getCheckboxContext(row.index())\"\n                  />\n                } @else {\n                  <ng-template\n                    #defaultCellTemplate\n                    let-content\n                  >\n                    {{ content }}\n                  </ng-template>\n\n                  <ng-template\n                    [ngTemplateOutlet]=\"getCellTemplate(row.dataColumns()[$index].template) ?? defaultCellTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: cell }\"\n                  />\n                }\n              </div>\n            </ng-template>\n            @if (!row.dataColumns()[$index].isRowHeader) {\n              <td\n                class=\"ard-table__body-cell\"\n                [ngClass]=\"row.dataColumns()[$index].cellClass\"\n                [class.ard-table__checkbox-cell]=\"isCellCheckbox(cell)\"\n              >\n                <ng-template [ngTemplateOutlet]=\"cellTmp\"></ng-template>\n              </td>\n            } @else {\n              <th\n                class=\"ard-table__body-cell ard-table__row-header\"\n                scope=\"row\"\n                [ngClass]=\"row.dataColumns()[$index].cellClass\"\n                [class.ard-table__checkbox-cell]=\"isCellCheckbox(cell)\"\n              >\n                <ng-template [ngTemplateOutlet]=\"cellTmp\"></ng-template>\n              </th>\n            }\n          }\n        </tr>\n      }\n    }\n  </tbody>\n  @if (canDisplayPagination()) {\n    <tfoot class=\"ard-table__foot\">\n      <tr class=\"ard-table__foot-row\">\n        <td\n          class=\"ard-table__pagination-cell\"\n          colspan=\"9999\"\n        >\n          <ard-table-pagination\n            [options]=\"paginationOptions()\"\n            [totalItems]=\"totalItems()!\"\n            [disabled]=\"paginationDisabled()\"\n            [(itemsPerPage)]=\"itemsPerPage\"\n            [(page)]=\"page\"\n            [align]=\"paginationAlign()\"\n            [isLoading]=\"isLoading()\"\n            [itemsPerPageText]=\"itemsPerPageText()\"\n            [currentItemsFormatFn]=\"currentItemsFormatFn()\"\n          />\n        </td>\n      </tr>\n    </tfoot>\n  }\n</table>\n", styles: [".ard-table__cell-container,.ard-table__header-template-container{width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumCheckboxComponent, selector: "ard-checkbox", inputs: ["htmlId", "color", "unselectedColor", "state"], outputs: ["stateChange"] }, { kind: "component", type: ArdiumTablePaginationComponent, selector: "ard-table-pagination", inputs: ["totalItems", "options", "itemsPerPage", "page", "color", "align", "compact", "useFirstLastButtons", "isLoading", "itemsPerPageText", "currentItemsFormatFn"], outputs: ["itemsPerPageChange", "pageChange"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumProgressBarComponent, selector: "ard-progress-bar", inputs: ["value", "bufferValue", "color", "variant", "size", "mode", "hideValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableComponent, deps: [{ token: ARD_TABLE_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumTableComponent, selector: "ard-table", inputs: { rowDisabledFrom: { classPropertyName: "rowDisabledFrom", publicName: "rowDisabledFrom", isSignal: true, isRequired: false, transformFunction: null }, rowBoldFrom: { classPropertyName: "rowBoldFrom", publicName: "rowBoldFrom", isSignal: true, isRequired: false, transformFunction: null }, invertRowDisabled: { classPropertyName: "invertRowDisabled", publicName: "invertRowDisabled", isSignal: true, isRequired: false, transformFunction: null }, invertRowBold: { classPropertyName: "invertRowBold", publicName: "invertRowBold", isSignal: true, isRequired: false, transformFunction: null }, selectableRows: { classPropertyName: "selectableRows", publicName: "selectableRows", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, clickableRows: { classPropertyName: "clickableRows", publicName: "clickableRows", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, loadingProgress: { classPropertyName: "loadingProgress", publicName: "loadingProgress", isSignal: true, isRequired: false, transformFunction: null }, loadingProgressBuffer: { classPropertyName: "loadingProgressBuffer", publicName: "loadingProgressBuffer", isSignal: true, isRequired: false, transformFunction: null }, loadingBarMode: { classPropertyName: "loadingBarMode", publicName: "loadingBarMode", isSignal: true, isRequired: false, transformFunction: null }, loadingBarColor: { classPropertyName: "loadingBarColor", publicName: "loadingBarColor", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, headerAlign: { classPropertyName: "headerAlign", publicName: "headerAlign", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, zebra: { classPropertyName: "zebra", publicName: "zebra", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, paginated: { classPropertyName: "paginated", publicName: "paginated", isSignal: true, isRequired: false, transformFunction: null }, paginationStrategy: { classPropertyName: "paginationStrategy", publicName: "paginationStrategy", isSignal: true, isRequired: false, transformFunction: null }, paginationOptions: { classPropertyName: "paginationOptions", publicName: "paginationOptions", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, paginationColor: { classPropertyName: "paginationColor", publicName: "paginationColor", isSignal: true, isRequired: false, transformFunction: null }, paginationAlign: { classPropertyName: "paginationAlign", publicName: "paginationAlign", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null }, pageFillRemaining: { classPropertyName: "pageFillRemaining", publicName: "pageFillRemaining", isSignal: true, isRequired: false, transformFunction: null }, paginationDisabled: { classPropertyName: "paginationDisabled", publicName: "paginationDisabled", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: false, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: false, isRequired: false, transformFunction: null }, treatDataSourceAsString: { classPropertyName: "treatDataSourceAsString", publicName: "treatDataSourceAsString", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange", selectedRowsChangeEvent: "selectedRowsChange", failedSelectRowEvent: "failedSelectRow", selectRowEvent: "selectRow", unselectRowEvent: "unselectRow", clickRowEvent: "clickRow" }, queries: [{ propertyName: "checkboxTemplate", first: true, predicate: ArdiumTableCheckboxTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerCheckboxTemplate", first: true, predicate: ArdiumTableHeaderCheckboxTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "captionTemplate", first: true, predicate: ArdiumTableCaptionTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "templateChildren", predicate: ArdiumTableTemplateDirective, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<table\n  class=\"ard-table\"\n  [ngClass]=\"ngClasses()\"\n>\n  @if (caption()) {\n    <caption class=\"ard-table__caption\">\n      <div class=\"ard-table__caption-container\">\n        <ng-template\n          #defaultCaptionTemplate\n          let-captionText\n        >\n          {{ captionText }}\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"captionTemplate() ?? defaultCaptionTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: caption() }\"\n        />\n      </div>\n    </caption>\n  }\n  <thead class=\"ard-table__header\">\n    @for (row of headerCells(); track $index) {\n      <tr class=\"ard-table__header-row\">\n        @for (cell of row; track $index) {\n          <th\n            class=\"ard-table__header-cell\"\n            [ngClass]=\"cell.cell().cellClass\"\n            [class.ard-table__checkbox-cell]=\"isHeaderCellCheckbox(cell)\"\n            [attr.colspan]=\"cell.colspan()\"\n            [attr.rowspan]=\"cell.rowspan()\"\n            [scope]=\"cell.colspan() > 1 ? 'colgroup' : 'col'\"\n          >\n            <div\n              class=\"ard-table__cell-container\"\n              [class.ard-table__sortable]=\"isHeaderCellSortable(cell)\"\n              [style.width]=\"cell.width\"\n              [style.minWidth]=\"cell.minWidth\"\n            >\n              @if (isHeaderCellCheckbox(cell)) {\n                <ng-template\n                  #defaultHeaderCheckboxTemplate\n                  let-state\n                  let-onChange=\"onChange\"\n                >\n                  <ard-checkbox\n                    [tabIndex]=\"isLoading() ? -1 : tabIndex()\"\n                    [state]=\"state\"\n                    [color]=\"getHeaderCheckboxColor()\"\n                    unselectedColor=\"currentColor\"\n                    (change)=\"onChange()\"\n                  />\n                </ng-template>\n\n                <ng-template\n                  [ngTemplateOutlet]=\"headerCheckboxTemplate() ?? defaultHeaderCheckboxTemplate\"\n                  [ngTemplateOutletContext]=\"getHeaderCheckboxContext()\"\n                />\n              } @else {\n                <ng-template\n                  #defaultHeaderCellTemplate\n                  let-content\n                  let-sortable=\"sortable\"\n                  let-sortType=\"sortType\"\n                  let-onTriggerSort=\"onTriggerSort\"\n                  let-onTriggerResetSort=\"onTriggerResetSort\"\n                >\n                  <div\n                    class=\"ard-table__header-template-container\"\n                    [class.ard-sortable]=\"sortable\"\n                    [class.ard-nonsortable]=\"!sortable\"\n                  >\n                    @if (sortable) {\n                      <button\n                        type=\"button\"\n                        class=\"ard-table__header-content-container\"\n                        (click)=\"onTriggerSort($event)\"\n                        [tabindex]=\"tabIndex()\"\n                        (keydown.Esc)=\"onTriggerResetSort($event)\"\n                      >\n                        <div class=\"ard-table__header-content\">{{ content }}</div>\n                        @if (sortType !== null) {\n                          <div class=\"ard-table__header-sort-icon\">\n                            @if (sortType === 'ascending') {\n                              <ard-icon>south</ard-icon>\n                            } @else if (sortType === 'descending') {\n                              <ard-icon>north</ard-icon>\n                            }\n                          </div>\n                        }\n                      </button>\n                    } @else {\n                      <div class=\"ard-table__header-content-container\">\n                        <div class=\"ard-table__header-content\">{{ content }}</div>\n                      </div>\n                    }\n                  </div>\n                </ng-template>\n\n                <ng-template\n                  [ngTemplateOutlet]=\"getHeaderTemplate(cell.cell().header) ?? defaultHeaderCellTemplate\"\n                  [ngTemplateOutletContext]=\"getHeaderContext(cell.cell(), $index)\"\n                />\n              }\n            </div>\n          </th>\n        }\n      </tr>\n    }\n    <tr class=\"ard-table__progress-bar-row\">\n      <th\n        class=\"ard-table__progress-bar-cell\"\n        colspan=\"9999\"\n      >\n        @if (isLoading()) {\n          <ard-progress-bar\n            [value]=\"loadingProgress()\"\n            [bufferValue]=\"loadingProgressBuffer()\"\n            [mode]=\"loadingBarMode()\"\n            [color]=\"loadingBarColor()\"\n            variant=\"sharp\"\n            hideValue\n          />\n        }\n      </th>\n    </tr>\n  </thead>\n  <tbody class=\"ard-table__body\">\n    @for (row of dataRows(); track $index) {\n      @if (row.isEmpty()) {\n        <tr class=\"ard-table__empty-row\">\n          <td\n            class=\"ard-table__empty-cell\"\n            colspan=\"9999\"\n          ></td>\n        </tr>\n      } @else {\n        <tr\n          class=\"ard-table__body-row\"\n          [class.ard-table__selected-row]=\"row.selected()\"\n          [class.ard-table__highlighted-row]=\"row.highlighted()\"\n          [class.ard-table__disabled-row]=\"row.disabled()\"\n          [class.ard-table__bold-row]=\"row.bold()\"\n          (click)=\"onRowClick(row, $event)\"\n          (mouseover)=\"onRowMouseOver($event)\"\n          (mouseenter)=\"onRowMouseEnter(row.index(), $event)\"\n          (mouseleave)=\"onRowMouseLeave(row.index(), $event)\"\n        >\n          @for (cell of row.data(); track $index) {\n            <ng-template #cellTmp>\n              <div\n                class=\"ard-table__cell-container\"\n                [style]=\"getCellStyle(row.dataColumns()[$index])\"\n              >\n                @if (isCellCheckbox(cell)) {\n                  <ng-template\n                    #defaultCheckboxTemplate\n                    let-isChecked\n                    let-onChange=\"onChange\"\n                    let-disabled=\"disabled\"\n                  >\n                    <ard-checkbox\n                      [tabIndex]=\"isLoading() ? -1 : tabIndex()\"\n                      [selected]=\"isChecked\"\n                      [color]=\"color()\"\n                      [disabled]=\"disabled\"\n                      (change)=\"onChange()\"\n                      (click)=\"$event.stopPropagation()\"\n                    />\n                  </ng-template>\n\n                  <ng-template\n                    [ngTemplateOutlet]=\"checkboxTemplate() ?? defaultCheckboxTemplate\"\n                    [ngTemplateOutletContext]=\"getCheckboxContext(row.index())\"\n                  />\n                } @else {\n                  <ng-template\n                    #defaultCellTemplate\n                    let-content\n                  >\n                    {{ content }}\n                  </ng-template>\n\n                  <ng-template\n                    [ngTemplateOutlet]=\"getCellTemplate(row.dataColumns()[$index].template) ?? defaultCellTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: cell }\"\n                  />\n                }\n              </div>\n            </ng-template>\n            @if (!row.dataColumns()[$index].isRowHeader) {\n              <td\n                class=\"ard-table__body-cell\"\n                [ngClass]=\"row.dataColumns()[$index].cellClass\"\n                [class.ard-table__checkbox-cell]=\"isCellCheckbox(cell)\"\n              >\n                <ng-template [ngTemplateOutlet]=\"cellTmp\"></ng-template>\n              </td>\n            } @else {\n              <th\n                class=\"ard-table__body-cell ard-table__row-header\"\n                scope=\"row\"\n                [ngClass]=\"row.dataColumns()[$index].cellClass\"\n                [class.ard-table__checkbox-cell]=\"isCellCheckbox(cell)\"\n              >\n                <ng-template [ngTemplateOutlet]=\"cellTmp\"></ng-template>\n              </th>\n            }\n          }\n        </tr>\n      }\n    }\n  </tbody>\n  @if (canDisplayPagination()) {\n    <tfoot class=\"ard-table__foot\">\n      <tr class=\"ard-table__foot-row\">\n        <td\n          class=\"ard-table__pagination-cell\"\n          colspan=\"9999\"\n        >\n          <ard-table-pagination\n            [options]=\"paginationOptions()\"\n            [totalItems]=\"totalItems()!\"\n            [disabled]=\"paginationDisabled()\"\n            [(itemsPerPage)]=\"itemsPerPage\"\n            [(page)]=\"page\"\n            [align]=\"paginationAlign()\"\n            [isLoading]=\"isLoading()\"\n            [itemsPerPageText]=\"itemsPerPageText()\"\n            [currentItemsFormatFn]=\"currentItemsFormatFn()\"\n          />\n        </td>\n      </tr>\n    </tfoot>\n  }\n</table>\n", styles: [".ard-table__cell-container,.ard-table__header-template-container{width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumCheckboxComponent, selector: "ard-checkbox", inputs: ["htmlId", "color", "unselectedColor", "state"], outputs: ["stateChange"] }, { kind: "component", type: ArdiumTablePaginationComponent, selector: "ard-table-pagination", inputs: ["totalItems", "options", "itemsPerPage", "page", "color", "align", "compact", "useFirstLastButtons", "isLoading", "itemsPerPageText", "currentItemsFormatFn"], outputs: ["itemsPerPageChange", "pageChange"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumProgressBarComponent, selector: "ard-progress-bar", inputs: ["value", "bufferValue", "color", "variant", "size", "mode", "hideValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-table', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table\n  class=\"ard-table\"\n  [ngClass]=\"ngClasses()\"\n>\n  @if (caption()) {\n    <caption class=\"ard-table__caption\">\n      <div class=\"ard-table__caption-container\">\n        <ng-template\n          #defaultCaptionTemplate\n          let-captionText\n        >\n          {{ captionText }}\n        </ng-template>\n\n        <ng-template\n          [ngTemplateOutlet]=\"captionTemplate() ?? defaultCaptionTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: caption() }\"\n        />\n      </div>\n    </caption>\n  }\n  <thead class=\"ard-table__header\">\n    @for (row of headerCells(); track $index) {\n      <tr class=\"ard-table__header-row\">\n        @for (cell of row; track $index) {\n          <th\n            class=\"ard-table__header-cell\"\n            [ngClass]=\"cell.cell().cellClass\"\n            [class.ard-table__checkbox-cell]=\"isHeaderCellCheckbox(cell)\"\n            [attr.colspan]=\"cell.colspan()\"\n            [attr.rowspan]=\"cell.rowspan()\"\n            [scope]=\"cell.colspan() > 1 ? 'colgroup' : 'col'\"\n          >\n            <div\n              class=\"ard-table__cell-container\"\n              [class.ard-table__sortable]=\"isHeaderCellSortable(cell)\"\n              [style.width]=\"cell.width\"\n              [style.minWidth]=\"cell.minWidth\"\n            >\n              @if (isHeaderCellCheckbox(cell)) {\n                <ng-template\n                  #defaultHeaderCheckboxTemplate\n                  let-state\n                  let-onChange=\"onChange\"\n                >\n                  <ard-checkbox\n                    [tabIndex]=\"isLoading() ? -1 : tabIndex()\"\n                    [state]=\"state\"\n                    [color]=\"getHeaderCheckboxColor()\"\n                    unselectedColor=\"currentColor\"\n                    (change)=\"onChange()\"\n                  />\n                </ng-template>\n\n                <ng-template\n                  [ngTemplateOutlet]=\"headerCheckboxTemplate() ?? defaultHeaderCheckboxTemplate\"\n                  [ngTemplateOutletContext]=\"getHeaderCheckboxContext()\"\n                />\n              } @else {\n                <ng-template\n                  #defaultHeaderCellTemplate\n                  let-content\n                  let-sortable=\"sortable\"\n                  let-sortType=\"sortType\"\n                  let-onTriggerSort=\"onTriggerSort\"\n                  let-onTriggerResetSort=\"onTriggerResetSort\"\n                >\n                  <div\n                    class=\"ard-table__header-template-container\"\n                    [class.ard-sortable]=\"sortable\"\n                    [class.ard-nonsortable]=\"!sortable\"\n                  >\n                    @if (sortable) {\n                      <button\n                        type=\"button\"\n                        class=\"ard-table__header-content-container\"\n                        (click)=\"onTriggerSort($event)\"\n                        [tabindex]=\"tabIndex()\"\n                        (keydown.Esc)=\"onTriggerResetSort($event)\"\n                      >\n                        <div class=\"ard-table__header-content\">{{ content }}</div>\n                        @if (sortType !== null) {\n                          <div class=\"ard-table__header-sort-icon\">\n                            @if (sortType === 'ascending') {\n                              <ard-icon>south</ard-icon>\n                            } @else if (sortType === 'descending') {\n                              <ard-icon>north</ard-icon>\n                            }\n                          </div>\n                        }\n                      </button>\n                    } @else {\n                      <div class=\"ard-table__header-content-container\">\n                        <div class=\"ard-table__header-content\">{{ content }}</div>\n                      </div>\n                    }\n                  </div>\n                </ng-template>\n\n                <ng-template\n                  [ngTemplateOutlet]=\"getHeaderTemplate(cell.cell().header) ?? defaultHeaderCellTemplate\"\n                  [ngTemplateOutletContext]=\"getHeaderContext(cell.cell(), $index)\"\n                />\n              }\n            </div>\n          </th>\n        }\n      </tr>\n    }\n    <tr class=\"ard-table__progress-bar-row\">\n      <th\n        class=\"ard-table__progress-bar-cell\"\n        colspan=\"9999\"\n      >\n        @if (isLoading()) {\n          <ard-progress-bar\n            [value]=\"loadingProgress()\"\n            [bufferValue]=\"loadingProgressBuffer()\"\n            [mode]=\"loadingBarMode()\"\n            [color]=\"loadingBarColor()\"\n            variant=\"sharp\"\n            hideValue\n          />\n        }\n      </th>\n    </tr>\n  </thead>\n  <tbody class=\"ard-table__body\">\n    @for (row of dataRows(); track $index) {\n      @if (row.isEmpty()) {\n        <tr class=\"ard-table__empty-row\">\n          <td\n            class=\"ard-table__empty-cell\"\n            colspan=\"9999\"\n          ></td>\n        </tr>\n      } @else {\n        <tr\n          class=\"ard-table__body-row\"\n          [class.ard-table__selected-row]=\"row.selected()\"\n          [class.ard-table__highlighted-row]=\"row.highlighted()\"\n          [class.ard-table__disabled-row]=\"row.disabled()\"\n          [class.ard-table__bold-row]=\"row.bold()\"\n          (click)=\"onRowClick(row, $event)\"\n          (mouseover)=\"onRowMouseOver($event)\"\n          (mouseenter)=\"onRowMouseEnter(row.index(), $event)\"\n          (mouseleave)=\"onRowMouseLeave(row.index(), $event)\"\n        >\n          @for (cell of row.data(); track $index) {\n            <ng-template #cellTmp>\n              <div\n                class=\"ard-table__cell-container\"\n                [style]=\"getCellStyle(row.dataColumns()[$index])\"\n              >\n                @if (isCellCheckbox(cell)) {\n                  <ng-template\n                    #defaultCheckboxTemplate\n                    let-isChecked\n                    let-onChange=\"onChange\"\n                    let-disabled=\"disabled\"\n                  >\n                    <ard-checkbox\n                      [tabIndex]=\"isLoading() ? -1 : tabIndex()\"\n                      [selected]=\"isChecked\"\n                      [color]=\"color()\"\n                      [disabled]=\"disabled\"\n                      (change)=\"onChange()\"\n                      (click)=\"$event.stopPropagation()\"\n                    />\n                  </ng-template>\n\n                  <ng-template\n                    [ngTemplateOutlet]=\"checkboxTemplate() ?? defaultCheckboxTemplate\"\n                    [ngTemplateOutletContext]=\"getCheckboxContext(row.index())\"\n                  />\n                } @else {\n                  <ng-template\n                    #defaultCellTemplate\n                    let-content\n                  >\n                    {{ content }}\n                  </ng-template>\n\n                  <ng-template\n                    [ngTemplateOutlet]=\"getCellTemplate(row.dataColumns()[$index].template) ?? defaultCellTemplate\"\n                    [ngTemplateOutletContext]=\"{ $implicit: cell }\"\n                  />\n                }\n              </div>\n            </ng-template>\n            @if (!row.dataColumns()[$index].isRowHeader) {\n              <td\n                class=\"ard-table__body-cell\"\n                [ngClass]=\"row.dataColumns()[$index].cellClass\"\n                [class.ard-table__checkbox-cell]=\"isCellCheckbox(cell)\"\n              >\n                <ng-template [ngTemplateOutlet]=\"cellTmp\"></ng-template>\n              </td>\n            } @else {\n              <th\n                class=\"ard-table__body-cell ard-table__row-header\"\n                scope=\"row\"\n                [ngClass]=\"row.dataColumns()[$index].cellClass\"\n                [class.ard-table__checkbox-cell]=\"isCellCheckbox(cell)\"\n              >\n                <ng-template [ngTemplateOutlet]=\"cellTmp\"></ng-template>\n              </th>\n            }\n          }\n        </tr>\n      }\n    }\n  </tbody>\n  @if (canDisplayPagination()) {\n    <tfoot class=\"ard-table__foot\">\n      <tr class=\"ard-table__foot-row\">\n        <td\n          class=\"ard-table__pagination-cell\"\n          colspan=\"9999\"\n        >\n          <ard-table-pagination\n            [options]=\"paginationOptions()\"\n            [totalItems]=\"totalItems()!\"\n            [disabled]=\"paginationDisabled()\"\n            [(itemsPerPage)]=\"itemsPerPage\"\n            [(page)]=\"page\"\n            [align]=\"paginationAlign()\"\n            [isLoading]=\"isLoading()\"\n            [itemsPerPageText]=\"itemsPerPageText()\"\n            [currentItemsFormatFn]=\"currentItemsFormatFn()\"\n          />\n        </td>\n      </tr>\n    </tfoot>\n  }\n</table>\n", styles: [".ard-table__cell-container,.ard-table__header-template-container{width:100%;height:100%}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -10037,8 +10040,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class ArdiumTableModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableModule, declarations: [ArdiumTableComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableModule, declarations: [ArdiumTableComponent,
             ArdiumTableTemplateDirective,
             ArdiumTableCheckboxTemplateDirective,
             ArdiumTableHeaderCheckboxTemplateDirective,
@@ -10049,9 +10052,9 @@ class ArdiumTableModule {
             ArdiumTableHeaderCheckboxTemplateDirective,
             ArdiumTableCaptionTemplateDirective,
             ArdiumTablePaginationTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableModule, imports: [CommonModule, ArdiumCheckboxModule, ArdiumTablePaginationModule, ArdiumIconModule, ArdiumProgressBarModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableModule, imports: [CommonModule, ArdiumCheckboxModule, ArdiumTablePaginationModule, ArdiumIconModule, ArdiumProgressBarModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -10195,20 +10198,20 @@ class ArdiumTableFromCsvComponent {
         }
         return dataRows;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableFromCsvComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumTableFromCsvComponent, selector: "ard-table-from-csv", inputs: { selectableRows: { classPropertyName: "selectableRows", publicName: "selectableRows", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, clickableRows: { classPropertyName: "clickableRows", publicName: "clickableRows", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, loadingProgress: { classPropertyName: "loadingProgress", publicName: "loadingProgress", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, headerAlign: { classPropertyName: "headerAlign", publicName: "headerAlign", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, zebra: { classPropertyName: "zebra", publicName: "zebra", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, paginated: { classPropertyName: "paginated", publicName: "paginated", isSignal: true, isRequired: false, transformFunction: null }, paginationStrategy: { classPropertyName: "paginationStrategy", publicName: "paginationStrategy", isSignal: true, isRequired: false, transformFunction: null }, paginationOptions: { classPropertyName: "paginationOptions", publicName: "paginationOptions", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, paginationColor: { classPropertyName: "paginationColor", publicName: "paginationColor", isSignal: true, isRequired: false, transformFunction: null }, paginationAlign: { classPropertyName: "paginationAlign", publicName: "paginationAlign", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null }, pageFillRemaining: { classPropertyName: "pageFillRemaining", publicName: "pageFillRemaining", isSignal: true, isRequired: false, transformFunction: null }, paginationDisabled: { classPropertyName: "paginationDisabled", publicName: "paginationDisabled", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, stringData: { classPropertyName: "stringData", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange" }, usesOnChanges: true, ngImport: i0, template: "<ard-table\n  treatDataSourceAsString\n  [columns]=\"headers()\"\n  [data]=\"dataRows()\"\n  [selectableRows]=\"selectableRows()\"\n  [maxSelectedItems]=\"maxSelectedItems()\"\n  [clickableRows]=\"clickableRows()\"\n  [isLoading]=\"isLoading()\"\n  [loadingProgress]=\"loadingProgress()\"\n  [caption]=\"caption()\"\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [color]=\"color()\"\n  [align]=\"align()\"\n  [headerAlign]=\"headerAlign()\"\n  [compact]=\"compact()\"\n  [zebra]=\"zebra()\"\n  [stickyHeader]=\"stickyHeader()\"\n  [paginated]=\"paginated()\"\n  [paginationStrategy]=\"paginationStrategy()\"\n  [totalItems]=\"totalItems()\"\n  [paginationColor]=\"paginationColor()\"\n  [paginationAlign]=\"paginationAlign()\"\n  [itemsPerPageText]=\"itemsPerPageText()\"\n  [currentItemsFormatFn]=\"currentItemsFormatFn()\"\n  [pageFillRemaining]=\"pageFillRemaining()\"\n  [paginationDisabled]=\"paginationDisabled()\"\n  [useFirstLastButtons]=\"useFirstLastButtons()\"\n  [(itemsPerPage)]=\"itemsPerPage\"\n  [(page)]=\"page\"\n/>\n", dependencies: [{ kind: "component", type: ArdiumTableComponent, selector: "ard-table", inputs: ["rowDisabledFrom", "rowBoldFrom", "invertRowDisabled", "invertRowBold", "selectableRows", "maxSelectedItems", "clickableRows", "caption", "isLoading", "loadingProgress", "loadingProgressBuffer", "loadingBarMode", "loadingBarColor", "appearance", "variant", "color", "align", "headerAlign", "compact", "zebra", "stickyHeader", "paginated", "paginationStrategy", "paginationOptions", "totalItems", "paginationColor", "paginationAlign", "itemsPerPageText", "currentItemsFormatFn", "pageFillRemaining", "paginationDisabled", "useFirstLastButtons", "itemsPerPage", "page", "columns", "data", "treatDataSourceAsString"], outputs: ["itemsPerPageChange", "pageChange", "selectedRowsChange", "failedSelectRow", "selectRow", "unselectRow", "clickRow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableFromCsvComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumTableFromCsvComponent, selector: "ard-table-from-csv", inputs: { selectableRows: { classPropertyName: "selectableRows", publicName: "selectableRows", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, clickableRows: { classPropertyName: "clickableRows", publicName: "clickableRows", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, loadingProgress: { classPropertyName: "loadingProgress", publicName: "loadingProgress", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, headerAlign: { classPropertyName: "headerAlign", publicName: "headerAlign", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, zebra: { classPropertyName: "zebra", publicName: "zebra", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, paginated: { classPropertyName: "paginated", publicName: "paginated", isSignal: true, isRequired: false, transformFunction: null }, paginationStrategy: { classPropertyName: "paginationStrategy", publicName: "paginationStrategy", isSignal: true, isRequired: false, transformFunction: null }, paginationOptions: { classPropertyName: "paginationOptions", publicName: "paginationOptions", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, paginationColor: { classPropertyName: "paginationColor", publicName: "paginationColor", isSignal: true, isRequired: false, transformFunction: null }, paginationAlign: { classPropertyName: "paginationAlign", publicName: "paginationAlign", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageText: { classPropertyName: "itemsPerPageText", publicName: "itemsPerPageText", isSignal: true, isRequired: false, transformFunction: null }, currentItemsFormatFn: { classPropertyName: "currentItemsFormatFn", publicName: "currentItemsFormatFn", isSignal: true, isRequired: false, transformFunction: null }, pageFillRemaining: { classPropertyName: "pageFillRemaining", publicName: "pageFillRemaining", isSignal: true, isRequired: false, transformFunction: null }, paginationDisabled: { classPropertyName: "paginationDisabled", publicName: "paginationDisabled", isSignal: true, isRequired: false, transformFunction: null }, useFirstLastButtons: { classPropertyName: "useFirstLastButtons", publicName: "useFirstLastButtons", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPage: { classPropertyName: "itemsPerPage", publicName: "itemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, stringData: { classPropertyName: "stringData", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemsPerPage: "itemsPerPageChange", page: "pageChange" }, usesOnChanges: true, ngImport: i0, template: "<ard-table\n  treatDataSourceAsString\n  [columns]=\"headers()\"\n  [data]=\"dataRows()\"\n  [selectableRows]=\"selectableRows()\"\n  [maxSelectedItems]=\"maxSelectedItems()\"\n  [clickableRows]=\"clickableRows()\"\n  [isLoading]=\"isLoading()\"\n  [loadingProgress]=\"loadingProgress()\"\n  [caption]=\"caption()\"\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [color]=\"color()\"\n  [align]=\"align()\"\n  [headerAlign]=\"headerAlign()\"\n  [compact]=\"compact()\"\n  [zebra]=\"zebra()\"\n  [stickyHeader]=\"stickyHeader()\"\n  [paginated]=\"paginated()\"\n  [paginationStrategy]=\"paginationStrategy()\"\n  [totalItems]=\"totalItems()\"\n  [paginationColor]=\"paginationColor()\"\n  [paginationAlign]=\"paginationAlign()\"\n  [itemsPerPageText]=\"itemsPerPageText()\"\n  [currentItemsFormatFn]=\"currentItemsFormatFn()\"\n  [pageFillRemaining]=\"pageFillRemaining()\"\n  [paginationDisabled]=\"paginationDisabled()\"\n  [useFirstLastButtons]=\"useFirstLastButtons()\"\n  [(itemsPerPage)]=\"itemsPerPage\"\n  [(page)]=\"page\"\n/>\n", dependencies: [{ kind: "component", type: ArdiumTableComponent, selector: "ard-table", inputs: ["rowDisabledFrom", "rowBoldFrom", "invertRowDisabled", "invertRowBold", "selectableRows", "maxSelectedItems", "clickableRows", "caption", "isLoading", "loadingProgress", "loadingProgressBuffer", "loadingBarMode", "loadingBarColor", "appearance", "variant", "color", "align", "headerAlign", "compact", "zebra", "stickyHeader", "paginated", "paginationStrategy", "paginationOptions", "totalItems", "paginationColor", "paginationAlign", "itemsPerPageText", "currentItemsFormatFn", "pageFillRemaining", "paginationDisabled", "useFirstLastButtons", "itemsPerPage", "page", "columns", "data", "treatDataSourceAsString"], outputs: ["itemsPerPageChange", "pageChange", "selectedRowsChange", "failedSelectRow", "selectRow", "unselectRow", "clickRow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableFromCsvComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableFromCsvComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-table-from-csv', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ard-table\n  treatDataSourceAsString\n  [columns]=\"headers()\"\n  [data]=\"dataRows()\"\n  [selectableRows]=\"selectableRows()\"\n  [maxSelectedItems]=\"maxSelectedItems()\"\n  [clickableRows]=\"clickableRows()\"\n  [isLoading]=\"isLoading()\"\n  [loadingProgress]=\"loadingProgress()\"\n  [caption]=\"caption()\"\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [color]=\"color()\"\n  [align]=\"align()\"\n  [headerAlign]=\"headerAlign()\"\n  [compact]=\"compact()\"\n  [zebra]=\"zebra()\"\n  [stickyHeader]=\"stickyHeader()\"\n  [paginated]=\"paginated()\"\n  [paginationStrategy]=\"paginationStrategy()\"\n  [totalItems]=\"totalItems()\"\n  [paginationColor]=\"paginationColor()\"\n  [paginationAlign]=\"paginationAlign()\"\n  [itemsPerPageText]=\"itemsPerPageText()\"\n  [currentItemsFormatFn]=\"currentItemsFormatFn()\"\n  [pageFillRemaining]=\"pageFillRemaining()\"\n  [paginationDisabled]=\"paginationDisabled()\"\n  [useFirstLastButtons]=\"useFirstLastButtons()\"\n  [(itemsPerPage)]=\"itemsPerPage\"\n  [(page)]=\"page\"\n/>\n" }]
         }] });
 
 class ArdiumTableFromCsvModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableFromCsvModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableFromCsvModule, declarations: [ArdiumTableFromCsvComponent], imports: [CommonModule, ArdiumTableModule], exports: [ArdiumTableFromCsvComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableFromCsvModule, imports: [CommonModule, ArdiumTableModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableFromCsvModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableFromCsvModule, declarations: [ArdiumTableFromCsvComponent], imports: [CommonModule, ArdiumTableModule], exports: [ArdiumTableFromCsvComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableFromCsvModule, imports: [CommonModule, ArdiumTableModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTableFromCsvModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTableFromCsvModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumTableFromCsvComponent],
@@ -10223,10 +10226,10 @@ class ArdiumTextListPipe {
             return value.filter(Boolean).join(separator);
         return value.join(separator);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListPipe, name: "ardTextList" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListPipe, name: "ardTextList" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListPipe, decorators: [{
             type: Pipe,
             args: [{ name: 'ardTextList', pure: true }]
         }] });
@@ -10237,20 +10240,20 @@ class ArdiumTextListComponent {
         this.separator = input(', ');
         this.filter = input(false, { transform: v => coerceBooleanProperty(v) });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumTextListComponent, selector: "ard-text-list", inputs: { values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: true, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "{{ values() | ardTextList : separator() : filter() }}\r\n", styles: [""], dependencies: [{ kind: "pipe", type: ArdiumTextListPipe, name: "ardTextList" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumTextListComponent, selector: "ard-text-list", inputs: { values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: true, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "{{ values() | ardTextList : separator() : filter() }}\r\n", styles: [""], dependencies: [{ kind: "pipe", type: ArdiumTextListPipe, name: "ardTextList" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-text-list', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "{{ values() | ardTextList : separator() : filter() }}\r\n" }]
         }] });
 
 class ArdiumTextListModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListModule, declarations: [ArdiumTextListComponent, ArdiumTextListPipe], imports: [CommonModule], exports: [ArdiumTextListComponent, ArdiumTextListPipe] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListModule, declarations: [ArdiumTextListComponent, ArdiumTextListPipe], imports: [CommonModule], exports: [ArdiumTextListComponent, ArdiumTextListPipe] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTextListModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTextListModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumTextListComponent, ArdiumTextListPipe],
@@ -10283,10 +10286,10 @@ function provideCardDefaults(config) {
 }
 
 class ArdiumCardHeaderComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardHeaderComponent, selector: "ard-card-header", ngImport: i0, template: "<ng-content select=\"[ard-card-avatar]\" />\n<div class=\"ard-card-header-title-container\">\n  <ng-content\n    select=\"ard-card-title, ard-card-subtitle,\n      [ard-card-title], [ard-card-subtitle]\"\n  />\n</div>\n<ng-content />\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardHeaderComponent, selector: "ard-card-header", ngImport: i0, template: "<ng-content select=\"[ard-card-avatar]\" />\n<div class=\"ard-card-header-title-container\">\n  <ng-content\n    select=\"ard-card-title, ard-card-subtitle,\n      [ard-card-title], [ard-card-subtitle]\"\n  />\n</div>\n<ng-content />\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-card-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[ard-card-avatar]\" />\n<div class=\"ard-card-header-title-container\">\n  <ng-content\n    select=\"ard-card-title, ard-card-subtitle,\n      [ard-card-title], [ard-card-subtitle]\"\n  />\n</div>\n<ng-content />\n" }]
         }] });
@@ -10294,10 +10297,10 @@ class ArdiumCardSubtitleDirective {
     constructor(renderer, hostElement) {
         renderer.addClass(hostElement.nativeElement, 'ard-card-subtitle');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardSubtitleDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardSubtitleDirective, selector: "ard-card-subtitle, [ard-card-subtitle]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardSubtitleDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardSubtitleDirective, selector: "ard-card-subtitle, [ard-card-subtitle]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardSubtitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardSubtitleDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-card-subtitle, [ard-card-subtitle]' }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }] });
@@ -10305,10 +10308,10 @@ class ArdiumCardTitleDirective {
     constructor(renderer, hostElement) {
         renderer.addClass(hostElement.nativeElement, 'ard-card-title');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardTitleDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardTitleDirective, selector: "ard-card-title, [ard-card-title]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardTitleDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardTitleDirective, selector: "ard-card-title, [ard-card-title]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardTitleDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-card-title, [ard-card-title]' }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }] });
@@ -10316,10 +10319,10 @@ class ArdiumCardAvatarDirective {
     constructor(renderer, hostElement) {
         renderer.addClass(hostElement.nativeElement, 'ard-card-avatar');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardAvatarDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardAvatarDirective, selector: "[ard-card-avatar]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardAvatarDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardAvatarDirective, selector: "[ard-card-avatar]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardAvatarDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardAvatarDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[ard-card-avatar]' }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }] });
@@ -10327,10 +10330,10 @@ class ArdiumCardContentDirective {
     constructor(renderer, hostElement) {
         renderer.addClass(hostElement.nativeElement, 'ard-card-content');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardContentDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardContentDirective, selector: "ard-card-content, [ard-card-content]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardContentDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardContentDirective, selector: "ard-card-content, [ard-card-content]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardContentDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-card-content, [ard-card-content]' }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }] });
@@ -10338,10 +10341,10 @@ class ArdiumCardImageDirective {
     constructor(renderer, hostElement) {
         renderer.addClass(hostElement.nativeElement, 'ard-card-image');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardImageDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardImageDirective, selector: "[ard-card-image]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardImageDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardImageDirective, selector: "[ard-card-image]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardImageDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardImageDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[ard-card-image]' }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }] });
@@ -10351,10 +10354,10 @@ class ArdiumCardActionButtonsDirective {
         this.align = input(this._DEFAULTS.actionButtonsAlign);
         this.alignClass = computed(() => `ard-card-action-buttons ard-align-${this.align()}`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardActionButtonsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumCardActionButtonsDirective, selector: "ard-card-action-buttons, [ard-card-action-buttons]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "alignClass()" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardActionButtonsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumCardActionButtonsDirective, selector: "ard-card-action-buttons, [ard-card-action-buttons]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "alignClass()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardActionButtonsDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardActionButtonsDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ard-card-action-buttons, [ard-card-action-buttons]',
@@ -10367,10 +10370,10 @@ class ArdiumCardFooterDirective {
     constructor(renderer, hostElement) {
         renderer.addClass(hostElement.nativeElement, 'ard-card-footer');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardFooterDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardFooterDirective, selector: "ard-card-footer, [ard-card-footer]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardFooterDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardFooterDirective, selector: "ard-card-footer, [ard-card-footer]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardFooterDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardFooterDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-card-footer, [ard-card-footer]' }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }] });
@@ -10386,10 +10389,10 @@ class ArdiumCardDirective {
     get _ngClassesHostAttribute() {
         return this.ngClasses();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumCardDirective, selector: "[ard-card]", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this._ngClassesHostAttribute" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumCardDirective, selector: "[ard-card]", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this._ngClassesHostAttribute" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[ard-card]' }]
         }], propDecorators: { _ngClassesHostAttribute: [{
@@ -10397,10 +10400,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                 args: ['class']
             }] } });
 class ArdiumCardComponent extends ArdiumCardDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ArdiumCardComponent, selector: "ard-card", usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ArdiumCardComponent, selector: "ard-card", usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ard-card',
@@ -10411,8 +10414,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumCardModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardModule, declarations: [ArdiumCardComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardModule, declarations: [ArdiumCardComponent,
             ArdiumCardDirective,
             ArdiumCardHeaderComponent,
             ArdiumCardTitleDirective,
@@ -10431,9 +10434,9 @@ class ArdiumCardModule {
             ArdiumCardImageDirective,
             ArdiumCardActionButtonsDirective,
             ArdiumCardFooterDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardModule, imports: [CommonModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumCardModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumCardModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -10481,10 +10484,10 @@ class ArdiumDividerComponent {
         this._DEFAULTS = inject(ARD_DIVIDER_DEFAULTS);
         this.vertical = input(this._DEFAULTS.vertical, { transform: v => coerceBooleanProperty(v) });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumDividerComponent, selector: "ard-divider", inputs: { vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-divider-vertical": "vertical()" } }, ngImport: i0, template: '', isInline: true, styles: ["ard-divider{display:block}ard-divider:not(.ard-divider-vertical){width:100%;height:0}ard-divider.ard-divider-vertical{width:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumDividerComponent, selector: "ard-divider", inputs: { vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-divider-vertical": "vertical()" } }, ngImport: i0, template: '', isInline: true, styles: ["ard-divider{display:block}ard-divider:not(.ard-divider-vertical){width:100%;height:0}ard-divider.ard-divider-vertical{width:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDividerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDividerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-divider', template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.ard-divider-vertical]': 'vertical()',
@@ -10492,11 +10495,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumDividerModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDividerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDividerModule, declarations: [ArdiumDividerComponent], imports: [CommonModule], exports: [ArdiumDividerComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDividerModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDividerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDividerModule, declarations: [ArdiumDividerComponent], imports: [CommonModule], exports: [ArdiumDividerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDividerModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDividerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDividerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumDividerComponent],
@@ -10543,10 +10546,10 @@ class ArdiumTabComponent {
     _emitChange() {
         this.selectedChange.emit(this.selected());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.2", type: ArdiumTabComponent, selector: "ard-tab", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, _selected: { classPropertyName: "_selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, _label: { classPropertyName: "_label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, tabId: { classPropertyName: "tabId", publicName: "tabId", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { focusEvent: "focusEvent", blurEvent: "blurEvent", selectedChange: "selectedChange" }, host: { properties: { "class.ard-tab-selected": "this._selectedHostAttribute" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ArdiumTabComponent, selector: "ard-tab", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, _selected: { classPropertyName: "_selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, _label: { classPropertyName: "_label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, tabId: { classPropertyName: "tabId", publicName: "tabId", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { focusEvent: "focusEvent", blurEvent: "blurEvent", selectedChange: "selectedChange" }, host: { properties: { "class.ard-tab-selected": "this._selectedHostAttribute" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-tab', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { _selected: [{
@@ -10649,20 +10652,20 @@ class ArdiumTabberComponent {
         tab.focused.set(false);
         this.currentFocusedTab.set(null);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumTabberComponent, selector: "ard-tabber", inputs: { initialTab: { classPropertyName: "initialTab", publicName: "initialTab", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, stretchTabs: { classPropertyName: "stretchTabs", publicName: "stretchTabs", isSignal: true, isRequired: false, transformFunction: null }, uniformTabWidths: { classPropertyName: "uniformTabWidths", publicName: "uniformTabWidths", isSignal: true, isRequired: false, transformFunction: null }, tabAlignment: { classPropertyName: "tabAlignment", publicName: "tabAlignment", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { focusEvent: "focus", blurEvent: "blur", changeTab: "changeTab" }, queries: [{ propertyName: "tabs", predicate: ArdiumTabComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-tabber\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div\n    class=\"ard-tabber-tabs\"\n    [ngClass]=\"tabContainerClasses()\"\n    [style]=\"{ '--ard-_tabber-tabs': tabs().length }\"\n  >\n    @for (tab of tabs(); track tab) {\n      <button\n        #focusableElement\n        type=\"button\"\n        role=\"tab\"\n        class=\"ard-tab-button\"\n        [id]=\"tab.tabId()\"\n        [class.ard-tab-active]=\"tab === currentTab()\"\n        [class.ard-tab-focused]=\"tab === currentFocusedTab()\"\n        (click)=\"!tab.selected() && onTabClick(tab)\"\n        (focus)=\"onTabFocus(tab)\"\n        (blur)=\"onTabBlur(tab)\"\n        [tabindex]=\"tabIndex()\"\n      >\n        <div class=\"ard-focus-overlay\"></div>\n        {{ tab.label() }}\n      </button>\n    }\n  </div>\n  <div\n    role=\"tabpanel\"\n    class=\"ard-tabber-content\"\n  >\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".ard-tabber ard-tab{display:none}.ard-tabber ard-tab.ard-tab-selected{display:block}.ard-tabber .ard-tabber-tabs.ard-uniform-tab-widths{display:grid;grid-template-columns:repeat(var(--ard-_tabber-tabs),1fr);max-width:max-content}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumTabberComponent, selector: "ard-tabber", inputs: { initialTab: { classPropertyName: "initialTab", publicName: "initialTab", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, stretchTabs: { classPropertyName: "stretchTabs", publicName: "stretchTabs", isSignal: true, isRequired: false, transformFunction: null }, uniformTabWidths: { classPropertyName: "uniformTabWidths", publicName: "uniformTabWidths", isSignal: true, isRequired: false, transformFunction: null }, tabAlignment: { classPropertyName: "tabAlignment", publicName: "tabAlignment", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { focusEvent: "focus", blurEvent: "blur", changeTab: "changeTab" }, queries: [{ propertyName: "tabs", predicate: ArdiumTabComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ard-tabber\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div\n    class=\"ard-tabber-tabs\"\n    [ngClass]=\"tabContainerClasses()\"\n    [style]=\"{ '--ard-_tabber-tabs': tabs().length }\"\n  >\n    @for (tab of tabs(); track tab) {\n      <button\n        #focusableElement\n        type=\"button\"\n        role=\"tab\"\n        class=\"ard-tab-button\"\n        [id]=\"tab.tabId()\"\n        [class.ard-tab-active]=\"tab === currentTab()\"\n        [class.ard-tab-focused]=\"tab === currentFocusedTab()\"\n        (click)=\"!tab.selected() && onTabClick(tab)\"\n        (focus)=\"onTabFocus(tab)\"\n        (blur)=\"onTabBlur(tab)\"\n        [tabindex]=\"tabIndex()\"\n      >\n        <div class=\"ard-focus-overlay\"></div>\n        {{ tab.label() }}\n      </button>\n    }\n  </div>\n  <div\n    role=\"tabpanel\"\n    class=\"ard-tabber-content\"\n  >\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".ard-tabber ard-tab{display:none}.ard-tabber ard-tab.ard-tab-selected{display:block}.ard-tabber .ard-tabber-tabs.ard-uniform-tab-widths{display:grid;grid-template-columns:repeat(var(--ard-_tabber-tabs),1fr);max-width:max-content}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabberComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-tabber', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"ard-tabber\"\n  [ngClass]=\"ngClasses()\"\n>\n  <div\n    class=\"ard-tabber-tabs\"\n    [ngClass]=\"tabContainerClasses()\"\n    [style]=\"{ '--ard-_tabber-tabs': tabs().length }\"\n  >\n    @for (tab of tabs(); track tab) {\n      <button\n        #focusableElement\n        type=\"button\"\n        role=\"tab\"\n        class=\"ard-tab-button\"\n        [id]=\"tab.tabId()\"\n        [class.ard-tab-active]=\"tab === currentTab()\"\n        [class.ard-tab-focused]=\"tab === currentFocusedTab()\"\n        (click)=\"!tab.selected() && onTabClick(tab)\"\n        (focus)=\"onTabFocus(tab)\"\n        (blur)=\"onTabBlur(tab)\"\n        [tabindex]=\"tabIndex()\"\n      >\n        <div class=\"ard-focus-overlay\"></div>\n        {{ tab.label() }}\n      </button>\n    }\n  </div>\n  <div\n    role=\"tabpanel\"\n    class=\"ard-tabber-content\"\n  >\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".ard-tabber ard-tab{display:none}.ard-tabber ard-tab.ard-tab-selected{display:block}.ard-tabber .ard-tabber-tabs.ard-uniform-tab-widths{display:grid;grid-template-columns:repeat(var(--ard-_tabber-tabs),1fr);max-width:max-content}\n"] }]
         }] });
 
 class ArdiumTabberModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabberModule, declarations: [ArdiumTabberComponent, ArdiumTabComponent], imports: [CommonModule], exports: [ArdiumTabberComponent, ArdiumTabComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabberModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabberModule, declarations: [ArdiumTabberComponent, ArdiumTabComponent], imports: [CommonModule], exports: [ArdiumTabberComponent, ArdiumTabComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabberModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumTabberModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumTabberModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumTabberComponent, ArdiumTabComponent],
@@ -10713,10 +10716,10 @@ class ArdDialogButtonsTemplateDirective {
     constructor(template) {
         this.template = template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdDialogButtonsTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ArdDialogButtonsTemplateDirective, selector: "ard-dialog > ng-template[ard-buttons-tmp]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdDialogButtonsTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ArdDialogButtonsTemplateDirective, selector: "ard-dialog > ng-template[ard-buttons-tmp]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdDialogButtonsTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdDialogButtonsTemplateDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ard-dialog > ng-template[ard-buttons-tmp]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -10782,10 +10785,10 @@ class ArdiumModalComponent {
     onCloseButtonClick() {
         this._destroyOverlay();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumModalComponent, selector: "ard-modal", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, _open: { classPropertyName: "_open", publicName: "open", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { openChange: "openChange", closeEvent: "close" }, viewQueries: [{ propertyName: "modalTemplate", first: true, predicate: ["modalTemplate"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<ng-template #modalTemplate>\n  @if (noBackdrop()) {\n    <div\n      class=\"ard-modal\"\n      [ngClass]=\"ngClasses\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  } @else {\n    <div\n      class=\"ard-modal ard-modal-backdrop\"\n      [ngClass]=\"ngClasses\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  }\n</ng-template>\n\n<ng-template #_modalInsidePanel>\n  <div\n    class=\"ard-modal-panel\"\n    cdkTrapFocus\n    [class.ard-modal-no-heading-text]=\"!heading\"\n    [class.ard-modal-has-close-button]=\"!this.noCloseButton()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <div class=\"ard-modal-heading\">\n      <div class=\"ard-modal-heading-text\">{{ heading() }}</div>\n      @if (!noCloseButton()) {\n        <ard-icon-button\n          class=\"ard-modal-close-button\"\n          color=\"none\"\n          [compact]=\"compact()\"\n          (click)=\"onCloseButtonClick()\"\n        >\n          <ard-icon>close</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n    <div class=\"ard-modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-modal-content{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: i4$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumModalComponent, selector: "ard-modal", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, _open: { classPropertyName: "_open", publicName: "open", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { openChange: "openChange", closeEvent: "close" }, viewQueries: [{ propertyName: "modalTemplate", first: true, predicate: ["modalTemplate"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<ng-template #modalTemplate>\n  @if (noBackdrop()) {\n    <div\n      class=\"ard-modal\"\n      [ngClass]=\"ngClasses\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  } @else {\n    <div\n      class=\"ard-modal ard-modal-backdrop\"\n      [ngClass]=\"ngClasses\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  }\n</ng-template>\n\n<ng-template #_modalInsidePanel>\n  <div\n    class=\"ard-modal-panel\"\n    cdkTrapFocus\n    [class.ard-modal-no-heading-text]=\"!heading\"\n    [class.ard-modal-has-close-button]=\"!this.noCloseButton()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <div class=\"ard-modal-heading\">\n      <div class=\"ard-modal-heading-text\">{{ heading() }}</div>\n      @if (!noCloseButton()) {\n        <ard-icon-button\n          class=\"ard-modal-close-button\"\n          color=\"none\"\n          [compact]=\"compact()\"\n          (click)=\"onCloseButtonClick()\"\n        >\n          <ard-icon>close</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n    <div class=\"ard-modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-modal-content{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "color", "lightColoring", "compact"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: i4$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumModalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-modal', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #modalTemplate>\n  @if (noBackdrop()) {\n    <div\n      class=\"ard-modal\"\n      [ngClass]=\"ngClasses\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  } @else {\n    <div\n      class=\"ard-modal ard-modal-backdrop\"\n      [ngClass]=\"ngClasses\"\n      (click)=\"onBackdropClick()\"\n    >\n      <ng-template [ngTemplateOutlet]=\"_modalInsidePanel\"></ng-template>\n    </div>\n  }\n</ng-template>\n\n<ng-template #_modalInsidePanel>\n  <div\n    class=\"ard-modal-panel\"\n    cdkTrapFocus\n    [class.ard-modal-no-heading-text]=\"!heading\"\n    [class.ard-modal-has-close-button]=\"!this.noCloseButton()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <div class=\"ard-modal-heading\">\n      <div class=\"ard-modal-heading-text\">{{ heading() }}</div>\n      @if (!noCloseButton()) {\n        <ard-icon-button\n          class=\"ard-modal-close-button\"\n          color=\"none\"\n          [compact]=\"compact()\"\n          (click)=\"onCloseButtonClick()\"\n        >\n          <ard-icon>close</ard-icon>\n        </ard-icon-button>\n      }\n    </div>\n    <div class=\"ard-modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: [".ard-modal-content{width:100%}\n"] }]
         }], propDecorators: { _open: [{
@@ -10869,20 +10872,20 @@ class ArdiumDialogComponent {
     onModalClose() {
         this.closeEvent.emit('close');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ArdiumDialogComponent, selector: "ard-dialog", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonText: { classPropertyName: "confirmButtonText", publicName: "confirmButtonText", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonColor: { classPropertyName: "confirmButtonColor", publicName: "confirmButtonColor", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonAppearance: { classPropertyName: "confirmButtonAppearance", publicName: "confirmButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonText: { classPropertyName: "rejectButtonText", publicName: "rejectButtonText", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonColor: { classPropertyName: "rejectButtonColor", publicName: "rejectButtonColor", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonAppearance: { classPropertyName: "rejectButtonAppearance", publicName: "rejectButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, noRejectButton: { classPropertyName: "noRejectButton", publicName: "noRejectButton", isSignal: true, isRequired: false, transformFunction: null }, canConfirm: { classPropertyName: "canConfirm", publicName: "canConfirm", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closeEvent: "close", confirmEvent: "confirm", rejectEvent: "reject" }, queries: [{ propertyName: "buttonsTemplate", first: true, predicate: ArdDialogButtonsTemplateDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<ard-modal\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [heading]=\"heading()\"\n  [noCloseButton]=\"noCloseButton()\"\n  [noBackdrop]=\"noBackdrop()\"\n  [disableBackdropClose]=\"disableBackdropClose()\"\n  [(open)]=\"open\"\n  (close)=\"onModalClose()\"\n>\n  <div class=\"ard-dialog-container\">\n    <div class=\"ard-dialog-content\">\n      <ng-content></ng-content>\n    </div>\n    <div class=\"ard-dialog-buttons\">\n      <ng-template\n        #defaultButtonsTemplate\n        let-confirmButton=\"confirmButton\"\n        let-rejectButton=\"rejectButton\"\n        let-canConfirm=\"canConfirm\"\n        let-onConfirm=\"onConfirm\"\n        let-onReject=\"onReject\"\n        let-dialogVariant=\"dialogVariant\"\n        let-dialogCompact=\"dialogCompact\"\n      >\n        <div class=\"ard-dialog-buttons-container\">\n          @if (rejectButton.enabled) {\n            <ard-button\n              [color]=\"rejectButton.color\"\n              [appearance]=\"rejectButton.appearance\"\n              [variant]=\"dialogVariant\"\n              [compact]=\"dialogCompact\"\n              (click)=\"onReject()\"\n            >\n              {{ rejectButton.text }}\n            </ard-button>\n          }\n          <ard-button\n            [color]=\"confirmButton.color\"\n            [appearance]=\"confirmButton.appearance\"\n            [variant]=\"dialogVariant\"\n            [compact]=\"dialogCompact\"\n            (click)=\"onConfirm()\"\n            [disabled]=\"!canConfirm\"\n          >\n            {{ confirmButton.text }}\n          </ard-button>\n        </div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"buttonsTemplate()?.template ?? defaultButtonsTemplate\"\n        [ngTemplateOutletContext]=\"getButtonsContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</ard-modal>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "component", type: ArdiumModalComponent, selector: "ard-modal", inputs: ["appearance", "variant", "compact", "heading", "noCloseButton", "noBackdrop", "disableBackdropClose", "open"], outputs: ["openChange", "close"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ArdiumDialogComponent, selector: "ard-dialog", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, noCloseButton: { classPropertyName: "noCloseButton", publicName: "noCloseButton", isSignal: true, isRequired: false, transformFunction: null }, noBackdrop: { classPropertyName: "noBackdrop", publicName: "noBackdrop", isSignal: true, isRequired: false, transformFunction: null }, disableBackdropClose: { classPropertyName: "disableBackdropClose", publicName: "disableBackdropClose", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonText: { classPropertyName: "confirmButtonText", publicName: "confirmButtonText", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonColor: { classPropertyName: "confirmButtonColor", publicName: "confirmButtonColor", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonAppearance: { classPropertyName: "confirmButtonAppearance", publicName: "confirmButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonText: { classPropertyName: "rejectButtonText", publicName: "rejectButtonText", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonColor: { classPropertyName: "rejectButtonColor", publicName: "rejectButtonColor", isSignal: true, isRequired: false, transformFunction: null }, rejectButtonAppearance: { classPropertyName: "rejectButtonAppearance", publicName: "rejectButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, noRejectButton: { classPropertyName: "noRejectButton", publicName: "noRejectButton", isSignal: true, isRequired: false, transformFunction: null }, canConfirm: { classPropertyName: "canConfirm", publicName: "canConfirm", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closeEvent: "close", confirmEvent: "confirm", rejectEvent: "reject" }, queries: [{ propertyName: "buttonsTemplate", first: true, predicate: ArdDialogButtonsTemplateDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<ard-modal\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [heading]=\"heading()\"\n  [noCloseButton]=\"noCloseButton()\"\n  [noBackdrop]=\"noBackdrop()\"\n  [disableBackdropClose]=\"disableBackdropClose()\"\n  [(open)]=\"open\"\n  (close)=\"onModalClose()\"\n>\n  <div class=\"ard-dialog-container\">\n    <div class=\"ard-dialog-content\">\n      <ng-content></ng-content>\n    </div>\n    <div class=\"ard-dialog-buttons\">\n      <ng-template\n        #defaultButtonsTemplate\n        let-confirmButton=\"confirmButton\"\n        let-rejectButton=\"rejectButton\"\n        let-canConfirm=\"canConfirm\"\n        let-onConfirm=\"onConfirm\"\n        let-onReject=\"onReject\"\n        let-dialogVariant=\"dialogVariant\"\n        let-dialogCompact=\"dialogCompact\"\n      >\n        <div class=\"ard-dialog-buttons-container\">\n          @if (rejectButton.enabled) {\n            <ard-button\n              [color]=\"rejectButton.color\"\n              [appearance]=\"rejectButton.appearance\"\n              [variant]=\"dialogVariant\"\n              [compact]=\"dialogCompact\"\n              (click)=\"onReject()\"\n            >\n              {{ rejectButton.text }}\n            </ard-button>\n          }\n          <ard-button\n            [color]=\"confirmButton.color\"\n            [appearance]=\"confirmButton.appearance\"\n            [variant]=\"dialogVariant\"\n            [compact]=\"dialogCompact\"\n            (click)=\"onConfirm()\"\n            [disabled]=\"!canConfirm\"\n          >\n            {{ confirmButton.text }}\n          </ard-button>\n        </div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"buttonsTemplate()?.template ?? defaultButtonsTemplate\"\n        [ngTemplateOutletContext]=\"getButtonsContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</ard-modal>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "component", type: ArdiumModalComponent, selector: "ard-modal", inputs: ["appearance", "variant", "compact", "heading", "noCloseButton", "noBackdrop", "disableBackdropClose", "open"], outputs: ["openChange", "close"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDialogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-dialog', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ard-modal\n  [appearance]=\"appearance()\"\n  [variant]=\"variant()\"\n  [compact]=\"compact()\"\n  [heading]=\"heading()\"\n  [noCloseButton]=\"noCloseButton()\"\n  [noBackdrop]=\"noBackdrop()\"\n  [disableBackdropClose]=\"disableBackdropClose()\"\n  [(open)]=\"open\"\n  (close)=\"onModalClose()\"\n>\n  <div class=\"ard-dialog-container\">\n    <div class=\"ard-dialog-content\">\n      <ng-content></ng-content>\n    </div>\n    <div class=\"ard-dialog-buttons\">\n      <ng-template\n        #defaultButtonsTemplate\n        let-confirmButton=\"confirmButton\"\n        let-rejectButton=\"rejectButton\"\n        let-canConfirm=\"canConfirm\"\n        let-onConfirm=\"onConfirm\"\n        let-onReject=\"onReject\"\n        let-dialogVariant=\"dialogVariant\"\n        let-dialogCompact=\"dialogCompact\"\n      >\n        <div class=\"ard-dialog-buttons-container\">\n          @if (rejectButton.enabled) {\n            <ard-button\n              [color]=\"rejectButton.color\"\n              [appearance]=\"rejectButton.appearance\"\n              [variant]=\"dialogVariant\"\n              [compact]=\"dialogCompact\"\n              (click)=\"onReject()\"\n            >\n              {{ rejectButton.text }}\n            </ard-button>\n          }\n          <ard-button\n            [color]=\"confirmButton.color\"\n            [appearance]=\"confirmButton.appearance\"\n            [variant]=\"dialogVariant\"\n            [compact]=\"dialogCompact\"\n            (click)=\"onConfirm()\"\n            [disabled]=\"!canConfirm\"\n          >\n            {{ confirmButton.text }}\n          </ard-button>\n        </div>\n      </ng-template>\n\n      <ng-template\n        [ngTemplateOutlet]=\"buttonsTemplate()?.template ?? defaultButtonsTemplate\"\n        [ngTemplateOutletContext]=\"getButtonsContext()\"\n      ></ng-template>\n    </div>\n  </div>\n</ard-modal>\n" }]
         }] });
 
 class ArdiumModalModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumModalModule, declarations: [ArdiumModalComponent], imports: [CommonModule, ArdiumIconButtonModule, ArdiumIconModule, A11yModule], exports: [ArdiumModalComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumModalModule, imports: [CommonModule, ArdiumIconButtonModule, ArdiumIconModule, A11yModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalModule, declarations: [ArdiumModalComponent], imports: [CommonModule, ArdiumIconButtonModule, ArdiumIconModule, A11yModule], exports: [ArdiumModalComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalModule, imports: [CommonModule, ArdiumIconButtonModule, ArdiumIconModule, A11yModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumModalModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumModalModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumModalComponent],
@@ -10892,11 +10895,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 class ArdiumDialogModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDialogModule, declarations: [ArdiumDialogComponent, ArdDialogButtonsTemplateDirective], imports: [CommonModule, ArdiumButtonModule, ArdiumModalModule], exports: [ArdiumDialogComponent, ArdDialogButtonsTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDialogModule, imports: [CommonModule, ArdiumButtonModule, ArdiumModalModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogModule, declarations: [ArdiumDialogComponent, ArdDialogButtonsTemplateDirective], imports: [CommonModule, ArdiumButtonModule, ArdiumModalModule], exports: [ArdiumDialogComponent, ArdDialogButtonsTemplateDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogModule, imports: [CommonModule, ArdiumButtonModule, ArdiumModalModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumDialogModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumDialogModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ArdiumDialogComponent, ArdDialogButtonsTemplateDirective],
@@ -11074,10 +11077,10 @@ class _ArdSimpleSnackbarComponent {
     get colorClass() {
         return `ard-color-${this.color}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ArdSimpleSnackbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: _ArdSimpleSnackbarComponent, isStandalone: true, selector: "ard-simple-snackbar", ngImport: i0, template: "<div\n  class=\"ard-snackbar\"\n  [class.ard-snackbar-closing]=\"snackbarRef.onCloseStart | async\"\n  [class]=\"colorClass\"\n>\n  <div class=\"ard-snackbar-content\">\n    @if (typeIcon) {\n      <ard-icon filled>{{ typeIcon }}</ard-icon>\n    }\n    <div class=\"ard-snackbar-message\">{{ data.message }}</div>\n  </div>\n  @if (data.action) {\n    <ard-button\n      class=\"ard-snackbar-action\"\n      appearance=\"transparent\"\n      lightColoring\n      [color]=\"color\"\n      (click)=\"closeWithAction()\"\n      >{{ data.action }}</ard-button\n    >\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ArdiumButtonModule }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: ArdiumIconModule }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ArdSimpleSnackbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: _ArdSimpleSnackbarComponent, isStandalone: true, selector: "ard-simple-snackbar", ngImport: i0, template: "<div\n  class=\"ard-snackbar\"\n  [class.ard-snackbar-closing]=\"snackbarRef.onCloseStart | async\"\n  [class]=\"colorClass\"\n>\n  <div class=\"ard-snackbar-content\">\n    @if (typeIcon) {\n      <ard-icon filled>{{ typeIcon }}</ard-icon>\n    }\n    <div class=\"ard-snackbar-message\">{{ data.message }}</div>\n  </div>\n  @if (data.action) {\n    <ard-button\n      class=\"ard-snackbar-action\"\n      appearance=\"transparent\"\n      lightColoring\n      [color]=\"color\"\n      (click)=\"closeWithAction()\"\n      >{{ data.action }}</ard-button\n    >\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ArdiumButtonModule }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["icon", "variant", "alignIcon", "vertical"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: ArdiumIconModule }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: _ArdSimpleSnackbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _ArdSimpleSnackbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ard-simple-snackbar', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [ArdiumButtonModule, AsyncPipe, ArdiumIconModule], standalone: true, template: "<div\n  class=\"ard-snackbar\"\n  [class.ard-snackbar-closing]=\"snackbarRef.onCloseStart | async\"\n  [class]=\"colorClass\"\n>\n  <div class=\"ard-snackbar-content\">\n    @if (typeIcon) {\n      <ard-icon filled>{{ typeIcon }}</ard-icon>\n    }\n    <div class=\"ard-snackbar-message\">{{ data.message }}</div>\n  </div>\n  @if (data.action) {\n    <ard-button\n      class=\"ard-snackbar-action\"\n      appearance=\"transparent\"\n      lightColoring\n      [color]=\"color\"\n      (click)=\"closeWithAction()\"\n      >{{ data.action }}</ard-button\n    >\n  }\n</div>\n" }]
         }] });
@@ -11308,10 +11311,10 @@ class ArdiumSnackbarService {
             ],
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSnackbarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSnackbarService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSnackbarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSnackbarService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ArdiumSnackbarService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ArdiumSnackbarService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',