Angular 13 upgrade

2025-09-17 14:21:29 +00:00 · 2022-03-01 15:45:25 +00:00
parent 20be6f3af7
commit 548e5c4fae
53 changed files with 1914 additions and 3454 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
+/.angular/cache
 *.log
 node_modules
 bundles
--- a/angular.json
+++ b/angular.json
@@ -388,18 +388,6 @@
            "protractorConfig": "./e2e/protractor.conf.js",
            "devServerTarget": "lib-e2e-test:serve"
          }
-        },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": [
-              "./e2e/tsconfig.e2e.json"
-            ],
-            "exclude": [
-              "**/lib/**/*",
-              "**/node_modules/**/*"
-            ]
-          }
        }
      }
    },
--- a/demo-shell/src/custom-style-dev.scss
+++ b/demo-shell/src/custom-style-dev.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../../lib/core/styles/index';
@include mat.core($alfresco-typography);

--- a/demo-shell/src/custom-style.scss
+++ b/demo-shell/src/custom-style.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '~@alfresco/adf-core/theming';
@include mat.core($alfresco-typography);

--- a/demo-shell/src/polyfills.ts
+++ b/demo-shell/src/polyfills.ts
@@ -35,9 +35,6 @@
 * BROWSER POLYFILLS
 */

-/** IE10 and IE11 requires the following for NgClass support on SVG elements */
-// import 'classlist.js';  // Run `npm install --save classlist.js`.
-
 /***************************************************************************************************
 * Zone JS is required by Angular itself.
 */
--- a/demo-shell/src/test.ts
+++ b/demo-shell/src/test.ts
@@ -29,7 +29,9 @@ declare const require: any;
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
    BrowserDynamicTestingModule,
-    platformBrowserDynamicTesting()
+    platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
 );
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);
--- a/lib/cli/tsconfig.lib.prod.json
+++ b/lib/cli/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/lib/content-services/ng-package.json
+++ b/lib/content-services/ng-package.json
@@ -8,22 +8,6 @@
  ],
  "lib": {
    "entryFile": "src/public-api.ts",
-    "flatModuleFile": "adf-content-services",
-    "umdModuleIds": {
-      "@alfresco/js-api": "@alfresco/js-api",
-      "@angular/platform-browser/animations": "@angular/platform-browser/animations",
-      "@angular/material": "@angular/material",
-      "@mat-datetimepicker/core": "@mat-datetimepicker/core",
-      "@mat-datetimepicker/moment": "@mat-datetimepicker/moment",
-      "@angular/flex-layout": "@angular/flex-layout",
-      "@alfresco/adf-core": "@alfresco/adf-core",
-      "@angular/animations": "@angular/animations",
-      "@angular/cdk/platform": "@angular/cdk/platform",
-      "@angular/material/core": "@angular/material/core",
-      "moment": "moment",
-      "moment-es6": "moment-es6",
-      "moment/src/moment": "moment/src/moment",
-      "@ngx-translate/core": "@ngx-translate/core"
-    }
+    "flatModuleFile": "adf-content-services"
  }
 }
--- a/lib/content-services/src/lib/search/components/search-control.component.scss
+++ b/lib/content-services/src/lib/search/components/search-control.component.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;

 $mat-menu-overlay-min-width: 112px !default;   // 56 * 2
 $mat-menu-overlay-max-width: 280px !default;   // 56 * 5
