@letsprogram/ng-oat 0.1.3 → 0.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@letsprogram/ng-oat",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "Angular component library built on top of the Oat CSS framework — signals-first, lightweight, and accessible.",
   "license": "MIT",
   "author": "SashiKumar Yadav",

package/types/letsprogram-ng-oat.d.ts

@@ -1,6 +1,7 @@
 import * as _angular_core from '@angular/core';
-import { EnvironmentProviders, TemplateRef, ViewContainerRef, OnInit, OnDestroy, InjectionToken, AfterViewInit } from '@angular/core';
+import { EnvironmentProviders, TemplateRef, ViewContainerRef, OnInit, OnDestroy, InjectionToken, AfterViewInit, ModelSignal } from '@angular/core';
 import { FormCheckboxControl, FormValueControl, ValidationError, FieldState } from '@angular/forms/signals';
+import { ControlValueAccessor } from '@angular/forms';
 
 /** Configuration for provideNgOat() */
 interface NgOatOptions {
@@ -707,12 +708,13 @@ declare class NgOatSpinner {
 declare class NgOatSwitch implements FormCheckboxControl {
     readonly label: _angular_core.InputSignal<string>;
     readonly checked: _angular_core.ModelSignal<boolean>;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
+    readonly touched: _angular_core.ModelSignal<boolean>;
     readonly value: undefined;
     readonly changed: _angular_core.OutputEmitterRef<boolean>;
     onInputChange(event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatSwitch, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatSwitch, "ng-oat-switch", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "changed": "changed"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatSwitch, "ng-oat-switch", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "disabled": "disabledChange"; "touched": "touchedChange"; "changed": "changed"; }, never, never, true, never>;
 }
 
 type NgOatSkeletonType = 'line' | 'box';
@@ -807,7 +809,8 @@ interface NgOatTableColumn {
  * <ng-oat-table
  *   [columns]="[{key:'name', label:'Name'}, {key:'email', label:'Email'}]"
  *   [data]="users"
- *   [striped]="true"
+ *   [scrollX]="true"
+ *   [scrollY]="'320px'"
  *   (rowClick)="onRowClick($event)">
  * </ng-oat-table>
  * ```
@@ -818,10 +821,12 @@ declare class NgOatTable {
     readonly striped: _angular_core.InputSignal<boolean>;
     readonly clickable: _angular_core.InputSignal<boolean>;
     readonly emptyText: _angular_core.InputSignal<string>;
+    readonly scrollX: _angular_core.InputSignal<boolean>;
+    readonly scrollY: _angular_core.InputSignal<string>;
     readonly rowClick: _angular_core.OutputEmitterRef<Record<string, any>>;
     onRowClick(row: Record<string, any>): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatTable, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatTable, "ng-oat-table", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "data": { "alias": "data"; "required": true; "isSignal": true; }; "striped": { "alias": "striped"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; }, { "rowClick": "rowClick"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatTable, "ng-oat-table", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "data": { "alias": "data"; "required": true; "isSignal": true; }; "striped": { "alias": "striped"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "scrollX": { "alias": "scrollX"; "required": false; "isSignal": true; }; "scrollY": { "alias": "scrollY"; "required": false; "isSignal": true; }; }, { "rowClick": "rowClick"; }, never, never, true, never>;
 }
 
 /**
@@ -1106,9 +1111,10 @@ declare class NgOatFileUpload {
 declare class NgOatInputOtp implements FormValueControl<string> {
     readonly length: _angular_core.InputSignal<number>;
     readonly separator: _angular_core.InputSignal<number>;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
     readonly mask: _angular_core.InputSignal<boolean>;
     readonly value: _angular_core.ModelSignal<string>;
+    readonly touched: _angular_core.ModelSignal<boolean>;
     readonly checked: undefined;
     private slotInputRefs;
     protected slots: _angular_core.Signal<string[]>;
@@ -1120,7 +1126,7 @@ declare class NgOatInputOtp implements FormValueControl<string> {
     private focusSlot;
     focus(options?: FocusOptions): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatInputOtp, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatInputOtp, "ng-oat-input-otp", never, { "length": { "alias": "length"; "required": false; "isSignal": true; }; "separator": { "alias": "separator"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatInputOtp, "ng-oat-input-otp", never, { "length": { "alias": "length"; "required": false; "isSignal": true; }; "separator": { "alias": "separator"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
 /**
@@ -1135,7 +1141,7 @@ declare class NgOatInputOtp implements FormValueControl<string> {
  */
 declare class NgOatSearchInput implements FormValueControl<string>, OnInit, OnDestroy {
     readonly placeholder: _angular_core.InputSignal<string>;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
     readonly shortcut: _angular_core.InputSignal<string>;
     readonly debounceMs: _angular_core.InputSignal<number>;
     readonly value: _angular_core.ModelSignal<string>;
@@ -1157,7 +1163,7 @@ declare class NgOatSearchInput implements FormValueControl<string>, OnInit, OnDe
     focus(options?: FocusOptions): void;
     private focusInput;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatSearchInput, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatSearchInput, "ng-oat-search-input", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "shortcut": { "alias": "shortcut"; "required": false; "isSignal": true; }; "debounceMs": { "alias": "debounceMs"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "search"; "touched": "touchedChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatSearchInput, "ng-oat-search-input", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "shortcut": { "alias": "shortcut"; "required": false; "isSignal": true; }; "debounceMs": { "alias": "debounceMs"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "value": "valueChange"; "search": "search"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
 type NgOatSeparatorOrientation = 'horizontal' | 'vertical';
@@ -1644,7 +1650,7 @@ declare class NgOatThemeSelectorIcon {
  */
 declare class NgOatThemeSelector implements OnInit {
     /** Display mode: dropdown menu or inline toggle group */
-    readonly mode: _angular_core.InputSignal<"dropdown" | "toggle">;
+    readonly mode: _angular_core.InputSignal<"toggle" | "dropdown">;
     /** Initial theme (overrides localStorage if set) */
     readonly initialTheme: _angular_core.InputSignal<NgOatTheme | undefined>;
     /**
@@ -1711,7 +1717,7 @@ declare class NgOatInput implements FormValueControl<string> {
     private static nextId;
     readonly value: _angular_core.ModelSignal<string>;
     readonly checked: undefined;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
     readonly readonly: _angular_core.InputSignal<boolean>;
     readonly required: _angular_core.InputSignal<boolean>;
     readonly invalid: _angular_core.InputSignal<boolean>;
@@ -1725,12 +1731,12 @@ declare class NgOatInput implements FormValueControl<string> {
     readonly type: _angular_core.InputSignal<NgOatInputType>;
     readonly placeholder: _angular_core.InputSignal<string>;
     readonly showErrors: _angular_core.InputSignal<boolean>;
-    protected inputId: _angular_core.Signal<string>;
+    protected readonly inputId: string;
     onInput(event: Event): void;
     onBlur(): void;
     focus(options?: FocusOptions): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatInput, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatInput, "ng-oat-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "minLength": { "alias": "minLength"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatInput, "ng-oat-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "minLength": { "alias": "minLength"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
 /**
@@ -1751,7 +1757,7 @@ declare class NgOatTextarea implements FormValueControl<string> {
     private static nextId;
     readonly value: _angular_core.ModelSignal<string>;
     readonly checked: undefined;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
     readonly readonly: _angular_core.InputSignal<boolean>;
     readonly required: _angular_core.InputSignal<boolean>;
     readonly invalid: _angular_core.InputSignal<boolean>;
@@ -1763,12 +1769,12 @@ declare class NgOatTextarea implements FormValueControl<string> {
     readonly placeholder: _angular_core.InputSignal<string>;
     readonly rows: _angular_core.InputSignal<number>;
     readonly showErrors: _angular_core.InputSignal<boolean>;
-    protected textareaId: _angular_core.Signal<string>;
+    protected readonly textareaId: string;
     onInput(event: Event): void;
     onBlur(): void;
     focus(options?: FocusOptions): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatTextarea, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatTextarea, "ng-oat-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "minLength": { "alias": "minLength"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatTextarea, "ng-oat-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "minLength": { "alias": "minLength"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
 interface NgOatSelectOption {
@@ -1797,7 +1803,7 @@ declare class NgOatSelect implements FormValueControl<string> {
     private static nextId;
     readonly checked: undefined;
     readonly value: _angular_core.ModelSignal<string>;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
     readonly required: _angular_core.InputSignal<boolean>;
     readonly invalid: _angular_core.InputSignal<boolean>;
     readonly errors: _angular_core.InputSignal<readonly ValidationError.WithOptionalFieldTree[]>;
@@ -1806,12 +1812,12 @@ declare class NgOatSelect implements FormValueControl<string> {
     readonly placeholder: _angular_core.InputSignal<string>;
     readonly options: _angular_core.InputSignal<NgOatSelectOption[]>;
     readonly showErrors: _angular_core.InputSignal<boolean>;
-    protected selectId: _angular_core.Signal<string>;
+    protected readonly selectId: string;
     onChange(event: Event): void;
     onBlur(): void;
     focus(options?: FocusOptions): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatSelect, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatSelect, "ng-oat-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatSelect, "ng-oat-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
 /**
@@ -1830,13 +1836,14 @@ declare class NgOatSelect implements FormValueControl<string> {
  */
 declare class NgOatCheckbox implements FormCheckboxControl {
     readonly checked: _angular_core.ModelSignal<boolean>;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
+    readonly touched: _angular_core.ModelSignal<boolean>;
     /** FormCheckboxControl requires `value` to be undefined */
     readonly value: undefined;
     readonly label: _angular_core.InputSignal<string>;
     onChange(event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatCheckbox, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatCheckbox, "ng-oat-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatCheckbox, "ng-oat-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "disabled": "disabledChange"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
 interface NgOatRadioOption {
@@ -1871,7 +1878,7 @@ declare class NgOatRadioGroup implements FormValueControl<string> {
     private static nextId;
     readonly value: _angular_core.ModelSignal<string>;
     readonly checked: undefined;
-    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
     readonly required: _angular_core.InputSignal<boolean>;
     readonly invalid: _angular_core.InputSignal<boolean>;
     readonly errors: _angular_core.InputSignal<readonly ValidationError.WithOptionalFieldTree[]>;
@@ -1879,29 +1886,134 @@ declare class NgOatRadioGroup implements FormValueControl<string> {
     readonly label: _angular_core.InputSignal<string>;
     readonly options: _angular_core.InputSignal<NgOatRadioOption[]>;
     readonly showErrors: _angular_core.InputSignal<boolean>;
-    protected groupName: _angular_core.Signal<string>;
+    protected readonly groupName: string;
     onSelect(val: string): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatRadioGroup, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatRadioGroup, "ng-oat-radio-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatRadioGroup, "ng-oat-radio-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "showErrors": { "alias": "showErrors"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "touched": "touchedChange"; }, never, never, true, never>;
 }
 
 /**
- * Displays validation errors for a Signal Forms field.
- * Shows errors only when the field has been touched and is invalid.
+ * Displays validation errors for form fields.
  *
- * Usage:
+ * **Signal Forms** — pass the `FieldState` directly:
  * ```html
- * <ng-oat-input label="Email" [formField]="myForm.email" />
  * <ng-oat-form-error [control]="myForm.email" />
  * ```
+ *
+ * **Reactive / Template-driven** — pass error strings and a visibility flag:
+ * ```html
+ * <ng-oat-form-error [errors]="['Email is required']" [show]="email.touched && email.invalid" />
+ * ```
  */
 declare class NgOatFormError {
-    readonly control: _angular_core.InputSignal<FieldState<unknown, string | number>>;
+    /** Signal Forms FieldState — for automatic error display. */
+    readonly control: _angular_core.InputSignal<FieldState<unknown, string | number> | undefined>;
+    /** Plain error message strings — for Reactive / Template-driven forms. */
+    readonly errors: _angular_core.InputSignal<string[]>;
+    /** External visibility flag — for Reactive / Template-driven forms. */
+    readonly show: _angular_core.InputSignal<boolean>;
+    /** Unified list of error message strings. */
+    protected readonly errorMessages: _angular_core.Signal<(string | undefined)[]>;
     protected readonly shouldShowError: _angular_core.Signal<boolean>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatFormError, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatFormError, "ng-oat-form-error", never, { "control": { "alias": "control"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgOatFormError, "ng-oat-form-error", never, { "control": { "alias": "control"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "show": { "alias": "show"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * ControlValueAccessor adapter for ng-oat **value-type** components.
+ *
+ * Auto-activates when a Reactive Forms or Template-driven directive is present
+ * (`formControlName`, `[formControl]`, or `[(ngModel)]`).
+ *
+ * Add this directive to your component's `imports` alongside the form component:
+ * ```typescript
+ * imports: [ReactiveFormsModule, NgOatInput, NgOatValueCva]
+ * ```
+ *
+ * ```html
+ * <ng-oat-input label="Email" formControlName="email" />
+ * <ng-oat-input label="Name" [(ngModel)]="name" />
+ * ```
+ */
+declare class NgOatValueCva implements ControlValueAccessor {
+    private readonly host;
+    private onChange;
+    private onTouched;
+    /**
+     * Listen for native `input` and `change` events that bubble from the inner
+     * `<input>`, `<textarea>`, or `<select>` element up to the host component.
+     */
+    onHostValueChange(): void;
+    /** Mark as touched when focus leaves the host element tree. */
+    onHostBlur(): void;
+    writeValue(val: string): void;
+    registerOnChange(fn: (val: string) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatValueCva, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgOatValueCva, "ng-oat-input[formControlName],ng-oat-input[formControl],ng-oat-input[ngModel],ng-oat-textarea[formControlName],ng-oat-textarea[formControl],ng-oat-textarea[ngModel],ng-oat-select[formControlName],ng-oat-select[formControl],ng-oat-select[ngModel],ng-oat-radio-group[formControlName],ng-oat-radio-group[formControl],ng-oat-radio-group[ngModel],ng-oat-search-input[formControlName],ng-oat-search-input[formControl],ng-oat-search-input[ngModel],ng-oat-input-otp[formControlName],ng-oat-input-otp[formControl],ng-oat-input-otp[ngModel]", never, {}, {}, never, never, true, never>;
 }
 
+/**
+ * ControlValueAccessor adapter for ng-oat **checkbox-type** components.
+ *
+ * Auto-activates when a Reactive Forms or Template-driven directive is present
+ * (`formControlName`, `[formControl]`, or `[(ngModel)]`).
+ *
+ * Add this directive to your component's `imports` alongside the form component:
+ * ```typescript
+ * imports: [ReactiveFormsModule, NgOatCheckbox, NgOatCheckboxCva]
+ * ```
+ *
+ * ```html
+ * <ng-oat-checkbox label="Accept terms" formControlName="accepted" />
+ * <ng-oat-switch label="Alerts" [(ngModel)]="alertsOn" />
+ * ```
+ */
+declare class NgOatCheckboxCva implements ControlValueAccessor {
+    private readonly host;
+    private onChange;
+    private onTouched;
+    /**
+     * Listen for native `change` events that bubble from the inner
+     * `<input type="checkbox">` up to the host component.
+     */
+    onHostChange(): void;
+    /** Mark as touched when focus leaves the host element tree. */
+    onHostBlur(): void;
+    writeValue(val: boolean): void;
+    registerOnChange(fn: (val: boolean) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgOatCheckboxCva, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgOatCheckboxCva, "ng-oat-checkbox[formControlName],ng-oat-checkbox[formControl],ng-oat-checkbox[ngModel],ng-oat-switch[formControlName],ng-oat-switch[formControl],ng-oat-switch[ngModel]", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Host interface for ng-oat components that carry a string `value`.
+ * Used by the CVA adapter directives to bridge Reactive & Template-driven forms.
+ */
+interface NgOatValueHost {
+    readonly value: ModelSignal<string>;
+    readonly touched: ModelSignal<boolean>;
+    readonly disabled: ModelSignal<boolean>;
+}
+/**
+ * Host interface for ng-oat checkbox-style components that carry a boolean `checked`.
+ */
+interface NgOatCheckboxHost {
+    readonly checked: ModelSignal<boolean>;
+    readonly touched: ModelSignal<boolean>;
+    readonly disabled: ModelSignal<boolean>;
+}
+/** Injection token provided by each value-type ng-oat form component. */
+declare const NG_OAT_VALUE_HOST: InjectionToken<NgOatValueHost>;
+/** Injection token provided by each checkbox-type ng-oat form component. */
+declare const NG_OAT_CHECKBOX_HOST: InjectionToken<NgOatCheckboxHost>;
+
+/** Convenience array — import both CVA adapters at once. */
+declare const NgOatFormsCva: readonly [typeof NgOatValueCva, typeof NgOatCheckboxCva];
+
 /** Upstream Oat version this build is synced to. */
 declare const OAT_VERSION = "0.0.0-vendored";
 
@@ -1920,5 +2032,5 @@ interface TooltipPositioner {
 /** DI token for tooltip positioning strategy */
 declare const TOOLTIP_POSITIONER: InjectionToken<TooltipPositioner>;
 
-export { NG_OAT_CHIP_GROUP, NG_OAT_TOGGLE_GROUP, NgOatAccordion, NgOatAlert, NgOatAvatar, NgOatBadge, NgOatBreadcrumb, NgOatButton, NgOatCard, NgOatCardCarousel, NgOatCardFooter, NgOatCardHeader, NgOatCarousel, NgOatCheckbox, NgOatChip, NgOatChipGroup, NgOatChipInput, NgOatDialog, NgOatDialogComponent, NgOatDropdown, NgOatDropdownComponent, NgOatFileUpload, NgOatFormError, NgOatInput, NgOatInputOtp, NgOatMeter, NgOatPagination, NgOatProgress, NgOatRadioGroup, NgOatSearchInput, NgOatSelect, NgOatSeparator, NgOatSidebar, NgOatSidebarComponent, NgOatSkeleton, NgOatSpinner, NgOatSplitButton, NgOatSwitch, NgOatTable, NgOatTabs, NgOatTabsComponent, NgOatTextarea, NgOatThemeRef, NgOatThemeSelector, NgOatThemeSelectorIcon, NgOatToast, NgOatToggle, NgOatToggleGroup, NgOatToolbar, NgOatToolbarRow, NgOatTooltip, NgOatTooltipComponent, OAT_TOKEN_MAP, OAT_VERSION, OAT_VERSION_TOKEN, TOOLTIP_POSITIONER, provideNgOat, provideNgOatTheme };
-export type { NgOatAccordionItem, NgOatAlertVariant, NgOatAvatarSize, NgOatBadgeVariant, NgOatButtonSize, NgOatButtonStyle, NgOatButtonVariant, NgOatCarouselAspectRatio, NgOatCarouselOrientation, NgOatCarouselSlide, NgOatChipGroupHost, NgOatChipSize, NgOatChipVariant, NgOatInputType, NgOatOptions, NgOatProductCard, NgOatRadioOption, NgOatSelectOption, NgOatSeparatorOrientation, NgOatSkeletonType, NgOatSpinnerSize, NgOatTabItem, NgOatTableColumn, NgOatTheme, NgOatThemeConfig, NgOatThemeOption, NgOatToastOptions, NgOatToastPlacement, NgOatToastVariant, NgOatToggleGroupHost, NgOatToggleGroupSize, NgOatToggleGroupVariant, NgOatToggleSize, NgOatToggleVariant, NgOatToolbarColor, OatBreadcrumbItem, OatTokens, Placement, TooltipPositioner };
+export { NG_OAT_CHECKBOX_HOST, NG_OAT_CHIP_GROUP, NG_OAT_TOGGLE_GROUP, NG_OAT_VALUE_HOST, NgOatAccordion, NgOatAlert, NgOatAvatar, NgOatBadge, NgOatBreadcrumb, NgOatButton, NgOatCard, NgOatCardCarousel, NgOatCardFooter, NgOatCardHeader, NgOatCarousel, NgOatCheckbox, NgOatCheckboxCva, NgOatChip, NgOatChipGroup, NgOatChipInput, NgOatDialog, NgOatDialogComponent, NgOatDropdown, NgOatDropdownComponent, NgOatFileUpload, NgOatFormError, NgOatFormsCva, NgOatInput, NgOatInputOtp, NgOatMeter, NgOatPagination, NgOatProgress, NgOatRadioGroup, NgOatSearchInput, NgOatSelect, NgOatSeparator, NgOatSidebar, NgOatSidebarComponent, NgOatSkeleton, NgOatSpinner, NgOatSplitButton, NgOatSwitch, NgOatTable, NgOatTabs, NgOatTabsComponent, NgOatTextarea, NgOatThemeRef, NgOatThemeSelector, NgOatThemeSelectorIcon, NgOatToast, NgOatToggle, NgOatToggleGroup, NgOatToolbar, NgOatToolbarRow, NgOatTooltip, NgOatTooltipComponent, NgOatValueCva, OAT_TOKEN_MAP, OAT_VERSION, OAT_VERSION_TOKEN, TOOLTIP_POSITIONER, provideNgOat, provideNgOatTheme };
+export type { NgOatAccordionItem, NgOatAlertVariant, NgOatAvatarSize, NgOatBadgeVariant, NgOatButtonSize, NgOatButtonStyle, NgOatButtonVariant, NgOatCarouselAspectRatio, NgOatCarouselOrientation, NgOatCarouselSlide, NgOatCheckboxHost, NgOatChipGroupHost, NgOatChipSize, NgOatChipVariant, NgOatInputType, NgOatOptions, NgOatProductCard, NgOatRadioOption, NgOatSelectOption, NgOatSeparatorOrientation, NgOatSkeletonType, NgOatSpinnerSize, NgOatTabItem, NgOatTableColumn, NgOatTheme, NgOatThemeConfig, NgOatThemeOption, NgOatToastOptions, NgOatToastPlacement, NgOatToastVariant, NgOatToggleGroupHost, NgOatToggleGroupSize, NgOatToggleGroupVariant, NgOatToggleSize, NgOatToggleVariant, NgOatToolbarColor, NgOatValueHost, OatBreadcrumbItem, OatTokens, Placement, TooltipPositioner };