build: update to TypeScript 4.7

Bumps up our version of TypeScript to 4.7 and resolves a couple of build errors.

Author: crisbeto

.circleci/config.yml

@@ -13,12 +13,12 @@ var_2: &docker-browser-image cimg/node:16.14.0-browsers
 # **Note**: When updating the beginning of the cache key, also update the cache key to match
 # the new cache key prefix. This allows us to take advantage of CircleCI's fallback caching.
 # Read more here: https://circleci.com/docs/2.0/caching/#restoring-cache.
-var_3: &cache_key v9-ng-mat-{{ checksum ".bazelversion" }}-{{ checksum "tools/postinstall/apply-patches.js" }}-{{ checksum "WORKSPACE" }}-{{ checksum "yarn.lock" }}
+var_3: &cache_key v10-ng-mat-{{ checksum ".bazelversion" }}-{{ checksum "tools/postinstall/apply-patches.js" }}-{{ checksum "WORKSPACE" }}-{{ checksum "yarn.lock" }}
 # We want to invalidate the cache if the postinstall patches change. In order to apply new
 # patches, a clean version of the node modules is needed. Additionally, we invalidate the cache
 # if the Bazel version changes. We do this because otherwise the `bazelisk` cache folder will
 # contain all previously used versions and ultimately cause the cache restoring to be slower.
-var_4: &cache_fallback_key v9-ng-mat-{{ checksum ".bazelversion" }}-{{ checksum "tools/postinstall/apply-patches.js" }}-
+var_4: &cache_fallback_key v10-ng-mat-{{ checksum ".bazelversion" }}-{{ checksum "tools/postinstall/apply-patches.js" }}-
 
 # Settings common to each job
 var_5: &job_defaults

.vscode/settings.json

@@ -19,5 +19,6 @@
   "[typescript]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode",
     "editor.formatOnSave": true
-  }
+  },
+  "typescript.tsdk": "node_modules/typescript/lib"
 }

package.json

@@ -54,12 +54,12 @@
   },
   "version": "14.1.0-next.0",
   "dependencies": {
-    "@angular/animations": "14.0.0-next.15",
-    "@angular/common": "14.0.0-next.15",
-    "@angular/compiler": "14.0.0-next.15",
-    "@angular/core": "14.0.0-next.15",
-    "@angular/forms": "14.0.0-next.15",
-    "@angular/platform-browser": "14.0.0-next.15",
+    "@angular/animations": "14.0.0-next.16",
+    "@angular/common": "14.0.0-next.16",
+    "@angular/compiler": "14.0.0-next.16",
+    "@angular/core": "14.0.0-next.16",
+    "@angular/forms": "14.0.0-next.16",
+    "@angular/platform-browser": "14.0.0-next.16",
     "@types/google.maps": "^3.47.3",
     "@types/youtube": "^0.0.46",
     "rxjs": "^6.6.7",
@@ -68,30 +68,30 @@
     "zone.js": "~0.11.5"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "14.0.0-next.12",
-    "@angular-devkit/core": "14.0.0-next.12",
-    "@angular-devkit/schematics": "14.0.0-next.12",
-    "@angular/bazel": "14.0.0-next.15",
-    "@angular/cli": "14.0.0-next.12",
-    "@angular/compiler-cli": "14.0.0-next.15",
+    "@angular-devkit/build-angular": "14.0.0-next.13",
+    "@angular-devkit/core": "14.0.0-next.13",
+    "@angular-devkit/schematics": "14.0.0-next.13",
+    "@angular/bazel": "14.0.0-next.16",
+    "@angular/cli": "14.0.0-next.13",
+    "@angular/compiler-cli": "14.0.0-next.16",
     "@angular/dev-infra-private": "https://github.com/angular/dev-infra-private-builds.git#335aad1b04b3d95cd4cb1d719e73b93d4e90cce3",
-    "@angular/localize": "14.0.0-next.15",
-    "@angular/platform-browser-dynamic": "14.0.0-next.15",
-    "@angular/platform-server": "14.0.0-next.15",
-    "@angular/router": "14.0.0-next.15",
+    "@angular/localize": "14.0.0-next.16",
+    "@angular/platform-browser-dynamic": "14.0.0-next.16",
+    "@angular/platform-server": "14.0.0-next.16",
+    "@angular/router": "14.0.0-next.16",
     "@axe-core/webdriverjs": "^4.3.2",
     "@babel/core": "^7.16.12",
     "@bazel/bazelisk": "~1.11.0",
     "@bazel/buildifier": "~5.0.1",
-    "@bazel/concatjs": "5.4.0",
-    "@bazel/esbuild": "5.4.0",
+    "@bazel/concatjs": "5.4.1",
+    "@bazel/esbuild": "5.4.1",
     "@bazel/ibazel": "~0.16.2",
-    "@bazel/jasmine": "5.4.0",
-    "@bazel/protractor": "5.4.0",
-    "@bazel/rollup": "5.4.0",
-    "@bazel/runfiles": "5.4.0",
-    "@bazel/terser": "5.4.0",
-    "@bazel/worker": "5.4.0",
+    "@bazel/jasmine": "5.4.1",
+    "@bazel/protractor": "5.4.1",
+    "@bazel/rollup": "5.4.1",
+    "@bazel/runfiles": "5.4.1",
+    "@bazel/terser": "5.4.1",
+    "@bazel/worker": "5.4.1",
     "@firebase/app-types": "^0.7.0",
     "@material/animation": "14.0.0-canary.9736ddce9.0",
     "@material/auto-init": "14.0.0-canary.9736ddce9.0",
@@ -143,7 +143,7 @@
     "@octokit/rest": "18.3.5",
     "@rollup/plugin-commonjs": "^21.0.0",
     "@rollup/plugin-node-resolve": "^13.1.3",
-    "@schematics/angular": "14.0.0-next.12",
+    "@schematics/angular": "14.0.0-next.13",
     "@types/babel__core": "^7.1.18",
     "@types/browser-sync": "^2.26.3",
     "@types/fs-extra": "^9.0.13",
@@ -214,16 +214,16 @@
     "tsickle": "0.39.1",
     "tslint": "^6.1.3",
     "tsutils": "^3.21.0",
-    "typescript": "~4.6.2",
+    "typescript": "4.7.0-beta",
     "vrsource-tslint-rules": "6.0.0",
     "yaml": "^1.10.2",
     "yargs": "^17.3.1",
     "zx": "^4.3.0"
   },
   "resolutions": {
-    "@angular/dev-infra-private/typescript": "~4.6.2",
+    "@angular/dev-infra-private/typescript": "4.7.0-beta",
     "browser-sync-client": "2.26.13",
-    "dgeni-packages/typescript": "4.6.2",
+    "dgeni-packages/typescript": "4.7.0-beta",
     "**/https-proxy-agent": "5.0.0"
   }
 }

