@angular/forms 21.1.0-rc.0 → 21.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @license Angular v21.1.0-rc.0
2
+ * @license Angular v21.1.0
3
3
  * (c) 2010-2026 Google LLC. https://angular.dev/
4
4
  * License: MIT
5
5
  */
@@ -42,52 +42,6 @@ declare class InteropNgControl implements Pick<NgControl, InteropSharedKeys | 'c
42
42
  updateValueAndValidity(): void;
43
43
  }
44
44
 
45
- /**
46
- * Lightweight DI token provided by the {@link Field} directive.
47
- *
48
- * @category control
49
- * @experimental 21.0.0
50
- */
51
- declare const FIELD: InjectionToken<Field<unknown>>;
52
- /**
53
- * Binds a form `FieldTree` to a UI control that edits it. A UI control can be one of several things:
54
- * 1. A native HTML input or textarea
55
- * 2. A signal forms custom control that implements `FormValueControl` or `FormCheckboxControl`
56
- * 3. A component that provides a `ControlValueAccessor`. This should only be used for backwards
57
- * compatibility with reactive forms. Prefer options (1) and (2).
58
- *
59
- * This directive has several responsibilities:
60
- * 1. Two-way binds the field's value with the UI control's value
61
- * 2. Binds additional forms related state on the field to the UI control (disabled, required, etc.)
62
- * 3. Relays relevant events on the control to the field (e.g. marks field touched on blur)
63
- * 4. Provides a fake `NgControl` that implements a subset of the features available on the
64
- * reactive forms `NgControl`. This is provided to improve interoperability with controls
65
- * designed to work with reactive forms. It should not be used by controls written for signal
66
- * forms.
67
- *
68
- * @category control
69
- * @experimental 21.0.0
70
- */
71
- declare class Field<T> {
72
- readonly element: HTMLElement;
73
- readonly injector: Injector;
74
- readonly field: i0.InputSignal<FieldTree<T>>;
75
- readonly state: i0.Signal<[T] extends [_angular_forms.AbstractControl<any, any, any>] ? CompatFieldState<T, string | number> : FieldState<T, string | number>>;
76
- readonly [_CONTROL]: {
77
- readonly create: typeof __controlCreate;
78
- readonly update: typeof _controlUpdate;
79
- };
80
- private config;
81
- /** Any `ControlValueAccessor` instances provided on the host element. */
82
- private readonly controlValueAccessors;
83
- /** A lazily instantiated fake `NgControl`. */
84
- private interopNgControl;
85
- /** Lazily instantiates a fake `NgControl` for this field. */
86
- protected getOrCreateNgControl(): InteropNgControl;
87
- static ɵfac: i0.ɵɵFactoryDeclaration<Field<any>, never>;
88
- static ɵdir: i0.ɵɵDirectiveDeclaration<Field<any>, "[field]", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
89
- }
90
-
91
45
  /**
92
46
  * Lightweight DI token provided by the {@link FormField} directive.
93
47
  *
@@ -130,6 +84,8 @@ declare class FormField<T> {
130
84
  private interopNgControl;
131
85
  /** Lazily instantiates a fake `NgControl` for this form field. */
132
86
  protected getOrCreateNgControl(): InteropNgControl;
87
+ /** Focuses this UI control. */
88
+ focus?(): void;
133
89
  static ɵfac: i0.ɵɵFactoryDeclaration<FormField<any>, never>;
