@ardium-ui/ui 3.3.0-alpha1 → 3.3.0

package/lib/_internal/focusable-component.d.ts

@@ -39,7 +39,7 @@ export declare abstract class _FocusableComponentBase extends _DisablableCompone
     /**
      * Whether the component is currently focused.
      */
-    isFocused: boolean;
+    readonly isFocused: import("@angular/core").WritableSignal<boolean>;
     /**
      * Function to handle when an element is focused. Sets `isFocused` and fires the `focus` event.
      * @param event The focus event to emit.

package/lib/_internal/form-field-component.d.ts

@@ -1,5 +1,4 @@
-import { Injector, OnDestroy, OnInit } from '@angular/core';
-import { ControlValueAccessor, NgControl } from '@angular/forms';
+import { ControlValueAccessor } from '@angular/forms';
 import { _NgModelComponentBase, _NgModelComponentDefaults } from './ngmodel-component';
 import * as i0 from "@angular/core";
 export interface _FormFieldComponentDefaults extends _NgModelComponentDefaults {
@@ -11,19 +10,11 @@ export declare const _formFieldComponentDefaults: _FormFieldComponentDefaults;
  *
  * **Warning**: `writeValue` function should be implemented on the child component!
  */
-export declare abstract class _FormFieldComponentBase extends _NgModelComponentBase implements ControlValueAccessor, OnInit, OnDestroy {
+export declare abstract class _FormFieldComponentBase extends _NgModelComponentBase implements ControlValueAccessor {
     protected readonly _DEFAULTS: _FormFieldComponentDefaults;
-    protected readonly _injector: Injector;
-    private _statusChangesSub?;
-    ngOnInit(): void;
-    protected _ngControl: NgControl | null;
     readonly _required: import("@angular/core").InputSignalWithTransform<boolean | undefined, any>;
     get required(): boolean;
-    readonly htmlId: import("@angular/core").InputSignal<string>;
-    readonly _hasError: import("@angular/core").InputSignalWithTransform<boolean | undefined, any>;
-    private readonly _hasErrorInControl;
-    readonly hasError: import("@angular/core").Signal<boolean>;
-    ngOnDestroy(): void;
+    readonly isSuccess: import("@angular/core").InputSignalWithTransform<boolean, any>;
     static ɵfac: i0.ɵɵFactoryDeclaration<_FormFieldComponentBase, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<_FormFieldComponentBase, never, never, { "_required": { "alias": "required"; "required": false; "isSignal": true; }; "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "_hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_FormFieldComponentBase, never, never, { "_required": { "alias": "required"; "required": false; "isSignal": true; }; "isSuccess": { "alias": "isSuccess"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
 }

package/lib/_internal/item-storages/simple-item-storage.d.ts

@@ -17,6 +17,7 @@ export interface SimpleItemStorageHost {
     readonly isValueRequired: Signal<boolean>;
     readonly maxSelectedItems: Signal<Nullable<number>>;
     readonly _componentId: string;
+    readonly _componentName: string;
 }
 export declare class SimpleItemStorage {
     private readonly _ardParentComp;

package/lib/_internal/ngmodel-component.d.ts

@@ -1,4 +1,5 @@
-import { ControlValueAccessor } from '@angular/forms';
+import { Injector, OnDestroy, OnInit, Signal } from '@angular/core';
+import { ControlValueAccessor, NgControl } from '@angular/forms';
 import { _FocusableComponentBase, _FocusableComponentDefaults } from './focusable-component';
 import * as i0 from "@angular/core";
 export interface _NgModelComponentDefaults extends _FocusableComponentDefaults {
@@ -10,7 +11,7 @@ export declare const _ngModelComponentDefaults: _NgModelComponentDefaults;
  *
  * **Warning**: `writeValue` function should be implemented on the child component!
  */
-export declare abstract class _NgModelComponentBase extends _FocusableComponentBase implements ControlValueAccessor {
+export declare abstract class _NgModelComponentBase extends _FocusableComponentBase implements ControlValueAccessor, OnInit, OnDestroy {
     protected readonly _DEFAULTS: _NgModelComponentDefaults;
     protected _onChangeRegistered: (_: any) => void;
     protected _onTouchedRegistered: () => void;
@@ -41,7 +42,19 @@ export declare abstract class _NgModelComponentBase extends _FocusableComponentB
      * @param v The new value to write.
      */
     protected abstract _emitChange(): void;
+    readonly wasTouched: import("@angular/core").WritableSignal<boolean>;
+    onFocus(event: FocusEvent): void;
+    private _shouldEmitTouched;
     onBlur(event: FocusEvent): void;
+    protected readonly _injector: Injector;
+    private _statusChangesSub?;
+    ngOnInit(): void;
+    protected _ngControl: NgControl | null;
+    readonly htmlId: import("@angular/core").InputSignal<string>;
+    readonly _hasError: import("@angular/core").InputSignalWithTransform<boolean | undefined, any>;
+    private readonly _hasErrorInControl;
+    readonly hasError: Signal<boolean>;
+    ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<_NgModelComponentBase, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<_NgModelComponentBase, never, never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_NgModelComponentBase, never, never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "_hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
 }

package/lib/_internal/selectable-list-component.d.ts

@@ -1,10 +1,10 @@
 import { ControlValueAccessor } from '@angular/forms';
 import { ArdOptionSimple, CompareWithFn, OptionContext } from '../types/item-storage.types';
 import { Nullable } from '../types/utility.types';
+import { _FormFieldComponentBase, _FormFieldComponentDefaults } from './form-field-component';
 import { SimpleItemStorage, SimpleItemStorageHost } from './item-storages/simple-item-storage';
-import { _NgModelComponentBase, _NgModelComponentDefaults } from './ngmodel-component';
 import * as i0 from "@angular/core";
-export interface _SelectableListComponentDefaults extends _NgModelComponentDefaults {
+export interface _SelectableListComponentDefaults extends _FormFieldComponentDefaults {
     valueFrom: string;
     labelFrom: string;
     disabledFrom: string;
@@ -15,10 +15,9 @@ export interface _SelectableListComponentDefaults extends _NgModelComponentDefau
     maxSelectedItems: Nullable<number>;
 }
 export declare const _selectableListComponentDefaults: _SelectableListComponentDefaults;
-export declare abstract class _SelectableListComponentBase extends _NgModelComponentBase implements ControlValueAccessor, SimpleItemStorageHost {
+export declare abstract class _SelectableListComponentBase extends _FormFieldComponentBase implements ControlValueAccessor, SimpleItemStorageHost {
     protected readonly _DEFAULTS: _SelectableListComponentDefaults;
     readonly itemStorage: SimpleItemStorage;
-    readonly htmlId: string;
     readonly element: HTMLElement;
     readonly DEFAULTS: _SelectableListComponentDefaults;
     abstract readonly _componentId: string;

package/lib/checkbox/checkbox.component.d.ts

@@ -7,7 +7,6 @@ import * as i0 from "@angular/core";
 export declare class ArdiumCheckboxComponent extends _BooleanComponentBase implements ControlValueAccessor {
     protected readonly _DEFAULTS: ArdCheckboxDefaults;
     constructor(defaults: ArdCheckboxDefaults);
-    readonly htmlId: import("@angular/core").InputSignal<string>;
     readonly color: import("@angular/core").InputSignal<SimpleComponentColor>;
     readonly unselectedColor: import("@angular/core").InputSignal<SimpleComponentColor>;
     readonly ngClasses: import("@angular/core").Signal<string>;
@@ -15,5 +14,5 @@ export declare class ArdiumCheckboxComponent extends _BooleanComponentBase imple
     readonly state: import("@angular/core").ModelSignal<CheckboxState>;
     toggleState(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumCheckboxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumCheckboxComponent, "ard-checkbox", never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "unselectedColor": { "alias": "unselectedColor"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; }, { "state": "stateChange"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumCheckboxComponent, "ard-checkbox", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "unselectedColor": { "alias": "unselectedColor"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; }, { "state": "stateChange"; }, never, never, false, never>;
 }

package/lib/checkbox-list/checkbox-list.component.d.ts

@@ -10,7 +10,6 @@ import * as i0 from "@angular/core";
 export declare class ArdiumCheckboxListComponent extends _NgModelComponentBase implements SimpleItemStorageHost, AfterViewInit {
     protected readonly _DEFAULTS: ArdCheckboxListDefaults;
     constructor(defaults: ArdCheckboxListDefaults);
-    readonly htmlId: import("@angular/core").InputSignal<string>;
     get _htmlIdHostAttribute(): string;
     readonly DEFAULTS: ArdCheckboxListDefaults;
     readonly multiselectable: import("@angular/core").WritableSignal<true>;
@@ -46,5 +45,5 @@ export declare class ArdiumCheckboxListComponent extends _NgModelComponentBase i
     unselectItem(v: ArdOptionSimple): void;
     toggleItem(v: ArdOptionSimple): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumCheckboxListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumCheckboxListComponent, "ard-checkbox-list", never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "valueFrom": { "alias": "valueFrom"; "required": false; "isSignal": true; }; "labelFrom": { "alias": "labelFrom"; "required": false; "isSignal": true; }; "disabledFrom": { "alias": "disabledFrom"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "invertDisabled": { "alias": "invertDisabled"; "required": false; "isSignal": true; }; "maxSelectedItems": { "alias": "maxSelectedItems"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumCheckboxListComponent, "ard-checkbox-list", never, { "valueFrom": { "alias": "valueFrom"; "required": false; "isSignal": true; }; "labelFrom": { "alias": "labelFrom"; "required": false; "isSignal": true; }; "disabledFrom": { "alias": "disabledFrom"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "invertDisabled": { "alias": "invertDisabled"; "required": false; "isSignal": true; }; "maxSelectedItems": { "alias": "maxSelectedItems"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; }, never, never, false, never>;
 }

package/lib/file-inputs/file-input-base.d.ts

@@ -6,7 +6,6 @@ export declare abstract class _FileInputComponentBase extends _NgModelComponentB
     protected readonly _DEFAULTS: _FileInputBaseDefaults;
     abstract readonly componentId: string;
     readonly fileInputEl: import("@angular/core").Signal<ElementRef<HTMLInputElement> | undefined>;
-    readonly htmlId: import("@angular/core").InputSignal<string>;
     readonly name: import("@angular/core").InputSignal<string>;
     ngOnInit(): void;
     protected _wasViewInit: boolean;
@@ -36,5 +35,5 @@ export declare abstract class _FileInputComponentBase extends _NgModelComponentB
     protected _countDragenterFiles(data: DataTransfer | null): number | null;
     protected _updateElementValue(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<_FileInputComponentBase, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<_FileInputComponentBase, never, never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "blockAfterUpload": { "alias": "blockAfterUpload"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; "dragFilesEvent": "dragFiles"; }, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_FileInputComponentBase, never, never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "blockAfterUpload": { "alias": "blockAfterUpload"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; "dragFilesEvent": "dragFiles"; }, never, never, false, never>;
 }

package/lib/form-field/form-field.component.d.ts

@@ -6,14 +6,14 @@ import { ArdiumLabelComponent } from './label/label.component';
 import * as i0 from "@angular/core";
 export declare class ArdiumFormFieldComponent implements OnInit {
     protected readonly _DEFAULTS: import("./form-field.defaults").ArdFormFieldDefaults;
-    readonly alignLabelToLeftByDefault: boolean;
+    readonly alignHintToLeftByDefault: boolean;
     readonly control: import("@angular/core").Signal<_FormFieldComponentBase | undefined>;
-    readonly controlId: import("@angular/core").Signal<string | undefined>;
     readonly label: import("@angular/core").Signal<ArdiumLabelComponent | undefined>;
     readonly hints: import("@angular/core").Signal<readonly ArdiumHintDirective[]>;
     readonly errors: import("@angular/core").Signal<readonly ArdiumErrorDirective[]>;
     readonly hasAnyError: import("@angular/core").Signal<boolean>;
+    readonly reserveHintLine: import("@angular/core").InputSignalWithTransform<boolean, any>;
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumFormFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumFormFieldComponent, "ard-form-field", never, {}, {}, ["control", "label", "hints", "errors"], ["ard-label, [ard-label]", "*", "ard-error, [ard-error]", "ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])", "ard-hint[left], [ard-hint][left]", "ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])", "ard-hint[right], [ard-hint][right]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumFormFieldComponent, "ard-form-field", never, { "reserveHintLine": { "alias": "reserveHintLine"; "required": false; "isSignal": true; }; }, {}, ["control", "label", "hints", "errors"], ["ard-label, [ard-label]", "*", "ard-error, [ard-error]", "ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])", "ard-hint[left], [ard-hint][left]", "ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])", "ard-hint[right], [ard-hint][right]"], false, never>;
 }

package/lib/form-field/form-field.defaults.d.ts

@@ -2,6 +2,7 @@ import { InjectionToken, Provider } from '@angular/core';
 import { SimpleOneAxisAlignment } from './../types/alignment.types';
 export interface ArdFormFieldDefaults {
     defaultHintAlign: SimpleOneAxisAlignment;
+    reserveHintLine: boolean;
 }
 export declare const ARD_FORM_FIELD_DEFAULTS: InjectionToken<ArdFormFieldDefaults>;
 export declare function provideFormFieldDefaults(config: Partial<ArdFormFieldDefaults>): Provider;

package/lib/form-field/form-field.module.d.ts

@@ -1,13 +1,14 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./form-field.component";
-import * as i2 from "./label/label.component";
-import * as i3 from "./hint/hint.component";
-import * as i4 from "./error/error.component";
-import * as i5 from "@angular/common";
-import * as i6 from "./hint/hint.directive";
-import * as i7 from "./error/error.directive";
+import * as i2 from "./horizontal-form-field.component";
+import * as i3 from "./label/label.component";
+import * as i4 from "./hint/hint.component";
+import * as i5 from "./error/error.component";
+import * as i6 from "@angular/common";
+import * as i7 from "./hint/hint.directive";
+import * as i8 from "./error/error.directive";
 export declare class ArdiumFormFieldModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumFormFieldModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ArdiumFormFieldModule, [typeof i1.ArdiumFormFieldComponent, typeof i2.ArdiumLabelComponent, typeof i3.ArdiumHintComponent, typeof i4.ArdiumErrorComponent], [typeof i5.CommonModule, typeof i6.ArdiumHintDirective, typeof i7.ArdiumErrorDirective], [typeof i1.ArdiumFormFieldComponent, typeof i2.ArdiumLabelComponent, typeof i3.ArdiumHintComponent, typeof i4.ArdiumErrorComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ArdiumFormFieldModule, [typeof i1.ArdiumFormFieldComponent, typeof i2.ArdiumHorizontalFormFieldComponent, typeof i3.ArdiumLabelComponent, typeof i4.ArdiumHintComponent, typeof i5.ArdiumErrorComponent], [typeof i6.CommonModule, typeof i7.ArdiumHintDirective, typeof i8.ArdiumErrorDirective], [typeof i1.ArdiumFormFieldComponent, typeof i2.ArdiumHorizontalFormFieldComponent, typeof i3.ArdiumLabelComponent, typeof i4.ArdiumHintComponent, typeof i5.ArdiumErrorComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ArdiumFormFieldModule>;
 }

package/lib/form-field/horizontal-form-field.component.d.ts

@@ -0,0 +1,19 @@
+import { OnInit } from '@angular/core';
+import { _FormFieldComponentBase } from '../_internal/form-field-component';
+import { ArdiumErrorDirective } from './error/error.directive';
+import { ArdiumHintDirective } from './hint/hint.directive';
+import { ArdiumLabelComponent } from './label/label.component';
+import * as i0 from "@angular/core";
+export declare class ArdiumHorizontalFormFieldComponent implements OnInit {
+    protected readonly _DEFAULTS: import("./form-field.defaults").ArdFormFieldDefaults;
+    readonly alignHintToLeftByDefault: boolean;
+    readonly control: import("@angular/core").Signal<_FormFieldComponentBase | undefined>;
+    readonly label: import("@angular/core").Signal<ArdiumLabelComponent | undefined>;
+    readonly hints: import("@angular/core").Signal<readonly ArdiumHintDirective[]>;
+    readonly errors: import("@angular/core").Signal<readonly ArdiumErrorDirective[]>;
+    readonly hasAnyError: import("@angular/core").Signal<boolean>;
+    readonly reserveHintLine: import("@angular/core").InputSignalWithTransform<boolean, any>;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumHorizontalFormFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumHorizontalFormFieldComponent, "ard-horizontal-form-field", never, { "reserveHintLine": { "alias": "reserveHintLine"; "required": false; "isSignal": true; }; }, {}, ["control", "label", "hints", "errors"], ["ard-label, [ard-label]", "*", "ard-error, [ard-error]", "ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])", "ard-hint[left], [ard-hint][left]", "ard-hint:not([left]):not([right]), [ard-hint]:not([left]):not([right])", "ard-hint[right], [ard-hint][right]"], false, never>;
+}

package/lib/form-field/index.d.ts

@@ -4,4 +4,5 @@ export * from './form-field.component';
 export * from './form-field.module';
 export * from './hint/hint.component';
 export * from './hint/hint.directive';
+export * from './horizontal-form-field.component';
 export * from './label/label.component';

package/lib/form-field-frame/form-field-frame.component.d.ts

@@ -9,7 +9,8 @@ export declare class ArdiumFormFieldFrameComponent extends _FocusableComponentBa
     protected readonly _DEFAULTS: ArdFormFieldFrameDefaults;
     constructor(defaults: ArdFormFieldFrameDefaults);
     readonly hasError: import("@angular/core").InputSignalWithTransform<boolean, any>;
-    isFocused: boolean;
+    readonly isSuccess: import("@angular/core").InputSignalWithTransform<boolean, any>;
+    set _setIsFocused(v: boolean);
     /**
      * The appearance of the component, aka the styling.
      */
@@ -28,5 +29,5 @@ export declare class ArdiumFormFieldFrameComponent extends _FocusableComponentBa
     readonly prefixTemplate: import("@angular/core").Signal<ArdFormFieldPrefixTemplateDirective | undefined>;
     readonly suffixTemplate: import("@angular/core").Signal<ArdFormFieldSuffixTemplateDirective | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumFormFieldFrameComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumFormFieldFrameComponent, "ard-form-field-frame", never, { "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "isFocused": { "alias": "isFocused"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "prefixTemplateInput": { "alias": "prefixTemplate"; "required": false; "isSignal": true; }; "suffixTemplateInput": { "alias": "suffixTemplate"; "required": false; "isSignal": true; }; }, {}, ["prefixTemplate", "suffixTemplate"], ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumFormFieldFrameComponent, "ard-form-field-frame", never, { "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "isSuccess": { "alias": "isSuccess"; "required": false; "isSignal": true; }; "_setIsFocused": { "alias": "isFocused"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "prefixTemplateInput": { "alias": "prefixTemplate"; "required": false; "isSignal": true; }; "suffixTemplateInput": { "alias": "suffixTemplate"; "required": false; "isSignal": true; }; }, {}, ["prefixTemplate", "suffixTemplate"], ["*"], false, never>;
 }

package/lib/inputs/digit-input/digit-input.component.d.ts

@@ -1,4 +1,4 @@
-import { ElementRef, OnInit } from '@angular/core';
+import { AfterViewInit, ElementRef, OnInit } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 import { _FormFieldComponentBase } from '../../_internal/form-field-component';
 import { FormElementAppearance, FormElementVariant } from '../../types/theming.types';
@@ -6,7 +6,7 @@ import { ArdDigitInputDefaults } from './digit-input.defaults';
 import { DigitInputConfig, DigitInputShape } from './digit-input.types';
 import { DigitInputModelHost } from './digit-input.utils';
 import * as i0 from "@angular/core";
-export declare class ArdiumDigitInputComponent extends _FormFieldComponentBase implements ControlValueAccessor, DigitInputModelHost, OnInit {
+export declare class ArdiumDigitInputComponent extends _FormFieldComponentBase implements ControlValueAccessor, DigitInputModelHost, OnInit, AfterViewInit {
     protected readonly _DEFAULTS: ArdDigitInputDefaults;
     constructor(defaults: ArdDigitInputDefaults);
     readonly inputs: import("@angular/core").Signal<readonly ElementRef<HTMLInputElement>[]>;
@@ -22,8 +22,11 @@ export declare class ArdiumDigitInputComponent extends _FormFieldComponentBase i
     readonly configArrayDataEffect: import("@angular/core").EffectRef;
     ngOnInit(): void;
     isInputEmpty(index: number): boolean;
+    private _valueBeforeViewInit?;
     writeValue(v: any): void;
     private _writeValue;
+    private _wasViewInit;
+    ngAfterViewInit(): void;
     readonly outputAsString: import("@angular/core").InputSignalWithTransform<boolean, any>;
     readonly outputControlValueAccessorOnFinish: import("@angular/core").InputSignalWithTransform<boolean, any>;
     set value(v: string | (string | null)[] | null);

package/lib/inputs/digit-input/digit-input.model.d.ts

@@ -5,7 +5,6 @@ export declare class DigitInputModel {
     constructor(_ardHost: DigitInputModelHost);
     private readonly _configArray;
     readonly configArrayData: import("@angular/core").Signal<DigitInputConfigData[]>;
-    private readonly _configArrayNoStatics;
     readonly isConfigDefined: import("@angular/core").Signal<boolean>;
     readonly value: import("@angular/core").WritableSignal<(string | null)[] | null>;
     readonly stringValue: import("@angular/core").Signal<string>;

package/lib/inputs/digit-input/digit-input.types.d.ts

@@ -17,7 +17,7 @@ export declare const DigitInputPrimitiveOption: {
 export type DigitInputPrimitiveOption = (typeof DigitInputPrimitiveOption)[keyof typeof DigitInputPrimitiveOption];
 export interface DigitInputAcceptObject {
     accept: string | RegExp | ((char: string, charsBefore: string) => boolean);
-    transform?: TransformType | null;
+    transform?: TransformType | ((char: string) => string) | null;
     readonly?: boolean;
     placeholder?: string;
 }

package/lib/inputs/digit-input/digit-input.utils.d.ts

@@ -8,6 +8,7 @@ export interface DigitInputConfigData {
 }
 export interface DigitInputModelHost {
     readonly inputs: Signal<readonly ElementRef<HTMLInputElement>[]>;
+    readonly outputAsString: Signal<boolean>;
 }
 export declare const DigitInputConfigDataType: {
     readonly Input: "input";

package/lib/radio/radio/radio.component.d.ts

@@ -1,13 +1,51 @@
 import { ChangeDetectorRef } from '@angular/core';
-import { _BooleanComponentBase } from '../../_internal/boolean-component';
+import { _FocusableComponentBase } from '../../_internal/focusable-component';
 import { SimpleComponentColor } from '../../types/colors.types';
 import { ArdRadioDefaults } from './radio.defaults';
 import * as i0 from "@angular/core";
-export declare class ArdiumRadioComponent extends _BooleanComponentBase {
+export declare class ArdiumRadioComponent extends _FocusableComponentBase {
     protected readonly _changeDetector: ChangeDetectorRef;
     protected readonly _DEFAULTS: ArdRadioDefaults;
     constructor(defaults: ArdRadioDefaults);
     readonly htmlId: import("@angular/core").InputSignal<string>;
+    /**
+     * Emits all select-state-related events.
+     */
+    protected _emitChange(): void;
+    /**
+     * The event emitter responsible for firing `select` events. Fired when the `selected` state is set to true.
+     */
+    readonly selectEvent: import("@angular/core").OutputEmitterRef<null>;
+    /**
+     * The event emitter responsible for firing `unselect` events. Fired when the `selected` state is set to false.
+     */
+    readonly unselectEvent: import("@angular/core").OutputEmitterRef<null>;
+    /**
+     * The event emitter responsible for firing `change` events. Fired when the `selected` state is changed.
+     */
+    readonly changeEvent: import("@angular/core").OutputEmitterRef<boolean>;
+    readonly selected: import("@angular/core").WritableSignal<boolean>;
+    /**
+     * The selection state of the component. Coercible into a boolean.
+     */
+    set _selected(v: any);
+    get _selectedHostAttribute(): boolean;
+    /**
+     * The event emitter responsible for firing `selectedChange` events. Fired when the `selected` state is changed.
+     */
+    readonly selectedChange: import("@angular/core").OutputEmitterRef<boolean>;
+    /**
+     * Toggles the selected state. Emits all appropriate events.
+     */
+    toggleSelected(): void;
+    /**
+     * Sets the state to "selected". Emits all appropriate events only if the state changes.
+     */
+    select(): void;
+    /**
+     * Sets the state to "unselected". Emits all appropriate events only if the state changes.
+     */
+    unselect(): void;
     readonly value: import("@angular/core").InputSignal<any>;
     readonly color: import("@angular/core").InputSignal<SimpleComponentColor>;
     readonly ngClasses: import("@angular/core").Signal<string>;
@@ -21,5 +59,5 @@ export declare class ArdiumRadioComponent extends _BooleanComponentBase {
      */
     markForCheck(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumRadioComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioComponent, "ard-radio", never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioComponent, "ard-radio", never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "_selected": { "alias": "selected"; "required": false; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, { "selectEvent": "select"; "unselectEvent": "unselect"; "changeEvent": "change"; "selectedChange": "selectedChange"; }, never, ["*"], false, never>;
 }

package/lib/radio/radio/radio.defaults.d.ts

@@ -1,7 +1,7 @@
 import { InjectionToken, Provider } from '@angular/core';
-import { _BooleanComponentDefaults } from '../../_internal/boolean-component';
+import { _FocusableComponentDefaults } from '../../_internal/focusable-component';
 import { SimpleComponentColor } from './../../types/colors.types';
-export interface ArdRadioDefaults extends _BooleanComponentDefaults {
+export interface ArdRadioDefaults extends _FocusableComponentDefaults {
     color: SimpleComponentColor;
 }
 export declare const ARD_RADIO_DEFAULTS: InjectionToken<ArdRadioDefaults>;

package/lib/radio/radio-group.component.d.ts

@@ -5,7 +5,6 @@ import { ArdiumRadioComponent } from './radio/radio.component';
 import * as i0 from "@angular/core";
 export declare class ArdiumRadioGroupComponent extends _NgModelComponentBase implements AfterContentInit, OnDestroy {
     private readonly _radios;
-    readonly htmlId: import("@angular/core").InputSignal<string>;
     get _htmlIdHostAttribute(): string;
     constructor();
     get value(): any | undefined;
@@ -36,5 +35,5 @@ export declare class ArdiumRadioGroupComponent extends _NgModelComponentBase imp
     ngOnDestroy(): void;
     private _destroyChildSubscriptions;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumRadioGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioGroupComponent, "ard-radio-group", never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; "selected": "selectedChange"; }, ["_radios"], ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioGroupComponent, "ard-radio-group", never, { "value": { "alias": "value"; "required": false; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; "selected": "selectedChange"; }, ["_radios"], ["*"], false, never>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ardium-ui/ui",
-  "version": "3.3.0-alpha1",
+  "version": "3.3.0",
   "peerDependencies": {
     "@angular/common": ">=18.0.0",
     "@angular/core": ">=18.0.0",

package/prebuilt-themes/default/chips.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/chips.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_clear-button.scss"],"names":[],"mappings":"AAMA;EC8DE;EDzDA;EACA,OEJM;EFKN,YEbG;EFcH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AGtBA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AClIF;EACE,QFkCgB;EEjChB,OFiCgB;EEhChB;;AAGF;EACE;EACA;EACA,OFGK;EEFL,OFyBgB;EExBhB,QFwBgB;EEvBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EH3BF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EGoBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EH7CN;EACA;EACA;EG6CM;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AHEN;EAEE;;AAEF;EACE;;AAEF;EACE;;ADnDF;EACE;;AAEF;ECrBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EDcE,YE9BM;EF+BN;;AAGF;EACE;EACA;EACA;;AAIE;EACE;;AAIF;EACE;;AAIJ;EClDF;EACA;EACA;;ADmDI;EACE;;AAKN;EACE;EACA;EACA;;AAEA;EACE,kBE/DC;EFgED,OE7DE;EF8DF,YACE;;AAIF;EACE;EACA;;AAIN;EAEE;EACA;EACA;EACA;EACA;;AAEA;EACE,YACE;;AAGF;EACE;EACA;;AAIA;EACE;;AAIF;EACE;;AAIJ;EACE;;AAEA;EACE;;AAIA;EACE;;AAIF;EACE;;AAOR;EACE;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAIN;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAKN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEF;EACE;EACA;;;AAMJ;EACE;EACA;;AAEA;EACE","file":"chips.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/chips.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_clear-button.scss"],"names":[],"mappings":"AAMA;ECgEE;ED3DA;EACA,OEJM;EFKN,YEbG;EFcH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AGtBA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AClIF;EACE,QFkCgB;EEjChB,OFiCgB;EEhChB;;AAGF;EACE;EACA;EACA,OFGK;EEFL,OFyBgB;EExBhB,QFwBgB;EEvBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EH3BF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EGoBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EH7CN;EACA;EACA;EG6CM;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AHIN;EAEE;;AAEF;EACE;;AAEF;EACE;;ADrDF;EACE;;AAEF;ECrBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EDcE,YE9BM;EF+BN;;AAGF;EACE;EACA;EACA;;AAIE;EACE;;AAIF;EACE;;AAIJ;EClDF;EACA;EACA;;ADmDI;EACE;;AAKN;EACE;EACA;EACA;;AAEA;EACE,kBE/DC;EFgED,OE7DE;EF8DF,YACE;;AAIF;EACE;EACA;;AAIN;EAEE;EACA;EACA;EACA;EACA;;AAEA;EACE,YACE;;AAGF;EACE;EACA;;AAIA;EACE;;AAIF;EACE;;AAIJ;EACE;;AAEA;EACE;;AAIA;EACE;;AAIF;EACE;;AAOR;EACE;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAIN;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAEA;EACE;;AAKN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEF;EACE;EACA;;;AAMJ;EACE;EACA;;AAEA;EACE","file":"chips.css"}

package/prebuilt-themes/default/core.css

@@ -78,6 +78,8 @@
   --ard-simple-shadow3: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14),
     0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --ard-spinner-color: rgba(0, 0, 0, 50%);
+  --ard-horizontal-form-field-label-width: 12rem;
+  --ard-horizontal-form-field-label-align: flex-start;
 }
 
 .ard-disabled {

package/prebuilt-themes/default/core.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/core.scss"],"names":[],"mappings":"AAEQ;AACA;AAER;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;AAAA;EAEA;AAAA;EAEA;AAAA;EAGA;;;AAGF;EACE","file":"core.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/core.scss"],"names":[],"mappings":"AAEQ;AACA;AAER;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;AAAA;EAEA;AAAA;EAEA;AAAA;EAGA;EAEA;EACA;;;AAGF;EACE","file":"core.css"}

package/prebuilt-themes/default/form-field-frame.css

@@ -17,7 +17,10 @@
 }
 .ard-form-field-frame .ard-form-field-content-container {
   flex-grow: 1;
-  min-height: 100%;
+  min-height: inherit;
+}
+.ard-form-field-frame .ard-form-field-content-container > * {
+  min-height: inherit;
 }
 .ard-form-field-frame .ard-form-field-prefix-container,
 .ard-form-field-frame .ard-form-field-suffix-container {
@@ -45,6 +48,9 @@
 .ard-form-field-frame.ard-appearance-outlined.ard-focused {
   --ard-appearance-border-color: var(--ard-border-dark);
 }
+.ard-form-field-frame.ard-appearance-outlined.ard-is-success {
+  --ard-appearance-border-color: rgb(var(--ard-success-500));
+}
 .ard-form-field-frame.ard-appearance-outlined.ard-has-error {
   --ard-appearance-background: rgb(var(--ard-danger-50));
   --ard-appearance-border-color: rgb(var(--ard-danger-500));
@@ -53,6 +59,9 @@
   --ard-appearance-background: var(--ard-bg-filled);
   --ard-appearance-border: none;
 }
+.ard-form-field-frame.ard-appearance-filled.ard-is-success {
+  --ard-appearance-background: rgb(var(--ard-success-50));
+}
 .ard-form-field-frame.ard-appearance-filled.ard-has-error {
   --ard-appearance-background: rgb(var(--ard-danger-50));
 }
@@ -60,9 +69,6 @@
   --ard-appearance-background: transparent;
   --ard-appearance-border: none;
 }
-.ard-form-field-frame.ard-appearance-transparent.ard-has-error {
-  --ard-appearance-border: 1px solid rgba(var(--ard-danger-500), 0.1);
-}
 .ard-form-field-frame.ard-variant-rounded, .ard-form-field-frame.ard-variant-semirounded {
   --ard-variant-border-radius: 8px;
 }

package/prebuilt-themes/default/form-field-frame.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/form-field-frame.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ECsDA;EDxBA;EACA;EACA;;AA9BA;EACE;EACA;;AAEF;AAAA;EAEE;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;;AAIF;EACE;EACA;EACA;;ACFF;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAEA;EACE;;AAGJ;EACE;EACA;;AAEA;EACE;;AAQJ;EAEE;;AAEF;EACE;;AAEF;EACE;;AD9BF;EACE,YE/CM;EFgDN;EACA;;AAIA;EACE;;AAIF;EACE;;;AAIN;EACE;EACA;;AAGE;EACE","file":"form-field-frame.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/form-field-frame.scss","../../../../projects/ui/src/themes/default/_mixins.scss","../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ECwDA;EDtBA;EACA;EACA;;AAlCA;EACE;EACA;;AAEA;EACE;;AAGJ;AAAA;EAEE;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;;AAIF;EACE;EACA;EACA;;ACNF;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;;AAOF;EAEE;;AAEF;EACE;;AAEF;EACE;;AD5BF;EACE,YEnDM;EFoDN;EACA;;AAIA;EACE;;AAIF;EACE;;;AAIN;EACE;EACA;;AAGE;EACE","file":"form-field-frame.css"}

package/prebuilt-themes/default/form-field.css

@@ -1,33 +1,98 @@
-.ard-form-field {
+ard-form-field,
+ard-horizontal-form-field {
+  display: block;
+  width: 100%;
+}
+
+.ard-form-field,
+.ard-horizontal-form-field {
   display: flex;
   flex-direction: column;
 }
-.ard-form-field .ard-label {
+.ard-form-field .ard-label,
+.ard-horizontal-form-field .ard-label {
   padding: 0.25rem 0 0.125rem 0.125rem;
   font-size: 0.9375rem;
   font-weight: 500;
 }
-.ard-form-field .ard-form-field__hints {
+.ard-form-field .ard-form-field__hints,
+.ard-horizontal-form-field .ard-form-field__hints {
   padding: 0.125rem 0 0.25rem 0.125rem;
+  font-size: 0.8125rem;
+  line-height: 1.1;
 }
-.ard-form-field .ard-form-field__hints-right > * {
+.ard-form-field .ard-form-field__hints.ard-form-field__reserve-hint-line,
+.ard-horizontal-form-field .ard-form-field__hints.ard-form-field__reserve-hint-line {
+  box-sizing: content-box;
+  min-height: 1.1em;
+}
+.ard-form-field .ard-form-field__hints-right > *,
+.ard-horizontal-form-field .ard-form-field__hints-right > * {
   padding-left: 0.25rem;
 }
 .ard-form-field .ard-hint,
-.ard-form-field .ard-error {
-  font-size: 0.8125rem;
+.ard-form-field .ard-error,
+.ard-horizontal-form-field .ard-hint,
+.ard-horizontal-form-field .ard-error {
+  font-size: 1em;
   line-height: 1.1;
   display: block;
   height: 1.1em;
 }
-.ard-form-field .ard-hint {
+.ard-form-field .ard-hint,
+.ard-horizontal-form-field .ard-hint {
   color: var(--ard-text2);
 }
-.ard-form-field .ard-error {
+.ard-form-field .ard-error,
+.ard-horizontal-form-field .ard-error {
   color: rgb(var(--ard-danger-700));
+  overflow: hidden;
+  animation: errorAppear 0.25s cubic-bezier(0.4, 0, 0.2, 1) forwards;
 }
-.ard-form-field.ard-form-field__with-error .ard-label {
+.ard-form-field.ard-form-field__with-error .ard-label,
+.ard-horizontal-form-field.ard-form-field__with-error .ard-label {
   color: rgb(var(--ard-danger-700));
 }
+.ard-form-field.ard-form-field__is-success .ard-label,
+.ard-horizontal-form-field.ard-form-field__is-success .ard-label {
+  color: rgb(var(--ard-success-700));
+}
+.ard-form-field.ard-form-field__control-disabled .ard-label,
+.ard-horizontal-form-field.ard-form-field__control-disabled .ard-label {
+  opacity: 40%;
+}
+.ard-form-field.ard-form-field__control-disabled .ard-form-field__hints,
+.ard-horizontal-form-field.ard-form-field__control-disabled .ard-form-field__hints {
+  opacity: 50%;
+}
+
+.ard-horizontal-form-field {
+  align-items: flex-start;
+  justify-content: stretch;
+  flex-direction: row;
+  gap: 0.5rem;
+}
+.ard-horizontal-form-field .ard-form-field__label-container {
+  width: var(--ard-horizontal-form-field-label-width, 12rem);
+  height: 2.3125rem;
+  display: flex;
+  align-items: center;
+  justify-content: var(--ard-horizontal-form-field-label-align, flex-start);
+}
+.ard-horizontal-form-field .ard-form-field__non-label {
+  flex-grow: 1;
+}
+.ard-horizontal-form-field:has(.ard-form-field__input .ard-compact) .ard-form-field__label-container {
+  height: 1.5625rem;
+}
+
+@keyframes errorAppear {
+  from {
+    height: 0;
+  }
+  to {
+    height: 1.1em;
+  }
+}
 
 /*# sourceMappingURL=form-field.css.map */