FIO-9547: Upgrade to Angular 19.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/angular",
-  "version": "8.1.0-rc.1",
+  "version": "9.0.0-rc.1",
   "scripts": {
     "ng": "ng",
     "build": "ng build angular-formio",
@@ -35,41 +35,41 @@
     "node": ">=6.0.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^18.1.2",
-    "@angular/animations": "^18.1.2",
-    "@angular/cli": "^18.1.2",
-    "@angular/common": "^18.1.2",
-    "@angular/compiler": "^18.1.2",
-    "@angular/compiler-cli": "^18.1.2",
-    "@angular/core": "^18.1.2",
-    "@angular/forms": "^18.1.2",
-    "@angular/platform-browser": "^18.1.2",
-    "@angular/platform-browser-dynamic": "^18.1.2",
-    "@angular/router": "^18.1.2",
-    "@compodoc/compodoc": "^1.1.25",
+    "@angular-devkit/build-angular": "^19.0.6",
+    "@angular/animations": "^19.0.5",
+    "@angular/cli": "^19.0.6",
+    "@angular/common": "^19.0.5",
+    "@angular/compiler": "^19.0.5",
+    "@angular/compiler-cli": "^19.0.5",
+    "@angular/core": "^19.0.5",
+    "@angular/forms": "^19.0.5",
+    "@angular/platform-browser": "^19.0.5",
+    "@angular/platform-browser-dynamic": "^19.0.5",
+    "@angular/router": "^19.0.5",
+    "@compodoc/compodoc": "1.1.25",
     "@formio/deprecated-types": "^0.1.0",
     "@formio/js": "^5.0.0",
-    "@types/jasmine": "^5.1.4",
+    "@types/jasmine": "^5.1.5",
     "@types/jasminewd2": "^2.0.13",
-    "@types/node": "^22.0.0",
+    "@types/node": "^22.10.5",
     "bootstrap": "5.3.3",
     "codelyzer": "^6.0.2",
-    "jasmine-core": "^5.2.0",
+    "jasmine-core": "^5.5.0",
     "jasmine-spec-reporter": "^7.0.0",
-    "karma": "^6.4.3",
+    "karma": "^6.4.4",
     "karma-chrome-launcher": "^3.1.1",
     "karma-coverage-istanbul-reporter": "~3.0.2",
     "karma-jasmine": "^5.1.0",
     "karma-jasmine-html-reporter": "^2.1.0",
-    "ng-packagr": "^18.1.0",
-    "ngx-bootstrap": "^18.0.2",
+    "ng-packagr": "^19.0.1",
+    "ngx-bootstrap": "^19.0.2",
     "protractor": "~7.0.0",
-    "replace-in-file": "^7.2.0",
+    "replace-in-file": "^8.3.0",
     "rxjs": "^7.8.1",
     "ts-node": "^10.9.2",
-    "tslib": "^2.6.3",
+    "tslib": "^2.8.1",
     "tslint": "~6.1.0",
-    "typescript": "~5.5.4",
-    "zone.js": "^0.14.8"
+    "typescript": "~5.6.3",
+    "zone.js": "^0.15.0"
   }
 }

projects/angular-formio/auth/src/auth.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 @Component({
-  templateUrl: './auth.component.html'
+  templateUrl: './auth.component.html',
+  standalone: false
 })
 export class FormioAuthComponent {}

projects/angular-formio/auth/src/login/login.component.ts

