chore: update angular 21

.eslintrc.json

@@ -1,8 +1,7 @@
 {
     "root": true,
     "ignorePatterns": ["**/*"],
-    "plugins": ["@nx"],
-    "extends": ["@bynary/eslint-config/angular"],
+    "plugins": ["@nx", "@angular-eslint"],
     "overrides": [
         {
             "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],

.github/workflows/ci.yml

@@ -14,14 +14,14 @@ jobs:
         runs-on: ubuntu-latest
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v6
             - name: Cache node modules
               id: cache
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json', '.nvmrc') }}
-            - uses: actions/setup-node@v3
+            - uses: actions/setup-node@v6
               if: steps.cache.outputs.cache-hit != 'true'
               with:
                   node-version-file: '.nvmrc'
@@ -34,12 +34,12 @@ jobs:
         needs: install-deps
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v6
               with:
                   fetch-depth: 0
             - run: git fetch --no-tags --prune --depth=1 origin develop
             - name: Cache node modules
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json', '.nvmrc') }}
@@ -51,20 +51,20 @@ jobs:
         needs: install-deps
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v6
               with:
                   fetch-depth: 0
             - run: git fetch --no-tags --prune --depth=1 origin develop
             - name: Cache node modules
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json', '.nvmrc') }}
 
             - run: npx nx affected --target=test --parallel=3 --configuration=ci --base=origin/develop --codeCoverage
 
             - name: Upload coverage reports to Codecov
-              uses: codecov/codecov-action@v3
+              uses: codecov/codecov-action@v5
               env:
                   CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
 
@@ -73,20 +73,20 @@ jobs:
         needs: install-deps
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v6
               with:
                   fetch-depth: 0
             - run: git fetch --no-tags --prune --depth=1 origin develop
             - name: Cache node modules
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json', '.nvmrc') }}
 
             - run: npx nx affected:build --parallel=3 --base=origin/develop
 
             - name: Archive production artifacts
-              uses: actions/upload-artifact@v3
+              uses: actions/upload-artifact@v6
               with:
                   name: dist
                   path: dist

.github/workflows/deploy-demo.yml

@@ -25,14 +25,14 @@ jobs:
     install-deps:
         runs-on: ubuntu-latest
         steps:
-            - uses: actions/checkout@v4
+            - uses: actions/checkout@v6
             - name: Cache node modules
               id: cache
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json') }}
-            - uses: actions/setup-node@v4
+            - uses: actions/setup-node@v6
               if: steps.cache.outputs.cache-hit != 'true'
               with:
                   node-version-file: '.nvmrc'
@@ -49,23 +49,23 @@ jobs:
         needs: install-deps
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v6
             - name: Cache node modules
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json') }}
             - name: Setup Pages
-              uses: actions/configure-pages@v3
+              uses: actions/configure-pages@v5
 
             - name: Build Demo
               run: npx nx build demo -c github
 
             - name: Upload artifact
-              uses: actions/upload-pages-artifact@v2
+              uses: actions/upload-pages-artifact@v4
               with:
                   # Upload entire repository
                   path: './dist/apps/demo'
             - name: Deploy to GitHub Pages
               id: deployment
-              uses: actions/deploy-pages@v2
+              uses: actions/deploy-pages@v4

.github/workflows/publish-docs.yml

@@ -17,14 +17,14 @@ jobs:
     install-deps:
         runs-on: ubuntu-latest
         steps:
-            - uses: actions/checkout@v4
+            - uses: actions/checkout@v6
             - name: Cache node modules
               id: cache
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json') }}
-            - uses: actions/setup-node@v4
+            - uses: actions/setup-node@v6
               if: steps.cache.outputs.cache-hit != 'true'
               with:
                   node-version-file: '.nvmrc'
@@ -37,16 +37,16 @@ jobs:
         needs: install-deps
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v6
             - name: Cache node modules
-              uses: actions/cache@v3
+              uses: actions/cache@v5
               with:
                   path: node_modules
                   key: cache-node-modules-${{ hashFiles('package-lock.json') }}
             - name: Build Docs
               run: scripts/build-docs.sh
 
             - name: Upload Docs to Wiki
-              uses: Andrew-Chen-Wang/github-wiki-action@v4
+              uses: Andrew-Chen-Wang/github-wiki-action@v5
               with:
                   path: 'docs'

.github/workflows/publish.yml

@@ -13,10 +13,10 @@ jobs:
 
         steps:
             - name: Checkout code
-              uses: actions/checkout@v4
+              uses: actions/checkout@v6
 
             - name: Use Node.js
-              uses: actions/setup-node@v3
+              uses: actions/setup-node@v6
               with:
                   node-version-file: '.nvmrc'
                   registry-url: 'https://registry.npmjs.org/'

.github/workflows/release-please.yml

@@ -13,8 +13,8 @@ jobs:
     release-please:
         runs-on: ubuntu-latest
         steps:
-            -   uses: google-github-actions/release-please-action@v3
-                with:
-                    command: manifest
-                    token: ${{secrets.GITHUB_TOKEN}}
-                    default-branch: main
+            - uses: google-github-actions/release-please-action@v4
+              with:
+                  command: manifest
+                  token: ${{secrets.GITHUB_TOKEN}}
+                  default-branch: main

.gitignore

@@ -45,3 +45,5 @@ Thumbs.db
 
 .nx/cache
 .nx/workspace-data
+.cursor/rules/nx-rules.mdc
+.github/instructions/nx.instructions.md

.nvmrc

@@ -1 +1 @@
-20
+24

apps/demo/.eslintrc.json

@@ -1,15 +1,9 @@
 {
-    "extends": [
-        "../../.eslintrc.json"
-    ],
-    "ignorePatterns": [
-        "!**/*"
-    ],
+    "extends": ["../../.eslintrc.json"],
+    "ignorePatterns": ["!**/*"],
     "overrides": [
         {
-            "files": [
-                "*.ts"
-            ],
+            "files": ["*.ts"],
             "rules": {
                 "@angular-eslint/directive-selector": [
                     "error",
@@ -26,20 +20,14 @@
                         "prefix": "demo",
                         "style": "kebab-case"
                     }
-                ]
+                ],
+                "@angular-eslint/prefer-standalone": "off"
             },
-            "extends": [
-                "plugin:@nx/angular",
-                "plugin:@angular-eslint/template/process-inline-templates"
-            ]
+            "extends": ["plugin:@nx/angular", "plugin:@angular-eslint/template/process-inline-templates"]
         },
         {
-            "files": [
-                "*.html"
-            ],
-            "extends": [
-                "plugin:@nx/angular-template"
-            ],
+            "files": ["*.html"],
+            "extends": ["plugin:@nx/angular-template"],
             "rules": {}
         }
     ]

apps/demo/project.json

@@ -72,7 +72,8 @@
                     "buildTarget": "demo:build:development"
                 }
             },
