@radix-ng/primitives 1.0.0-beta.1 → 1.0.0-beta.2

package/types/radix-ng-primitives-input.d.ts

@@ -1,7 +1,11 @@
 import * as _angular_core from '@angular/core';
-import { RdxFormValueControl, BooleanInput } from '@radix-ng/primitives/core';
+import { RdxFormValueControl, BooleanInput, RdxValidationError, NumberInput } from '@radix-ng/primitives/core';
 
-type RdxInputValue = string | number | readonly string[];
+/**
+ * The input value. Native text inputs always produce strings, so the model is
+ * `string` — matching Signal Forms' `FormValueControl<string>` round-trip.
+ */
+type RdxInputValue = string;
 interface RdxInputValueChangeEventDetails {
     event: Event;
     cancel: () => void;
@@ -24,30 +28,44 @@ declare class RdxInputDirective implements RdxFormValueControl<RdxInputValue | u
     private defaultValueApplied;
     private readonly filledValue;
     private readonly focusedValue;
+    private readonly dirtyValue;
     /**
      * The input id. Field labels and descriptions use this value for accessible relationships.
      *
      * @group Props
      */
     readonly id: _angular_core.InputSignal<string>;
+    /**
+     * The name of the input, submitted with the form data and used by Form-level
+     * error matching.
+     *
+     * @group Props
+     */
+    readonly name: _angular_core.InputSignal<string | undefined>;
     /**
      * The controlled input value.
      *
      * @group Props
      */
-    readonly value: _angular_core.ModelSignal<RdxInputValue | undefined>;
+    readonly value: _angular_core.ModelSignal<string | undefined>;
     /**
      * The initial value when the input is uncontrolled.
      *
      * @group Props
      */
-    readonly defaultValue: _angular_core.InputSignal<RdxInputValue | undefined>;
+    readonly defaultValue: _angular_core.InputSignal<string | undefined>;
     /**
      * Whether the input is disabled.
      *
      * @group Props
      */
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Whether the input is read-only.
+     *
+     * @group Props
+     */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /**
      * Whether the input is required.
      *
@@ -60,17 +78,69 @@ declare class RdxInputDirective implements RdxFormValueControl<RdxInputValue | u
      * @group Props
      */
     readonly invalid: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Whether the input has been touched. A two-way model: the input sets it on
+     * blur (emitting `touchedChange`, which Signal Forms' `[formField]` listens
+     * to), and a form system can write it back.
+     *
+     * @group Props
+     */
+    readonly touched: _angular_core.ModelSignal<boolean>;
+    /**
+     * Whether the input value has changed from its initial value. Merged with the
+     * internally tracked state; a form system can own it through this input.
+     *
+     * @group Props
+     */
+    readonly dirty: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Validation errors for the input. A non-empty list marks the input invalid.
+     *
+     * @group Props
+     */
+    readonly errors: _angular_core.InputSignal<readonly RdxValidationError[]>;
+    /**
+     * Minimum number of characters.
+     *
+     * @group Props
+     */
+    readonly minLength: _angular_core.InputSignalWithTransform<number | undefined, NumberInput>;
+    /**
+     * Maximum number of characters.
+     *
+     * @group Props
+     */
+    readonly maxLength: _angular_core.InputSignalWithTransform<number | undefined, NumberInput>;
+    /**
+     * Patterns the value must match. Reflected to the native `pattern` attribute
+     * only when exactly one pattern is provided (the attribute holds a single regex).
+     *
+     * @group Props
+     */
+    readonly pattern: _angular_core.InputSignal<readonly RegExp[]>;
     /**
      * Emits when the input value changes.
      *
      * @group Emits
      */
     readonly onValueChange: _angular_core.OutputEmitterRef<RdxInputValueChangeEvent>;
+    /**
+     * Emits on blur, notifying a form system the input was touched. Stable
+     * Angular 22 Signal Forms listens to this `touch` output; the 21.x
+     * experimental implementation listens to the `touched` model's
+     * `touchedChange` instead — both are emitted, covering either version.
+     *
+     * @group Emits
+     */
+    readonly touch: _angular_core.OutputEmitterRef<void>;
     protected readonly invalidState: _angular_core.Signal<boolean>;
     protected readonly disabledState: _angular_core.Signal<boolean>;
     protected readonly requiredState: _angular_core.Signal<boolean>;
     protected readonly filledState: _angular_core.Signal<boolean>;
     protected readonly focusedState: _angular_core.Signal<boolean>;
+    protected readonly touchedState: _angular_core.Signal<boolean>;
+    protected readonly dirtyState: _angular_core.Signal<boolean>;
+    protected readonly patternAttr: _angular_core.Signal<string | undefined>;
     protected readonly describedBy: _angular_core.Signal<string | undefined>;
     constructor();
     onFocus(): void;
@@ -80,7 +150,7 @@ declare class RdxInputDirective implements RdxFormValueControl<RdxInputValue | u
     private writeValue;
     protected readonly dataAttr: (value: boolean) => "" | undefined;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxInputDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxInputDirective, "input[rdxInput]", ["rdxInput"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "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; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxInputDirective, "input[rdxInput]", ["rdxInput"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "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; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "minLength": { "alias": "minLength"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "pattern": { "alias": "pattern"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; "onValueChange": "onValueChange"; "touch": "touch"; }, never, never, true, never>;
 }
 
 export { RdxInputDirective };