feat: upgrade nx & angular & prettier

.gitignore

@@ -50,3 +50,6 @@ docs/api
 
 
 apps/e2e/screenshots/*.png
+
+vite.config.*.timestamp*
+vitest.config.*.timestamp*

apps/contrast-plugin/src/app/app.component.ts

@@ -16,7 +16,6 @@ import { CommonModule } from '@angular/common';
 import { Shape } from '@penpot/plugin-types';
 
 @Component({
-  standalone: true,
     imports: [CommonModule],
     selector: 'app-root',
     template: `
@@ -115,7 +114,7 @@ import { Shape } from '@penpot/plugin-types';
         '[style.--color1]': 'color1()',
         '[style.--color2]': 'color2()',
     },
-  changeDetection: ChangeDetectionStrategy.OnPush,
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AppComponent {
   #route = inject(ActivatedRoute);

apps/icons-plugin/src/app/app.component.ts

@@ -10,7 +10,6 @@ import { PluginMessageEvent } from '../model';
 
 @Component({
     selector: 'app-root',
-  standalone: true,
     imports: [
         RouterModule,
         SafeHtmlPipe,
@@ -40,7 +39,7 @@ import { PluginMessageEvent } from '../model';
   </div>`,
     host: {
         '[attr.data-theme]': 'theme()',
-  },
+    }
 })
 export class AppComponent {
   public route = inject(ActivatedRoute);

apps/icons-plugin/src/app/components/icon-button/icon-button.component.ts

@@ -4,7 +4,6 @@ import { FeatherIcon } from 'feather-icons';
 
 @Component({
     selector: 'app-icon-button',
-  standalone: true,
     imports: [SafeHtmlPipe],
     styleUrl: './icon-button.component.css',
     template: `<button
@@ -26,7 +25,7 @@ import { FeatherIcon } from 'feather-icons';
       stroke-linejoin="round"
       [innerHtml]="icon().contents | safeHtml"
     ></svg>
-  </button>`,
+  </button>`
 })
 export class IconButtonComponent {
   public icon = input.required<FeatherIcon>();

apps/icons-plugin/src/app/components/icon-search/icon-search.component.ts

@@ -3,7 +3,6 @@ import { icons } from 'feather-icons';
 
 @Component({
     selector: 'app-icon-search',
-  standalone: true,
     imports: [],
     styleUrl: './icon-search.component.css',
     template: `
@@ -13,7 +12,7 @@ import { icons } from 'feather-icons';
       placeholder="Search an icon"
       (input)="onSearchIcons($event)"
     />
-  `,
+  `
 })
 export class IconSearchComponent {
   public searchIcons = output<string>();

apps/lorem-ipsum-plugin/src/app/app.component.ts

@@ -10,7 +10,6 @@ import type {
 import { filter, fromEvent, map, merge, take } from 'rxjs';
 
 @Component({
-  standalone: true,
     imports: [ReactiveFormsModule],
     selector: 'app-root',
     template: `
@@ -65,7 +64,7 @@ import { filter, fromEvent, map, merge, take } from 'rxjs';
     styleUrl: './app.component.css',
     host: {
         '[attr.data-theme]': 'theme()',
-  },
+    }
 })
 export class AppComponent {
   route = inject(ActivatedRoute);

apps/poc-state-plugin/src/app/app.component.ts

@@ -3,7 +3,6 @@ import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 import type { Shape } from '@penpot/plugin-types';
 
 @Component({
-  standalone: true,
     selector: 'app-root',
     imports: [ReactiveFormsModule],
     template: `
@@ -129,7 +128,7 @@ import type { Shape } from '@penpot/plugin-types';
       </p>
     </div>
   `,
-  styleUrl: './app.component.css',
+    styleUrl: './app.component.css'
 })
 export class AppComponent {
   #pageId: null | string = null;

apps/rename-layers-plugin/src/app/app.component.ts

@@ -12,14 +12,13 @@ import { FormsModule } from '@angular/forms';
 import { Shape } from '@penpot/plugin-types';
 
 @Component({
-  standalone: true,
     imports: [RouterModule, CommonModule, FormsModule],
     selector: 'app-root',
     templateUrl: './app.component.html',
     styleUrl: './app.component.css',
     host: {
         '[attr.data-theme]': 'theme()',
-  },
+    }
 })
 export class AppComponent {
   @ViewChild('searchElement') public searchElement!: ElementRef;

apps/table-plugin/src/app/app.component.ts

@@ -12,14 +12,13 @@ import { filter, fromEvent, map, merge, take } from 'rxjs';
 import { FormBuilder, ReactiveFormsModule, FormGroup } from '@angular/forms';
 
 @Component({
-  standalone: true,
     imports: [RouterModule, CommonModule, ReactiveFormsModule],
     selector: 'app-root',
     templateUrl: './app.component.html',
     styleUrl: './app.component.css',
     host: {
         '[attr.data-theme]': 'theme()',
-  },
+    }
 })
 export class AppComponent {
   private readonly fb = inject(FormBuilder);

nx.json

@@ -77,5 +77,6 @@
       "unitTestRunner": "none",
       "projectNameAndRootFormat": "as-provided"
     }
-  }
+  },
+  "useLegacyCache": true
 }

package.json

@@ -20,7 +20,7 @@
     "build:styles-example": "npx nx run example-styles:build",
     "lint": "nx run-many --all --target=lint --parallel",
     "lint:affected": "npx nx affected --target=lint",
-    "test": "nx run-many -t test --parallel -p plugins-runtime lorem-ipsum-plugin",
+    "test": "nx run-many -t test --parallel -p plugins-runtime lorem-ipsum-plugin colors-to-tokens-plugin",
     "test:e2e": "npx nx test e2e",
     "registry": "nx local-registry",
     "prepare": "husky",
@@ -29,27 +29,27 @@
   },
   "private": true,
   "devDependencies": {
-    "@angular-devkit/build-angular": "18.1.3",
-    "@angular-devkit/core": "18.1.3",
-    "@angular-devkit/schematics": "18.1.3",
-    "@angular-eslint/eslint-plugin": "18.2.0",
-    "@angular-eslint/eslint-plugin-template": "18.2.0",
-    "@angular-eslint/template-parser": "18.2.0",
-    "@angular/cli": "~18.1.0",
-    "@angular/compiler-cli": "18.1.3",
-    "@angular/language-service": "18.1.3",
+    "@angular-devkit/build-angular": "19.1.4",
+    "@angular-devkit/core": "19.1.4",
+    "@angular-devkit/schematics": "19.0.7",
+    "@angular-eslint/eslint-plugin": "19.0.2",
+    "@angular-eslint/eslint-plugin-template": "19.0.2",
+    "@angular-eslint/template-parser": "19.0.2",
+    "@angular/cli": "~19.0.0",
+    "@angular/compiler-cli": "19.1.3",
+    "@angular/language-service": "19.1.3",
     "@commitlint/cli": "^18.6.0",
     "@commitlint/config-conventional": "^18.6.0",
     "@eslint/eslintrc": "^2.1.1",
-    "@nx/angular": "19.5.6",
-    "@nx/esbuild": "19.5.6",
-    "@nx/eslint": "19.5.6",
-    "@nx/eslint-plugin": "19.5.6",
-    "@nx/js": "19.5.6",
-    "@nx/node": "19.5.6",
-    "@nx/vite": "19.5.6",
-    "@nx/web": "19.5.6",
-    "@schematics/angular": "18.1.3",
+    "@nx/angular": "20.3.2",
+    "@nx/esbuild": "20.3.2",
+    "@nx/eslint": "20.3.2",
+    "@nx/eslint-plugin": "20.3.2",
+    "@nx/js": "20.3.2",
+    "@nx/node": "20.3.2",
+    "@nx/vite": "20.3.2",
+    "@nx/web": "20.3.2",
+    "@schematics/angular": "19.0.7",
     "@swc-node/register": "1.9.2",
     "@swc/core": "1.5.7",
     "@swc/helpers": "0.5.12",
@@ -72,12 +72,12 @@
     "husky": "^9.0.10",
     "jsdom": "~22.1.0",
     "jsonc-eslint-parser": "^2.1.0",
-    "nx": "19.5.6",
-    "prettier": "^2.6.2",
+    "nx": "20.3.2",
+    "prettier": "^3.4.2",
     "swc-loader": "0.1.15",
     "tsx": "^4.16.2",
     "typedoc": "^0.26.5",
-    "typescript": "5.5.4",
+    "typescript": "5.6.3",
     "vite": "^5.0.0",
     "vite-plugin-checker": "^0.6.4",
     "vite-plugin-dts": "~2.3.0",
@@ -87,14 +87,14 @@
     "packages/*"
   ],
   "dependencies": {
-    "@angular/animations": "18.1.3",
-    "@angular/common": "18.1.3",
-    "@angular/compiler": "18.1.3",
-    "@angular/core": "18.1.3",
-    "@angular/forms": "18.1.3",
-    "@angular/platform-browser": "18.1.3",
-    "@angular/platform-browser-dynamic": "18.1.3",
-    "@angular/router": "18.1.3",
+    "@angular/animations": "19.1.3",
+    "@angular/common": "19.1.3",
+    "@angular/compiler": "19.1.3",
+    "@angular/core": "19.1.3",
+    "@angular/forms": "19.1.3",
+    "@angular/platform-browser": "19.1.3",
+    "@angular/platform-browser-dynamic": "19.1.3",
+    "@angular/router": "19.1.3",
     "axios": "^1.6.0",
     "feather-icons": "^4.29.2",
     "puppeteer": "^22.11.0",
@@ -103,7 +103,7 @@
     "tslib": "^2.3.0",
     "uuid": "^9.0.1",
     "zod": "^3.22.4",
-    "zone.js": "~0.14.3"
+    "zone.js": "0.15.0"
   },
   "nx": {
     "includedScripts": []