@angular/forms - npm Package Compare versions

Comparing version 21.2.0-next.0 to 21.2.0-next.1

fesm2022/_structure-chunk.mjs

 /**
- * @license Angular v21.2.0-next.0
+ * @license Angular v21.2.0-next.1
  * (c) 2010-2026 Google LLC. https://angular.dev/
@@ -650,6 +650,15 @@ * License: MIT
   }] : []));
-  errors = computed(() => [...this.syncErrors(), ...this.asyncErrors().filter(err => err !== 'pending')], ...(ngDevMode ? [{
+  parseErrors = computed(() => this.node.formFieldBindings().flatMap(field => field.parseErrors()), ...(ngDevMode ? [{
+    debugName: "parseErrors"
+  }] : []));
+  errors = computed(() => [...this.parseErrors(), ...this.syncErrors(), ...this.asyncErrors().filter(err => err !== 'pending')], ...(ngDevMode ? [{
     debugName: "errors"
   }] : []));
-  errorSummary = computed(() => this.node.structure.reduceChildren(this.errors(), (child, result) => [...result, ...child.errorSummary()]), ...(ngDevMode ? [{
+  errorSummary = computed(() => {
+    const errors = this.node.structure.reduceChildren(this.errors(), (child, result) => [...result, ...child.errorSummary()]);
+    if (typeof ngServerMode === 'undefined' || !ngServerMode) {
+      untracked(() => errors.sort(compareErrorPosition));
+    }
+    return errors;
+  }, ...(ngDevMode ? [{
     debugName: "errorSummary"
@@ -705,2 +714,16 @@ }] : []));
 }
+function getFirstBoundElement(error) {
+  if (error.formField) return error.formField.element;
+  return error.fieldTree().formFieldBindings().reduce((el, binding) => {
+    if (!el || !binding.element) return el ?? binding.element;
+    return el.compareDocumentPosition(binding.element) & Node.DOCUMENT_POSITION_PRECEDING ? binding.element : el;
+  }, undefined);
+}
+function compareErrorPosition(a, b) {
+  const aEl = getFirstBoundElement(a);
+  const bEl = getFirstBoundElement(b);
+  if (aEl === bEl) return 0;
+  if (aEl === undefined || bEl === undefined) return aEl === undefined ? 1 : -1;
+  return aEl.compareDocumentPosition(bEl) & Node.DOCUMENT_POSITION_PRECEDING ? 1 : -1;
+}
 
@@ -1219,2 +1242,5 @@ const DEBOUNCER = createMetadataKey();
   }
+  get parseErrors() {
+    return this.validationState.parseErrors;
+  }
   get errorSummary() {
@@ -1563,4 +1589,7 @@ return this.validationState.errorSummary;
   const node = form();
-  markAllAsTouched(node);
-  if (node.invalid()) {
+  const invalid = untracked(() => {
+    markAllAsTouched(node);
+    return node.invalid();
+  });
+  if (invalid) {
     return;
@@ -1599,2 +1628,5 @@ }
 function markAllAsTouched(node) {
+  if (node.validationState.shouldSkipValidation()) {
+    return;
+  }
   node.markAsTouched();
@@ -1601,0 +1633,0 @@ for (const child of node.structure.children()) {

fesm2022/signals-compat.mjs

 /**
- * @license Angular v21.2.0-next.0
+ * @license Angular v21.2.0-next.1
  * (c) 2010-2026 Google LLC. https://angular.dev/
@@ -209,2 +209,5 @@ * License: MIT
   valid;
+  parseErrors = computed(() => [], ...(ngDevMode ? [{
+    debugName: "parseErrors"
+  }] : []));
   constructor(options) {
@@ -211,0 +214,0 @@ this.syncValid = getControlStatusSignal(options, c => c.status === 'VALID');

fesm2022/signals.mjs

 /**
- * @license Angular v21.2.0-next.0
+ * @license Angular v21.2.0-next.1
  * (c) 2010-2026 Google LLC. https://angular.dev/
@@ -104,6 +104,9 @@ * License: MIT
   injector = inject(Injector);
-  formField = input.required(...(ngDevMode ? [{
-    debugName: "formField"
-  }] : []));
-  state = computed(() => this.formField()(), ...(ngDevMode ? [{
+  fieldTree = input.required({
+    ...(ngDevMode ? {
+      debugName: "fieldTree"
+    } : {}),
+    alias: 'formField'
+  });
+  state = computed(() => this.fieldTree()(), ...(ngDevMode ? [{
     debugName: "state"
@@ -114,2 +117,12 @@ }] : []));
   }] : []));
+  parseErrors = computed(() => this.bindingOptions()?.parseErrors?.().map(err => ({
+    ...err,
+    fieldTree: this.fieldTree(),
+    formField: this
+  })) ?? [], ...(ngDevMode ? [{
+    debugName: "parseErrors"
+  }] : []));
+  errors = computed(() => this.state().errors().filter(err => !err.formField || err.formField === this), ...(ngDevMode ? [{
+    debugName: "errors"
+  }] : []));
   [_CONTROL] = controlInstructions;
@@ -156,3 +169,3 @@ config = inject(SIGNAL_FORMS_CONFIG, {
     minVersion: "12.0.0",
-    version: "21.2.0-next.0",
+    version: "21.2.0-next.1",
     ngImport: i0,
@@ -165,3 +178,3 @@ type: FormField,
     minVersion: "17.1.0",
-    version: "21.2.0-next.0",
+    version: "21.2.0-next.1",
     type: FormField,
@@ -171,4 +184,4 @@ isStandalone: true,
     inputs: {
-      formField: {
-        classPropertyName: "formField",
+      fieldTree: {
+        classPropertyName: "fieldTree",
         publicName: "formField",
@@ -187,2 +200,3 @@ isSignal: true,
     }],
+    exportAs: ["formField"],
     ngImport: i0
@@ -193,3 +207,3 @@ });
   minVersion: "12.0.0",
-  version: "21.2.0-next.0",
+  version: "21.2.0-next.1",
   ngImport: i0,
@@ -201,2 +215,3 @@ type: FormField,
       selector: '[formField]',
+      exportAs: 'formField',
       providers: [{
@@ -212,3 +227,3 @@ provide: FORM_FIELD,
   propDecorators: {
-    formField: [{
+    fieldTree: [{
       type: i0.Input,
@@ -215,0 +230,0 @@ args: [{

package.json

 {
   "name": "@angular/forms",
-  "version": "21.2.0-next.0",
+  "version": "21.2.0-next.1",
   "description": "Angular - directives and services for creating forms",
@@ -15,5 +15,5 @@ "author": "angular",
   "peerDependencies": {
-    "@angular/core": "21.2.0-next.0",
-    "@angular/common": "21.2.0-next.0",
-    "@angular/platform-browser": "21.2.0-next.0",
+    "@angular/core": "21.2.0-next.1",
+    "@angular/common": "21.2.0-next.1",
+    "@angular/platform-browser": "21.2.0-next.1",
     "rxjs": "^6.5.3 || ^7.4.0"
@@ -20,0 +20,0 @@ },

types/signals-compat.d.ts

 /**
- * @license Angular v21.2.0-next.0
+ * @license Angular v21.2.0-next.1
  * (c) 2010-2026 Google LLC. https://angular.dev/
@@ -4,0 +4,0 @@ * License: MIT

types/signals.d.ts

 /**
- * @license Angular v21.2.0-next.0
+ * @license Angular v21.2.0-next.1
  * (c) 2010-2026 Google LLC. https://angular.dev/
@@ -8,4 +8,4 @@ * License: MIT
 import { Signal, ResourceRef, InputSignal, InputSignalWithTransform, ModelSignal, OutputRef } from '@angular/core';
-import { PathKind, SchemaPath, SchemaPathRules, LogicFn, OneOrMany, ValidationError, SchemaPathTree, FieldValidator, FieldContext, TreeValidationResult, TreeValidator, WithOptionalField, DisabledReason, Debouncer } from './_structure-chunk.js';
-export { AsyncValidationResult, ChildFieldContext, CompatFieldState, CompatSchemaPath, EmailValidationError, FORM_FIELD, FieldState, FieldTree, FormField, FormFieldBindingOptions, 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, 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';
+import { PathKind, SchemaPath, SchemaPathRules, LogicFn, OneOrMany, ValidationError, SchemaPathTree, FieldValidator, FieldContext, TreeValidationResult, TreeValidator, WithOptionalFieldTree, DisabledReason, Debouncer } from './_structure-chunk.js';
+export { AsyncValidationResult, ChildFieldContext, CompatFieldState, CompatSchemaPath, EmailValidationError, FORM_FIELD, FieldState, FieldTree, FormField, FormFieldBindingOptions, 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, ValidationResult, ValidationSuccess, Validator, WithField, WithFieldTree, WithOptionalField, WithoutField, WithoutFieldTree, apply, applyEach, applyWhen, applyWhenValue, createManagedMetadataKey, createMetadataKey, emailError, form, maxError, maxLengthError, metadata, minError, minLengthError, patternError, provideSignalFormsConfig, requiredError, schema, standardSchemaError, submit } from './_structure-chunk.js';
 import { StandardSchemaV1 } from '@standard-schema/spec';
@@ -427,3 +427,3 @@ import { HttpResourceRequest, HttpResourceOptions } from '@angular/common/http';
  */
