@dynamic-field-kit/angular 1.11.0 → 1.11.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @dynamic-field-kit/angular
 
+## 1.11.1
+
+### Patch Changes
+
+- ba3538b: Angular 22 is accepted: `@angular/core` and `@angular/common` are now `>=16 <23`. An app on Angular 22 could not install the package before, as npm refused the peer range. `scripts/verify-angular-peer-range.js` now checks Angular 16 and 22, and the demo app was built with the Angular 22 CLI and used in a browser.
+- ba3538b: A registered field component that uses `OnPush` change detection now shows the props the form hands it after the first render. They were assigned to the component without marking it for check, so a value the form set itself, such as a computed field, did not show. From Angular 22 every component that names no strategy is `OnPush`, so on 22 this hit every registered field component.
+- Angular 22 support.
+
 ## 1.11.0
 
 ### Minor Changes

package/README.md

@@ -86,16 +86,23 @@ For a complete UI integration, see the
 
 ## Supported Angular versions
 
-The package declares `@angular/core` and `@angular/common` as `>=16 <22`,
+The package declares `@angular/core` and `@angular/common` as `>=16 <23`,
 and `scripts/verify-angular-peer-range.js` proves both ends in CI by installing
-the packed tarballs against Angular 16 and 21 outside the workspace.
+the packed tarballs against Angular 16 and 22 outside the workspace.
 
 The floor is 16 because the form store is built on `signal` and `computed`,
 which Angular introduced in 16. It read `>=14` until 1.6.0: npm accepted the
 install on 14 and 15 and the package then failed on import.
 
 The suite, the build and the demo app all run Angular 21, which is the version
-the setup below is written for.
+the setup below is written for. The setup works unchanged on 22.
+
+Angular 22 makes `OnPush` the default for a component that names no change
+detection strategy, and that includes the field components you register. They
+need nothing extra for it: the adapter marks a rendered field component for
+check whenever it hands it new props. Up to 1.11.0 it did not, so on Angular 22
+a value the form set itself, such as a computed field, did not show in a
+registered component.
 
 ## Basic setup
 

package/dist/fesm2022/dynamic-field-kit-angular.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Output, Input, Component, InjectionToken, inject, ViewContainerRef, ViewChild, ChangeDetectionStrategy, HostListener, signal, computed, NgModule } from '@angular/core';
+import { EventEmitter, Output, Input, Component, InjectionToken, inject, ChangeDetectorRef, ViewContainerRef, ViewChild, ChangeDetectionStrategy, HostListener, signal, computed, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, NgIf, NgClass, NgFor, JsonPipe } from '@angular/common';
 import { fieldRegistry, makeErrorId, isAsyncOptions, createOptionsLoader, buildFieldRendererProps, makeFieldId, indexGroupPathMap, applyComputedValues, validateFields, canAddGroupItem, canRemoveGroupItem, createGroupItem, createMessageResolver, validateFieldsAsync, collectFieldPaths } from '@dynamic-field-kit/core';
@@ -209,6 +209,12 @@ class DynamicInput extends BaseInputComponent {
         if (changes['extraProps']) {
             this.applyExtraProps(this.inputInstance);
         }
+        // The props above are assigned to the instance, which Angular does not
+        // see. Checking the host view alone skips an OnPush renderer that is not
+        // marked, and from Angular 22 every renderer that names no strategy is
+        // OnPush: a value the form set itself (a computed field, a reset) never
+        // showed. The renderer's own view is marked first.
+        this.compRef?.injector.get(ChangeDetectorRef).markForCheck();
         this.compRef?.changeDetectorRef?.detectChanges();
     }
     cleanup() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-field-kit/angular",
-  "version": "1.11.0",
+  "version": "1.11.1",
   "description": "Angular renderer for dynamic-field-kit",
   "license": "MIT",
   "private": false,
@@ -27,8 +27,8 @@
     "CHANGELOG.md"
   ],
   "peerDependencies": {
-    "@angular/common": ">=16 <22",
-    "@angular/core": ">=16 <22",
+    "@angular/common": ">=16 <23",
+    "@angular/core": ">=16 <23",
     "@dynamic-field-kit/core": "^1.3.0"
   },
   "publishConfig": {
@@ -44,8 +44,8 @@
     "lint": "eslint ."
   },
   "devDependencies": {
-    "@analogjs/vite-plugin-angular": "^2.7.1",
-    "@analogjs/vitest-angular": "^2.7.1",
+    "@analogjs/vite-plugin-angular": "^2.8.0",
+    "@analogjs/vitest-angular": "^2.8.0",
     "@angular-devkit/build-angular": "^21.2.0",
     "@angular/cdk": "^21.2.14",
     "@angular/common": "^21.2.0",