134
90
  static ɵdir: i0.ɵɵDirectiveDeclaration<FormField<any>, "[formField]", never, { "formField": { "alias": "formField"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
135
91
  }
@@ -526,9 +482,9 @@ interface FieldState<TValue, TKey extends string | number = string | number> ext
526
482
  */
527
483
  readonly keyInParent: Signal<TKey>;
528
484
  /**
529
- * The {@link Field} directives that bind this field to a UI control.
485
+ * The {@link FormField} directives that bind this field to a UI control.
530
486
  */
531
- readonly formFieldBindings: Signal<readonly (Field<unknown> | FormField<unknown>)[]>;
487
+ readonly formFieldBindings: Signal<readonly FormField<unknown>[]>;
532
488
  /**
533
489
  * Reads a metadata value from the field.
534
490
  * @param key The metadata key to read.
@@ -542,6 +498,11 @@ interface FieldState<TValue, TKey extends string | number = string | number> ext
542
498
  * @param value Optional value to set to the form. If not passed, the value will not be changed.
543
499
  */
544
500
  reset(value?: TValue): void;
501
+ /**
502
+ * Focuses the first UI control in the DOM that is bound to this field state.
503
+ * If no UI control is bound, does nothing.
504
+ */
505
+ focusBoundControl(): void;
545
506
  }
546
507
  /**
547
508
  * This is FieldState also providing access to the wrapped FormControl.
@@ -1171,7 +1132,7 @@ type NgValidationError = RequiredValidationError | MinValidationError | MaxValid
1171
1132
  interface SignalFormsConfig {
1172
1133
  /** A map of CSS class names to predicate functions that determine when to apply them. */
1173
1134
  classes?: {
1174
- [className: string]: (state: Field<unknown> | FormField<unknown>) => boolean;
1135
+ [className: string]: (state: FormField<unknown>) => boolean;
1175
1136
  };
1176
1137
  }
1177
1138
  /**
@@ -1572,7 +1533,7 @@ declare class FieldNodeState {
1572
1533
  */
1573
1534
  markAsUntouched(): void;
1574
1535
  /** The {@link FormField} directives that bind this field to a UI control. */
1575
- readonly formFieldBindings: i0.WritableSignal<readonly (Field<unknown> | FormField<unknown>)[]>;
1536
+ readonly formFieldBindings: i0.WritableSignal<readonly FormField<unknown>[]>;
1576
1537
  constructor(node: FieldNode);
1577
1538
  /**
1578
1539
  * Whether this field is considered dirty.
@@ -1773,6 +1734,16 @@ declare class FieldNode implements FieldState<unknown> {
1773
1734
  readonly fieldProxy: FieldTree<any>;
1774
1735
  private readonly pathNode;
1775
1736
  constructor(options: FieldNodeOptions);
1737
+ focusBoundControl(): void;
1738
+ /**
1739
+ * Gets the Field directive binding that should be focused when the developer calls
1740
+ * `focusBoundControl` on this node.
1741
+ *
1742
+ * This will prioritize focusable bindings to this node, and if multiple exist, it will return
1743
+ * the first one in the DOM. If no focusable bindings exist on this node, it will return the
1744
+ * first focusable binding in the DOM for any descendant node of this one.
1745
+ */
1746
+ private getBindingForFocus;
1776
1747
  /**
1777
1748
  * The `AbortController` for the currently debounced sync, or `undefined` if there is none.
1778
1749
  *
@@ -1797,7 +1768,7 @@ declare class FieldNode implements FieldState<unknown> {
1797
1768
  get disabledReasons(): Signal<readonly DisabledReason[]>;
1798
1769
  get hidden(): Signal<boolean>;
1799
1770
  get readonly(): Signal<boolean>;
1800
- get formFieldBindings(): Signal<readonly (Field<unknown> | FormField<unknown>)[]>;
1771
+ get formFieldBindings(): Signal<readonly FormField<unknown>[]>;
1801
1772
  get submitting(): Signal<boolean>;
1802
1773
  get name(): Signal<string>;
1803
1774
  get max(): Signal<number | undefined> | undefined;
@@ -1906,7 +1877,7 @@ declare abstract class FieldNodeStructure {
1906
1877
  get injector(): DestroyableInjector;
1907
1878
  constructor(logic: LogicNode, node: FieldNode, createChildNode: ChildNodeCtor);
1908
1879
  /** Gets the child fields of this field. */