@@ -1,7 +1,8 @@
 import { Component } from '@angular/core';
 import { FormioAuthService } from '../auth.service';
 @Component({
-  templateUrl: './login.component.html'
+  templateUrl: './login.component.html',
+  standalone: false
 })
 export class FormioAuthLoginComponent {
   public renderOptions: any = {

projects/angular-formio/auth/src/register/register.component.ts

@@ -1,7 +1,8 @@
 import { Component } from '@angular/core';
 import { FormioAuthService } from '../auth.service';
 @Component({
-  templateUrl: './register.component.html'
+  templateUrl: './register.component.html',
+  standalone: false
 })
 export class FormioAuthRegisterComponent {
   public renderOptions: any = {

projects/angular-formio/auth/src/resetpass/resetpass.component.ts

@@ -1,7 +1,8 @@
 import { Component } from '@angular/core';
 import { FormioAuthService } from '../auth.service';
 @Component({
-  templateUrl: './resetpass.component.html'
+  templateUrl: './resetpass.component.html',
+  standalone: false
 })
 export class FormioResetPassComponent {
   constructor(public service: FormioAuthService) {}

projects/angular-formio/embed/src/builder.component.ts

@@ -4,7 +4,8 @@ import WebformBuilder from '@formio/js/lib/cjs/WebformBuilder';
 
 @Component({
     selector: 'formio-builder',
-    template: '<div #formio></div>'
+    template: '<div #formio></div>',
+    standalone: false
 })
 export class FormioBuilder implements AfterViewInit {
     @ViewChild('formio') element: ElementRef;

projects/angular-formio/embed/src/formio.component.ts

@@ -4,7 +4,8 @@ import { Form, Submission } from '@formio/core/types'
 
 @Component({
     selector: 'formio',
-    template: '<div #formio></div>'
+    template: '<div #formio></div>',
+    standalone: false
 })
 export class FormioComponent implements AfterViewInit {
     @Input() src?: string;

projects/angular-formio/grid/src/GridBodyComponent.ts

@@ -5,7 +5,8 @@ import { GridService } from './grid.service';
 import {FormioPromiseService} from '@formio/angular';
 
 @Component({
-  template: ''
+  template: '',
+  standalone: false
 })
 export class GridBodyComponent {
   @Input() header: GridHeaderComponent;

projects/angular-formio/grid/src/GridFooterComponent.ts

@@ -4,7 +4,8 @@ import { GridHeaderComponent } from './GridHeaderComponent';
 import { GridBodyComponent } from './GridBodyComponent';
 
 @Component({
-  template: ''
+  template: '',
+  standalone: false
 })
 export class GridFooterComponent {
   @Input() header: GridHeaderComponent;

projects/angular-formio/grid/src/GridHeaderComponent.ts

@@ -3,7 +3,8 @@ import {FormioPromiseService} from '@formio/angular';
 import {GridHeader} from './types/grid-header';
 
 @Component({
-  template: ''
+  template: '',
+  standalone: false
 })
 export class GridHeaderComponent {
   @Input() actionAllowed: any;

projects/angular-formio/grid/src/form/FormGridBody.component.ts

@@ -5,7 +5,8 @@ import { Tooltip } from 'bootstrap';
 @Component({
   selector: 'form-grid-body',
   styleUrls: ['./FormGridBody.component.scss'],
-  templateUrl: './FormGridBody.component.html'
+  templateUrl: './FormGridBody.component.html',
+  standalone: false
 })
 export class FormGridBodyComponent extends GridBodyComponent implements OnDestroy {
   @ViewChildren('create') createBtns: ElementRef[];

projects/angular-formio/grid/src/form/FormGridFooter.component.ts

@@ -4,7 +4,8 @@ import { GridFooterComponent } from '../GridFooterComponent';
 @Component({
   templateUrl: './FormGridFooter.component.html',
   styleUrls: ['../grid.footer.scss'],
-  encapsulation: ViewEncapsulation.None
+  encapsulation: ViewEncapsulation.None,
+  standalone: false
 })
 export class FormGridFooterComponent extends GridFooterComponent implements OnInit {
 

projects/angular-formio/grid/src/form/FormGridHeader.component.ts

@@ -4,7 +4,8 @@ import {GridHeader, SortType} from '../types/grid-header';
 
 @Component({
   selector: 'form-grid-header',
-  templateUrl: './FormGridHeader.component.html'
+  templateUrl: './FormGridHeader.component.html',
+  standalone: false
 })
 export class FormGridHeaderComponent extends GridHeaderComponent {
   public header: GridHeader;

projects/angular-formio/grid/src/form/time-since.pipe.ts

@@ -1,7 +1,8 @@
 import { Pipe, PipeTransform } from '@angular/core';
 
 @Pipe({
-  name: 'timeSince'
+  name: 'timeSince',
+  standalone: false
 })
 export class TimeSince implements PipeTransform {
   transform(date: Date): string {

projects/angular-formio/grid/src/grid.component.ts

@@ -27,7 +27,8 @@ import {GridHeader, SortType} from './types/grid-header';
 @Component({
   selector: 'formio-grid',
   styleUrls: ['./grid.component.scss'],
-  templateUrl: './grid.component.html'
+  templateUrl: './grid.component.html',
+  standalone: false
 })
 export class FormioGridComponent implements OnChanges, OnInit, AfterViewInit {
   @Input() footerPosition = GridFooterPositions.bottom;

projects/angular-formio/grid/src/submission/SubmissionGridBody.component.ts

@@ -5,7 +5,8 @@ import {FormioPromiseService} from '@formio/angular';
 import { GridHeader } from '../types/grid-header';
 import {FormioSubmission} from '@formio/angular';
 @Component({
-  templateUrl: './SubmissionGridBody.component.html'
+  templateUrl: './SubmissionGridBody.component.html',
+  standalone: false
 })
 export class SubmissionGridBodyComponent extends GridBodyComponent {
   load(formio: FormioPromiseService, query?: any) {

projects/angular-formio/grid/src/submission/SubmissionGridFooter.component.ts

@@ -4,7 +4,8 @@ import { GridFooterComponent } from '../GridFooterComponent';
 @Component({
   templateUrl: './SubmissionGridFooter.component.html',
   styleUrls: ['../grid.footer.scss'],
-  encapsulation: ViewEncapsulation.None
+  encapsulation: ViewEncapsulation.None,
+  standalone: false
 })
 export class SubmissionGridFooterComponent extends GridFooterComponent implements OnInit {
 

projects/angular-formio/grid/src/submission/SubmissionGridHeader.component.ts

@@ -8,7 +8,8 @@ import {GridColumn} from '../types/grid-column';
 import {GridHeader, SortType} from '../types/grid-header';
 
 @Component({
-  templateUrl: './SubmissionGridHeader.component.html'
+  templateUrl: './SubmissionGridHeader.component.html',
+  standalone: false
 })
 export class SubmissionGridHeaderComponent extends GridHeaderComponent {
 

projects/angular-formio/manager/src/create/create.component.ts

@@ -2,7 +2,8 @@ import { Component, OnInit } from '@angular/core';
 import { FormManagerEditComponent } from '../edit/edit.component';
 
 @Component({
-  templateUrl: '../edit/edit.component.html'
+  templateUrl: '../edit/edit.component.html',
+  standalone: false
 })
 export class FormManagerCreateComponent extends FormManagerEditComponent implements OnInit {
   ngOnInit() {

projects/angular-formio/manager/src/delete/delete.component.ts

@@ -5,7 +5,8 @@ import { FormioAlerts } from '@formio/angular';
 import { GridService } from '@formio/angular/grid';
 
 @Component({
-  templateUrl: './delete.component.html'
+  templateUrl: './delete.component.html',
+  standalone: false
 })
 export class FormManagerDeleteComponent {
   constructor(

projects/angular-formio/manager/src/edit/edit.component.ts

@@ -7,7 +7,8 @@ import { FormBuilderComponent } from '@formio/angular';
 import _ from 'lodash';
 
 @Component({
-  templateUrl: './edit.component.html'
+  templateUrl: './edit.component.html',
+  standalone: false
 })
 export class FormManagerEditComponent implements AfterViewInit {
   @ViewChild(FormBuilderComponent, {static: false}) builder: FormBuilderComponent;

projects/angular-formio/manager/src/form/form.component.ts

@@ -6,7 +6,8 @@ import { FormioAppConfig } from '@formio/angular';
 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
 
 @Component({
-  templateUrl: './form.component.html'
+  templateUrl: './form.component.html',
+  standalone: false
 })
 export class FormManagerFormComponent implements OnInit {
   choice: any = 'isUrl';

projects/angular-formio/manager/src/index/index.component.ts

@@ -7,7 +7,8 @@ import { debounce } from 'lodash';
 
 @Component({
   templateUrl: './index.component.html',
-  styleUrls: ['./index.component.scss']
+  styleUrls: ['./index.component.scss'],
+  standalone: false
 })
 export class FormManagerIndexComponent implements OnInit, AfterViewInit {
   @ViewChild('search') searchElement: ElementRef;

projects/angular-formio/manager/src/submission/delete/delete.component.ts

@@ -4,7 +4,8 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { FormioAlerts } from '@formio/angular';
 
 @Component({
-  templateUrl: './delete.component.html'
+  templateUrl: './delete.component.html',
+  standalone: false
 })
 export class SubmissionDeleteComponent {
   constructor(

projects/angular-formio/manager/src/submission/edit/edit.component.ts

@@ -3,7 +3,8 @@ import { FormManagerService } from '../../form-manager.service';
 import { ActivatedRoute, Router } from '@angular/router';
 
 @Component({
-  templateUrl: './edit.component.html'
+  templateUrl: './edit.component.html',
+  standalone: false
 })
 export class SubmissionEditComponent {
   constructor(

projects/angular-formio/manager/src/submission/index/index.component.ts

@@ -3,7 +3,8 @@ import { Router, ActivatedRoute } from '@angular/router';
 import { FormManagerService } from '../../form-manager.service';
 
 @Component({
-  templateUrl: './index.component.html'
+  templateUrl: './index.component.html',
+  standalone: false
 })
 export class SubmissionIndexComponent {
   constructor(

projects/angular-formio/manager/src/submission/submission/submission.component.ts

@@ -3,7 +3,8 @@ import { FormManagerService } from '../../form-manager.service';
 import { ActivatedRoute } from '@angular/router';
 
 @Component({
-  templateUrl: './submission.component.html'
+  templateUrl: './submission.component.html',
+  standalone: false
 })
 export class SubmissionComponent implements OnInit {
   public downloadUrl: string;

projects/angular-formio/manager/src/submission/view/view.component.ts

@@ -2,7 +2,8 @@ import { Component } from '@angular/core';
 import { FormManagerService } from '../../form-manager.service';
 
 @Component({
-  templateUrl: './view.component.html'
+  templateUrl: './view.component.html',
+  standalone: false
 })
 export class SubmissionViewComponent {
   constructor(public service: FormManagerService) { }

projects/angular-formio/manager/src/view/view.component.ts

@@ -6,7 +6,8 @@ import { FormioAuthService } from '@formio/angular/auth';
 import { Formio } from '@formio/js';
 
 @Component({
-  templateUrl: './view.component.html'
+  templateUrl: './view.component.html',
+  standalone: false
 })
 export class FormManagerViewComponent implements OnInit {
   public submission: any;

projects/angular-formio/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/angular",
-  "version": "8.1.0-rc.1",
+  "version": "9.0.0-rc.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/formio/angular-formio"
@@ -25,13 +25,13 @@
     "node": ">=6.0.0"
   },
   "peerDependencies": {
-    "@angular/core": "^16.0.0 || ^17.0.0 || ^18.0.0",
-    "@angular/common": "^16.0.0 || ^17.0.0 || ^18.0.0",
-    "@angular/elements": "^16.0.0 || ^17.0.0 || ^18.0.0",
+    "@angular/core": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "@angular/common": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "@angular/elements": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "@formio/js": "^5.0.0",
     "zone.js": "~0.13.0 || ~0.14.0",
     "lodash": "^4.17.20",
-    "ngx-bootstrap": "^10.0.0 || ^11.0.0 || ^12.0.0 || ^18.0.0",
+    "ngx-bootstrap": "^10.0.0 || ^11.0.0 || ^12.0.0 || ^18.0.0 || ^19.0.0",
     "tslib": "^2.0.0"
   }
 }

projects/angular-formio/resource/src/create/create.component.ts

@@ -5,7 +5,8 @@ import { FormioResourceConfig } from '../resource.config';
 
 @Component({
   styleUrls: ['./create.component.scss'],
-  templateUrl: './create.component.html'
+  templateUrl: './create.component.html',
+  standalone: false
 })
 export class FormioResourceCreateComponent implements OnInit {
   public onError: EventEmitter<any>;

projects/angular-formio/resource/src/delete/delete.component.ts

@@ -3,7 +3,8 @@ import { Router, ActivatedRoute } from '@angular/router';
 import { FormioResourceService } from '../resource.service';
 
 @Component({
-  templateUrl: './delete.component.html'
+  templateUrl: './delete.component.html',
+  standalone: false
 })
 export class FormioResourceDeleteComponent {
   constructor(