@uppy/angular,meta: upgrade to Angular 17.x and to TS 5.4 (#5008)

e2e/package.json

@@ -54,7 +54,7 @@
     "prompts": "^2.4.2",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
-    "typescript": "~5.1",
+    "typescript": "~5.4",
     "vue": "^3.2.33"
   }
 }

examples/angular-example/README.md

@@ -6,7 +6,9 @@ This project was generated with [Angular CLI](https://github.com/angular/angular
 
 ```
 corepack yarn install
+corepack yarn build:clean
 corepack yarn build
+rm packages/@uppy/*/tsconfig.json
 corepack yarn workspace @uppy/angular prepublishOnly
 corepack yarn workspace @uppy-example/angular start
 ```

examples/angular-example/angular.json

@@ -53,10 +53,10 @@
           "builder": "@angular-devkit/build-angular:dev-server",
           "configurations": {
             "production": {
-              "browserTarget": "angular-example:build:production"
+              "buildTarget": "angular-example:build:production"
             },
             "development": {
-              "browserTarget": "angular-example:build:development"
+              "buildTarget": "angular-example:build:development"
             }
           },
           "defaultConfiguration": "development"
@@ -64,7 +64,7 @@
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "angular-example:build"
+            "buildTarget": "angular-example:build"
           }
         },
         "test": {

examples/angular-example/package.json

@@ -11,14 +11,14 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^16.2.0",
-    "@angular/common": "^16.2.0",
-    "@angular/compiler": "^16.2.0",
-    "@angular/core": "^16.2.0",
-    "@angular/forms": "^16.2.0",
-    "@angular/platform-browser": "^16.2.0",
-    "@angular/platform-browser-dynamic": "^16.2.0",
-    "@angular/router": "^16.2.0",
+    "@angular/animations": "^17.3.0",
+    "@angular/common": "^17.3.0",
+    "@angular/compiler": "^17.3.0",
+    "@angular/core": "^17.3.0",
+    "@angular/forms": "^17.3.0",
+    "@angular/platform-browser": "^17.3.0",
+    "@angular/platform-browser-dynamic": "^17.3.0",
+    "@angular/router": "^17.3.0",
     "@uppy/angular": "workspace:*",
     "@uppy/core": "workspace:*",
     "@uppy/drag-drop": "workspace:*",
@@ -28,27 +28,27 @@
     "@uppy/webcam": "workspace:*",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
-    "zone.js": "~0.13.0"
+    "zone.js": "~0.14.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^16.2.0",
-    "@angular-eslint/builder": "16.1.1",
-    "@angular-eslint/eslint-plugin": "16.1.1",
-    "@angular-eslint/eslint-plugin-template": "16.1.1",
-    "@angular-eslint/schematics": "16.1.1",
-    "@angular-eslint/template-parser": "16.1.1",
-    "@angular/cli": "~16.2.0",
-    "@angular/compiler-cli": "^16.2.0",
-    "@types/jasmine": "~4.3.0",
-    "@typescript-eslint/eslint-plugin": "5.62.0",
-    "@typescript-eslint/parser": "5.62.0",
-    "eslint": "^8.0.0",
-    "jasmine-core": "~4.6.0",
+    "@angular-devkit/build-angular": "^17.3.0",
+    "@angular-eslint/builder": "17.3.0",
+    "@angular-eslint/eslint-plugin": "17.3.0",
+    "@angular-eslint/eslint-plugin-template": "17.3.0",
+    "@angular-eslint/schematics": "17.3.0",
+    "@angular-eslint/template-parser": "17.3.0",
+    "@angular/cli": "~17.3.0",
+    "@angular/compiler-cli": "^17.3.0",
+    "@types/jasmine": "~5.1.0",
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
+    "eslint": "^8.57.0",
+    "jasmine-core": "~5.1.0",
     "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.0",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
-    "typescript": "~5.1"
+    "typescript": "~5.4"
   }
 }

examples/angular-example/src/app/app.component.ts

@@ -65,7 +65,8 @@ export class AppComponent implements OnInit {
     },
   }
 