1909
- children(): Iterable<FieldNode>;
1880
+ children(): readonly FieldNode[];
1910
1881
  /** Retrieve a child `FieldNode` of this node by property key. */
1911
1882
  getChild(key: PropertyKey): FieldNode | undefined;
1912
1883
  /**
@@ -2357,7 +2328,7 @@ declare function applyWhenValue<TValue>(path: SchemaPath<TValue>, predicate: (va
2357
2328
  /**
2358
2329
  * Submits a given `FieldTree` using the given action function and applies any submission errors
2359
2330
  * resulting from the action to the field. Submission errors returned by the `action` will be integrated
2360
- * into the field as a `ValidationError` on the sub-field indicated by the `field` property of the
2331
+ * into the field as a `ValidationError` on the sub-field indicated by the `fieldTree` property of the
2361
2332
  * submission error.
2362
2333
  *
2363
2334
  * @example
@@ -2366,8 +2337,9 @@ declare function applyWhenValue<TValue>(path: SchemaPath<TValue>, predicate: (va
2366
2337
  * const result = await myClient.registerNewUser(registrationForm().value());
2367
2338
  * if (result.errorCode === myClient.ErrorCode.USERNAME_TAKEN) {
2368
2339
  * return [{
2369
- * field: registrationForm.username,
2370
- * error: {kind: 'server', message: 'Username already taken'}
2340
+ * fieldTree: registrationForm.username,
2341
+ * kind: 'server',
2342
+ * message: 'Username already taken'
2371
2343
  * }];
2372
2344
  * }
2373
2345
  * return undefined;
@@ -2400,5 +2372,5 @@ declare function submit<TModel>(form: FieldTree<TModel>, action: (form: FieldTre
2400
2372
  */
2401
2373
  declare function schema<TValue>(fn: SchemaFn<TValue>): Schema<TValue>;
2402
2374
 
2403
- export { EmailValidationError, FIELD, FORM_FIELD, Field, FormField, MAX, MAX_LENGTH, MIN, MIN_LENGTH, MaxLengthValidationError, MaxValidationError, MetadataKey, MetadataReducer, MinLengthValidationError, MinValidationError, NgValidationError, PATTERN, PathKind, PatternValidationError, REQUIRED, RequiredValidationError, SchemaPathRules, StandardSchemaValidationError, ValidationError, apply, applyEach, applyWhen, applyWhenValue, createManagedMetadataKey, createMetadataKey, emailError, form, maxError, maxLengthError, metadata, minError, minLengthError, patternError, provideSignalFormsConfig, requiredError, schema, standardSchemaError, submit };
2375
+ export { EmailValidationError, FORM_FIELD, FormField, MAX, MAX_LENGTH, MIN, MIN_LENGTH, MaxLengthValidationError, MaxValidationError, MetadataKey, MetadataReducer, MinLengthValidationError, MinValidationError, NgValidationError, PATTERN, PathKind, PatternValidationError, REQUIRED, RequiredValidationError, SchemaPathRules, StandardSchemaValidationError, ValidationError, apply, applyEach, applyWhen, applyWhenValue, createManagedMetadataKey, createMetadataKey, emailError, form, maxError, maxLengthError, metadata, minError, minLengthError, patternError, provideSignalFormsConfig, requiredError, schema, standardSchemaError, submit };
2404
2376
  export type { AsyncValidationResult, ChildFieldContext, CompatFieldState, CompatSchemaPath, Debouncer, DisabledReason, FieldContext, FieldState, FieldTree, FieldValidator, FormOptions, ItemFieldContext, ItemType, LogicFn, MaybeFieldTree, MaybeSchemaPathTree, MetadataSetterType, OneOrMany, ReadonlyArrayLike, RootFieldContext, Schema, SchemaFn, SchemaOrSchemaFn, SchemaPath, SchemaPathTree, SignalFormsConfig, Subfields, SubmittedStatus, TreeValidationResult, TreeValidator, ValidationResult, ValidationSuccess, Validator, WithField, WithOptionalField, WithoutField };
