@ardium-ui/ui 5.0.0-alpha.53 → 5.0.0-alpha.55

package/fesm2022/ardium-ui-ui.mjs

@@ -2,18 +2,18 @@ import 'first-last';
 import { Overlay, ScrollStrategyOptions, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
 import { TemplatePortal, ComponentPortal } from '@angular/cdk/portal';
 import * as i0 from '@angular/core';
-import { signal, computed, InjectionToken, input, Directive, Input, HostBinding, output, ViewChildren, inject, Injector, runInInjectionContext, viewChild, contentChild, Component, ViewEncapsulation, ChangeDetectionStrategy, Inject, ViewContainerRef, TemplateRef, forwardRef, HostListener, NgModule, effect, viewChildren, Pipe, model, ElementRef, ChangeDetectorRef, ContentChildren, Renderer2, linkedSignal, untracked, contentChildren, Injectable } from '@angular/core';
-import { NgControl, Validators, NG_VALUE_ACCESSOR } from '@angular/forms';
+import { signal, computed, InjectionToken, inject, Injector, input, Directive, Input, HostBinding, output, ViewChildren, viewChild, contentChild, Component, ViewEncapsulation, ChangeDetectionStrategy, Inject, ViewContainerRef, TemplateRef, forwardRef, HostListener, NgModule, effect, viewChildren, Pipe, model, ElementRef, ChangeDetectorRef, ContentChildren, Renderer2, linkedSignal, untracked, contentChildren, Injectable } from '@angular/core';
+import { NgControl, ValueChangeEvent, TouchedChangeEvent, PristineChangeEvent, StatusChangeEvent, Validators, NG_VALUE_ACCESSOR } from '@angular/forms';
 import * as i4 from '@ardium-ui/devkit';
 import { arraySignal, coerceBooleanProperty, coerceNumberProperty, coerceArrayProperty, ArdiumClickOutsideModule, ArdiumEscapeHTMLModule, FileSystemService, FileSystemMethod, ArdiumFilePipesModule, coerceDateProperty, ArdiumHoldModule } from '@ardium-ui/devkit';
-import { isDefined, any, isPrimitive, isAnyString, isNull, isNumber, isString, isArray, isFunction, isRegExp, evaluate, isObject, isPromise, isDate } from 'simple-bool';
+import { isDefined, any, isPrimitive, isFunction, isAnyString, isNull, isNumber, isString, isArray, isRegExp, evaluate, isObject, isPromise, isDate } from 'simple-bool';
 import { resolvePath } from 'resolve-object-path';
-import { toObservable } from '@angular/core/rxjs-interop';
-import { map, Subject, isObservable, firstValueFrom, merge, takeUntil, startWith, filter, BehaviorSubject } from 'rxjs';
 import { TakeChance } from 'take-chance';
+import { isEqual } from 'lodash';
 import * as i1 from '@angular/common';
 import { CommonModule, DatePipe, UpperCasePipe, TitleCasePipe, DOCUMENT, DecimalPipe, AsyncPipe } from '@angular/common';
 import { AutofillMonitor, CdkAutofill } from '@angular/cdk/text-field';
+import { Subject, isObservable, firstValueFrom, merge, takeUntil, startWith, filter, map, BehaviorSubject } from 'rxjs';
 import { roundToMultiple, roundFromZero, roundToPrecision } from 'more-rounding';
 import { keyToString } from 'key-display-names';
 import { BreakpointObserver } from '@angular/cdk/layout';
@@ -243,6 +243,164 @@ const FormElementVariant = {
     Pill: 'pill',
 };
 
+class FormControlTracker {
+    constructor(thisObj, options = {}) {
+        this.thisObj = thisObj;
+        this.options = options;
+        this._injector = inject(Injector);
+        this._value = signal(undefined);
+        this.value = this._value.asReadonly();
+        this._errors = signal(null, { equal: (a, b) => isEqual(a, b) });
+        this.errors = this._errors.asReadonly();
+        this._touched = signal(false);
+        this.touched = this._touched.asReadonly();
+        this.untouched = computed(() => !this.touched());
+        this._pristine = signal(false);
+        this.pristine = this._pristine.asReadonly();
+        this.dirty = computed(() => !this.pristine());
+        this._status = signal('VALID');
+        this.status = this._status.asReadonly();
+        this.valid = computed(() => this.status() === 'VALID');
+        this.invalid = computed(() => this.status() === 'INVALID');
+        this.pending = computed(() => this.status() === 'PENDING');
+        this.disabled = computed(() => this.status() === 'DISABLED');
+        this.enabled = computed(() => !this.disabled());
+        this._validators = signal(null);
+        this.validators = this._validators.asReadonly();
+        this._asyncValidators = signal(null);
+        this.asyncValidators = this._asyncValidators.asReadonly();
+    }
+    init() {
+        const ngControl = this._injector.get(NgControl, null);
+        if (ngControl) {
+            // if the valueAccessor was not yet set by Angular, we have to do it manually here
+            if (this.options.attachValueAccessor ?? true) {
+                if (!ngControl.valueAccessor || (this.thisObj && this.thisObj instanceof ngControl.valueAccessor.constructor)) {
+                    ngControl.valueAccessor = this.thisObj;
+                }
+            }
+            // grab the AbstractControl instance
+            const instance = ngControl.control;
+            if (!instance)
+                return;
+            this.instance = instance;
+            // listen to all data available in the events emitter
+            this._eventsSub = instance.events.subscribe(event => {
+                if (event instanceof ValueChangeEvent) {
+                    this._value.set(event.value);
+                    return;
+                }
+                if (event instanceof TouchedChangeEvent) {
+                    this._touched.set(event.touched);
+                    return;
+                }
+                if (event instanceof PristineChangeEvent) {
+                    this._pristine.set(event.pristine);
+                    return;
+                }
+                if (event instanceof StatusChangeEvent) {
+                    this._status.set(event.status);
+                    this._errors.set(event.source.errors);
+                    return;
+                }
+            });
+            this._value.set(instance.value);
+            this._touched.set(instance.touched);
+            this._pristine.set(instance.pristine);
+            this._status.set(instance.status);
+            this._errors.set(instance.errors);
+            // do not read the next lines of code if you are easily frightened
+            // I'm not proud of this part, but it had to be done. God please forgive me
+            // I didn't find any other feasible way to detect when the control changes its validators
+            // so it had to be hacked like this
+            // override the "setValidators" function to capture the validators
+            const oldSetValidators = instance.setValidators.bind(instance);
+            instance.setValidators = (...args) => {
+                oldSetValidators(...args);
+                const validators = instance._rawValidators;
+                this._validators.set(isFunction(validators) ? [validators] : validators);
+            };
+            // override the "validator" setter to capture the validators
+            wrapSetter(instance, 'validator', () => {
+                const raw = instance._rawValidators;
+                this._validators.set(isFunction(raw) ? [raw] : raw);
+            });
+            // override the "setAsyncValidators" function to capture the async validators
+            const oldSetAsyncValidators = instance.setAsyncValidators.bind(instance);
+            instance.setAsyncValidators = (...args) => {
+                oldSetAsyncValidators(...args);
+                const validators = instance._rawAsyncValidators;
+                this._asyncValidators.set(isFunction(validators) ? [validators] : validators);
+            };
+            // override the "asyncValidator" setter to capture the async validators
+            wrapSetter(instance, 'asyncValidator', () => {
+                const raw = instance._rawAsyncValidators;
+                this._asyncValidators.set(isFunction(raw) ? [raw] : raw);
+            });
+            // assign the validators at init time
+            const validators = instance._rawValidators;
+            this._validators.set(isFunction(validators) ? [validators] : validators);
+            const asyncValidators = instance._rawAsyncValidators;
+            this._asyncValidators.set(isFunction(asyncValidators) ? [asyncValidators] : asyncValidators);
+        }
+    }
+    destroy() {
+        this._eventsSub?.unsubscribe();
+    }
+}
+/**
+ * Gives reactive access to the properties of the Form Control assigned to the component instance.
+ *
+ * Call the `init()` method inside `ngOnInit()` to start listening to the Form Control, call `destroy()` to dispose of the listener.
+ *
+ * @param thisObj the component instance.
+ * @returns an object containing all standard form control getters as signals.
+ * @example
+ * ```
+ * export class MyComponent implements ControlValueAccessor, OnInit, OnDestroy {
+ *   readonly control = trackFormControl(this);
+ *
+ *   ngOnInit(): void {
+ *     this.control.init();
+ *   }
+ *   ngOnDestroy(): void {
+ *     this.control.destroy();
+ *   }
+ *   // control value accessor implementation ...
+ * }
+ * ```
+ */
+function trackFormControl(thisObj, options = {}) {
+    return new FormControlTracker(thisObj, options);
+}
+// --- helper: wraps an accessor setter on a single instance ---
+function wrapSetter(obj, propName, after) {
+    // find the accessor descriptor up the prototype chain
+    let proto = obj;
+    let desc;
+    while (proto && !(desc = Object.getOwnPropertyDescriptor(proto, propName))) {
+        proto = Object.getPrototypeOf(proto);
+    }
+    if (!desc || typeof desc.set !== 'function') {
+        throw new Error(`No setter found for ${String(propName)}`);
+    }
+    const originalSet = desc.set;
+    const originalGet = desc.get; // may exist
+    Object.defineProperty(obj, propName, {
+        configurable: true,
+        enumerable: desc.enumerable ?? true,
+        get: originalGet
+            ? function () {
+                return originalGet.call(this);
+            }
+            : undefined,
+        set: function (value) {
+            originalSet.call(this, value);
+            after();
+        },
+    });
+}
+
 const _disablableComponentDefaults = {
     readonly: false,
     disabled: false,
@@ -383,19 +541,15 @@ const _ngModelComponentDefaults = {
 class _NgModelComponentBase extends _FocusableComponentBase {
     constructor() {
         super(...arguments);
-        //! event handlers
-        this.wasTouched = signal(false);
         this._shouldEmitTouched = false;
         //! form field related
-        this._injector = inject(Injector);
-        this._ngControl = null;
+        this.control = trackFormControl(this);
         this.htmlId = input(TakeChance.id());
         this._hasError = input(undefined, {
             transform: v => coerceBooleanProperty(v),
             alias: 'hasError',
         });
-        this._hasErrorInControl = signal(false);
-        this.hasError = computed(() => this._hasError() ?? (this.wasTouched() && this._hasErrorInControl()));
+        this.hasError = computed(() => this._hasError() ?? (this.control.touched() && this.control.invalid()));
     }
     /**
      * Registers a function to handle touched state. Required by ControlValueAccessor.
@@ -418,6 +572,7 @@ class _NgModelComponentBase extends _FocusableComponentBase {
     setDisabledState(isDisabled) {
         this.disabled.set(isDisabled);
     }
+    //! event handlers
     onFocus(event) {
         super.onFocus(event);
         this._shouldEmitTouched = false;
@@ -434,32 +589,13 @@ class _NgModelComponentBase extends _FocusableComponentBase {
         }, 0);
     }
     _emitTouched() {
-        this.wasTouched.set(true);
         this._onTouchedRegistered?.();
     }
     ngOnInit() {
-        this._ngControl = this._injector.get(NgControl, null);
-        if (this._ngControl) {
-            if (!this._ngControl.valueAccessor || (this && this instanceof this._ngControl.valueAccessor.constructor)) {
-                this._ngControl.valueAccessor = this;
-            }
-            this._hasErrorInControl.set(this._ngControl.status === 'INVALID');
-            this._statusChangesSub = this._ngControl.statusChanges
-                ?.pipe(map(v => v === 'INVALID'))
-                .subscribe(v => this._hasErrorInControl.set(v));
-            if (!this._ngControl.control)
-                return;
-            runInInjectionContext(this._injector, () => {
-                // do not read the next line of code if you are easily frightened
-                // I'm not proud of this part, but it had to be done. God please forgive me
-                // I didn't find any other feasible way to detect when the control changes its touched state
-                // so it had to be hacked like this
-                toObservable(this._ngControl?.control?.touchedReactive)?.subscribe(v => this.wasTouched.set(v));
-            });
-        }
+        this.control.init();
     }
     ngOnDestroy() {
-        this._statusChangesSub?.unsubscribe();
+        this.control.destroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: _NgModelComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: _NgModelComponentBase, isStandalone: true, inputs: { htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, _hasError: { classPropertyName: "_hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
@@ -484,11 +620,10 @@ class _FormFieldComponentBase extends _NgModelComponentBase {
             transform: v => coerceBooleanProperty(v),
             alias: 'required',
         });
+        this.required = computed(() => this._required() ??
+            !!(this.control.validators()?.includes(Validators.required) || this.control.validators()?.includes(Validators.requiredTrue)));
         this.isSuccess = input(false, { transform: v => coerceBooleanProperty(v) });
     }
-    get required() {
-        return this._required() ?? !!this._ngControl?.control?.hasValidator(Validators.required);
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: _FormFieldComponentBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: _FormFieldComponentBase, isStandalone: true, inputs: { _required: { classPropertyName: "_required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, isSuccess: { classPropertyName: "isSuccess", publicName: "isSuccess", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
 }
@@ -674,6 +809,13 @@ class NumberInputModel {
         this._value.set(stringV);
         this._updateInputEl();
     }
+    updateFixedDecimalPlaces() {
+        if (!this._ardHostCmp.fixedDecimalPlaces())
+            return;
+        const maxDp = this._ardHostCmp.maxDecimalPlaces();
+        const newValue = this.numberValue()?.toFixed(maxDp) ?? null;
+        this.setValue(newValue);
+    }
     _updateInputEl() {
         const stringV = this.stringValue();
         const el = this._ardHostCmp.inputEl()?.nativeElement;
@@ -9812,6 +9954,7 @@ const _numberInputDefaults = {
     min: 0,
     max: Infinity,
     maxDecimalPlaces: Infinity,
+    fixedDecimalPlaces: false,
     allowFloat: false,
     noButtons: false,
     stepSize: 1,
@@ -9929,6 +10072,9 @@ class ArdiumNumberInputComponent extends _FormFieldComponentBase {
                 return newValue;
             },
         });
+        this.fixedDecimalPlaces = input(this._DEFAULTS.fixedDecimalPlaces, {
+            transform: v => coerceBooleanProperty(v),
+        });
         this.allowFloat = input(this._DEFAULTS.allowFloat, { transform: v => coerceBooleanProperty(v) });
         //! incerement/decrement buttons
         this.noButtons = input(this._DEFAULTS.noButtons, { transform: v => coerceBooleanProperty(v) });
@@ -9976,6 +10122,9 @@ class ArdiumNumberInputComponent extends _FormFieldComponentBase {
     //! control value accessor's write value implementation
     writeValue(v) {
         this.inputModel.writeValue(v);
+        if (this.isFocused())
+            return;
+        this.inputModel.updateFixedDecimalPlaces();
     }
     set value(v) {
         if (typeof v === 'number')
@@ -10039,6 +10188,7 @@ class ArdiumNumberInputComponent extends _FormFieldComponentBase {
     }
     onBlurMaster(event) {
         this.onBlur(event);
+        this.inputModel.updateFixedDecimalPlaces();
     }
     //change
     onChange(event) {
@@ -10088,7 +10238,7 @@ class ArdiumNumberInputComponent extends _FormFieldComponentBase {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumNumberInputComponent, deps: [{ token: ARD_NUMBER_INPUT_DEFAULTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumNumberInputComponent, isStandalone: false, 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 }, maxDecimalPlaces: { classPropertyName: "maxDecimalPlaces", publicName: "maxDecimalPlaces", 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 }, keepFocusOnQuickChangeButton: { classPropertyName: "keepFocusOnQuickChangeButton", publicName: "keepFocusOnQuickChangeButton", 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.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumNumberInputComponent, isStandalone: false, 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 }, maxDecimalPlaces: { classPropertyName: "maxDecimalPlaces", publicName: "maxDecimalPlaces", isSignal: true, isRequired: false, transformFunction: null }, fixedDecimalPlaces: { classPropertyName: "fixedDecimalPlaces", publicName: "fixedDecimalPlaces", 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 }, keepFocusOnQuickChangeButton: { classPropertyName: "keepFocusOnQuickChangeButton", publicName: "keepFocusOnQuickChangeButton", 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),
@@ -13322,6 +13472,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
                 }]
         }] });
 
+const _formFieldDefaults = {
+    defaultHintAlign: SimpleOneAxisAlignment.Left,
+    reserveHintLine: false,
+    labelRequiredText: '*',
+    labelOptionalText: '(optional)',
+    autoErrorOnlyFirstError: true,
+};
+const ARD_FORM_FIELD_DEFAULTS = new InjectionToken('ard-form-field-defaults', {
+    factory: () => ({
+        ..._formFieldDefaults,
+    }),
+});
+function provideFormFieldDefaults(config) {
+    return { provide: ARD_FORM_FIELD_DEFAULTS, useValue: { ..._formFieldDefaults, ...config } };
+}
+
+const ARD_ERROR_MAP = new InjectionToken('ard-error-map', {
+    factory: () => ({ $fallback: 'Provide error messages using provideErrorMap' }),
+});
+function provideErrorMap(errorMap) {
+    return { provide: ARD_ERROR_MAP, useValue: errorMap };
+}
+
 class ArdiumErrorDirective {
     constructor() {
         this.left = input(false, { transform: v => coerceBooleanProperty(v) });
@@ -13349,29 +13522,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
                 }]
         }], ctorParameters: () => [] });
 
-const _formFieldDefaults = {
-    defaultHintAlign: SimpleOneAxisAlignment.Left,
-    reserveHintLine: false,
-    labelRequiredText: '*',
-    labelOptionalText: '(optional)',
-    autoErrorOnlyFirstError: true,
-};
-const ARD_FORM_FIELD_DEFAULTS = new InjectionToken('ard-form-field-defaults', {
-    factory: () => ({
-        ..._formFieldDefaults,
-    }),
-});
-function provideFormFieldDefaults(config) {
-    return { provide: ARD_FORM_FIELD_DEFAULTS, useValue: { ..._formFieldDefaults, ...config } };
-}
-
-const ARD_ERROR_MAP = new InjectionToken('ard-error-map', {
-    factory: () => ({ $fallback: 'Provide error messages using provideErrorMap' }),
-});
-function provideErrorMap(errorMap) {
-    return { provide: ARD_ERROR_MAP, useValue: errorMap };
-}
-
 class ArdiumErrorComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ArdiumErrorComponent, isStandalone: false, selector: "ard-error", hostDirectives: [{ directive: ArdiumErrorDirective }], ngImport: i0, template: '<ng-content />', isInline: true }); }
@@ -13401,15 +13551,15 @@ class ArdiumAutoErrorComponent {
         effect(() => {
             const control = this.control();
             this._eventsSub = control.events
-                .pipe(filter(event => 'touched' in event || ('status' in event && (event.status === 'INVALID' || event.status === 'VALID'))), map(() => {
+                .pipe(filter(event => 'touched' in event || 'status' in event), map(() => {
                 const errors = control.errors;
                 if (!errors || !control.touched) {
                     return [];
                 }
-                const onlyFirstError = this.onlyFirstError();
                 if (typeof errors === 'object' && Object.keys(errors).length === 0) {
                     return [];
                 }
+                const onlyFirstError = this.onlyFirstError();
                 const errorMessages = [];
                 for (const errorType in this._errorMap) {
                     if (errorType in errors) {
@@ -13437,6 +13587,9 @@ class ArdiumAutoErrorComponent {
                 .subscribe(errorMessages => {
                 this.errorMessages.set(errorMessages);
             });
+            () => {
+                this._eventsSub.unsubscribe();
+            };
         });
         effect(() => {
             if (this.left() && this.right()) {
@@ -13448,16 +13601,17 @@ class ArdiumAutoErrorComponent {
         this._eventsSub?.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumAutoErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumAutoErrorComponent, isStandalone: false, selector: "ard-auto-error", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, onlyFirstError: { classPropertyName: "onlyFirstError", publicName: "onlyFirstError", isSignal: true, isRequired: false, transformFunction: null }, left: { classPropertyName: "left", publicName: "left", isSignal: true, isRequired: false, transformFunction: null }, right: { classPropertyName: "right", publicName: "right", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-error": "true", "class.ard-auto-error": "true", "class.ard-auto-error-default": "!left() && !right()", "class.ard-auto-error-left": "left() && !right()", "class.ard-auto-error-right": "!left() && right()" } }, hostDirectives: [{ directive: ArdiumErrorDirective }], ngImport: i0, template: "@for (message of errorMessages(); track message) {\r\n  <ard-error>{{ message }}</ard-error>\r\n}", dependencies: [{ kind: "component", type: ArdiumErrorComponent, selector: "ard-error" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumAutoErrorComponent, isStandalone: false, selector: "ard-auto-error", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, onlyFirstError: { classPropertyName: "onlyFirstError", publicName: "onlyFirstError", isSignal: true, isRequired: false, transformFunction: null }, left: { classPropertyName: "left", publicName: "left", isSignal: true, isRequired: false, transformFunction: null }, right: { classPropertyName: "right", publicName: "right", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-auto-error": "true", "class.ard-auto-error-default": "!left() && !right()", "class.ard-auto-error-left": "left() && !right()", "class.ard-auto-error-right": "!left() && right()", "class.ard-auto-error__no-errors": "errorMessages().length === 0", "class.ard-auto-error__has-errors": "errorMessages().length > 0" } }, ngImport: i0, template: "@for (message of errorMessages(); track message) {\r\n  <ard-error>{{ message }}</ard-error>\r\n}", dependencies: [{ kind: "component", type: ArdiumErrorComponent, selector: "ard-error" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumAutoErrorComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'ard-auto-error', hostDirectives: [{ directive: ArdiumErrorDirective }], host: {
-                        '[class.ard-error]': 'true',
+            args: [{ standalone: false, selector: 'ard-auto-error', host: {
                         '[class.ard-auto-error]': 'true',
                         '[class.ard-auto-error-default]': '!left() && !right()',
                         '[class.ard-auto-error-left]': 'left() && !right()',
                         '[class.ard-auto-error-right]': '!left() && right()',
+                        '[class.ard-auto-error__no-errors]': 'errorMessages().length === 0',
+                        '[class.ard-auto-error__has-errors]': 'errorMessages().length > 0',
                     }, template: "@for (message of errorMessages(); track message) {\r\n  <ard-error>{{ message }}</ard-error>\r\n}" }]
         }], ctorParameters: () => [] });
 
@@ -13467,46 +13621,24 @@ class ArdiumFormFieldNativeInputAdapterDirective {
             transform: v => coerceBooleanProperty(v),
             alias: 'required',
         });
+        this.required = computed(() => this._required() ??
+            !!(this.control.validators()?.includes(Validators.required) || this.control.validators()?.includes(Validators.requiredTrue)));
         this.isSuccess = input(false, { transform: v => coerceBooleanProperty(v) });
         this.disabled = input(false, { transform: v => coerceBooleanProperty(v) });
         //! form field related
-        this._injector = inject(Injector);
-        this.wasTouched = signal(false);
-        this._ngControl = null;
+        this.control = trackFormControl(this, { attachValueAccessor: false });
         this.htmlId = input(TakeChance.id());
         this._hasError = input(undefined, {
             transform: v => coerceBooleanProperty(v),
             alias: 'hasError',
         });
-        this._hasErrorInControl = signal(false);
-        this.hasError = computed(() => this._hasError() ?? (this.wasTouched() && this._hasErrorInControl()));
-    }
-    get required() {
-        return this._required() ?? !!this._ngControl?.control?.hasValidator(Validators.required);
+        this.hasError = computed(() => this._hasError() ?? (this.control.touched() && this.control.invalid()));
     }
     ngOnInit() {
-        this._ngControl = this._injector.get(NgControl, null);
-        if (this._ngControl) {
-            // if (!this._ngControl.valueAccessor || (this && this instanceof (this._ngControl.valueAccessor as any).constructor)) {
-            //   this._ngControl.valueAccessor = this;
-            // }
-            this._hasErrorInControl.set(this._ngControl.status === 'INVALID');
-            this._statusChangesSub = this._ngControl.statusChanges
-                ?.pipe(map(v => v === 'INVALID'))
-                .subscribe(v => this._hasErrorInControl.set(v));
-            if (!this._ngControl.control)
-                return;
-            runInInjectionContext(this._injector, () => {
-                // do not read the next line of code if you are easily frightened
-                // I'm not proud of this part, but it had to be done. God please forgive me
-                // I didn't find any other feasible way to detect when the control changes its touched state
-                // so it had to be hacked like this
-                toObservable(this._ngControl?.control?.touchedReactive)?.subscribe(v => this.wasTouched.set(v));
-            });
-        }
+        this.control.init();
     }
     ngOnDestroy() {
-        this._statusChangesSub?.unsubscribe();
+        this.control.destroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumFormFieldNativeInputAdapterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: ArdiumFormFieldNativeInputAdapterDirective, isStandalone: false, selector: "ard-form-field > input, ard-form-field > textarea, ard-form-field > select, ard-horizontal-form-field > input, ard-horizontal-form-field > textarea, ard-horizontal-form-field > select", inputs: { _required: { classPropertyName: "_required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, isSuccess: { classPropertyName: "isSuccess", publicName: "isSuccess", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, htmlId: { classPropertyName: "htmlId", publicName: "htmlId", isSignal: true, isRequired: false, transformFunction: null }, _hasError: { classPropertyName: "_hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ard-has-error": "hasError()", "class.ard-is-success": "isSuccess()" } }, providers: [
@@ -13667,11 +13799,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
 
 class ArdiumFormFieldComponent extends _FormFieldBase {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumFormFieldComponent, isStandalone: false, selector: "ard-form-field", usesInheritance: true, ngImport: i0, template: "<div\r\n  class=\"ard-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <label\r\n    class=\"ard-form-field__label\"\r\n    [attr.for]=\"controlHtmlId\"\r\n  >\r\n    <ng-content select=\"ard-label, [ard-label]\" />\r\n  </label>\r\n  <div class=\"ard-form-field__input\">\r\n    <ng-content />\r\n  </div>\r\n  <div\r\n    class=\"ard-form-field__hints\"\r\n    [class.ard-form-field__errors]=\"hasAnyError()\"\r\n    [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n    [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n  >\r\n    @if (hasAnyError()) {\r\n    <div class=\"ard-form-field__errors-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__errors-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    } @else {\r\n    <div class=\"ard-form-field__hints-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__hints-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: [":host{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumFormFieldComponent, isStandalone: false, selector: "ard-form-field", usesInheritance: true, ngImport: i0, template: "<div\r\n  class=\"ard-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <label\r\n    class=\"ard-form-field__label\"\r\n    [attr.for]=\"controlHtmlId\"\r\n  >\r\n    <ng-content select=\"ard-label, [ard-label]\" />\r\n  </label>\r\n  <div class=\"ard-form-field__input\">\r\n    <ng-content />\r\n  </div>\r\n  <div\r\n    class=\"ard-form-field__hints\"\r\n    [class.ard-form-field__errors]=\"hasAnyError()\"\r\n    [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n    [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n  >\r\n    @if (hasAnyError()) {\r\n    <div class=\"ard-form-field__errors-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__errors-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    } @else {\r\n    <div class=\"ard-form-field__hints-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__hints-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: ["ard-form-field,ard-horizontal-form-field{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-auto-error__no-errors{display:none}\n"], dependencies: [{ 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: "19.2.15", ngImport: i0, type: ArdiumFormFieldComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'ard-form-field', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"ard-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <label\r\n    class=\"ard-form-field__label\"\r\n    [attr.for]=\"controlHtmlId\"\r\n  >\r\n    <ng-content select=\"ard-label, [ard-label]\" />\r\n  </label>\r\n  <div class=\"ard-form-field__input\">\r\n    <ng-content />\r\n  </div>\r\n  <div\r\n    class=\"ard-form-field__hints\"\r\n    [class.ard-form-field__errors]=\"hasAnyError()\"\r\n    [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n    [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n  >\r\n    @if (hasAnyError()) {\r\n    <div class=\"ard-form-field__errors-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__errors-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    } @else {\r\n    <div class=\"ard-form-field__hints-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__hints-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: [":host{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error{display:none}\n"] }]
+            args: [{ standalone: false, selector: 'ard-form-field', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"ard-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <label\r\n    class=\"ard-form-field__label\"\r\n    [attr.for]=\"controlHtmlId\"\r\n  >\r\n    <ng-content select=\"ard-label, [ard-label]\" />\r\n  </label>\r\n  <div class=\"ard-form-field__input\">\r\n    <ng-content />\r\n  </div>\r\n  <div\r\n    class=\"ard-form-field__hints\"\r\n    [class.ard-form-field__errors]=\"hasAnyError()\"\r\n    [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n    [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n  >\r\n    @if (hasAnyError()) {\r\n    <div class=\"ard-form-field__errors-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__errors-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-error\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    } @else {\r\n    <div class=\"ard-form-field__hints-left\">\r\n      @if (alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n      <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n    </div>\r\n    <div class=\"ard-form-field__hints-right\">\r\n      @if (!alignHintToLeftByDefault()) {\r\n      <div class=\"ard-form-field__default-hint\">\r\n        <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n        <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n      </div>\r\n      }\r\n      <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n      <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: ["ard-form-field,ard-horizontal-form-field{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-auto-error__no-errors{display:none}\n"] }]
         }] });
 
 class ArdiumHintErrorComponent {
@@ -13704,11 +13836,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
 
 class ArdiumHorizontalFormFieldComponent extends _FormFieldBase {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumHorizontalFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumHorizontalFormFieldComponent, isStandalone: false, selector: "ard-horizontal-form-field", usesInheritance: true, ngImport: i0, template: "<div\r\n  class=\"ard-horizontal-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <div class=\"ard-form-field__label-container\">\r\n    <label\r\n      class=\"ard-form-field__label\"\r\n      [attr.for]=\"controlHtmlId\"\r\n    >\r\n      <ng-content select=\"ard-label, [ard-label]\" />\r\n    </label>\r\n  </div>\r\n  <div class=\"ard-form-field__non-label\">\r\n    <div class=\"ard-form-field__input\">\r\n      <ng-content />\r\n    </div>\r\n    <div\r\n      class=\"ard-form-field__hints\"\r\n      [class.ard-form-field__errors]=\"hasAnyError()\"\r\n      [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n      [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n    >\r\n      @if (hasAnyError()) {\r\n      <div class=\"ard-form-field__errors-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__errors-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      } @else {\r\n      <div class=\"ard-form-field__hints-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__hints-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: [":host{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ArdiumHorizontalFormFieldComponent, isStandalone: false, selector: "ard-horizontal-form-field", usesInheritance: true, ngImport: i0, template: "<div\r\n  class=\"ard-horizontal-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <div class=\"ard-form-field__label-container\">\r\n    <label\r\n      class=\"ard-form-field__label\"\r\n      [attr.for]=\"controlHtmlId\"\r\n    >\r\n      <ng-content select=\"ard-label, [ard-label]\" />\r\n    </label>\r\n  </div>\r\n  <div class=\"ard-form-field__non-label\">\r\n    <div class=\"ard-form-field__input\">\r\n      <ng-content />\r\n    </div>\r\n    <div\r\n      class=\"ard-form-field__hints\"\r\n      [class.ard-form-field__errors]=\"hasAnyError()\"\r\n      [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n      [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n    >\r\n      @if (hasAnyError()) {\r\n      <div class=\"ard-form-field__errors-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__errors-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      } @else {\r\n      <div class=\"ard-form-field__hints-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__hints-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: ["ard-form-field,ard-horizontal-form-field{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-auto-error__no-errors{display:none}\n"], dependencies: [{ 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: "19.2.15", ngImport: i0, type: ArdiumHorizontalFormFieldComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'ard-horizontal-form-field', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"ard-horizontal-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <div class=\"ard-form-field__label-container\">\r\n    <label\r\n      class=\"ard-form-field__label\"\r\n      [attr.for]=\"controlHtmlId\"\r\n    >\r\n      <ng-content select=\"ard-label, [ard-label]\" />\r\n    </label>\r\n  </div>\r\n  <div class=\"ard-form-field__non-label\">\r\n    <div class=\"ard-form-field__input\">\r\n      <ng-content />\r\n    </div>\r\n    <div\r\n      class=\"ard-form-field__hints\"\r\n      [class.ard-form-field__errors]=\"hasAnyError()\"\r\n      [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n      [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n    >\r\n      @if (hasAnyError()) {\r\n      <div class=\"ard-form-field__errors-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__errors-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      } @else {\r\n      <div class=\"ard-form-field__hints-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__hints-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: [":host{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error{display:none}\n"] }]
+            args: [{ standalone: false, selector: 'ard-horizontal-form-field', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"ard-horizontal-form-field\"\r\n  [class.ard-form-field__with-error]=\"controlHasError\"\r\n  [class.ard-form-field__is-success]=\"controlIsSuccess\"\r\n  [class.ard-form-field__control-disabled]=\"controlDisabled\"\r\n>\r\n  <div class=\"ard-form-field__label-container\">\r\n    <label\r\n      class=\"ard-form-field__label\"\r\n      [attr.for]=\"controlHtmlId\"\r\n    >\r\n      <ng-content select=\"ard-label, [ard-label]\" />\r\n    </label>\r\n  </div>\r\n  <div class=\"ard-form-field__non-label\">\r\n    <div class=\"ard-form-field__input\">\r\n      <ng-content />\r\n    </div>\r\n    <div\r\n      class=\"ard-form-field__hints\"\r\n      [class.ard-form-field__errors]=\"hasAnyError()\"\r\n      [class.ard-form-field__reserve-hint-line]=\"reserveHintLine() || hasAnyHint()\"\r\n      [class.ard-form-field__hints-default-left]=\"alignHintToLeftByDefault()\"\r\n    >\r\n      @if (hasAnyError()) {\r\n      <div class=\"ard-form-field__errors-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[left], [ard-error][left], ard-auto-error[left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__errors-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-error\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultAutoErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultErrors\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-error[right], [ard-error][right], ard-auto-error[right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      } @else {\r\n      <div class=\"ard-form-field__hints-left\">\r\n        @if (alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[left], [ard-hint][left]\" />\r\n        <ng-template [ngTemplateOutlet]=\"leftHintErrors\" />\r\n      </div>\r\n      <div class=\"ard-form-field__hints-right\">\r\n        @if (!alignHintToLeftByDefault()) {\r\n        <div class=\"ard-form-field__default-hint\">\r\n          <ng-template [ngTemplateOutlet]=\"defaultHints\" />\r\n          <ng-template [ngTemplateOutlet]=\"defaultHintErrors\" />\r\n        </div>\r\n        }\r\n        <ng-content select=\"ard-hint[right], [ard-hint][right]\" />\r\n        <ng-template [ngTemplateOutlet]=\"rightHintErrors\" />\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #defaultHints>\r\n  <ng-content select=\"ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultAutoErrors>\r\n  <ng-content select=\"ard-auto-error:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultErrors>\r\n  <ng-content select=\"ard-error:not([left]):not([right]), [ard-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n\r\n<ng-template #defaultHintErrors>\r\n  <ng-content select=\"ard-hint-error:not([left]):not([right]), [ard-hint-error]:not([left]):not([right])\" />\r\n</ng-template>\r\n<ng-template #leftHintErrors>\r\n  <ng-content select=\"ard-hint-error[left], [ard-hint-error][left]\" />\r\n</ng-template>\r\n<ng-template #rightHintErrors>\r\n  <ng-content select=\"ard-hint-error[right], [ard-hint-error][right]\" />\r\n</ng-template>\r\n", styles: ["ard-form-field,ard-horizontal-form-field{display:block}.ard-horizontal-form-field{display:flex}.ard-form-field__hints,.ard-form-field__errors{display:flex;justify-content:space-between}.ard-form-field__hints>*,.ard-form-field__errors>*{display:flex;flex-direction:column}.ard-form-field__hints .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors .ard-form-field__errors-left .ard-form-field__default-error{display:none}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-left .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-left .ard-form-field__default-error{display:flex;flex-direction:column}.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__hints.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__hints-right .ard-form-field__default-hint,.ard-form-field__errors.ard-form-field__hints-default-left .ard-form-field__errors-right .ard-form-field__default-error,.ard-auto-error__no-errors{display:none}\n"] }]
         }] });
 
 class ArdiumFormFieldModule {
@@ -17142,5 +17274,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ARD_BADGE_DEFAULTS, ARD_BREAKPOINTS, ARD_BUTTON_DEFAULTS, ARD_CALENDAR_DEFAULTS, ARD_CARD_DEFAULTS, ARD_CHECKBOX_DEFAULTS, ARD_CHECKBOX_LIST_DEFAULTS, ARD_CHIP_DEFAULTS, ARD_DATE_INPUT_DEFAULTS, ARD_DELETABLE_CHIP_DEFAULTS, ARD_DIALOG_DEFAULTS, ARD_DIGIT_INPUT_DEFAULTS, ARD_DIVIDER_DEFAULTS, ARD_DROPDOWN_PANEL_DEFAULTS, ARD_ERROR_MAP, ARD_FAB_DEFAULTS, ARD_FILE_DROP_AREA_DEFAULTS, ARD_FILE_INPUT_DEFAULTS, ARD_FORM_FIELD_CONTROL, ARD_FORM_FIELD_DEFAULTS, ARD_FORM_FIELD_FRAME_DEFAULTS, ARD_GRID_DEFAULTS, ARD_HEX_INPUT_DEFAULTS, ARD_ICON_BUTTON_DEFAULTS, ARD_ICON_DEFAULTS, ARD_KBD_DEFAULTS, ARD_KBD_SHORTCUT_DEFAULTS, ARD_MODAL_DEFAULTS, ARD_NUMBER_INPUT_DEFAULTS, ARD_PASSWORD_INPUT_DEFAULTS, ARD_PROGRESS_BAR_DEFAULTS, ARD_PROGRESS_CIRCLE_DEFAULTS, ARD_RADIO_DEFAULTS, ARD_RATING_DISPLAY_DEFAULTS, ARD_RATING_INPUT_DEFAULTS, ARD_SEGMENT_DEFAULTS, ARD_SELECTABLE_CHIP_DEFAULTS, ARD_SELECT_DEFAULTS, ARD_SIMPLE_INPUT_DEFAULTS, ARD_SLIDER_DEFAULTS, ARD_SLIDE_TOGGLE_DEFAULTS, ARD_SNACKBAR_ANIMATION_LENGTH, ARD_SNACKBAR_DATA, ARD_SNACKBAR_DEFAULTS, ARD_SPINNER_DEFAULTS, ARD_STAR_BUTTON_DEFAULTS, ARD_STAR_DEFAULTS, ARD_STATEBOX_DEFAULTS, ARD_TABBER_DEFAULTS, ARD_TABLE_DEFAULTS, ARD_TABLE_FROM_CSV_DEFAULTS, ARD_TABLE_PAGINATION_DEFAULTS, ArdAddCustomTemplateDirective, ArdAutocompleteInputLoadingTemplateDirective, ArdAutocompleteInputPlaceholderTemplateDirective, ArdAutocompleteInputPrefixTemplateDirective, ArdAutocompleteInputSuffixTemplateDirective, ArdAutocompleteInputSuggestionTemplateDirective, ArdCalendarDayTemplateDirective, ArdCalendarDaysViewHeaderTemplateDirective, ArdCalendarFloatingMonthTemplateDirective, ArdCalendarMonthTemplateDirective, ArdCalendarMonthsViewHeaderTemplateDirective, ArdCalendarView, ArdCalendarWeekdayTemplateDirective, ArdCalendarYearTemplateDirective, ArdCalendarYearsViewHeaderTemplateDirective, ArdCheckboxListCheckboxTemplateDirective, ArdCheckboxListLabelTemplateDirective, ArdCheckboxTemplateDirective, ArdDateInputAcceptButtonsTemplateDirective, ArdDateInputCalendarIconTemplateDirective, ArdDateInputDayTemplateDirective, ArdDateInputDaysViewHeaderTemplateDirective, ArdDateInputFloatingMonthTemplateDirective, ArdDateInputMinMaxStrategy, ArdDateInputMonthTemplateDirective, ArdDateInputMonthsViewHeaderTemplateDirective, ArdDateInputPrefixTemplateDirective, ArdDateInputSuffixTemplateDirective, ArdDateInputValueTemplateDirective, ArdDateInputWeekdayTemplateDirective, ArdDateInputYearTemplateDirective, ArdDateInputYearsViewHeaderTemplateDirective, ArdDateRangeInputAcceptButtonsTemplateDirective, ArdDateRangeInputCalendarIconTemplateDirective, ArdDateRangeInputDayTemplateDirective, ArdDateRangeInputDaysViewHeaderTemplateDirective, ArdDateRangeInputFloatingMonthTemplateDirective, ArdDateRangeInputMonthTemplateDirective, ArdDateRangeInputMonthsViewHeaderTemplateDirective, ArdDateRangeInputPrefixTemplateDirective, ArdDateRangeInputSuffixTemplateDirective, ArdDateRangeInputValueTemplateDirective, ArdDateRangeInputWeekdayTemplateDirective, ArdDateRangeInputYearTemplateDirective, ArdDateRangeInputYearsViewHeaderTemplateDirective, ArdDialogActionType, ArdDialogButtonsTemplateDirective, ArdDialogCloseIconTemplateDirective, ArdDialogResult, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdFileInputPlaceholderTemplateDirective, ArdFileInputPrefixTemplateDirective, ArdFileInputSuffixTemplateDirective, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective, ArdGridAlign, ArdGridDirection, ArdGridJustify, ArdGridSize, ArdGridWrap, ArdHexInputPlaceholderTemplateDirective, ArdHexInputPrefixTemplateDirective, ArdHexInputSuffixTemplateDirective, ArdInputPlaceholderTemplateDirective, ArdInputPrefixTemplateDirective, ArdInputSuffixTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdModalCloseIconTemplateDirective, ArdMultiCalendarLocation, ArdMultipageDateRangeInputAcceptButtonsTemplateDirective, ArdMultipageDateRangeInputCalendarIconTemplateDirective, ArdMultipageDateRangeInputDayTemplateDirective, ArdMultipageDateRangeInputDaysViewHeaderTemplateDirective, ArdMultipageDateRangeInputFloatingMonthTemplateDirective, ArdMultipageDateRangeInputMonthTemplateDirective, ArdMultipageDateRangeInputMonthsViewHeaderTemplateDirective, ArdMultipageDateRangeInputPrefixTemplateDirective, ArdMultipageDateRangeInputSuffixTemplateDirective, ArdMultipageDateRangeInputValueTemplateDirective, ArdMultipageDateRangeInputWeekdayTemplateDirective, ArdMultipageDateRangeInputYearTemplateDirective, ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdNumberInputPlaceholderTemplateDirective, ArdNumberInputPrefixTemplateDirective, ArdNumberInputSuffixTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdPanelPosition, ArdPasswordInputPlaceholderTemplateDirective, ArdPasswordInputPrefixTemplateDirective, ArdPasswordInputRevealButtonTemplateDirective, ArdPasswordInputSuffixTemplateDirective, ArdProgressBarValueTemplateDirective, ArdProgressCircleValueTemplateDirective, ArdRangeCalendarDayTemplateDirective, ArdRangeCalendarDaysViewHeaderTemplateDirective, ArdRangeCalendarFloatingMonthTemplateDirective, ArdRangeCalendarMonthTemplateDirective, ArdRangeCalendarMonthsViewHeaderTemplateDirective, ArdRangeCalendarWeekdayTemplateDirective, ArdRangeCalendarYearTemplateDirective, ArdRangeCalendarYearsViewHeaderTemplateDirective, ArdRangeSelectionBehavior, ArdRatingDisplayStarTemplateDirective, ArdRatingInputStarButtonTemplateDirective, searchFunctions as ArdSearchFunction, ArdSegmentOptionTemplateDirective, ArdSelectDropdownArrowTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdSlideToggleAppearance, ArdSliderTooltipDirective, ArdSnackbarAlignment, ArdSnackbarOriginRelation, ArdSnackbarQueueHandling, ArdSnackbarRef, ArdSnackbarType, ArdStarButtonStarTemplateDirective, ArdStarIconTemplateDirective, ArdTabberLabelTemplateDirective, ArdValueChipTemplateDirective, ArdValueTemplateDirective, ArdiumAutoErrorComponent, ArdiumAutocompleteInputComponent, ArdiumAutocompleteInputModule, ArdiumBadgeDirective, ArdiumBadgeModule, ArdiumBreakpointService, ArdiumButtonComponent, ArdiumButtonDirective, ArdiumButtonModule, ArdiumCalendarComponent, ArdiumCalendarModule, ArdiumCardActionButtonsDirective, ArdiumCardAvatarDirective, ArdiumCardComponent, ArdiumCardContentDirective, ArdiumCardDirective, ArdiumCardFooterDirective, ArdiumCardHeaderComponent, ArdiumCardImageDirective, ArdiumCardModule, ArdiumCardSubtitleDirective, ArdiumCardTitleDirective, ArdiumCheckboxComponent, ArdiumCheckboxListComponent, ArdiumCheckboxListModule, ArdiumCheckboxModule, ArdiumChipComponent, ArdiumChipModule, ArdiumDateInputComponent, ArdiumDateInputModule, ArdiumDateRangeInputComponent, ArdiumDateRangeInputModule, ArdiumDeletableChipComponent, ArdiumDialogComponent, ArdiumDialogModule, ArdiumDigitInputComponent, ArdiumDigitInputModule, ArdiumDividerComponent, ArdiumDividerModule, ArdiumDropdownPanelComponent, ArdiumDropdownPanelModule, ArdiumErrorComponent, ArdiumErrorDirective, ArdiumFabComponent, ArdiumFabModule, ArdiumFileDropAreaComponent, ArdiumFileDropAreaDragoverContentTemplateDirective, ArdiumFileDropAreaIdleContentTemplateDirective, ArdiumFileDropAreaModule, ArdiumFileDropAreaUploadedContentTemplateDirective, ArdiumFileInputComponent, ArdiumFileInputDragoverContentTemplateDirective, ArdiumFileInputFolderIconTemplateDirective, ArdiumFileInputIdleContentTemplateDirective, ArdiumFileInputModule, ArdiumFileInputUploadedContentTemplateDirective, ArdiumFormFieldComponent, ArdiumFormFieldFrameComponent, ArdiumFormFieldFrameModule, ArdiumFormFieldModule, ArdiumFormFieldNativeInputAdapterDirective, ArdiumGridComponent, ArdiumGridModule, ArdiumHexInputComponent, ArdiumHexInputModule, ArdiumHintComponent, ArdiumHintDirective, ArdiumHintErrorComponent, ArdiumHintErrorDirective, ArdiumHorizontalFormFieldComponent, ArdiumIconButtonComponent, ArdiumIconButtonModule, ArdiumIconComponent, ArdiumIconModule, ArdiumIconPipe, ArdiumInputComponent, ArdiumInputModule, ArdiumKbdComponent, ArdiumKbdDirective, ArdiumKbdModule, ArdiumKbdPipe, ArdiumKbdShortcutComponent, ArdiumKbdShortcutModule, ArdiumLabelComponent, ArdiumModalComponent, ArdiumModalModule, ArdiumMultipageDateRangeInputComponent, ArdiumMultipageDateRangeInputModule, ArdiumNumberInputComponent, ArdiumNumberInputModule, ArdiumOptionComponent, ArdiumOptionModule, ArdiumPasswordInputComponent, ArdiumPasswordInputModule, ArdiumProgressBarComponent, ArdiumProgressBarModule, ArdiumProgressCircleComponent, ArdiumProgressCircleModule, ArdiumRadioComponent, ArdiumRadioGroupComponent, ArdiumRadioModule, ArdiumRangeCalendarComponent, ArdiumRangeCalendarModule, ArdiumRangeSliderComponent, ArdiumRangeSliderModule, ArdiumRatingDisplayComponent, ArdiumRatingDisplayModule, ArdiumRatingInputComponent, ArdiumRatingInputModule, ArdiumSegmentComponent, ArdiumSegmentModule, ArdiumSelectComponent, ArdiumSelectModule, ArdiumSelectableChipComponent, ArdiumSlideToggleComponent, ArdiumSlideToggleModule, ArdiumSliderComponent, ArdiumSliderModule, ArdiumSnackbarService, ArdiumSpinnerComponent, ArdiumSpinnerModule, ArdiumStarButtonComponent, ArdiumStarButtonModule, ArdiumStarComponent, ArdiumStarModule, ArdiumStateboxComponent, ArdiumStateboxModule, ArdiumTabComponent, ArdiumTabberComponent, ArdiumTabberModule, ArdiumTableCaptionTemplateDirective, ArdiumTableCheckboxTemplateDirective, ArdiumTableComponent, ArdiumTableFromCsvComponent, ArdiumTableFromCsvModule, ArdiumTableHeaderCheckboxTemplateDirective, ArdiumTableModule, ArdiumTablePaginationComponent, ArdiumTablePaginationModule, ArdiumTablePaginationTemplateDirective, ArdiumTableTemplateDirective, ArdiumTextListComponent, ArdiumTextListModule, ArdiumTextListPipe, BadgePosition, BadgeSize, ButtonAppearance, ButtonVariant, CardAppearance, CardVariant, CheckboxListAlignType, CheckboxState, ClickStrategy, ComponentColor, DateRange, DecorationElementAppearance, DigitInputPrimitiveOption, DigitInputShape, DropdownPanelAppearance, DropdownPanelVariant, FabSize, FormElementAppearance, FormElementVariant, OneAxisAlignment, OutlinedAppearance, PaginationAlign, PanelAppearance, PanelVariant, ProgressBarAppearance, ProgressBarMode, ProgressBarSize, ProgressBarVariant, ProgressCircleAppearance, ProgressCircleVariant, SegmentAppearance, SegmentVariant, SimpleComponentColor, SimpleOneAxisAlignment, SliderDecorationPosition, SliderTooltipBehavior, SortType, StarColor, StarFillMode, TableAlignType, TableAppearance, TablePaginationStrategy, TableVariant, TransformType, _chipDefaults, _modalDefaults, isArdGridAlign, isArdGridDirection, isArdGridJustify, isArdGridSize, isArdGridWrap, provideBadgeDefaults, provideBreakpoints, provideButtonDefaults, provideCalendarDefaults, provideCardDefaults, provideCheckboxDefaults, provideCheckboxListDefaults, provideChipDefaults, provideDateInputDefaults, provideDeletableChipDefaults, provideDialogDefaults, provideDigitInputDefaults, provideDividerDefaults, provideDropdownPanelDefaults, provideErrorMap, provideFabDefaults, provideFileDropAreaDefaults, provideFileInputDefaults, provideFormFieldDefaults, provideFormFieldFrameDefaults, provideGridDefaults, provideHexInputDefaults, provideIconButtonDefaults, provideIconDefaults, provideInputDefaults, provideKbdDefaults, provideKbdShortcutDefaults, provideModalDefaults, provideNumberInputDefaults, providePasswordInputDefaults, provideProgressBarDefaults, provideProgressCircleDefaults, provideRadioDefaults, provideRatingDisplayDefaults, provideRatingInputDefaults, provideSegmentDefaults, provideSelectDefaults, provideSelectableChipDefaults, provideSlideToggleDefaults, provideSliderDefaults, provideSnackbarDefaults, provideSpinnerDefaults, provideStarButtonDefaults, provideStarDefaults, provideStateboxDefaults, provideTabberDefaults, provideTableDefaults, provideTableFromCsvDefaults, provideTablePaginationDefaults, searchInString };
+export { ARD_BADGE_DEFAULTS, ARD_BREAKPOINTS, ARD_BUTTON_DEFAULTS, ARD_CALENDAR_DEFAULTS, ARD_CARD_DEFAULTS, ARD_CHECKBOX_DEFAULTS, ARD_CHECKBOX_LIST_DEFAULTS, ARD_CHIP_DEFAULTS, ARD_DATE_INPUT_DEFAULTS, ARD_DELETABLE_CHIP_DEFAULTS, ARD_DIALOG_DEFAULTS, ARD_DIGIT_INPUT_DEFAULTS, ARD_DIVIDER_DEFAULTS, ARD_DROPDOWN_PANEL_DEFAULTS, ARD_ERROR_MAP, ARD_FAB_DEFAULTS, ARD_FILE_DROP_AREA_DEFAULTS, ARD_FILE_INPUT_DEFAULTS, ARD_FORM_FIELD_CONTROL, ARD_FORM_FIELD_DEFAULTS, ARD_FORM_FIELD_FRAME_DEFAULTS, ARD_GRID_DEFAULTS, ARD_HEX_INPUT_DEFAULTS, ARD_ICON_BUTTON_DEFAULTS, ARD_ICON_DEFAULTS, ARD_KBD_DEFAULTS, ARD_KBD_SHORTCUT_DEFAULTS, ARD_MODAL_DEFAULTS, ARD_NUMBER_INPUT_DEFAULTS, ARD_PASSWORD_INPUT_DEFAULTS, ARD_PROGRESS_BAR_DEFAULTS, ARD_PROGRESS_CIRCLE_DEFAULTS, ARD_RADIO_DEFAULTS, ARD_RATING_DISPLAY_DEFAULTS, ARD_RATING_INPUT_DEFAULTS, ARD_SEGMENT_DEFAULTS, ARD_SELECTABLE_CHIP_DEFAULTS, ARD_SELECT_DEFAULTS, ARD_SIMPLE_INPUT_DEFAULTS, ARD_SLIDER_DEFAULTS, ARD_SLIDE_TOGGLE_DEFAULTS, ARD_SNACKBAR_ANIMATION_LENGTH, ARD_SNACKBAR_DATA, ARD_SNACKBAR_DEFAULTS, ARD_SPINNER_DEFAULTS, ARD_STAR_BUTTON_DEFAULTS, ARD_STAR_DEFAULTS, ARD_STATEBOX_DEFAULTS, ARD_TABBER_DEFAULTS, ARD_TABLE_DEFAULTS, ARD_TABLE_FROM_CSV_DEFAULTS, ARD_TABLE_PAGINATION_DEFAULTS, ArdAddCustomTemplateDirective, ArdAutocompleteInputLoadingTemplateDirective, ArdAutocompleteInputPlaceholderTemplateDirective, ArdAutocompleteInputPrefixTemplateDirective, ArdAutocompleteInputSuffixTemplateDirective, ArdAutocompleteInputSuggestionTemplateDirective, ArdCalendarDayTemplateDirective, ArdCalendarDaysViewHeaderTemplateDirective, ArdCalendarFloatingMonthTemplateDirective, ArdCalendarMonthTemplateDirective, ArdCalendarMonthsViewHeaderTemplateDirective, ArdCalendarView, ArdCalendarWeekdayTemplateDirective, ArdCalendarYearTemplateDirective, ArdCalendarYearsViewHeaderTemplateDirective, ArdCheckboxListCheckboxTemplateDirective, ArdCheckboxListLabelTemplateDirective, ArdCheckboxTemplateDirective, ArdDateInputAcceptButtonsTemplateDirective, ArdDateInputCalendarIconTemplateDirective, ArdDateInputDayTemplateDirective, ArdDateInputDaysViewHeaderTemplateDirective, ArdDateInputFloatingMonthTemplateDirective, ArdDateInputMinMaxStrategy, ArdDateInputMonthTemplateDirective, ArdDateInputMonthsViewHeaderTemplateDirective, ArdDateInputPrefixTemplateDirective, ArdDateInputSuffixTemplateDirective, ArdDateInputValueTemplateDirective, ArdDateInputWeekdayTemplateDirective, ArdDateInputYearTemplateDirective, ArdDateInputYearsViewHeaderTemplateDirective, ArdDateRangeInputAcceptButtonsTemplateDirective, ArdDateRangeInputCalendarIconTemplateDirective, ArdDateRangeInputDayTemplateDirective, ArdDateRangeInputDaysViewHeaderTemplateDirective, ArdDateRangeInputFloatingMonthTemplateDirective, ArdDateRangeInputMonthTemplateDirective, ArdDateRangeInputMonthsViewHeaderTemplateDirective, ArdDateRangeInputPrefixTemplateDirective, ArdDateRangeInputSuffixTemplateDirective, ArdDateRangeInputValueTemplateDirective, ArdDateRangeInputWeekdayTemplateDirective, ArdDateRangeInputYearTemplateDirective, ArdDateRangeInputYearsViewHeaderTemplateDirective, ArdDialogActionType, ArdDialogButtonsTemplateDirective, ArdDialogCloseIconTemplateDirective, ArdDialogResult, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdFileInputPlaceholderTemplateDirective, ArdFileInputPrefixTemplateDirective, ArdFileInputSuffixTemplateDirective, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective, ArdGridAlign, ArdGridDirection, ArdGridJustify, ArdGridSize, ArdGridWrap, ArdHexInputPlaceholderTemplateDirective, ArdHexInputPrefixTemplateDirective, ArdHexInputSuffixTemplateDirective, ArdInputPlaceholderTemplateDirective, ArdInputPrefixTemplateDirective, ArdInputSuffixTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdModalCloseIconTemplateDirective, ArdMultiCalendarLocation, ArdMultipageDateRangeInputAcceptButtonsTemplateDirective, ArdMultipageDateRangeInputCalendarIconTemplateDirective, ArdMultipageDateRangeInputDayTemplateDirective, ArdMultipageDateRangeInputDaysViewHeaderTemplateDirective, ArdMultipageDateRangeInputFloatingMonthTemplateDirective, ArdMultipageDateRangeInputMonthTemplateDirective, ArdMultipageDateRangeInputMonthsViewHeaderTemplateDirective, ArdMultipageDateRangeInputPrefixTemplateDirective, ArdMultipageDateRangeInputSuffixTemplateDirective, ArdMultipageDateRangeInputValueTemplateDirective, ArdMultipageDateRangeInputWeekdayTemplateDirective, ArdMultipageDateRangeInputYearTemplateDirective, ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdNumberInputPlaceholderTemplateDirective, ArdNumberInputPrefixTemplateDirective, ArdNumberInputSuffixTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdPanelPosition, ArdPasswordInputPlaceholderTemplateDirective, ArdPasswordInputPrefixTemplateDirective, ArdPasswordInputRevealButtonTemplateDirective, ArdPasswordInputSuffixTemplateDirective, ArdProgressBarValueTemplateDirective, ArdProgressCircleValueTemplateDirective, ArdRangeCalendarDayTemplateDirective, ArdRangeCalendarDaysViewHeaderTemplateDirective, ArdRangeCalendarFloatingMonthTemplateDirective, ArdRangeCalendarMonthTemplateDirective, ArdRangeCalendarMonthsViewHeaderTemplateDirective, ArdRangeCalendarWeekdayTemplateDirective, ArdRangeCalendarYearTemplateDirective, ArdRangeCalendarYearsViewHeaderTemplateDirective, ArdRangeSelectionBehavior, ArdRatingDisplayStarTemplateDirective, ArdRatingInputStarButtonTemplateDirective, searchFunctions as ArdSearchFunction, ArdSegmentOptionTemplateDirective, ArdSelectDropdownArrowTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdSlideToggleAppearance, ArdSliderTooltipDirective, ArdSnackbarAlignment, ArdSnackbarOriginRelation, ArdSnackbarQueueHandling, ArdSnackbarRef, ArdSnackbarType, ArdStarButtonStarTemplateDirective, ArdStarIconTemplateDirective, ArdTabberLabelTemplateDirective, ArdValueChipTemplateDirective, ArdValueTemplateDirective, ArdiumAutoErrorComponent, ArdiumAutocompleteInputComponent, ArdiumAutocompleteInputModule, ArdiumBadgeDirective, ArdiumBadgeModule, ArdiumBreakpointService, ArdiumButtonComponent, ArdiumButtonDirective, ArdiumButtonModule, ArdiumCalendarComponent, ArdiumCalendarModule, ArdiumCardActionButtonsDirective, ArdiumCardAvatarDirective, ArdiumCardComponent, ArdiumCardContentDirective, ArdiumCardDirective, ArdiumCardFooterDirective, ArdiumCardHeaderComponent, ArdiumCardImageDirective, ArdiumCardModule, ArdiumCardSubtitleDirective, ArdiumCardTitleDirective, ArdiumCheckboxComponent, ArdiumCheckboxListComponent, ArdiumCheckboxListModule, ArdiumCheckboxModule, ArdiumChipComponent, ArdiumChipModule, ArdiumDateInputComponent, ArdiumDateInputModule, ArdiumDateRangeInputComponent, ArdiumDateRangeInputModule, ArdiumDeletableChipComponent, ArdiumDialogComponent, ArdiumDialogModule, ArdiumDigitInputComponent, ArdiumDigitInputModule, ArdiumDividerComponent, ArdiumDividerModule, ArdiumDropdownPanelComponent, ArdiumDropdownPanelModule, ArdiumErrorComponent, ArdiumErrorDirective, ArdiumFabComponent, ArdiumFabModule, ArdiumFileDropAreaComponent, ArdiumFileDropAreaDragoverContentTemplateDirective, ArdiumFileDropAreaIdleContentTemplateDirective, ArdiumFileDropAreaModule, ArdiumFileDropAreaUploadedContentTemplateDirective, ArdiumFileInputComponent, ArdiumFileInputDragoverContentTemplateDirective, ArdiumFileInputFolderIconTemplateDirective, ArdiumFileInputIdleContentTemplateDirective, ArdiumFileInputModule, ArdiumFileInputUploadedContentTemplateDirective, ArdiumFormFieldComponent, ArdiumFormFieldFrameComponent, ArdiumFormFieldFrameModule, ArdiumFormFieldModule, ArdiumFormFieldNativeInputAdapterDirective, ArdiumGridComponent, ArdiumGridModule, ArdiumHexInputComponent, ArdiumHexInputModule, ArdiumHintComponent, ArdiumHintDirective, ArdiumHintErrorComponent, ArdiumHintErrorDirective, ArdiumHorizontalFormFieldComponent, ArdiumIconButtonComponent, ArdiumIconButtonModule, ArdiumIconComponent, ArdiumIconModule, ArdiumIconPipe, ArdiumInputComponent, ArdiumInputModule, ArdiumKbdComponent, ArdiumKbdDirective, ArdiumKbdModule, ArdiumKbdPipe, ArdiumKbdShortcutComponent, ArdiumKbdShortcutModule, ArdiumLabelComponent, ArdiumModalComponent, ArdiumModalModule, ArdiumMultipageDateRangeInputComponent, ArdiumMultipageDateRangeInputModule, ArdiumNumberInputComponent, ArdiumNumberInputModule, ArdiumOptionComponent, ArdiumOptionModule, ArdiumPasswordInputComponent, ArdiumPasswordInputModule, ArdiumProgressBarComponent, ArdiumProgressBarModule, ArdiumProgressCircleComponent, ArdiumProgressCircleModule, ArdiumRadioComponent, ArdiumRadioGroupComponent, ArdiumRadioModule, ArdiumRangeCalendarComponent, ArdiumRangeCalendarModule, ArdiumRangeSliderComponent, ArdiumRangeSliderModule, ArdiumRatingDisplayComponent, ArdiumRatingDisplayModule, ArdiumRatingInputComponent, ArdiumRatingInputModule, ArdiumSegmentComponent, ArdiumSegmentModule, ArdiumSelectComponent, ArdiumSelectModule, ArdiumSelectableChipComponent, ArdiumSlideToggleComponent, ArdiumSlideToggleModule, ArdiumSliderComponent, ArdiumSliderModule, ArdiumSnackbarService, ArdiumSpinnerComponent, ArdiumSpinnerModule, ArdiumStarButtonComponent, ArdiumStarButtonModule, ArdiumStarComponent, ArdiumStarModule, ArdiumStateboxComponent, ArdiumStateboxModule, ArdiumTabComponent, ArdiumTabberComponent, ArdiumTabberModule, ArdiumTableCaptionTemplateDirective, ArdiumTableCheckboxTemplateDirective, ArdiumTableComponent, ArdiumTableFromCsvComponent, ArdiumTableFromCsvModule, ArdiumTableHeaderCheckboxTemplateDirective, ArdiumTableModule, ArdiumTablePaginationComponent, ArdiumTablePaginationModule, ArdiumTablePaginationTemplateDirective, ArdiumTableTemplateDirective, ArdiumTextListComponent, ArdiumTextListModule, ArdiumTextListPipe, BadgePosition, BadgeSize, ButtonAppearance, ButtonVariant, CardAppearance, CardVariant, CheckboxListAlignType, CheckboxState, ClickStrategy, ComponentColor, DateRange, DecorationElementAppearance, DigitInputPrimitiveOption, DigitInputShape, DropdownPanelAppearance, DropdownPanelVariant, FabSize, FormElementAppearance, FormElementVariant, OneAxisAlignment, OutlinedAppearance, PaginationAlign, PanelAppearance, PanelVariant, ProgressBarAppearance, ProgressBarMode, ProgressBarSize, ProgressBarVariant, ProgressCircleAppearance, ProgressCircleVariant, SegmentAppearance, SegmentVariant, SimpleComponentColor, SimpleOneAxisAlignment, SliderDecorationPosition, SliderTooltipBehavior, SortType, StarColor, StarFillMode, TableAlignType, TableAppearance, TablePaginationStrategy, TableVariant, TransformType, _chipDefaults, _modalDefaults, isArdGridAlign, isArdGridDirection, isArdGridJustify, isArdGridSize, isArdGridWrap, provideBadgeDefaults, provideBreakpoints, provideButtonDefaults, provideCalendarDefaults, provideCardDefaults, provideCheckboxDefaults, provideCheckboxListDefaults, provideChipDefaults, provideDateInputDefaults, provideDeletableChipDefaults, provideDialogDefaults, provideDigitInputDefaults, provideDividerDefaults, provideDropdownPanelDefaults, provideErrorMap, provideFabDefaults, provideFileDropAreaDefaults, provideFileInputDefaults, provideFormFieldDefaults, provideFormFieldFrameDefaults, provideGridDefaults, provideHexInputDefaults, provideIconButtonDefaults, provideIconDefaults, provideInputDefaults, provideKbdDefaults, provideKbdShortcutDefaults, provideModalDefaults, provideNumberInputDefaults, providePasswordInputDefaults, provideProgressBarDefaults, provideProgressCircleDefaults, provideRadioDefaults, provideRatingDisplayDefaults, provideRatingInputDefaults, provideSegmentDefaults, provideSelectDefaults, provideSelectableChipDefaults, provideSlideToggleDefaults, provideSliderDefaults, provideSnackbarDefaults, provideSpinnerDefaults, provideStarButtonDefaults, provideStarDefaults, provideStateboxDefaults, provideTabberDefaults, provideTableDefaults, provideTableFromCsvDefaults, provideTablePaginationDefaults, searchInString, trackFormControl };
 //# sourceMappingURL=ardium-ui-ui.mjs.map