--- a/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.scss
+++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;

 .adf-search-filter-chip {
    &.mat-chip {
--- a/lib/content-services/src/lib/search/components/search-form/search-form.component.scss
+++ b/lib/content-services/src/lib/search/components/search-form/search-form.component.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;

 .adf-search-form {
    &.mat-button {
--- a/lib/content-services/src/test.ts
+++ b/lib/content-services/src/test.ts
@@ -28,7 +28,9 @@ declare const require: any;
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
    BrowserDynamicTestingModule,
-    platformBrowserDynamicTesting()
+    platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
 );

 declare const pdfjsLib: any;
--- a/lib/content-services/tsconfig.lib.prod.json
+++ b/lib/content-services/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html
+++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html
@@ -21,9 +21,9 @@
                   [attr.data-automation-id]="'card-textitem-value-' + property.key">
            <textarea matInput
                      *ngIf="property.multiline"
-                      [matTextareaAutosize]="true"
-                      [matAutosizeMaxRows]="1"
-                      [matAutosizeMaxRows]="5"
+                      [cdkTextareaAutosize]="true"
+                      [cdkAutosizeMaxRows]="1"
+                      [cdkAutosizeMaxRows]="5"
                      class="adf-property-value"
                      [placeholder]="property.default"
                      [formControl]="textInput"
--- a/lib/core/context-menu/context-menu-overlay.service.ts
+++ b/lib/core/context-menu/context-menu-overlay.service.ts
@@ -102,26 +102,33 @@ export class ContextMenuOverlayService {
        };

        const positionStrategy = this.overlay.position()
-            .connectedTo(
-                new ElementRef(fakeElement),
-                { originX: 'start', originY: 'bottom' },
-                { overlayX: 'start', overlayY: 'top' })
-            .withFallbackPosition(
-                { originX: 'start', originY: 'top' },
-                { overlayX: 'start', overlayY: 'bottom' })
-            .withFallbackPosition(
-                { originX: 'end', originY: 'top' },
-                { overlayX: 'start', overlayY: 'top' })
-            .withFallbackPosition(
-                { originX: 'start', originY: 'top' },
-                { overlayX: 'end', overlayY: 'top' })
-            .withFallbackPosition(
-                { originX: 'end', originY: 'center' },
-                { overlayX: 'start', overlayY: 'center' })
-            .withFallbackPosition(
-                { originX: 'start', originY: 'center' },
-                { overlayX: 'end', overlayY: 'center' }
-            );
+            .flexibleConnectedTo(new ElementRef(fakeElement))
+            .withPositions([
+                {
+                    originX: 'start', originY: 'bottom' ,
+                    overlayX: 'start', overlayY: 'top'
+                },
+                {
+                    originX: 'start', originY: 'top',
+                    overlayX: 'start', overlayY: 'bottom'
+                },
+                {
+                    originX: 'end', originY: 'top',
+                    overlayX: 'start', overlayY: 'top'
+                },
+                {
+                    originX: 'start', originY: 'top',
+                    overlayX: 'end', overlayY: 'top'
+                },
+                {
+                    originX: 'end', originY: 'center',
+                    overlayX: 'start', overlayY: 'center'
+                },
+                {
+                    originX: 'start', originY: 'center',
+                    overlayX: 'end', overlayY: 'center'
+                }
+            ]);

        const overlayConfig = new OverlayConfig({
            hasBackdrop: config.hasBackdrop,
--- a/lib/core/datatable/components/datatable/datatable.component.scss
+++ b/lib/core/datatable/components/datatable/datatable.component.scss
@@ -1,5 +1,5 @@
 /* stylelint-disable no-descending-specificity */
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../../../styles/mixins';

 $data-table-header-font-size: var(--theme-caption-font-size) !default;
--- a/lib/core/directives/tooltip-card/tooltip-card.component.scss
+++ b/lib/core/directives/tooltip-card/tooltip-card.component.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;

 :host {
    display: block;
--- a/lib/core/form/components/widgets/multiline-text/multiline-text.widget.html
+++ b/lib/core/form/components/widgets/multiline-text/multiline-text.widget.html
@@ -3,7 +3,7 @@
    <mat-form-field floatPlaceholder="never" [hideRequiredMarker]="true">
        <label class="adf-label" [attr.for]="field.id">{{field.name | translate }}<span *ngIf="isRequired()">*</span></label>
        <textarea matInput class="adf-input"
-                  [matTextareaAutosize]="true"
+                  [cdkTextareaAutosize]="true"
                  type="text"
                  rows="3"
                  [id]="field.id"
--- a/lib/core/layout/components/sidebar-action/sidebar-action-menu.component.scss
+++ b/lib/core/layout/components/sidebar-action/sidebar-action-menu.component.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;

 .adf {
    &-sidebar-action-menu {
--- a/lib/core/layout/components/sidenav-layout/sidenav-layout.component.scss
+++ b/lib/core/layout/components/sidenav-layout/sidenav-layout.component.scss
@@ -1,4 +1,4 @@
-@import '~@angular/flex-layout/mq';
+@import '@angular/flex-layout/mq';
@import '../../../styles/mixins';

 .adf-sidenav-layout {
--- a/lib/core/ng-package.json
+++ b/lib/core/ng-package.json
@@ -11,18 +11,6 @@
  ],
  "lib": {
    "entryFile": "./public-api.ts",
-    "flatModuleFile": "adf-core",
-    "umdModuleIds": {
-      "@alfresco/js-api": "@alfresco/js-api",
-      "@alfresco/adf-extensions": "@alfresco/adf-extensions",
-      "minimatch": "minimatch-browser",
-      "@mat-datetimepicker/core": "@mat-datetimepicker/core",
-      "@mat-datetimepicker/moment": "@mat-datetimepicker/moment",
-      "moment": "moment",
-      "moment-es6": "moment-es6",
-      "moment/src/moment": "moment/src/moment",
-      "@ngx-translate/core": "@ngx-translate/core",
-      "cropperjs": "cropperjs"
-    }
+    "flatModuleFile": "adf-core"
  }
 }
--- a/lib/core/pagination/pagination.component.scss
+++ b/lib/core/pagination/pagination.component.scss
@@ -1,4 +1,4 @@
-@import '~@angular/flex-layout/mq';
+@import '@angular/flex-layout/mq';

 $adf-pagination-height: 48px !default;
 $adf-pagination-icon-button-size: 32px !default;
--- a/lib/core/styles/_index.scss
+++ b/lib/core/styles/_index.scss
@@ -1,5 +1,5 @@
 /* stylelint-disable value-keyword-case */
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
 /* stylelint-disable value-list-max-empty-lines */
 /* stylelint-disable scss/no-global-function-names */
 /* stylelint-disable scss/at-import-partial-extension */
--- a/lib/core/styles/_theming.scss
+++ b/lib/core/styles/_theming.scss
@@ -1,4 +1,4 @@
-@import '~@angular/flex-layout/mq';
+@import '@angular/flex-layout/mq';
@import './colors';
@import './mixins';
@import './typography';
--- a/lib/core/styles/_typography.scss
+++ b/lib/core/styles/_typography.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;

 $alfresco-typography: mat.define-typography-config(
    $font-family: 'Muli, Roboto, "Helvetica Neue", sans-serif',
--- a/lib/core/styles/prebuilt/adf-blue-orange.scss
+++ b/lib/core/styles/prebuilt/adf-blue-orange.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-blue-purple.scss
+++ b/lib/core/styles/prebuilt/adf-blue-purple.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-cyan-orange.scss
+++ b/lib/core/styles/prebuilt/adf-cyan-orange.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-cyan-purple.scss
+++ b/lib/core/styles/prebuilt/adf-cyan-purple.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-green-orange.scss
+++ b/lib/core/styles/prebuilt/adf-green-orange.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-green-purple.scss
+++ b/lib/core/styles/prebuilt/adf-green-purple.scss
@@ -1,4 +1,4 @@
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-indigo-pink.scss
+++ b/lib/core/styles/prebuilt/adf-indigo-pink.scss
@@ -1,5 +1,5 @@
 /* stylelint-disable value-keyword-case */
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-pink-bluegrey.scss
+++ b/lib/core/styles/prebuilt/adf-pink-bluegrey.scss
@@ -1,5 +1,5 @@
 /* stylelint-disable value-keyword-case */
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/styles/prebuilt/adf-purple-green.scss
+++ b/lib/core/styles/prebuilt/adf-purple-green.scss
@@ -1,5 +1,5 @@
 /* stylelint-disable value-keyword-case */
-@use '~@angular/material' as mat;
+@use '@angular/material' as mat;
@import '../theming';
@import './all-theme';
@include mat.core($alfresco-typography);
--- a/lib/core/test.ts
+++ b/lib/core/test.ts
@@ -28,7 +28,9 @@ declare const require: any;
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
    BrowserDynamicTestingModule,
-    platformBrowserDynamicTesting()
+    platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
 );

 // Then we find all the tests.
--- a/lib/core/tsconfig.lib.prod.json
+++ b/lib/core/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/lib/extensions/ng-package.json
+++ b/lib/extensions/ng-package.json
@@ -4,9 +4,6 @@
  "deleteDestPath": false,
  "lib": {
    "entryFile": "src/public-api.ts",
-    "flatModuleFile": "adf-extensions",
-    "umdModuleIds": {
-      "@alfresco/js-api": "@alfresco/js-api"
-    }
+    "flatModuleFile": "adf-extensions"
  }
 }
--- a/lib/extensions/src/test.ts
+++ b/lib/extensions/src/test.ts
@@ -30,7 +30,9 @@ declare const require: any;
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
+  platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
 );
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);
--- a/lib/extensions/tsconfig.lib.prod.json
+++ b/lib/extensions/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/lib/insights/ng-package.json
+++ b/lib/insights/ng-package.json
@@ -8,14 +8,6 @@
  ],
  "lib": {
    "entryFile": "src/public-api.ts",
-    "flatModuleFile": "adf-insights",
-    "umdModuleIds": {
-      "@alfresco/adf-core": "@alfresco/adf-core",
-      "ng2-charts": "ng2-charts",
-      "raphael": "raphael",
-      "moment": "moment",
-      "moment-es6": "moment-es6",
-      "@ngx-translate/core": "@ngx-translate/core"
-    }
+    "flatModuleFile": "adf-insights"
  }
 }
--- a/lib/insights/src/test.ts
+++ b/lib/insights/src/test.ts
@@ -30,7 +30,9 @@ declare const require: any;
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
    BrowserDynamicTestingModule,
-    platformBrowserDynamicTesting()
+    platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
 );

 // Then we find all the tests.
--- a/lib/insights/tsconfig.lib.prod.json
+++ b/lib/insights/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/lib/process-services-cloud/ng-package.json
+++ b/lib/process-services-cloud/ng-package.json
@@ -8,22 +8,7 @@
  ],
  "lib": {
    "entryFile": "src/public-api.ts",
-    "flatModuleFile": "adf-process-services-cloud",
-    "umdModuleIds": {
-      "@alfresco/js-api": "@alfresco/js-api",
-      "minimatch": "minimatch",
-      "@alfresco/adf-core": "@alfresco/adf-core",
-      "@alfresco/adf-content-services": "@alfresco/adf-content-services",
-      "moment": "moment",
-      "moment-es6": "moment-es6",
-      "@ngx-translate/core": "@ngx-translate/core",
-      "@apollo/client/core": "@apollo/client/core",
-      "@apollo/client/link/ws": "@apollo/client/link/ws",
-      "@apollo/client/link/error": "@apollo/client/link/error",
-      "@apollo/client/utilities": "@apollo/client/utilities",
-      "apollo-angular": "apollo-angular",
-      "apollo-angular/http": "apollo-angular/http"
-    }
+    "flatModuleFile": "adf-process-services-cloud"
  },
  "allowedNonPeerDependencies": [
    "@apollo/client",
--- a/lib/process-services-cloud/src/test.ts
+++ b/lib/process-services-cloud/src/test.ts
@@ -30,7 +30,9 @@ declare const require: any;
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
+  platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
 );
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);
--- a/lib/process-services-cloud/tsconfig.lib.prod.json
+++ b/lib/process-services-cloud/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/lib/process-services/ng-package.json
+++ b/lib/process-services/ng-package.json
@@ -8,15 +8,6 @@
  ],
  "lib": {
    "entryFile": "src/public-api.ts",
-    "flatModuleFile": "adf-process-services",
-    "umdModuleIds": {
-      "@alfresco/js-api": "@alfresco/js-api",
-      "minimatch": "minimatch",
-      "@alfresco/adf-core": "@alfresco/adf-core",
-      "@alfresco/adf-content-services": "@alfresco/adf-content-services",
-      "moment": "moment",
-      "moment-es6": "moment-es6",
-      "@ngx-translate/core": "@ngx-translate/core"
-    }
+    "flatModuleFile": "adf-process-services"
  }
 }