package/types/forms.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @license Angular v21.1.0-rc.0
2
+ * @license Angular v21.1.0
3
3
  * (c) 2010-2026 Google LLC. https://angular.dev/
4
4
  * License: MIT
5
5
  */
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @license Angular v21.1.0-rc.0
2
+ * @license Angular v21.1.0
3
3
  * (c) 2010-2026 Google LLC. https://angular.dev/
4
4
  * License: MIT
5
5
  */
@@ -1,12 +1,12 @@
1
1
  /**
2
- * @license Angular v21.1.0-rc.0
2
+ * @license Angular v21.1.0
3
3
  * (c) 2010-2026 Google LLC. https://angular.dev/
4
4
  * License: MIT
5
5
  */
6
6
 
7
7
  import { Signal, ResourceRef, InputSignal, InputSignalWithTransform, ModelSignal, OutputRef } from '@angular/core';
8
8
  import { PathKind, SchemaPath, SchemaPathRules, LogicFn, OneOrMany, ValidationError, SchemaPathTree, FieldValidator, FieldContext, TreeValidationResult, TreeValidator, WithOptionalField, DisabledReason, Debouncer } from './_structure-chunk.js';
9
- export { AsyncValidationResult, ChildFieldContext, CompatFieldState, CompatSchemaPath, EmailValidationError, FIELD, FORM_FIELD, Field, FieldState, FieldTree, FormField, FormOptions, ItemFieldContext, ItemType, MAX, MAX_LENGTH, MIN, MIN_LENGTH, MaxLengthValidationError, MaxValidationError, MaybeFieldTree, MaybeSchemaPathTree, MetadataKey, MetadataReducer, MetadataSetterType, MinLengthValidationError, MinValidationError, NgValidationError, PATTERN, PatternValidationError, REQUIRED, ReadonlyArrayLike, RequiredValidationError, RootFieldContext, Schema, SchemaFn, SchemaOrSchemaFn, SignalFormsConfig, StandardSchemaValidationError, Subfields, SubmittedStatus, ValidationResult, ValidationSuccess, Validator, WithField, WithoutField, apply, applyEach, applyWhen, applyWhenValue, createManagedMetadataKey, createMetadataKey, emailError, form, maxError, maxLengthError, metadata, minError, minLengthError, patternError, provideSignalFormsConfig, requiredError, schema, standardSchemaError, submit } from './_structure-chunk.js';
9
+ export { AsyncValidationResult, ChildFieldContext, CompatFieldState, CompatSchemaPath, EmailValidationError, FORM_FIELD, FieldState, FieldTree, FormField, FormOptions, ItemFieldContext, ItemType, MAX, MAX_LENGTH, MIN, MIN_LENGTH, MaxLengthValidationError, MaxValidationError, MaybeFieldTree, MaybeSchemaPathTree, MetadataKey, MetadataReducer, MetadataSetterType, MinLengthValidationError, MinValidationError, NgValidationError, PATTERN, PatternValidationError, REQUIRED, ReadonlyArrayLike, RequiredValidationError, RootFieldContext, Schema, SchemaFn, SchemaOrSchemaFn, SignalFormsConfig, StandardSchemaValidationError, Subfields, SubmittedStatus, ValidationResult, ValidationSuccess, Validator, WithField, WithoutField, apply, applyEach, applyWhen, applyWhenValue, createManagedMetadataKey, createMetadataKey, emailError, form, maxError, maxLengthError, metadata, minError, minLengthError, patternError, provideSignalFormsConfig, requiredError, schema, standardSchemaError, submit } from './_structure-chunk.js';
10
10
  import { StandardSchemaV1 } from '@standard-schema/spec';
11
11
  import { HttpResourceRequest, HttpResourceOptions } from '@angular/common/http';
12
12
  import '@angular/forms';