-            "defaultConfiguration": "development"
+            "defaultConfiguration": "development",
+            "continuous": true
         },
         "extract-i18n": {
             "executor": "@angular-devkit/build-angular:extract-i18n",
@@ -87,7 +88,8 @@
             "executor": "@nx/jest:jest",
             "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
             "options": {
-                "jestConfig": "apps/demo/jest.config.ts"
+                "jestConfig": "apps/demo/jest.config.ts",
+                "tsConfig": "apps/demo/tsconfig.spec.json"
             }
         },
         "serve-static": {

apps/demo/src/app/app.component.ts

@@ -7,7 +7,6 @@ import { ColorSchemeSwitchComponent } from './components/color-scheme-switch/col
 import { OldButtonComponent } from './components/old-button/old-button.component';
 
 @Component({
-    standalone: true,
     imports: [RouterModule, ButtonComponent, ColorSchemeSwitchComponent, OldButtonComponent],
     selector: 'demo-root',
     templateUrl: './app.component.html',

apps/demo/src/app/components/button/button.component.html

@@ -1,2 +1,4 @@
-<div class="c-button__loading-indicator" *ngIf="loading()"></div>
+@if (loading()) {
+<div class="c-button__loading-indicator"></div>
+}
 <ng-content></ng-content>

apps/demo/src/app/components/button/button.component.ts

@@ -1,4 +1,3 @@
-import { CommonModule } from '@angular/common';
 import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';
 import { bindAttribute, bindBooleanAttribute, useAttribute } from '@bynary/composables/attribute';
 import { bindModifier, bindModifierGroup, provideBaseClass } from '@bynary/composables/class';
@@ -11,8 +10,7 @@ export type ButtonColor = 'red' | 'green' | undefined;
  */
 @Component({
     selector: 'demo-button',
-    standalone: true,
-    imports: [CommonModule],
+    imports: [],
     templateUrl: './button.component.html',
     styleUrls: ['./button.component.scss'],
     encapsulation: ViewEncapsulation.None,

apps/demo/src/app/components/old-button/old-button.component.html

@@ -1,2 +1,4 @@
-<div class="c-button__loading-indicator" *ngIf="loading"></div>
+@if (loading) {
+<div class="c-button__loading-indicator"></div>
+}
 <ng-content></ng-content>

apps/demo/src/app/components/old-button/old-button.component.ts

@@ -1,4 +1,3 @@
-import { CommonModule } from '@angular/common';
 import { Attribute, Component, ElementRef, HostBinding, inject, Input, OnInit, Renderer2 } from '@angular/core';
 
 /**
@@ -8,8 +7,7 @@ import { Attribute, Component, ElementRef, HostBinding, inject, Input, OnInit, R
  */
 @Component({
     selector: 'demo-old-button',
-    standalone: true,
-    imports: [CommonModule],
+    imports: [],
     templateUrl: './old-button.component.html',
     styleUrls: ['../button/button.component.scss'],
     host: {

apps/demo/src/test-setup.ts

@@ -1,7 +1,9 @@
-import 'jest-preset-angular/setup-jest';
+import { setupZoneTestEnv } from 'jest-preset-angular/setup-env/zone';
+
+setupZoneTestEnv();
 import MatchMediaMock from 'jest-matchmedia-mock';
 
-// @ts-ignore https://thymikee.github.io/jest-preset-angular/docs/getting-started/test-environment
+// @ts-expect-error https://thymikee.github.io/jest-preset-angular/docs/getting-started/test-environment
 globalThis.ngJest = {
     testEnvironmentOptions: {
         errorOnUnknownElements: true,

apps/demo/tsconfig.app.json

@@ -2,17 +2,10 @@
     "extends": "./tsconfig.json",
     "compilerOptions": {
         "outDir": "../../dist/out-tsc",
-        "types": []
+        "types": [],
+        "moduleResolution": "bundler"
     },
-    "files": [
-        "src/main.ts"
-    ],
-    "include": [
-        "src/**/*.d.ts"
-    ],
-    "exclude": [
-        "jest.config.ts",
-        "src/**/*.test.ts",
-        "src/**/*.spec.ts"
-    ]
+    "files": ["src/main.ts"],
+    "include": ["src/**/*.d.ts"],
+    "exclude": ["jest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts"]
 }

apps/demo/tsconfig.json

@@ -7,7 +7,10 @@
         "noImplicitOverride": true,
         "noPropertyAccessFromIndexSignature": true,
         "noImplicitReturns": true,
-        "noFallthroughCasesInSwitch": true
+        "noFallthroughCasesInSwitch": true,
+        "module": "preserve",
+        "moduleResolution": "bundler",
+        "lib": ["dom", "es2022"]
     },
     "files": [],
     "include": [],