--- a/lib/process-services/src/test.ts
+++ b/lib/process-services/src/test.ts
@@ -28,7 +28,9 @@ declare const require: any;
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
    BrowserDynamicTestingModule,
-    platformBrowserDynamicTesting()
+    platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
 );

 // Then we find all the tests.
--- a/lib/process-services/tsconfig.lib.prod.json
+++ b/lib/process-services/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/lib/testing/ng-package.json
+++ b/lib/testing/ng-package.json
@@ -3,15 +3,6 @@
  "dest": "../dist/testing",
  "lib": {
    "entryFile": "src/public-api.ts",
-    "flatModuleFile": "adf-testing",
-    "umdModuleIds": {
-      "@alfresco/js-api": "@alfresco/js-api",
-      "moment-es6": "moment-es6",
-      "protractor": "protractor",
-      "selenium-webdriver": "selenium-webdriver",
-      "fs": "fs",
-      "path": "path",
-      "protractor/built/util": "protractor/built/util"
-    }
+    "flatModuleFile": "adf-testing"
  }
 }
--- a/lib/testing/shared/package.json
+++ b/lib/testing/shared/package.json
@@ -2,10 +2,7 @@
  "ngPackage": {
    "lib": {
      "entryFile": "../src/lib/shared/index.ts",
-      "flatModuleFile": "adf-testing-shared",
-      "umdModuleIds": {
-        "@alfresco/js-api": "@alfresco/js-api"
-      }
+      "flatModuleFile": "adf-testing-shared"
    }
  }
 }