-  uppy: Uppy = new Uppy({ debug: true, autoProceed: true })
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  uppy: Uppy<any, any> = new Uppy({ debug: true, autoProceed: true })
 
   ngOnInit(): void {
     this.uppy

examples/svelte-example/package.json

@@ -28,7 +28,7 @@
     "svelte-check": "^1.6.0",
     "svelte-preprocess": "^5.0.0",
     "tslib": "^2.0.0",
-    "typescript": "~5.1"
+    "typescript": "~5.4"
   },
   "dependencies": {
     "@uppy/core": "workspace:*",

package.json

@@ -106,7 +106,7 @@
     "stylelint-config-standard": "^34.0.0",
     "stylelint-config-standard-scss": "^10.0.0",
     "tar": "^6.1.0",
-    "typescript": "~5.1",
+    "typescript": "~5.4",
     "vitest": "^1.2.1",
     "vue-template-compiler": "workspace:*"
   },
@@ -119,11 +119,11 @@
     "build:css": "yarn node ./bin/build-css.js",
     "build:svelte": "yarn workspace @uppy/svelte build",
     "build:angular": "yarn workspace angular build",
-    "build:js": "npm-run-all build:lib build:companion build:locale-pack build:svelte build:bundle",
+    "build:js": "npm-run-all build:lib build:companion build:locale-pack build:svelte build:angular build:bundle",
     "build:ts": "yarn workspaces list --no-private --json | yarn node ./bin/build-ts.mjs && yarn workspace @uppy/svelte validate",
     "build:lib": "yarn node ./bin/build-lib.js",
     "build:locale-pack": "yarn workspace @uppy-dev/locale-pack build && eslint packages/@uppy/locales/src/en_US.js --fix && yarn workspace @uppy-dev/locale-pack test unused",
-    "build": "npm-run-all --parallel build:ts build:js build:css --serial size",
+    "build": "npm-run-all --serial build:ts --parallel build:js build:css --serial size",
     "contributors:save": "yarn node ./bin/update-contributors.mjs",
     "dev:with-companion": "npm-run-all --parallel start:companion dev",
     "dev": "yarn workspace @uppy-dev/dev dev",

packages/@uppy/angular/package.json

@@ -10,37 +10,37 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^16.2.0",
-    "@angular/common": "^16.2.0",
-    "@angular/compiler": "^16.2.0",
-    "@angular/core": "^16.2.0",
-    "@angular/forms": "^16.2.0",
-    "@angular/platform-browser": "^16.2.0",
-    "@angular/platform-browser-dynamic": "^16.2.0",
-    "@angular/router": "^16.2.0",
+    "@angular/animations": "^17.3.0",
+    "@angular/common": "^17.3.0",
+    "@angular/compiler": "^17.3.0",
+    "@angular/core": "^17.3.0",
+    "@angular/forms": "^17.3.0",
+    "@angular/platform-browser": "^17.3.0",
+    "@angular/platform-browser-dynamic": "^17.3.0",
+    "@angular/router": "^17.3.0",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
-    "zone.js": "~0.13.0"
+    "zone.js": "~0.14.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^16.2.0",
-    "@angular-eslint/builder": "16.1.1",
-    "@angular-eslint/eslint-plugin": "16.1.1",
-    "@angular-eslint/eslint-plugin-template": "16.1.1",
-    "@angular-eslint/schematics": "16.1.1",
-    "@angular-eslint/template-parser": "16.1.1",
-    "@angular/cli": "~16.2.0",
-    "@angular/compiler-cli": "^16.2.0",
-    "@types/jasmine": "~4.3.0",
-    "@typescript-eslint/eslint-plugin": "5.62.0",
-    "@typescript-eslint/parser": "5.62.0",
-    "jasmine-core": "~4.6.0",
+    "@angular-devkit/build-angular": "^17.3.0",
+    "@angular-eslint/builder": "17.3.0",
+    "@angular-eslint/eslint-plugin": "17.3.0",
+    "@angular-eslint/eslint-plugin-template": "17.3.0",
+    "@angular-eslint/schematics": "17.3.0",
+    "@angular-eslint/template-parser": "17.3.0",
+    "@angular/cli": "~17.3.0",
+    "@angular/compiler-cli": "^17.3.0",
+    "@types/jasmine": "~5.1.0",
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
+    "jasmine-core": "~5.1.0",
     "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.0",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
-    "ng-packagr": "^16.2.0",
-    "typescript": "~5.1"
+    "ng-packagr": "^17.3.0",
+    "typescript": "~5.4"
   }
 }

packages/@uppy/angular/projects/uppy/angular/src/lib/components/dashboard-modal/dashboard-modal-demo.component.ts

@@ -1,8 +1,7 @@
 import { Component, ChangeDetectionStrategy } from '@angular/core';
