Update angularmaterial monorepo to v22.1.3

Update npm to v12

package-lock.json

@@ -9,12 +9,12 @@
       "version": "0.14.4",
       "license": "MIT",
       "dependencies": {
-        "@angular/cdk": "22.1.2",
+        "@angular/cdk": "22.1.3",
         "@angular/common": "22.1.2",
         "@angular/compiler": "22.1.2",
         "@angular/core": "22.1.2",
         "@angular/forms": "22.1.2",
-        "@angular/material": "22.1.2",
+        "@angular/material": "22.1.3",
         "@angular/platform-browser": "22.1.2",
         "@angular/router": "22.1.2",
         "ajv": "8.20.0",
@@ -278,9 +278,9 @@
       }
     },
     "node_modules/@angular/cdk": {
-      "version": "22.1.2",
-      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-22.1.2.tgz",
-      "integrity": "sha512-YwTzVnTgZIQDLq3lnnPLINIB24e0SiDn7XxBxHSrOzD/+Y0zLAid5XIiMALXWOqa7rfdhfVh1kEeM93RRLnllQ==",
+      "version": "22.1.3",
+      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-22.1.3.tgz",
+      "integrity": "sha512-6N3S71J877j9zGpCqU0PDIP4AGQf+SjJrA1Pouy+xfC8GE8sfCyIVr0Y6qnpxr5D2k2lROykAMbQekZtKEiEeA==",
       "license": "MIT",
       "dependencies": {
         "parse5": "^8.0.0",
@@ -448,15 +448,15 @@
       }
     },
     "node_modules/@angular/material": {
-      "version": "22.1.2",
-      "resolved": "https://registry.npmjs.org/@angular/material/-/material-22.1.2.tgz",
-      "integrity": "sha512-KX0bVUppfwjDfUepsjpG1CAQGUGHI0l5e0QYpFcskB+1wNRCocBGsIO1br5z6neYu0rzsbhtWocjCeH05gwi7w==",
+      "version": "22.1.3",
+      "resolved": "https://registry.npmjs.org/@angular/material/-/material-22.1.3.tgz",
+      "integrity": "sha512-JNIhfEzJBc3WgOb2lPX4EBc/SE67Q7W0WL6U0nf7ahGwS4sce9yapbZoe3AE7zRCl8oiRbe346SwL0bFyxGHmA==",
       "license": "MIT",
       "dependencies": {
         "tslib": "^2.3.0"
       },
       "peerDependencies": {
-        "@angular/cdk": "22.1.2",
+        "@angular/cdk": "22.1.3",
         "@angular/common": "^22.0.0 || ^23.0.0",
         "@angular/core": "^22.0.0 || ^23.0.0",
         "@angular/forms": "^22.0.0 || ^23.0.0",

package.json

@@ -26,14 +26,14 @@
     "dist"
   ],
   "license": "MIT",
-  "packageManager": "npm@11.19.0",
+  "packageManager": "npm@12.0.2",
   "dependencies": {
-    "@angular/cdk": "22.1.2",
+    "@angular/cdk": "22.1.3",
     "@angular/common": "22.1.2",
     "@angular/compiler": "22.1.2",
     "@angular/core": "22.1.2",
     "@angular/forms": "22.1.2",
-    "@angular/material": "22.1.2",
+    "@angular/material": "22.1.3",
     "@angular/platform-browser": "22.1.2",
     "@angular/router": "22.1.2",
     "ajv": "8.20.0",
@@ -55,7 +55,7 @@
     "postcss": "8.5.26",
     "prettier": "3.9.6",
     "tailwindcss": "4.3.3",
-    "typescript": "7.0.2",
+    "typescript": "6.0.3",
     "vitest": "4.1.11"
   }
 }

src/app/components/route-list/route-list.html

@@ -17,7 +17,7 @@
     (cdkDropListDropped)="drop($event)"
     [cdkDropListData]="routes()"
   >
-    @for (route of routes(); track $index + (route.input || ''); let i = $index) {
+    @for (route of routes(); track route.id; let i = $index) {
       <div class="m-2" cdkDrag>
         <app-route
           [id]="listService.pathToId(`routes/${i}`)"

src/app/components/route/route.html

@@ -81,7 +81,7 @@
             (cdkDropListDropped)="drop($event)"
             [cdkDropListData]="route()?.processors"
           >
-            @for (processor of processors(); track $index + processor.type; let i = $index) {
+            @for (processor of processors(); track processor.id; let i = $index) {
               <div cdkDrag>
                 <app-processor
                   [path]="path() + '/processors/' + i"
@@ -237,7 +237,7 @@
               (cdkDropListDropped)="drop($event)"
               [cdkDropListData]="route()?.processors"
             >
-              @for (processor of processors(); track $index + processor.type; let i = $index) {
+              @for (processor of processors(); track processor.id; let i = $index) {
                 <div cdkDrag>
                   <app-processor
                     [path]="path() + '/processors/' + i"

src/app/models/config.ts

@@ -22,11 +22,13 @@ export type ModuleConfig = {
 };
 
 export type RouteConfig = {
+  id: string;
   input?: string;
   processors?: ProcessorConfig[];
 };
 
 export type ProcessorConfig = {
+  id: string;
   type: string;
   params?: Record<string, any>;
 };

src/app/services/schema.ts

@@ -139,12 +139,16 @@ export class SchemaService {
   }
 
   getSkeletonForRoute(): RouteConfig {
-    const template: RouteConfig = {};
+    const template: RouteConfig = {
+      id: crypto.randomUUID(),
+      processors: [],
+    };
     return template;
   }
 
   getSkeletonForProcessor(processorType: string): ProcessorConfig {
     const template: ProcessorConfig = {
+      id: crypto.randomUUID(),
       type: processorType,
     };
     const itemInfo = this.processorTypes.find((itemInfo) => itemInfo.type === processorType);