--- a/lib/testing/tsconfig.lib.prod.json
+++ b/lib/testing/tsconfig.lib.prod.json
@@ -4,6 +4,6 @@
    "declarationMap": false
  },
  "angularCompilerOptions": {
-    "enableIvy": false
+    "compilationMode": "partial"
  }
 }
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -69,18 +69,18 @@
  ],
  "dependencies": {
    "@alfresco/js-api": "4.8.0",
-    "@angular/animations": "^12.2.16",
-    "@angular/cdk": "12.2.13",
-    "@angular/common": "^12.2.16",
-    "@angular/compiler": "^12.2.16",
-    "@angular/core": "^12.2.16",
-    "@angular/flex-layout": "^12.0.0-beta.35",
-    "@angular/forms": "^12.2.16",
-    "@angular/material": "^12.2.13",
-    "@angular/material-moment-adapter": "^12.2.13",
-    "@angular/platform-browser": "^12.2.16",
-    "@angular/platform-browser-dynamic": "^12.2.16",
-    "@angular/router": "^12.2.16",
+    "@angular/animations": "^13.2.4",
+    "@angular/cdk": "13.2.4",
+    "@angular/common": "^13.2.4",
+    "@angular/compiler": "^13.2.4",
+    "@angular/core": "^13.2.4",
+    "@angular/flex-layout": "^13.0.0-beta.38",
+    "@angular/forms": "^13.2.4",
+    "@angular/material": "^13.2.4",
+    "@angular/material-moment-adapter": "^13.2.4",
+    "@angular/platform-browser": "^13.2.4",
+    "@angular/platform-browser-dynamic": "^13.2.4",
+    "@angular/router": "^13.2.4",
    "@apollo/client": "^3.5.6",
    "@mat-datetimepicker/core": "^5.1.1",
    "@mat-datetimepicker/moment": "^5.1.1",
@@ -88,7 +88,6 @@
    "adf-tslint-rules": "0.0.7",
    "apollo-angular": "^2.6.0",
    "chart.js": "2.9.4",
-    "classlist.js": "1.1.20150312",
    "cropperjs": "1.5.12",
    "custom-event-polyfill": "^1.0.7",
    "dotenv-expand": "^5.1.0",
@@ -105,7 +104,7 @@
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
-    "@angular-devkit/build-angular": "^12.2.16",
+    "@angular-devkit/build-angular": "^13.2.5",
    "@angular-devkit/core": "^13.2.5",
    "@angular-devkit/schematics": "^13.2.5",
    "@angular-eslint/builder": "1.2.0",
@@ -113,8 +112,8 @@
    "@angular-eslint/eslint-plugin-template": "1.2.0",
    "@angular-eslint/schematics": "1.2.0",
    "@angular-eslint/template-parser": "1.2.0",
-    "@angular/cli": "^12.2.16",
-    "@angular/compiler-cli": "^12.2.16",
+    "@angular/cli": "^13.2.5",
+    "@angular/compiler-cli": "^13.2.4",
    "@nrwl/schematics": "8.12.11",
    "@nrwl/storybook": "^13.8.3",
    "@nrwl/workspace": "^13.8.3",
@@ -166,7 +165,7 @@
    "lite-server": "^2.6.1",
    "mini-css-extract-plugin": "^1.6.0",
    "nconf": "^0.11.1",
-    "ng-packagr": "^12.2.7",
+    "ng-packagr": "^13.2.1",
    "postcss": "^8.4.5",
    "postcss-sass": "^0.5.0",
    "protractor": "^7.0.0",
@@ -182,7 +181,7 @@
    "ts-node": "^10.4.0",
    "tsconfig-paths": "^3.12.0",
    "tslint": "6.1.3",
-    "typescript": "4.3.5",
+    "typescript": "4.5.5",
    "webdriver-manager": "12.1.8"
  },
  "license": "Apache-2.0",