build: upgrade to angular 20

BREAKING CHANGE: angular 20 or higher is now required to use this package

Author: mattlewis92

README.md

@@ -20,7 +20,7 @@ https://mattlewis92.github.io/angular-resizable-element/
 
 ## About
 
-An angular 15.0+ directive that allows an element to be dragged and resized
+An angular 20.0+ directive that allows an element to be dragged and resized
 
 ## Installation
 
@@ -92,32 +92,11 @@ import { ResizeEvent } from 'angular-resizable-element';
     `,
   ],
   template: `
-    <div
-      class="rectangle"
-      mwlResizable
-      [enableGhostResize]="true"
-      (resizeEnd)="onResizeEnd($event)"
-    >
-      <div
-        class="resize-handle-top"
-        mwlResizeHandle
-        [resizeEdges]="{ top: true }"
-      ></div>
-      <div
-        class="resize-handle-left"
-        mwlResizeHandle
-        [resizeEdges]="{ left: true }"
-      ></div>
-      <div
-        class="resize-handle-right"
-        mwlResizeHandle
-        [resizeEdges]="{ right: true }"
-      ></div>
-      <div
-        class="resize-handle-bottom"
-        mwlResizeHandle
-        [resizeEdges]="{ bottom: true }"
-      ></div>
+    <div class="rectangle" mwlResizable [enableGhostResize]="true" (resizeEnd)="onResizeEnd($event)">
+      <div class="resize-handle-top" mwlResizeHandle [resizeEdges]="{ top: true }"></div>
+      <div class="resize-handle-left" mwlResizeHandle [resizeEdges]="{ left: true }"></div>
+      <div class="resize-handle-right" mwlResizeHandle [resizeEdges]="{ right: true }"></div>
+      <div class="resize-handle-bottom" mwlResizeHandle [resizeEdges]="{ bottom: true }"></div>
     </div>
   `,
 })

angular.json

@@ -18,7 +18,7 @@
       "prefix": "mwl",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:application",
+          "builder": "@angular/build:application",
           "options": {
             "outputPath": {
               "base": "dist/demo"
@@ -71,7 +71,7 @@
           "defaultConfiguration": "production"
         },
         "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
+          "builder": "@angular/build:dev-server",
           "configurations": {
             "production": {
               "buildTarget": "demo:build:production"
@@ -107,7 +107,7 @@
       "prefix": "lib",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "builder": "@angular/build:ng-packagr",
           "options": {
             "project": "projects/angular-resizable-element/ng-package.json"
           },
@@ -122,7 +122,7 @@
           "defaultConfiguration": "production"
         },
         "test": {
-          "builder": "@angular-devkit/build-angular:karma",
+          "builder": "@angular/build:karma",
           "options": {
             "main": "projects/angular-resizable-element/src/test.ts",
             "tsConfig": "projects/angular-resizable-element/tsconfig.spec.json",
@@ -147,6 +147,30 @@
     },
     "@angular-eslint/schematics:library": {
       "setParserOptionsProject": true
+    },
+    "@schematics/angular:component": {
+      "type": "component"
+    },
+    "@schematics/angular:directive": {
+      "type": "directive"
+    },
+    "@schematics/angular:service": {
+      "type": "service"
+    },
+    "@schematics/angular:guard": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:interceptor": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:module": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:pipe": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:resolver": {
+      "typeSeparator": "."
     }
   }
 }

package.json

@@ -1,7 +1,7 @@
 {
   "name": "angular-resizable-element",
   "version": "7.0.2",
-  "description": "An angular 15.0+ directive that allows an element to be dragged and resized",
+  "description": "An angular 20.0+ directive that allows an element to be dragged and resized",
   "scripts": {
     "start": "concurrently --raw \"ng serve --open\" \"pnpm test:watch\"",
     "build:demo": "ng build --configuration production",
@@ -37,48 +37,48 @@
   },
   "homepage": "https://github.com/mattlewis92/angular-resizable-element#readme",
   "devDependencies": {
-    "@angular-devkit/build-angular": "^19.2.15",
-    "@angular-eslint/builder": "19.8.1",
-    "@angular-eslint/eslint-plugin": "19.8.1",
-    "@angular-eslint/eslint-plugin-template": "19.8.1",
-    "@angular-eslint/schematics": "19.8.1",
-    "@angular-eslint/template-parser": "19.8.1",
-    "@angular/animations": "^19.2.14",
-    "@angular/cli": "^19.2.15",
-    "@angular/common": "^19.2.14",
-    "@angular/compiler": "^19.2.14",
-    "@angular/compiler-cli": "^19.2.14",
-    "@angular/core": "^19.2.14",
-    "@angular/forms": "^19.2.14",
-    "@angular/platform-browser": "^19.2.14",
-    "@angular/platform-browser-dynamic": "^19.2.14",
-    "@angular/router": "^19.2.14",
+    "@angular-eslint/builder": "20.2.0",
+    "@angular-eslint/eslint-plugin": "20.2.0",
+    "@angular-eslint/eslint-plugin-template": "20.2.0",
+    "@angular-eslint/schematics": "20.2.0",
+    "@angular-eslint/template-parser": "20.2.0",
+    "@angular/animations": "^20.2.1",
+    "@angular/build": "^20.2.0",
+    "@angular/cli": "^20.2.0",
+    "@angular/common": "^20.2.1",
+    "@angular/compiler": "^20.2.1",
+    "@angular/compiler-cli": "^20.2.1",
+    "@angular/core": "^20.2.1",
+    "@angular/forms": "^20.2.1",
+    "@angular/platform-browser": "^20.2.1",
+    "@angular/platform-browser-dynamic": "^20.2.1",
+    "@angular/router": "^20.2.1",
     "@commitlint/cli": "^17.3.0",
     "@commitlint/config-conventional": "^17.3.0",
     "@commitlint/prompt": "^17.3.0",
     "@compodoc/compodoc": "^1.1.19",
     "@types/chai": "^4.3.4",
     "@types/mocha": "^9.1.1",
-    "@types/node": "^18.11.13",
+    "@types/node": "^24.3.0",
     "@types/sinon": "^10.0.13",
     "@types/sinon-chai": "^3.2.9",
-    "@typescript-eslint/eslint-plugin": "^8.40.0",
-    "@typescript-eslint/parser": "^8.40.0",
+    "@typescript-eslint/eslint-plugin": "^8.33.1",
+    "@typescript-eslint/parser": "^8.33.1",
     "angular-cli-ghpages": "^1.0.5",
     "chai": "^4.3.7",
     "commitizen": "^4.2.6",
     "concurrently": "^7.6.0",
     "copyfiles": "^2.4.1",
-    "eslint": "^8.57.0",
+    "eslint": "^9.28.0",
     "husky": "^8.0.2",
     "karma": "^6.4.1",
     "karma-chrome-launcher": "^3.1.1",
     "karma-coverage": "^2.2.0",
     "karma-mocha": "^2.0.1",
     "mocha": "^10.2.0",
-    "ng-packagr": "^19.2.2",
-    "prettier": "^2.8.1",
-    "pretty-quick": "^3.1.3",
+    "ng-packagr": "^20.2.0",
+    "prettier": "^3.6.2",
+    "pretty-quick": "^4.2.2",
     "rxjs": "^7.6.0",
     "sinon": "^14.0.2",
     "sinon-chai": "^3.7.0",
@@ -89,7 +89,7 @@
     "zone.js": "^0.15.1"
   },
   "peerDependencies": {
-    "@angular/core": ">=19.0.0"
+    "@angular/core": ">=20.0.0"
   },
   "commitlint": {
     "extends": [