-interface FormUiControl {
+interface FormUiControl<TValue> {
     /**
@@ -433,3 +433,3 @@ * An input to receive the errors for the field. If implemented, the `Field` directive will
      */
-    readonly errors?: InputSignal<readonly WithOptionalField<ValidationError>[]> | InputSignalWithTransform<readonly WithOptionalField<ValidationError>[], unknown>;
+    readonly errors?: InputSignal<readonly ValidationError.WithOptionalFieldTree[]> | InputSignalWithTransform<readonly ValidationError.WithOptionalFieldTree[], unknown>;
     /**
@@ -444,3 +444,3 @@ * An input to receive the disabled status for the field. If implemented, the `Field` directive
      */
-    readonly disabledReasons?: InputSignal<readonly WithOptionalField<DisabledReason>[]> | InputSignalWithTransform<readonly WithOptionalField<DisabledReason>[], unknown>;
+    readonly disabledReasons?: InputSignal<readonly WithOptionalFieldTree<DisabledReason>[]> | InputSignalWithTransform<readonly WithOptionalFieldTree<DisabledReason>[], unknown>;
     /**
@@ -512,2 +512,8 @@ * An input to receive the readonly status for the field. If implemented, the `Field` directive
     /**
+     * A signal containing the current parse errors for the control.
+     * This allows the control to communicate to the form that there are additional validation errors
+     * beyond those produced by the schema, due to being unable to parse the user's input.
+     */
+    readonly parseErrors?: Signal<ValidationError.WithoutFieldTree[]>;
+    /**
      * Focuses the UI control.
@@ -533,3 +539,3 @@ *
  */
-interface FormValueControl<TValue> extends FormUiControl {
+interface FormValueControl<TValue> extends FormUiControl<TValue> {
     /**
@@ -558,3 +564,3 @@ * The value is the only required property in this contract. A component that wants to integrate
  */
-interface FormCheckboxControl extends FormUiControl {
+interface FormCheckboxControl extends FormUiControl<boolean> {
     /**
@@ -587,3 +593,3 @@ * The checked is the only required property in this contract. A component that wants to integrate
 
-export { Debouncer, DisabledReason, FieldContext, FieldValidator, LogicFn, OneOrMany, PathKind, SchemaPath, SchemaPathRules, SchemaPathTree, TreeValidationResult, TreeValidator, ValidationError, WithOptionalField, debounce, disabled, email, hidden, max, maxLength, min, minLength, pattern, readonly, required, validate, validateAsync, validateHttp, validateStandardSchema, validateTree };
+export { Debouncer, DisabledReason, FieldContext, FieldValidator, LogicFn, OneOrMany, PathKind, SchemaPath, SchemaPathRules, SchemaPathTree, TreeValidationResult, TreeValidator, ValidationError, WithOptionalFieldTree, debounce, disabled, email, hidden, max, maxLength, min, minLength, pattern, readonly, required, validate, validateAsync, validateHttp, validateStandardSchema, validateTree };
 export type { AsyncValidatorOptions, FormCheckboxControl, FormUiControl, FormValueControl, HttpValidatorOptions, IgnoreUnknownProperties, MapToErrorsFn, RemoveStringIndexUnknownKey };

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1485715

0.71%

Lines of code

16379

0.5%

Worsened metrics

Number of low supply chain risk alerts

83

2.47%

No dependency changes