-// @ts-expect-error
 import * as Dashboard from '@uppy/dashboard';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 
 @Component({
   selector: 'uppy-dashboard-demo',
@@ -12,7 +11,7 @@ import { Uppy } from '@uppy/core';
   ></uppy-dashboard-modal>`,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class DashboardModalDemoComponent {
-  uppy: Uppy = new Uppy({ debug: true, autoProceed: true });
-  props: Dashboard.DashboardOptions;
+export class DashboardModalDemoComponent<M extends Meta, B extends Body> {
+  uppy: Uppy<M, B> = new Uppy({ debug: true, autoProceed: true });
+  props?: Dashboard.DashboardOptions<M, B>;
 }

packages/@uppy/angular/projects/uppy/angular/src/lib/components/dashboard-modal/dashboard-modal.component.ts

@@ -7,25 +7,23 @@ import {
   OnChanges,
   SimpleChanges,
 } from '@angular/core';
-// @ts-expect-error
 import Dashboard from '@uppy/dashboard';
-// @ts-expect-error
 import type { DashboardOptions } from '@uppy/dashboard';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
 import { UppyAngularWrapper } from '../../utils/wrapper';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 
 @Component({
   selector: 'uppy-dashboard-modal',
   template: '',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class DashboardModalComponent
-  extends UppyAngularWrapper<Dashboard>
+export class DashboardModalComponent<M extends Meta, B extends Body>
+  extends UppyAngularWrapper<M, B, DashboardOptions<M, B>, Dashboard<M, B>>
   implements OnDestroy, OnChanges
 {
-  @Input() uppy: Uppy = new Uppy();
-  @Input() props: DashboardOptions = {};
+  @Input() uppy: Uppy<M, B> = new Uppy();
+  @Input() props: DashboardOptions<M, B> = {};
   @Input() open: boolean = false;
 
   constructor(public el: ElementRef) {

packages/@uppy/angular/projects/uppy/angular/src/lib/components/dashboard/dashboard-demo.component.ts

@@ -1,15 +1,14 @@
 import { Component, ChangeDetectionStrategy } from '@angular/core';
-// @ts-expect-error
 import * as Dashboard from '@uppy/dashboard';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 
 @Component({
   selector: 'uppy-dashboard-demo',
   template: `<uppy-dashboard [uppy]="uppy" [props]="props"></uppy-dashboard>`,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class DashboardDemoComponent {
-  uppy: Uppy = new Uppy({ debug: true, autoProceed: true });
-  props: Dashboard.DashboardOptions;
+export class DashboardDemoComponent<M extends Meta, B extends Body> {
+  uppy: Uppy<M, B> = new Uppy({ debug: true, autoProceed: true });
+  props?: Dashboard.DashboardOptions<M, B>;
 }

packages/@uppy/angular/projects/uppy/angular/src/lib/components/dashboard/dashboard.component.ts

@@ -7,25 +7,23 @@ import {
   OnChanges,
   SimpleChanges,
 } from '@angular/core';
-// @ts-expect-error
 import Dashboard from '@uppy/dashboard';
-// @ts-expect-error
 import type { DashboardOptions } from '@uppy/dashboard';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
 import { UppyAngularWrapper } from '../../utils/wrapper';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 
 @Component({
   selector: 'uppy-dashboard',
   template: '',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class DashboardComponent
-  extends UppyAngularWrapper
+export class DashboardComponent<M extends Meta, B extends Body>
+  extends UppyAngularWrapper<M, B, DashboardOptions<M,B>>
   implements OnDestroy, OnChanges
 {
-  @Input() uppy: Uppy = new Uppy();
-  @Input() props: DashboardOptions = {};
+  @Input() uppy: Uppy<M, B> = new Uppy();
+  @Input() props: DashboardOptions<M, B> = {};
 
   constructor(public el: ElementRef) {
     super();

packages/@uppy/angular/projects/uppy/angular/src/lib/components/drag-drop/drag-drop-demo.component.ts

@@ -1,15 +1,14 @@
 import { Component, ChangeDetectionStrategy } from '@angular/core';
-// @ts-expect-error
 import * as DragDrop from '@uppy/drag-drop';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 
 @Component({
   selector: 'uppy-drag-drop-demo',
   template: ` <uppy-drag-drop [uppy]="uppy" [props]="props"></uppy-drag-drop> `,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class DragDropDemoComponent {
-  uppy: Uppy = new Uppy({ debug: true, autoProceed: true });
+export class DragDropDemoComponent<M extends Meta, B extends Body> {
+  uppy: Uppy<M, B> = new Uppy({ debug: true, autoProceed: true });
   props: DragDrop.DragDropOptions = {};
 }

packages/@uppy/angular/projects/uppy/angular/src/lib/components/drag-drop/drag-drop.component.ts

@@ -7,12 +7,10 @@ import {
   SimpleChanges,
   ElementRef,
 } from '@angular/core';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
-// @ts-expect-error
 import DragDrop from '@uppy/drag-drop';
-// @ts-expect-error
 import type { DragDropOptions } from '@uppy/drag-drop';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 import { UppyAngularWrapper } from '../../utils/wrapper';
 
 @Component({
@@ -20,11 +18,11 @@ import { UppyAngularWrapper } from '../../utils/wrapper';
   template: '',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class DragDropComponent
-  extends UppyAngularWrapper
+export class DragDropComponent<M extends Meta, B extends Body>
+  extends UppyAngularWrapper<M, B, DragDropOptions>
   implements OnDestroy, OnChanges
 {
-  @Input() uppy: Uppy = new Uppy();
+  @Input() uppy: Uppy<M, B> = new Uppy();
   @Input() props: DragDropOptions = {};
 
   constructor(public el: ElementRef) {

packages/@uppy/angular/projects/uppy/angular/src/lib/components/progress-bar/progress-bar-demo.component.ts

@@ -4,10 +4,10 @@ import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
 } from '@angular/core';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
-// @ts-expect-error
-import { Tus, ProgressBar } from 'uppy';
+import Tus from '@uppy/tus';
+import type {ProgressBarOptions} from '@uppy/progress-bar';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 
 @Component({
   selector: 'uppy-progress-bar-demo',
@@ -56,12 +56,14 @@ import { Tus, ProgressBar } from 'uppy';
   `,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class ProgressBarDemoComponent implements OnInit {
-  uppyOne: Uppy;
-  uppyTwo: Uppy;
+export class ProgressBarDemoComponent<M extends Meta, B extends Body>
+  implements OnInit
+{
+  uppyOne!: Uppy<M, B>;
+  uppyTwo!: Uppy<M, B>;
   fileListOne: { url: string; fileName: string }[] = [];
   fileListTwo: { url: string; fileName: string }[] = [];
-  props: ProgressBar.ProgressBarOptions = {
+  props: ProgressBarOptions = {
     hideAfterFinish: false,
   };
 
@@ -82,10 +84,10 @@ export class ProgressBarDemoComponent implements OnInit {
     };
 
   ngOnInit(): void {
-    this.uppyOne = new Uppy({ debug: true, autoProceed: true })
+    this.uppyOne = new Uppy<M, B>({ debug: true, autoProceed: true })
       .use(Tus, { endpoint: 'https://master.tus.io/files/' })
       .on('upload-success', this.updateFileList('fileListOne'));
-    this.uppyTwo = new Uppy({ debug: true, autoProceed: false })
+    this.uppyTwo = new Uppy<M, B>({ debug: true, autoProceed: false })
       .use(Tus, { endpoint: 'https://master.tus.io/files/' })
       .on('upload-success', this.updateFileList('fileListTwo'));
   }

packages/@uppy/angular/projects/uppy/angular/src/lib/components/progress-bar/progress-bar.component.ts

@@ -7,12 +7,10 @@ import {
   OnChanges,
   SimpleChanges,
 } from '@angular/core';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
-// @ts-expect-error
 import ProgressBar from '@uppy/progress-bar';
-// @ts-expect-error
 import type { ProgressBarOptions } from '@uppy/progress-bar';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 import { UppyAngularWrapper } from '../../utils/wrapper';
 
 @Component({
@@ -20,11 +18,11 @@ import { UppyAngularWrapper } from '../../utils/wrapper';
   template: '',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class ProgressBarComponent
-  extends UppyAngularWrapper
+export class ProgressBarComponent<M extends Meta, B extends Body>
+  extends UppyAngularWrapper<M, B, ProgressBarOptions>
   implements OnDestroy, OnChanges
 {
-  @Input() uppy: Uppy = new Uppy();
+  @Input() uppy: Uppy<M, B> = new Uppy();
   @Input() props: ProgressBarOptions = {};
 
   constructor(public el: ElementRef) {

packages/@uppy/angular/projects/uppy/angular/src/lib/components/status-bar/status-bar-demo.component.ts

@@ -1,10 +1,10 @@
 import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
-// @ts-expect-error
 import * as StatusBar from '@uppy/status-bar';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
-// @ts-expect-error
-import { FileInput, Tus } from 'uppy';
+import FileInput from '@uppy/file-input';
+import Tus from '@uppy/tus';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
+
 
 @Component({
   selector: 'uppy-status-bar-demo',
@@ -14,8 +14,8 @@ import { FileInput, Tus } from 'uppy';
   `,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class StatusBarDemoComponent implements OnInit {
-  uppy: Uppy = new Uppy({ debug: true, autoProceed: true });
+export class StatusBarDemoComponent<M extends Meta, B extends Body> implements OnInit {
+  uppy: Uppy<M, B> = new Uppy({ debug: true, autoProceed: true });
   props: StatusBar.StatusBarOptions = {
     hideUploadButton: true,
     hideAfterFinish: false,

packages/@uppy/angular/projects/uppy/angular/src/lib/components/status-bar/status-bar.component.ts

@@ -3,17 +3,14 @@ import {
   ChangeDetectionStrategy,
   Input,
   ElementRef,
-  SimpleChange,
   OnDestroy,
   OnChanges,
   SimpleChanges,
 } from '@angular/core';
-// @ts-expect-error
 import { Uppy } from '@uppy/core';
-// @ts-expect-error
 import StatusBar from '@uppy/status-bar';
-// @ts-expect-error
 import type { StatusBarOptions } from '@uppy/status-bar';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 import { UppyAngularWrapper } from '../../utils/wrapper';
 
 @Component({
@@ -21,11 +18,11 @@ import { UppyAngularWrapper } from '../../utils/wrapper';
   template: '',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class StatusBarComponent
-  extends UppyAngularWrapper
+export class StatusBarComponent<M extends Meta, B extends Body>
+  extends UppyAngularWrapper<M, B, StatusBarOptions>
   implements OnDestroy, OnChanges
 {
-  @Input() uppy: Uppy = new Uppy();
+  @Input() uppy: Uppy<M, B> = new Uppy();
   @Input() props: StatusBarOptions = {};
 
   constructor(public el: ElementRef) {

packages/@uppy/angular/projects/uppy/angular/src/lib/utils/wrapper.ts

@@ -1,25 +1,25 @@
-// @ts-expect-error
-import type { Uppy, UIPlugin } from '@uppy/core';
+import type { Uppy, UIPlugin, UIPluginOptions } from '@uppy/core';
 import type { ElementRef, SimpleChanges } from '@angular/core';
-// @ts-expect-error
 import type { DragDropOptions } from '@uppy/drag-drop';
-// @ts-expect-error
 import type { StatusBarOptions } from '@uppy/status-bar';
-// @ts-expect-error
 import type { ProgressBarOptions } from '@uppy/progress-bar';
+import { Body, Meta } from '@uppy/utils/lib/UppyFile';
 
 export abstract class UppyAngularWrapper<
-  PluginType extends UIPlugin = UIPlugin,
+  M extends Meta,
+  B extends Body,
+  Opts extends UIPluginOptions,
+  PluginType extends UIPlugin<Opts, M, B> = UIPlugin<Opts, M, B>,
 > {
   abstract props: DragDropOptions | StatusBarOptions | ProgressBarOptions;
   abstract el: ElementRef;
-  abstract uppy: Uppy;
+  abstract uppy: Uppy<M, B>;
   private options: any;
   plugin: PluginType | undefined;
 
   onMount(
-    defaultOptions: Record<string, unknown>,
-    plugin: new (uppy: Uppy, opts?: Record<string, unknown>) => UIPlugin,
+    defaultOptions: Partial<Opts>,
+    plugin: new (uppy: any, opts?: Opts) => UIPlugin<Opts, M, B>,
   ) {
     this.options = {
       ...defaultOptions,
@@ -47,7 +47,6 @@ export abstract class UppyAngularWrapper<
       this.props !== changes['props'].previousValue &&
       changes['props'].previousValue !== undefined
     ) {
-      // @ts-expect-error
       this.plugin.setOptions({ ...this.options });
     }
   }

packages/@uppy/angular/tsconfig.json

@@ -23,6 +23,7 @@
     "module": "ES2022",
     "useDefineForClassFields": false,
     "lib": ["ES2022", "dom"],
+    "allowSyntheticDefaultImports": true,
   },
   "angularCompilerOptions": {
     "enableI18nLegacyMessageIdFormat": false,

packages/@uppy/companion/package.json

@@ -88,7 +88,7 @@
     "jest": "^29.0.0",
     "nock": "^13.1.3",
     "supertest": "6.2.4",
-    "typescript": "~5.1"
+    "typescript": "~5.4"
   },
   "files": [
     "bin/",