scripts/caretaking/firebase-functions/package.json

@@ -11,7 +11,7 @@
     "firebase-functions": "^3.11.0"
   },
   "devDependencies": {
-    "typescript": "^4.6.2",
+    "typescript": "4.7.0-beta",
     "firebase-tools": "^8.6.0"
   },
   "private": true

scripts/caretaking/firebase-functions/yarn.lock

@@ -4547,10 +4547,10 @@ typedarray-to-buffer@^3.1.5:
   dependencies:
     is-typedarray "^1.0.0"
 
-typescript@^4.6.2:
-  version "4.6.3"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.6.3.tgz#eefeafa6afdd31d725584c67a0eaba80f6fc6c6c"
-  integrity sha512-yNIatDa5iaofVozS/uQJEl3JRWLKKGJKh6Yaiv0GLGSuhpFJe7P3SbHZ8/yjAHRQwKRoA6YZqlfjXWmVzoVSMw==
+typescript@4.7.0-beta:
+  version "4.7.0-beta"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.0-beta.tgz#15952f24d4177479ca3d19f09436ad8c69a30563"
+  integrity sha512-m+CNL8lzHyHDxYYDTI+pm5hw5/bufYVGan2bokPyJY/y9C/4W/PCWMtYZ0vV9fLXbEL57elMeoaz9Evxs8UQ+A==
 
 unique-filename@^1.1.1:
   version "1.1.1"

src/material/table/table-data-source.ts

@@ -155,7 +155,7 @@ export class _MatTableDataSource<
     data: T,
     sortHeaderId: string,
   ): string | number => {
-    const value = (data as {[key: string]: any})[sortHeaderId];
+    const value = (data as unknown as Record<string, any>)[sortHeaderId];
 
     if (_isNumberValue(value)) {
       const numberValue = Number(value);
@@ -237,15 +237,15 @@ export class _MatTableDataSource<
    */
   filterPredicate: (data: T, filter: string) => boolean = (data: T, filter: string): boolean => {
     // Transform the data into a lowercase string of all property values.
-    const dataStr = Object.keys(data)
+    const dataStr = Object.keys(data as unknown as Record<string, any>)
       .reduce((currentTerm: string, key: string) => {
         // Use an obscure Unicode character to delimit the words in the concatenated string.
         // This avoids matches where the values of two columns combined will match the user's query
         // (e.g. `Flute` and `Stop` will match `Test`). The character is intended to be something
         // that has a very low chance of being typed in by somebody in a text field. This one in
         // particular is "White up-pointing triangle with dot" from
         // https://en.wikipedia.org/wiki/List_of_Unicode_characters
-        return currentTerm + (data as {[key: string]: any})[key] + '◬';
+        return currentTerm + (data as unknown as Record<string, any>)[key] + '◬';
       }, '')
       .toLowerCase();