Chore: Upgrade Typescript to 4.8.2 (#54901)

* Chore: Upgrade typescript to 4.8.2
2025-02-25 18:55:37 -06:00 · 2022-09-09 16:17:58 +01:00 · 2022-09-09 16:17:58 +01:00 · 4c7732ad17
commit 4c7732ad17
parent 4866898529
54 changed files with 522 additions and 482 deletions
--- a/.betterer.results
+++ b/.betterer.results
@ -1210,10 +1210,7 @@ exports[`better eslint`] = {
    "packages/grafana-toolkit/src/cli/utils/prompt.ts:5381": [
      [0, 0, 0, "Unexpected any. Specify a different type.", "0"],
      [0, 0, 0, "Unexpected any. Specify a different type.", "1"],
-      [0, 0, 0, "Unexpected any. Specify a different type.", "2"],
-      [0, 0, 0, "Unexpected any. Specify a different type.", "3"],
-      [0, 0, 0, "Unexpected any. Specify a different type.", "4"],
-      [0, 0, 0, "Unexpected any. Specify a different type.", "5"]
+      [0, 0, 0, "Unexpected any. Specify a different type.", "2"]
    ],
    "packages/grafana-toolkit/src/cli/utils/useSpinner.ts:5381": [
      [0, 0, 0, "Unexpected any. Specify a different type.", "0"],
--- a/.yarn/releases/yarn-3.2.3.cjs
+++ b/.yarn/releases/yarn-3.2.3.cjs
--- a/.yarn/sdks/eslint/bin/eslint.js
+++ b/.yarn/sdks/eslint/bin/eslint.js
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 if (existsSync(absPnpApiPath)) {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/eslint/lib/api.js
+++ b/.yarn/sdks/eslint/lib/api.js
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 if (existsSync(absPnpApiPath)) {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/eslint/package.json
+++ b/.yarn/sdks/eslint/package.json
@ -1,6 +1,6 @@
 {
  "name": "eslint",
-  "version": "8.20.0-sdk",
+  "version": "8.22.0-sdk",
  "main": "./lib/api.js",
  "type": "commonjs"
 }
--- a/.yarn/sdks/prettier/index.js
+++ b/.yarn/sdks/prettier/index.js
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 if (existsSync(absPnpApiPath)) {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/typescript/bin/tsc
+++ b/.yarn/sdks/typescript/bin/tsc
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 if (existsSync(absPnpApiPath)) {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/typescript/bin/tsserver
+++ b/.yarn/sdks/typescript/bin/tsserver
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 if (existsSync(absPnpApiPath)) {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/typescript/lib/tsc.js
+++ b/.yarn/sdks/typescript/lib/tsc.js
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 if (existsSync(absPnpApiPath)) {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/typescript/lib/tsserver.js
+++ b/.yarn/sdks/typescript/lib/tsserver.js
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 const moduleWrapper = tsserver => {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/typescript/lib/tsserverlibrary.js
+++ b/.yarn/sdks/typescript/lib/tsserverlibrary.js
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 const moduleWrapper = tsserver => {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/typescript/lib/typescript.js
+++ b/.yarn/sdks/typescript/lib/typescript.js
@ -1,13 +1,13 @@
 #!/usr/bin/env node

 const {existsSync} = require(`fs`);
-const {createRequire, createRequireFromPath} = require(`module`);
+const {createRequire} = require(`module`);
 const {resolve} = require(`path`);

 const relPnpApiPath = "../../../../.pnp.cjs";

 const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+const absRequire = createRequire(absPnpApiPath);

 if (existsSync(absPnpApiPath)) {
  if (!process.versions.pnp) {
--- a/.yarn/sdks/typescript/package.json
+++ b/.yarn/sdks/typescript/package.json
@ -1,6 +1,6 @@
 {
  "name": "typescript",
-  "version": "4.7.4-sdk",
+  "version": "4.8.2-sdk",
  "main": "./lib/typescript.js",
  "type": "commonjs"
 }
--- a/.yarnrc.yml
+++ b/.yarnrc.yml
@ -3,37 +3,40 @@ enableTelemetry: false
 nodeLinker: pnp

 packageExtensions:
-  '@mdx-js/loader@1.6.22':
+  "@mdx-js/loader@1.6.22":
    peerDependencies:
      react: 17.0.1
-  '@storybook/addon-docs@6.4.21':
+  "@npmcli/run-script@4.1.3":
+    dependencies:
+      which: ^2.0.2
+  "@storybook/addon-docs@6.4.21":
    peerDependencies:
-      '@storybook/manager-webpack5': 6.4.21
-  '@storybook/addon-essentials@6.4.21':
+      "@storybook/manager-webpack5": 6.4.21
+  "@storybook/addon-essentials@6.4.21":
    peerDependencies:
-      '@storybook/components': 6.4.21
-      '@storybook/core-events': 6.4.21
-      '@storybook/manager-webpack5': 6.4.21
-      '@storybook/theming': 6.4.21
-  '@storybook/core-server@6.4.21':
+      "@storybook/components": 6.4.21
+      "@storybook/core-events": 6.4.21
+      "@storybook/manager-webpack5": 6.4.21
+      "@storybook/theming": 6.4.21
+  "@storybook/core-server@6.4.21":
    peerDependencies:
-      '@babel/core': ^7.0.0
-  '@storybook/core@6.4.21':
+      "@babel/core": ^7.0.0
+  "@storybook/core@6.4.21":
    peerDependencies:
-      '@babel/core': ^7.0.0
-      '@storybook/manager-webpack5': 6.4.21
-  '@storybook/csf-tools@6.4.21':
+      "@babel/core": ^7.0.0
+      "@storybook/manager-webpack5": 6.4.21
+  "@storybook/csf-tools@6.4.21":
    peerDependencies:
-      '@babel/core': ^7.0.0
-  '@storybook/react@6.4.21':
+      "@babel/core": ^7.0.0
+  "@storybook/react@6.4.21":
    peerDependencies:
-      '@storybook/manager-webpack5': 6.4.21
+      "@storybook/manager-webpack5": 6.4.21
  doctrine@3.0.0:
    dependencies:
      assert: 2.0.0
  moveable@0.30.0:
    dependencies:
-      '@daybrush/utils': 1.7.0
+      "@daybrush/utils": 1.7.0
      framework-utils: ^1.1.0
  rc-time-picker@3.7.3:
    peerDependencies:
@ -48,9 +51,9 @@ packageExtensions:
      react-simple-compat: 1.2.2
  react-compat-moveable@0.18.0:
    dependencies:
-      '@egjs/agent': ^2.2.1
-      '@egjs/children-differ': ^1.0.1
-      '@scena/matrix': 1.1.1
+      "@egjs/agent": ^2.2.1
+      "@egjs/children-differ": ^1.0.1
+      "@scena/matrix": 1.1.1
      css-to-mat: ^1.0.3
      gesto: ^1.9.0
      overlap-area: ^1.0.0
@ -62,20 +65,17 @@ packageExtensions:
      webpack: 4.41.5
  react-icons@2.2.7:
    peerDependencies:
-      prop-types: '*'
+      prop-types: "*"
  react-resizable@3.0.4:
    peerDependencies:
      react-dom: 17.0.1
-  '@npmcli/run-script@4.1.3':
-    dependencies:
-      which: ^2.0.2

 plugins:
  - path: .yarn/plugins/@yarnpkg/plugin-typescript.cjs
-    spec: '@yarnpkg/plugin-typescript'
+    spec: "@yarnpkg/plugin-typescript"
  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
-    spec: '@yarnpkg/plugin-interactive-tools'
+    spec: "@yarnpkg/plugin-interactive-tools"
  - path: .yarn/plugins/@yarnpkg/plugin-outdated.cjs
-    spec: 'https://mskelton.dev/yarn-outdated/v2'
+    spec: "https://mskelton.dev/yarn-outdated/v2"

-yarnPath: .yarn/releases/yarn-3.2.2.cjs
+yarnPath: .yarn/releases/yarn-3.2.3.cjs
--- a/package.json
+++ b/package.json
@ -164,8 +164,8 @@
    "@types/testing-library__react-hooks": "^3.2.0",
    "@types/tinycolor2": "1.4.3",
    "@types/uuid": "8.3.4",
-    "@typescript-eslint/eslint-plugin": "5.31.0",
-    "@typescript-eslint/parser": "5.31.0",
+    "@typescript-eslint/eslint-plugin": "5.36.2",
+    "@typescript-eslint/parser": "5.36.2",
    "@wojtekmaj/enzyme-adapter-react-17": "0.6.7",
    "autoprefixer": "10.4.7",
    "axios": "0.27.2",
@ -234,7 +234,7 @@
    "ts-jest": "28.0.7",
    "ts-loader": "9.3.1",
    "ts-node": "10.9.1",
-    "typescript": "4.7.4",
+    "typescript": "4.8.2",
    "wait-on": "6.0.1",
    "webpack": "5.74.0",
    "webpack-bundle-analyzer": "4.5.0",
@ -280,7 +280,7 @@
    "@react-stately/collections": "3.4.1",
    "@react-stately/menu": "3.4.1",
    "@react-stately/tree": "3.3.1",
-    "@reduxjs/toolkit": "1.8.3",
+    "@reduxjs/toolkit": "1.8.5",
    "@sentry/browser": "6.19.7",
    "@sentry/types": "6.19.7",
    "@sentry/utils": "6.19.7",
@ -420,5 +420,5 @@
  "engines": {
    "node": ">= 16"
  },
-  "packageManager": "yarn@3.2.2"
+  "packageManager": "yarn@3.2.3"
 }
--- a/packages/grafana-data/package.json
+++ b/packages/grafana-data/package.json
@ -87,7 +87,7 @@
    "rollup-plugin-esbuild": "^4.9.1",
    "rollup-plugin-node-externals": "^4.1.0",
    "sinon": "14.0.0",
-    "typescript": "4.7.4"
+    "typescript": "4.8.2"
  },
  "peerDependencies": {
    "react": "^16.8.0 || ^17.0.0",
--- a/packages/grafana-data/src/types/app.ts
+++ b/packages/grafana-data/src/types/app.ts
@ -18,7 +18,7 @@ export enum CoreApp {
  PanelViewer = 'panel-viewer',
 }

-export interface AppRootProps<T = KeyValue> {
+export interface AppRootProps<T extends KeyValue = KeyValue> {
  meta: AppPluginMeta<T>;
  /**
   * base URL segment for an app, /app/pluginId
@ -44,11 +44,11 @@ export interface AppRootProps<T = KeyValue> {
  path: string;
 }

-export interface AppPluginMeta<T = KeyValue> extends PluginMeta<T> {
+export interface AppPluginMeta<T extends KeyValue = KeyValue> extends PluginMeta<T> {
  // TODO anything specific to apps?
 }

-export class AppPlugin<T = KeyValue> extends GrafanaPlugin<AppPluginMeta<T>> {
+export class AppPlugin<T extends KeyValue = KeyValue> extends GrafanaPlugin<AppPluginMeta<T>> {
  // Content under: /a/${plugin-id}/*
  root?: ComponentType<AppRootProps<T>>;
  rootNav?: NavModel; // Initial navigation model
--- a/packages/grafana-data/src/types/datasource.ts
+++ b/packages/grafana-data/src/types/datasource.ts
@ -16,7 +16,10 @@ import { CustomVariableSupport, DataSourceVariableSupport, StandardVariableSuppo

 import { DataSourceRef, WithAccessControlMetadata } from '.';

-export interface DataSourcePluginOptionsEditorProps<JSONData = DataSourceJsonData, SecureJSONData = {}> {
+export interface DataSourcePluginOptionsEditorProps<
+  JSONData extends DataSourceJsonData = DataSourceJsonData,
+  SecureJSONData = {}
+> {
  options: DataSourceSettings<JSONData, SecureJSONData>;
  onOptionsChange: (options: DataSourceSettings<JSONData, SecureJSONData>) => void;
 }
--- a/packages/grafana-data/src/types/fieldOverrides.ts
+++ b/packages/grafana-data/src/types/fieldOverrides.ts
@ -63,7 +63,7 @@ export interface FieldOverrideContext extends StandardEditorContext<any, any> {
  field?: Field;
  dataFrameIndex?: number; // The index for the selected field frame
 }
-export interface FieldConfigEditorProps<TValue, TSettings>
+export interface FieldConfigEditorProps<TValue, TSettings extends {}>
  extends Omit<StandardEditorProps<TValue, TSettings>, 'item'> {
  item: FieldConfigPropertyItem<any, TValue, TSettings>; // The property info
  value: TValue;
--- a/packages/grafana-data/src/utils/datasource.ts
+++ b/packages/grafana-data/src/utils/datasource.ts
@ -7,6 +7,7 @@ import {
  DataSourceSettings,
  DataSourceInstanceSettings,
  DataSourceRef,
+  DataSourceJsonData,
 } from '../types';

 /**
@ -49,31 +50,37 @@ export const onUpdateDatasourceOption =
  };

 export const onUpdateDatasourceJsonDataOption =
-  <J, S, K extends keyof J>(props: DataSourcePluginOptionsEditorProps<J, S>, key: K) =>
+  <J extends DataSourceJsonData, S, K extends keyof J>(props: DataSourcePluginOptionsEditorProps<J, S>, key: K) =>
  (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
    updateDatasourcePluginJsonDataOption(props, key, event.currentTarget.value);
  };

 export const onUpdateDatasourceSecureJsonDataOption =
-  <J, S extends {} = KeyValue>(props: DataSourcePluginOptionsEditorProps<J, S>, key: string) =>
+  <J extends DataSourceJsonData, S extends {} = KeyValue>(
+    props: DataSourcePluginOptionsEditorProps<J, S>,
+    key: string
+  ) =>
  (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>) => {
    updateDatasourcePluginSecureJsonDataOption(props, key, event.currentTarget.value);
  };

 export const onUpdateDatasourceJsonDataOptionSelect =
-  <J, S, K extends keyof J>(props: DataSourcePluginOptionsEditorProps<J, S>, key: K) =>
+  <J extends DataSourceJsonData, S, K extends keyof J>(props: DataSourcePluginOptionsEditorProps<J, S>, key: K) =>
  (selected: SelectableValue) => {
    updateDatasourcePluginJsonDataOption(props, key, selected.value);
  };

 export const onUpdateDatasourceJsonDataOptionChecked =
-  <J, S, K extends keyof J>(props: DataSourcePluginOptionsEditorProps<J, S>, key: K) =>
+  <J extends DataSourceJsonData, S, K extends keyof J>(props: DataSourcePluginOptionsEditorProps<J, S>, key: K) =>
  (event: React.SyntheticEvent<HTMLInputElement>) => {
    updateDatasourcePluginJsonDataOption(props, key, event.currentTarget.checked);
  };

 export const onUpdateDatasourceSecureJsonDataOptionSelect =
-  <J, S extends {} = KeyValue>(props: DataSourcePluginOptionsEditorProps<J, S>, key: string) =>
+  <J extends DataSourceJsonData, S extends {} = KeyValue>(
+    props: DataSourcePluginOptionsEditorProps<J, S>,
+    key: string
+  ) =>
  (selected: SelectableValue) => {
    updateDatasourcePluginSecureJsonDataOption(props, key, selected.value);
  };
@ -84,7 +91,7 @@ export const onUpdateDatasourceResetOption =
    updateDatasourcePluginResetOption(props, key);
  };

-export function updateDatasourcePluginOption<J, S extends {} = KeyValue>(
+export function updateDatasourcePluginOption<J extends DataSourceJsonData, S extends {} = KeyValue>(
  props: DataSourcePluginOptionsEditorProps<J, S>,
  key: keyof DataSourceSettings,
  val: any
@ -97,7 +104,7 @@ export function updateDatasourcePluginOption<J, S extends {} = KeyValue>(
  });
 }

-export const updateDatasourcePluginJsonDataOption = <J, S, K extends keyof J>(
+export const updateDatasourcePluginJsonDataOption = <J extends DataSourceJsonData, S, K extends keyof J>(
  props: DataSourcePluginOptionsEditorProps<J, S>,
  key: K,
  val: any
@ -113,7 +120,7 @@ export const updateDatasourcePluginJsonDataOption = <J, S, K extends keyof J>(
  });
 };

-export const updateDatasourcePluginSecureJsonDataOption = <J, S extends {} = KeyValue>(
+export const updateDatasourcePluginSecureJsonDataOption = <J extends DataSourceJsonData, S extends {} = KeyValue>(
  props: DataSourcePluginOptionsEditorProps<J, S>,
  key: string,
  val: any
@ -129,7 +136,7 @@ export const updateDatasourcePluginSecureJsonDataOption = <J, S extends {} = Key
  });
 };

-export const updateDatasourcePluginResetOption = <J, S extends {} = KeyValue>(
+export const updateDatasourcePluginResetOption = <J extends DataSourceJsonData, S extends {} = KeyValue>(
  props: DataSourcePluginOptionsEditorProps<J, S>,
  key: string
 ) => {
--- a/packages/grafana-e2e-selectors/package.json
+++ b/packages/grafana-e2e-selectors/package.json
@ -49,6 +49,6 @@
  "dependencies": {
    "@grafana/tsconfig": "^1.2.0-rc1",
    "tslib": "2.4.0",
-    "typescript": "4.7.4"
+    "typescript": "4.8.2"
  }
 }
--- a/packages/grafana-e2e/package.json
+++ b/packages/grafana-e2e/package.json
@ -78,7 +78,7 @@
    "tracelib": "1.0.1",
    "ts-loader": "6.2.2",
    "tslib": "2.4.0",
-    "typescript": "4.7.4",
+    "typescript": "4.8.2",
    "uuid": "8.3.2",
    "yaml": "^2.0.0"
  }
--- a/packages/grafana-runtime/package.json
+++ b/packages/grafana-runtime/package.json
@ -70,7 +70,7 @@
    "rollup-plugin-node-externals": "^4.1.0",
    "rollup-plugin-sourcemaps": "0.6.3",
    "rollup-plugin-terser": "7.0.2",
-    "typescript": "4.7.4"
+    "typescript": "4.8.2"
  },
  "peerDependencies": {
    "react": "17.0.2",
--- a/packages/grafana-schema/package.json
+++ b/packages/grafana-schema/package.json
@ -44,7 +44,7 @@
    "rollup-plugin-dts": "^4.2.2",
    "rollup-plugin-esbuild": "^4.9.1",
    "rollup-plugin-node-externals": "^4.1.0",
-    "typescript": "4.7.4"
+    "typescript": "4.8.2"
  },
  "dependencies": {
    "tslib": "2.4.0"
--- a/packages/grafana-toolkit/package.json
+++ b/packages/grafana-toolkit/package.json
@ -44,8 +44,8 @@
    "@babel/plugin-proposal-optional-chaining": "7.18.9",
    "@babel/plugin-syntax-dynamic-import": "7.8.3",
    "@babel/plugin-transform-react-constant-elements": "7.18.9",
-    "@babel/plugin-transform-runtime": "7.18.9",
-    "@babel/plugin-transform-typescript": "7.18.8",
+    "@babel/plugin-transform-runtime": "7.18.10",
+    "@babel/plugin-transform-typescript": "7.19.0",
    "@babel/preset-env": "^7.18.9",
    "@babel/preset-react": "^7.18.6",
    "@babel/preset-typescript": "^7.18.6",
@ -66,8 +66,8 @@
    "@types/rimraf": "3.0.2",
    "@types/semver": "7.3.9",
    "@types/tmp": "0.2.3",
-    "@typescript-eslint/eslint-plugin": "5.16.0",
-    "@typescript-eslint/parser": "5.16.0",
+    "@typescript-eslint/eslint-plugin": "5.36.2",
+    "@typescript-eslint/parser": "5.36.2",
    "axios": "^0.26.1",
    "babel-jest": "27.5.1",
    "babel-loader": "^8.2.5",
@ -120,7 +120,7 @@
    "ts-loader": "^9.3.1",
    "ts-node": "^9.1.0",
    "tslib": "2.4.0",
-    "typescript": "4.7.4",
+    "typescript": "4.8.2",
    "url-loader": "^4.1.1",
    "webpack": "^5.72.0"
  }
--- a/packages/grafana-toolkit/src/cli/utils/prompt.ts
+++ b/packages/grafana-toolkit/src/cli/utils/prompt.ts
@ -1,4 +1,4 @@
-import {
+import inquirer, {
  Question,
  InputQuestion,
  CheckboxQuestion,
@ -10,21 +10,21 @@ import {
  ChoiceOptions,
 } from 'inquirer';

-type QuestionWithValidation<A = any> =
+type QuestionWithValidation<A extends inquirer.Answers = inquirer.Answers> =
  | InputQuestion<A>
  | CheckboxQuestion<A>
  | NumberQuestion<A>
  | PasswordQuestion<A>
  | EditorQuestion<A>;

-export const answerRequired = (question: QuestionWithValidation): Question<any> => {
+export const answerRequired = <A extends inquirer.Answers>(question: QuestionWithValidation<A>): Question<A> => {
  return {
    ...question,
-    validate: (answer: any) => answer.trim() !== '' || `${question.name} is required`,
+    validate: (answer: A) => answer.trim() !== '' || `${question.name} is required`,
  };
 };

-export const promptInput = <A>(
+export const promptInput = <A extends inquirer.Answers>(
  name: string,
  message: string | ((answers: A) => string),
  required = false,
@ -42,7 +42,7 @@ export const promptInput = <A>(
  return required ? answerRequired(model) : model;
 };

-export const promptList = <A>(
+export const promptList = <A extends inquirer.Answers>(
  name: string,
  message: string | ((answers: A) => string),
  choices: () => ChoiceOptions[],
@ -61,7 +61,7 @@ export const promptList = <A>(
  return model;
 };

-export const promptConfirm = <A>(
+export const promptConfirm = <A extends inquirer.Answers>(
  name: string,
  message: string | ((answers: A) => string),
  def: any = undefined,
--- a/packages/grafana-ui/package.json
+++ b/packages/grafana-ui/package.json
@ -190,7 +190,7 @@
    "style-loader": "3.3.1",
    "terser-webpack-plugin": "5.3.3",
    "ts-loader": "8.4.0",
-    "typescript": "4.7.4",
+    "typescript": "4.8.2",
    "webpack": "5.74.0",
    "webpack-filter-warnings-plugin": "1.2.1"
  },
--- a/packages/grafana-ui/src/components/DataSourceSettings/AlertingSettings.tsx
+++ b/packages/grafana-ui/src/components/DataSourceSettings/AlertingSettings.tsx
@ -7,7 +7,8 @@ import { InlineField } from '../Forms/InlineField';
 import { InlineFieldRow } from '../Forms/InlineFieldRow';
 import { Select } from '../Select/Select';

-interface Props<T> extends Pick<DataSourcePluginOptionsEditorProps<T>, 'options' | 'onOptionsChange'> {
+interface Props<T extends DataSourceJsonData>
+  extends Pick<DataSourcePluginOptionsEditorProps<T>, 'options' | 'onOptionsChange'> {
  alertmanagerDataSources: Array<DataSourceInstanceSettings<DataSourceJsonData>>;
 }

--- a/packages/grafana-ui/src/components/DataSourceSettings/types.ts
+++ b/packages/grafana-ui/src/components/DataSourceSettings/types.ts
@ -1,6 +1,6 @@
 import React from 'react';

-import { DataSourceSettings } from '@grafana/data';
+import { DataSourceJsonData, DataSourceSettings } from '@grafana/data';

 export interface AzureAuthSettings {
  /** Set to true if Azure authentication supported by the datasource */
@ -19,7 +19,7 @@ export interface AzureAuthSettings {
  readonly azureSettingsUI?: React.ComponentType<HttpSettingsBaseProps>;
 }

-export interface HttpSettingsBaseProps<JSONData = any, SecureJSONData = any> {
+export interface HttpSettingsBaseProps<JSONData extends DataSourceJsonData = any, SecureJSONData = any> {
  /** The configuration object of the data source */
  dataSourceConfig: DataSourceSettings<JSONData, SecureJSONData>;
  /** Callback for handling changes to the configuration object */
--- a/packages/grafana-ui/src/components/ErrorBoundary/ErrorBoundary.tsx
+++ b/packages/grafana-ui/src/components/ErrorBoundary/ErrorBoundary.tsx
@ -135,7 +135,7 @@ export class ErrorBoundaryAlert extends PureComponent<ErrorBoundaryAlertProps> {
 *
 * @public
 */
-export function withErrorBoundary<P = {}>(
+export function withErrorBoundary<P extends {} = {}>(
  Component: ComponentType<P>,
  errorBoundaryProps: Omit<ErrorBoundaryAlertProps, 'children'> = {}
 ): ComponentType<P> {
--- a/packages/grafana-ui/src/components/Forms/Form.tsx
+++ b/packages/grafana-ui/src/components/Forms/Form.tsx
@ -1,10 +1,10 @@
 import { css } from '@emotion/css';
 import React, { HTMLProps, useEffect } from 'react';
-import { useForm, Mode, DeepPartial, UnpackNestedValue, SubmitHandler } from 'react-hook-form';
+import { useForm, Mode, DeepPartial, UnpackNestedValue, SubmitHandler, FieldValues } from 'react-hook-form';

 import { FormAPI } from '../../types';

-interface FormProps<T> extends Omit<HTMLProps<HTMLFormElement>, 'onSubmit'> {
+interface FormProps<T extends FieldValues> extends Omit<HTMLProps<HTMLFormElement>, 'onSubmit'> {
  validateOn?: Mode;
  validateOnMount?: boolean;
  validateFieldsOnMount?: string | string[];
@ -15,7 +15,7 @@ interface FormProps<T> extends Omit<HTMLProps<HTMLFormElement>, 'onSubmit'> {
  maxWidth?: number | 'none';
 }

-export function Form<T>({
+export function Form<T extends FieldValues>({
  defaultValues,
  onSubmit,
  validateOnMount = false,
--- a/packages/grafana-ui/src/components/Segment/SegmentSelect.tsx
+++ b/packages/grafana-ui/src/components/Segment/SegmentSelect.tsx
@ -10,7 +10,7 @@ import { AsyncSelect, Select } from '../Select/Select';
 * when a value is selected. See comment below on closeMenuOnSelect()
 */
 export interface Props<T> extends Omit<HTMLProps<HTMLDivElement>, 'value' | 'onChange'> {
-  value?: SelectableValue<T>;
+  value?: T | SelectableValue<T>;
  options: Array<SelectableValue<T>>;
  onChange: (item: SelectableValue<T>) => void;
  /**
--- a/packages/grafana-ui/src/components/Select/Select.tsx
+++ b/packages/grafana-ui/src/components/Select/Select.tsx
@ -17,7 +17,7 @@ export function MultiSelect<T>(props: MultiSelectCommonProps<T>) {

 export interface AsyncSelectProps<T> extends Omit<SelectCommonProps<T>, 'options'>, SelectAsyncProps<T> {
  // AsyncSelect has options stored internally. We cannot enable plain values as we don't have access to the fetched options
-  value?: SelectableValue<T> | null;
+  value?: T | SelectableValue<T> | null;
 }

 export function AsyncSelect<T>(props: AsyncSelectProps<T>) {
--- a/packages/grafana-ui/src/components/Select/SelectBase.tsx
+++ b/packages/grafana-ui/src/components/Select/SelectBase.tsx
@ -4,6 +4,8 @@ import { default as ReactAsyncSelect } from 'react-select/async';
 import { default as AsyncCreatable } from 'react-select/async-creatable';
 import Creatable from 'react-select/creatable';

+import { SelectableValue } from '@grafana/data';
+
 import { useTheme2 } from '../../themes';
 import { Icon } from '../Icon/Icon';
 import { Spinner } from '../Spinner/Spinner';
@ -19,7 +21,7 @@ import { SingleValue } from './SingleValue';
 import { ValueContainer } from './ValueContainer';
 import { getSelectStyles } from './getSelectStyles';
 import { useCustomSelectStyles } from './resetSelectStyles';
-import { ActionMeta, SelectBaseProps, SelectValue } from './types';
+import { ActionMeta, SelectBaseProps } from './types';
 import { cleanValue, findSelectedValue } from './utils';

 interface ExtraValuesIndicatorProps {
@ -166,7 +168,7 @@ export function SelectBase<T>({
  }, [maxMenuHeight, menuPlacement, loadOptions, isOpen]);

  const onChangeWithEmpty = useCallback(
-    (value: SelectValue<T>, action: ActionMeta) => {
+    (value: SelectableValue<T>, action: ActionMeta) => {
      if (isMulti && (value === undefined || value === null)) {
        return onChange([], action);
      }
--- a/packages/grafana-ui/src/components/Select/types.ts
+++ b/packages/grafana-ui/src/components/Select/types.ts
@ -76,7 +76,7 @@ export interface SelectCommonProps<T> {
  /** Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null*/
  renderControl?: ControlComponent<T>;
  tabSelectsValue?: boolean;
-  value?: SelectValue<T> | null;
+  value?: T | SelectValue<T> | null;
  /** Sets the width to a multiple of 8px. Should only be used with inline forms. Setting width of the container is preferred in other cases.*/
  width?: number | 'auto';
  isOptionDisabled?: () => boolean;
--- a/packages/grafana-ui/src/types/forms.ts
+++ b/packages/grafana-ui/src/types/forms.ts
@ -1,7 +1,7 @@
 import { UseFormReturn, FieldValues, FieldErrors } from 'react-hook-form';
 export type { SubmitHandler as FormsOnSubmit, FieldErrors as FormFieldErrors } from 'react-hook-form';

-export type FormAPI<T> = Omit<UseFormReturn<T>, 'trigger' | 'handleSubmit'> & {
+export type FormAPI<T extends FieldValues> = Omit<UseFormReturn<T>, 'trigger' | 'handleSubmit'> & {
  errors: FieldErrors<T>;
 };

--- a/packages/jaeger-ui-components/package.json
+++ b/packages/jaeger-ui-components/package.json
@ -27,7 +27,7 @@
    "@types/tinycolor2": "1.4.3",
    "enzyme": "3.11.0",
    "sinon": "14.0.0",
-    "typescript": "4.7.4"
+    "typescript": "4.8.2"
  },
  "dependencies": {
    "@emotion/css": "11.9.0",
--- a/public/app/core/internationalization/index.tsx
+++ b/public/app/core/internationalization/index.tsx
@ -66,7 +66,7 @@ export function I18nProvider({ children }: I18nProviderProps) {
 }

 // This is only really used for ModalManager, as that creates a new react root we need to make sure is localisable.
-export function provideI18n<P>(WrappedWithI18N: React.ComponentType<P>) {
+export function provideI18n<P extends {}>(WrappedWithI18N: React.ComponentType<P>) {
  const I18nProviderWrapper = (props: P) => {
    return (
      <I18nProvider>
--- a/public/app/core/navigation/mocks/routeProps.ts
+++ b/public/app/core/navigation/mocks/routeProps.ts
@ -3,7 +3,7 @@ import { merge } from 'lodash';

 import { GrafanaRouteComponentProps } from '../types';

-export function getRouteComponentProps<T = {}, Q extends Record<string, string | null | undefined> = {}>(
+export function getRouteComponentProps<T extends {} = {}, Q extends Record<string, string | null | undefined> = {}>(
  overrides: Partial<GrafanaRouteComponentProps> = {}
 ): GrafanaRouteComponentProps<T, Q> {
  const defaults: GrafanaRouteComponentProps<T, Q> = {
--- a/public/app/core/navigation/types.ts
+++ b/public/app/core/navigation/types.ts
@ -3,12 +3,12 @@ import { RouteComponentProps } from 'react-router-dom';

 import { UrlQueryMap } from '@grafana/data';

-export interface GrafanaRouteComponentProps<T = {}, Q = UrlQueryMap> extends RouteComponentProps<T> {
+export interface GrafanaRouteComponentProps<T extends {} = {}, Q = UrlQueryMap> extends RouteComponentProps<T> {
  route: RouteDescriptor;
  queryParams: Q;
 }

-export type GrafanaRouteComponent<T = any> = React.ComponentType<GrafanaRouteComponentProps<T>>;
+export type GrafanaRouteComponent<T extends {} = any> = React.ComponentType<GrafanaRouteComponentProps<T>>;

 export interface RouteDescriptor {
  path: string;
--- a/public/app/core/utils/object.ts
+++ b/public/app/core/utils/object.ts
@ -1,7 +1,7 @@
 import { isArray, isPlainObject } from 'lodash';

 /** @returns a deep clone of the object, but with any null value removed */
-export function sortedDeepCloneWithoutNulls<T>(value: T): T {
+export function sortedDeepCloneWithoutNulls<T extends {}>(value: T): T {
  if (isArray(value)) {
    return value.map(sortedDeepCloneWithoutNulls) as unknown as T;
  }
--- a/public/app/features/alerting/unified/components/receivers/form/ChannelSubForm.tsx
+++ b/public/app/features/alerting/unified/components/receivers/form/ChannelSubForm.tsx
@ -1,6 +1,6 @@
 import { css } from '@emotion/css';
 import React, { useEffect, useMemo, useState } from 'react';
-import { useFormContext, FieldErrors } from 'react-hook-form';
+import { useFormContext, FieldErrors, FieldValues } from 'react-hook-form';

 import { GrafanaTheme2, SelectableValue } from '@grafana/data';
 import { Alert, Button, Field, InputControl, Select, useStyles2 } from '@grafana/ui';
@ -12,7 +12,7 @@ import { ChannelValues, CommonSettingsComponentType } from '../../../types/recei
 import { ChannelOptions } from './ChannelOptions';
 import { CollapsibleSection } from './CollapsibleSection';

-interface Props<R> {
+interface Props<R extends FieldValues> {
  defaultValues: R;
  pathPrefix: string;
  notifiers: NotifierDTO[];
--- a/public/app/features/alerting/unified/hooks/useExternalAmSelector.ts
+++ b/public/app/features/alerting/unified/hooks/useExternalAmSelector.ts
@ -1,7 +1,7 @@
 import { countBy, keyBy } from 'lodash';
 import { useSelector } from 'react-redux';

-import { DataSourceInstanceSettings, DataSourceSettings } from '@grafana/data';
+import { DataSourceInstanceSettings, DataSourceJsonData, DataSourceSettings } from '@grafana/data';
 import { AlertManagerDataSourceJsonData } from 'app/plugins/datasource/alertmanager/types';

 import { StoreState } from '../../../../types';
@ -118,7 +118,7 @@ export function useExternalDataSourceAlertmanagers(): ExternalDataSourceAM[] {
  });
 }

-function getDataSourceUrlWithProtocol<T>(dsSettings: DataSourceSettings<T>) {
+function getDataSourceUrlWithProtocol<T extends DataSourceJsonData>(dsSettings: DataSourceSettings<T>) {
  const hasProtocol = new RegExp('^[^:]*://').test(dsSettings.url);
  if (!hasProtocol) {
    return `http://${dsSettings.url}`; // Grafana append http protocol if there is no any
--- a/public/app/features/alerting/unified/utils/misc.ts
+++ b/public/app/features/alerting/unified/utils/misc.ts
@ -1,6 +1,6 @@
 import { sortBy } from 'lodash';

-import { urlUtil, UrlQueryMap, Labels, DataSourceInstanceSettings } from '@grafana/data';
+import { urlUtil, UrlQueryMap, Labels, DataSourceInstanceSettings, DataSourceJsonData } from '@grafana/data';
 import { config } from '@grafana/runtime';
 import { alertInstanceKey } from 'app/features/alerting/unified/utils/rules';
 import { SortOrder } from 'app/plugins/panel/alertlist/types';
@ -98,7 +98,7 @@ export function makeLabelBasedSilenceLink(alertManagerSourceName: string, labels
  return `${config.appSubUrl}/alerting/silence/new?${silenceUrlParams.toString()}`;
 }

-export function makeDataSourceLink<T>(dataSource: DataSourceInstanceSettings<T>) {
+export function makeDataSourceLink<T extends DataSourceJsonData>(dataSource: DataSourceInstanceSettings<T>) {
  return `${config.appSubUrl}/datasources/edit/${dataSource.uid}`;
 }

--- a/public/app/features/alerting/unified/utils/redux.ts
+++ b/public/app/features/alerting/unified/utils/redux.ts
@ -26,7 +26,7 @@ export type AsyncRequestMapSlice<T> = Record<string, AsyncRequestState<T>>;

 export type AsyncRequestAction<T> = PayloadAction<Draft<T>, string, any, any>;

-function requestStateReducer<T, ThunkArg = void, ThunkApiConfig = {}>(
+function requestStateReducer<T, ThunkArg = void, ThunkApiConfig extends {} = {}>(
  asyncThunk: AsyncThunk<T, ThunkArg, ThunkApiConfig>,
  state: Draft<AsyncRequestState<T>> = initialAsyncRequestState,
  action: AsyncRequestAction<T>
@ -64,7 +64,7 @@ function requestStateReducer<T, ThunkArg = void, ThunkApiConfig = {}>(
 * createAsyncSlice creates a slice based on a given async action, exposing its state.
 * takes care to only use state of the latest invocation of the action if there are several in flight.
 */
-export function createAsyncSlice<T, ThunkArg = void, ThunkApiConfig = {}>(
+export function createAsyncSlice<T, ThunkArg = void, ThunkApiConfig extends {} = {}>(
  name: string,
  asyncThunk: AsyncThunk<T, ThunkArg, ThunkApiConfig>
 ) {
@ -84,7 +84,7 @@ export function createAsyncSlice<T, ThunkArg = void, ThunkApiConfig = {}>(
 * separate requests are uniquely indentified by result of provided getEntityId function
 * takes care to only use state of the latest invocation of the action if there are several in flight.
 */
-export function createAsyncMapSlice<T, ThunkArg = void, ThunkApiConfig = {}>(
+export function createAsyncMapSlice<T, ThunkArg = void, ThunkApiConfig extends {} = {}>(
  name: string,
  asyncThunk: AsyncThunk<T, ThunkArg, ThunkApiConfig>,
  getEntityId: (arg: ThunkArg) => string
--- a/public/app/features/correlations/Forms/useCorrelationForm.ts
+++ b/public/app/features/correlations/Forms/useCorrelationForm.ts
@ -1,10 +1,13 @@
-import { DeepPartial, SubmitHandler, UnpackNestedValue, useForm } from 'react-hook-form';
+import { DeepPartial, FieldValues, SubmitHandler, UnpackNestedValue, useForm } from 'react-hook-form';

-interface UseCorrelationFormOptions<T> {
+interface UseCorrelationFormOptions<T extends FieldValues> {
  onSubmit: SubmitHandler<T>;
  defaultValues?: UnpackNestedValue<DeepPartial<T>>;
 }
-export const useCorrelationForm = <T>({ onSubmit, defaultValues }: UseCorrelationFormOptions<T>) => {
+export const useCorrelationForm = <T extends FieldValues>({
+  onSubmit,
+  defaultValues,
+}: UseCorrelationFormOptions<T>) => {
  const {
    handleSubmit: submit,
    control,
--- a/public/app/features/datasources/mocks/dataSourcesMocks.ts
+++ b/public/app/features/datasources/mocks/dataSourcesMocks.ts
@ -1,6 +1,6 @@
 import { merge } from 'lodash';

-import { DataSourceSettings, DataSourcePluginMeta } from '@grafana/data';
+import { DataSourceSettings, DataSourcePluginMeta, DataSourceJsonData } from '@grafana/data';
 import { DataSourceSettingsState, PluginDashboard } from 'app/types';

 export const getMockDashboard = (override?: Partial<PluginDashboard>) => ({
@ -32,7 +32,9 @@ export const getMockDataSources = (amount: number, overrides?: Partial<DataSourc
    })
  );

-export const getMockDataSource = <T>(overrides?: Partial<DataSourceSettings<T>>): DataSourceSettings<T> =>
+export const getMockDataSource = <T extends DataSourceJsonData>(
+  overrides?: Partial<DataSourceSettings<T>>
+): DataSourceSettings<T> =>
  merge(
    {
      access: '',
--- a/public/app/features/plugins/sql/components/configuration/TLSSecretsConfig.tsx
+++ b/public/app/features/plugins/sql/components/configuration/TLSSecretsConfig.tsx
@ -9,14 +9,14 @@ import {
 } from '@grafana/data';
 import { InlineField, SecretTextArea } from '@grafana/ui';

-export interface Props<T, S> {
+export interface Props<T extends DataSourceJsonData, S> {
  editorProps: DataSourcePluginOptionsEditorProps<T, S>;
  showCACert?: boolean;
  secureJsonFields?: KeyValue<Boolean>;
  labelWidth?: number;
 }

-export const TLSSecretsConfig = <T extends DataSourceJsonData, S = {}>(props: Props<T, S>) => {
+export const TLSSecretsConfig = <T extends DataSourceJsonData, S extends {} = {}>(props: Props<T, S>) => {
  const { labelWidth, editorProps, showCACert } = props;
  const { secureJsonFields } = editorProps.options;
  return (
--- a/public/app/features/scenes/core/SceneObjectBase.tsx
+++ b/public/app/features/scenes/core/SceneObjectBase.tsx
@ -203,7 +203,7 @@ export abstract class SceneObjectBase<TState extends SceneObjectState = {}> impl
 * This hook is always returning model.state instead of a useState that remembers the last state emitted on the subject
 * The reason for this is so that if the model instance change this function will always return the latest state.
 */
-function useSceneObjectState<TState>(model: SceneObjectBase<TState>): TState {
+function useSceneObjectState<TState extends SceneObjectState>(model: SceneObjectBase<TState>): TState {
  const forceUpdate = useForceUpdate();

  useEffect(() => {
--- a/public/app/plugins/datasource/elasticsearch/utils.ts
+++ b/public/app/plugins/datasource/elasticsearch/utils.ts
@ -22,7 +22,7 @@ export const describeMetric = (metric: MetricAggregation) => {
 * recursing over nested objects (not arrays).
 * @param obj
 */
-export const removeEmpty = <T>(obj: T): Partial<T> =>
+export const removeEmpty = <T extends {}>(obj: T): Partial<T> =>
  Object.entries(obj).reduce((acc, [key, value]) => {
    // Removing nullish values (null & undefined)
    if (value == null) {
@ -35,7 +35,7 @@ export const removeEmpty = <T>(obj: T): Partial<T> =>
    }

    // Removing empty strings
-    if (value?.length === 0) {
+    if (typeof value === 'string' && value.length === 0) {
      return { ...acc };
    }

--- a/public/app/plugins/datasource/testdata/runStreams.ts
+++ b/public/app/plugins/datasource/testdata/runStreams.ts
@ -211,7 +211,7 @@ export function runFetchStream(
      },
    });

-    const processChunk = (value: ReadableStreamDefaultReadResult<Uint8Array>): any => {
+    const processChunk = (value: ReadableStreamReadResult<Uint8Array>): any => {
      if (value.value) {
        const text = new TextDecoder().decode(value.value);
        csv.readCSV(text);
--- a/public/app/plugins/panel/geomap/components/ObservablePropsWrapper.tsx
+++ b/public/app/plugins/panel/geomap/components/ObservablePropsWrapper.tsx
@ -11,7 +11,7 @@ interface State<T> {
  subProps: T;
 }

-export class ObservablePropsWrapper<T> extends Component<Props<T>, State<T>> {
+export class ObservablePropsWrapper<T extends {}> extends Component<Props<T>, State<T>> {
  sub?: Unsubscribable;

  constructor(props: Props<T>) {
--- a/public/app/types/store.ts
+++ b/public/app/types/store.ts
@ -31,8 +31,9 @@ export const useDispatch = () => useDispatchUntyped<AppDispatch>();
 export const useSelector: TypedUseSelectorHook<StoreState> = useSelectorUntyped;

 type DefaultThunkApiConfig = { dispatch: AppDispatch; state: StoreState };
-export const createAsyncThunk = <Returned, ThunkArg = void, ThunkApiConfig = DefaultThunkApiConfig>(
+export const createAsyncThunk = <Returned, ThunkArg = void, ThunkApiConfig extends {} = DefaultThunkApiConfig>(
  typePrefix: string,
  payloadCreator: AsyncThunkPayloadCreator<Returned, ThunkArg, ThunkApiConfig>,
  options?: AsyncThunkOptions<ThunkArg, ThunkApiConfig>
-): AsyncThunk<Returned, ThunkArg, ThunkApiConfig> => createAsyncThunkUntyped(typePrefix, payloadCreator, options);
+): AsyncThunk<Returned, ThunkArg, ThunkApiConfig> =>
+  createAsyncThunkUntyped<Returned, ThunkArg, ThunkApiConfig>(typePrefix, payloadCreator, options);
--- a/yarn.lock
+++ b/yarn.lock
@ -3285,6 +3285,22 @@ __metadata:
  languageName: node
  linkType: hard

+"@babel/plugin-transform-runtime@npm:7.18.10":
+  version: 7.18.10
+  resolution: "@babel/plugin-transform-runtime@npm:7.18.10"
+  dependencies:
+    "@babel/helper-module-imports": ^7.18.6
+    "@babel/helper-plugin-utils": ^7.18.9
+    babel-plugin-polyfill-corejs2: ^0.3.2
+    babel-plugin-polyfill-corejs3: ^0.5.3
+    babel-plugin-polyfill-regenerator: ^0.4.0
+    semver: ^6.3.0
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 98c18680b4258b8bd3f04926b73c72ae77037d5ea5b50761ca35de15896bf0d04bedabde39a81be56dbd4859c96ffaa7103fbefb5d5b58a36e0a80381e4a146c
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-transform-runtime@npm:7.18.9":
  version: 7.18.9
  resolution: "@babel/plugin-transform-runtime@npm:7.18.9"
@ -3425,19 +3441,6 @@ __metadata:
  languageName: node
  linkType: hard

-"@babel/plugin-transform-typescript@npm:7.18.8":
-  version: 7.18.8
-  resolution: "@babel/plugin-transform-typescript@npm:7.18.8"
-  dependencies:
-    "@babel/helper-create-class-features-plugin": ^7.18.6
-    "@babel/helper-plugin-utils": ^7.18.6
-    "@babel/plugin-syntax-typescript": ^7.18.6
-  peerDependencies:
-    "@babel/core": ^7.0.0-0
-  checksum: 627211f1658870274fcabf38a71bb08ae219e3ac672423083574fabe2c857f28d39243cb7279adada8468c912a7beebc0622770ed66885a1e33b84ccc8bfd7df
-  languageName: node
-  linkType: hard
-
 "@babel/plugin-transform-typescript@npm:7.19.0":
  version: 7.19.0
  resolution: "@babel/plugin-transform-typescript@npm:7.19.0"
@ -5254,7 +5257,7 @@ __metadata:
    sinon: 14.0.0
    tinycolor2: 1.4.2
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
    uplot: 1.6.22
    xss: 1.0.13
  peerDependencies:
@ -5278,7 +5281,7 @@ __metadata:
    rollup-plugin-esbuild: ^4.9.1
    rollup-plugin-node-externals: ^4.1.0
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
  languageName: unknown
  linkType: soft

@ -5317,7 +5320,7 @@ __metadata:
    tracelib: 1.0.1
    ts-loader: 6.2.2
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
    uuid: 8.3.2
    webpack: 5.74.0
    yaml: ^2.0.0
@ -5425,7 +5428,7 @@ __metadata:
    rxjs: 7.5.6
    systemjs: 0.20.19
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
  peerDependencies:
    react: 17.0.2
    react-dom: 17.0.2
@ -5448,7 +5451,7 @@ __metadata:
    rollup-plugin-esbuild: ^4.9.1
    rollup-plugin-node-externals: ^4.1.0
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
  languageName: unknown
  linkType: soft

@ -5463,8 +5466,8 @@ __metadata:
    "@babel/plugin-proposal-optional-chaining": 7.18.9
    "@babel/plugin-syntax-dynamic-import": 7.8.3
    "@babel/plugin-transform-react-constant-elements": 7.18.9
-    "@babel/plugin-transform-runtime": 7.18.9
-    "@babel/plugin-transform-typescript": 7.18.8
+    "@babel/plugin-transform-runtime": 7.18.10
+    "@babel/plugin-transform-typescript": 7.19.0
    "@babel/preset-env": ^7.18.9
    "@babel/preset-react": ^7.18.6
    "@babel/preset-typescript": ^7.18.6
@ -5485,8 +5488,8 @@ __metadata:
    "@types/rimraf": 3.0.2
    "@types/semver": 7.3.9
    "@types/tmp": 0.2.3
-    "@typescript-eslint/eslint-plugin": 5.16.0
-    "@typescript-eslint/parser": 5.16.0
+    "@typescript-eslint/eslint-plugin": 5.36.2
+    "@typescript-eslint/parser": 5.36.2
    axios: ^0.26.1
    babel-jest: 27.5.1
    babel-loader: ^8.2.5
@ -5539,7 +5542,7 @@ __metadata:
    ts-loader: ^9.3.1
    ts-node: ^9.1.0
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
    url-loader: ^4.1.1
    webpack: ^5.72.0
  bin:
@ -5701,7 +5704,7 @@ __metadata:
    tinycolor2: 1.4.2
    ts-loader: 8.4.0
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
    uplot: 1.6.22
    uuid: 8.3.2
    webpack: 5.74.0
@ -5890,7 +5893,7 @@ __metadata:
    tinycolor2: 1.4.2
    tslib: 2.4.0
    tween-functions: ^1.2.0
-    typescript: 4.7.4
+    typescript: 4.8.2
  languageName: unknown
  linkType: soft

@ -8972,9 +8975,9 @@ __metadata:
  languageName: node
  linkType: hard

-"@reduxjs/toolkit@npm:1.8.3":
-  version: 1.8.3
-  resolution: "@reduxjs/toolkit@npm:1.8.3"
+"@reduxjs/toolkit@npm:1.8.5":
+  version: 1.8.5
+  resolution: "@reduxjs/toolkit@npm:1.8.5"
  dependencies:
    immer: ^9.0.7
    redux: ^4.1.2
@ -8988,7 +8991,7 @@ __metadata:
      optional: true
    react-redux:
      optional: true
-  checksum: 2c932ac6fa430b982108829a6150ca0c15ff617eb121b8055b91a89ab2124e8d93a1277ccdc96ff8af680fbde9d4c7021b1f924f11e28004ee61c6a7d39915bc
+  checksum: 831b5c74779262351d20efa0f4c06f794702bd55b14bd8f69362e29f82f7ad43aee66f39518914345ad9e9c6c93611acdeb576a70deda260733c3f098875aaca
  languageName: node
  linkType: hard

@ -12754,13 +12757,13 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/eslint-plugin@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/eslint-plugin@npm:5.31.0"
+"@typescript-eslint/eslint-plugin@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/eslint-plugin@npm:5.36.2"
  dependencies:
-    "@typescript-eslint/scope-manager": 5.31.0
-    "@typescript-eslint/type-utils": 5.31.0
-    "@typescript-eslint/utils": 5.31.0
+    "@typescript-eslint/scope-manager": 5.36.2
+    "@typescript-eslint/type-utils": 5.36.2
+    "@typescript-eslint/utils": 5.36.2
    debug: ^4.3.4
    functional-red-black-tree: ^1.0.1
    ignore: ^5.2.0
@ -12773,7 +12776,7 @@ __metadata:
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: a6d007e6cc6c7204b9ce09dd6670a5a29f8b75417a84c8238d1dd7fc3bfa4a7294beb961a0ba76e610b695a0c80edd4186803429e3605a21562c23e47b8efa37
+  checksum: edcd9fcecdeb22a689b421cafe3b7adc859bf2fd6227aecdd7412c319c808e7bab063c8f94af32116cfc971962f9780d181cb0a4aa999951c2d2be1f84c6c376
  languageName: node
  linkType: hard

@ -12794,20 +12797,20 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/parser@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/parser@npm:5.31.0"
+"@typescript-eslint/parser@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/parser@npm:5.36.2"
  dependencies:
-    "@typescript-eslint/scope-manager": 5.31.0
-    "@typescript-eslint/types": 5.31.0
-    "@typescript-eslint/typescript-estree": 5.31.0
+    "@typescript-eslint/scope-manager": 5.36.2
+    "@typescript-eslint/types": 5.36.2
+    "@typescript-eslint/typescript-estree": 5.36.2
    debug: ^4.3.4
  peerDependencies:
    eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: ae842105ff0e5811d54c9c020ee0568170c13f401de293eb4caa2106f3060558773b496b5647f2b80b2969a2890135c054f50e2443a13c3705d5965aa12896c0
+  checksum: d6cc22cbc7aacb5ecebf55eb1d681cb6b964b108e147b418295c3e48701a77768cff128c16da421ae50eabb9f1296ecec7fa3cc5f2ccb63a3febf79f98b4195f
  languageName: node
  linkType: hard

@ -12831,13 +12834,13 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/scope-manager@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/scope-manager@npm:5.31.0"
+"@typescript-eslint/scope-manager@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/scope-manager@npm:5.36.2"
  dependencies:
-    "@typescript-eslint/types": 5.31.0
-    "@typescript-eslint/visitor-keys": 5.31.0
-  checksum: f771adf54a7cf6387bb201a0d4bef598425818c38832cabbf33c369b3fb650932cbb81a28f198727f3ffae5e21445dde710c41c624bd10b3b7283249333b625b
+    "@typescript-eslint/types": 5.36.2
+    "@typescript-eslint/visitor-keys": 5.36.2
+  checksum: 93ff655f7c237c88ec6dc5911202dd8f81bd8909b27f1a758a9d77e9791040f1ee6fe2891314bde75c808ce586246e98003a1b1396937b0312f2440016dea751
  languageName: node
  linkType: hard

@ -12857,11 +12860,12 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/type-utils@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/type-utils@npm:5.31.0"
+"@typescript-eslint/type-utils@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/type-utils@npm:5.36.2"
  dependencies:
-    "@typescript-eslint/utils": 5.31.0
+    "@typescript-eslint/typescript-estree": 5.36.2
+    "@typescript-eslint/utils": 5.36.2
    debug: ^4.3.4
    tsutils: ^3.21.0
  peerDependencies:
@ -12869,7 +12873,7 @@ __metadata:
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: 1e98a6952207cf7d19cdac375a69bcfed953a29746fa1f2b3c7a8c9376c6984c0bb52506539b76d6a9bebc33966c825f032a27859e545447890562dd3c05ef31
+  checksum: c202b7d2cd08ed7f7d1ad7e430e9e1596478e147f0d485d02babfda0211c55fa950de1dc4d1c950008a8a047a31c1e982e97fe5558f93d496830eb9d9532bc71
  languageName: node
  linkType: hard

@ -12887,10 +12891,10 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/types@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/types@npm:5.31.0"
-  checksum: 1c4223a7dcbeb2fb52dc723ac366e2cc75549b21d71f5de8515e86e48d13324e4e136e75804e0f71aff56c9936ef494fa4d1e3eb2f189ed60cf8e2c7401ce372
+"@typescript-eslint/types@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/types@npm:5.36.2"
+  checksum: 736cb8a76b58f2f9a7d066933094c5510ffe31479ea8b804a829ec85942420f1b55e0eb2688fbdaaaa9c0e5b3b590fb8f14bbd745353696b4fd33fda620d417b
  languageName: node
  linkType: hard

@ -12930,12 +12934,12 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/typescript-estree@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/typescript-estree@npm:5.31.0"
+"@typescript-eslint/typescript-estree@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/typescript-estree@npm:5.36.2"
  dependencies:
-    "@typescript-eslint/types": 5.31.0
-    "@typescript-eslint/visitor-keys": 5.31.0
+    "@typescript-eslint/types": 5.36.2
+    "@typescript-eslint/visitor-keys": 5.36.2
    debug: ^4.3.4
    globby: ^11.1.0
    is-glob: ^4.0.3
@ -12944,7 +12948,7 @@ __metadata:
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: 921c502ac4c93df9342d29636b384e154c3ac714e2be0308a4c9d3337d24d8b4721b76cbe700f70c7ceef06b50dfc404e4d4d734e446fe319bac030cb653d7b4
+  checksum: 2827ff57a114b6107ea6d555f3855007133b08a7c2bafba0cfa0c935d8b99fd7b49e982d48cccc1c5ba550d95748d0239f5e2109893f12a165d76ed64a0d261b
  languageName: node
  linkType: hard

@ -12964,19 +12968,19 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/utils@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/utils@npm:5.31.0"
+"@typescript-eslint/utils@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/utils@npm:5.36.2"
  dependencies:
    "@types/json-schema": ^7.0.9
-    "@typescript-eslint/scope-manager": 5.31.0
-    "@typescript-eslint/types": 5.31.0
-    "@typescript-eslint/typescript-estree": 5.31.0
+    "@typescript-eslint/scope-manager": 5.36.2
+    "@typescript-eslint/types": 5.36.2
+    "@typescript-eslint/typescript-estree": 5.36.2
    eslint-scope: ^5.1.1
    eslint-utils: ^3.0.0
  peerDependencies:
    eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
-  checksum: 2a4200fd8812f7d7dfbe381d856e97da3606f0c59de78829edd297cc76b4851316bf8362b65e66c7db399e9ea31ec71943626ec12022a552bcb7bb591259ec49
+  checksum: 45356cf55a8733e3ab1f2c3c19cdaefdb79857e35eb1433c29b81f3df071e9cef8a286bc407abe243889a21d9e793e999f92f03b9c727a0fac1c17a48e64c42a
  languageName: node
  linkType: hard

@ -13016,13 +13020,13 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/visitor-keys@npm:5.31.0":
-  version: 5.31.0
-  resolution: "@typescript-eslint/visitor-keys@npm:5.31.0"
+"@typescript-eslint/visitor-keys@npm:5.36.2":
+  version: 5.36.2
+  resolution: "@typescript-eslint/visitor-keys@npm:5.36.2"
  dependencies:
-    "@typescript-eslint/types": 5.31.0
+    "@typescript-eslint/types": 5.36.2
    eslint-visitor-keys: ^3.3.0
-  checksum: 24ff3b9037b8fafe4f240b1c8a91981d658cd12a019f7961c9fe2f1d4dc84cf64e4071d865073191181b46652f4bd8f8cfc8e053ed8737ba1b9aede3e3252b3d
+  checksum: 87ccdcfa5cdedaa3a1aac30d656969f4f5910b62bcaacdf80a514dbf0cbbd8e79b55f8e987eab34cc79ece8ce4b8c19d5caf8b0afb74e0b0d7ab39fb29aa8eba
  languageName: node
  linkType: hard

@ -22169,7 +22173,7 @@ __metadata:
    "@react-types/menu": 3.7.1
    "@react-types/overlays": 3.6.1
    "@react-types/shared": 3.14.1
-    "@reduxjs/toolkit": 1.8.3
+    "@reduxjs/toolkit": 1.8.5
    "@rtsao/plugin-proposal-class-properties": 7.0.1-patch.1
    "@sentry/browser": 6.19.7
    "@sentry/types": 6.19.7
@ -22237,8 +22241,8 @@ __metadata:
    "@types/tinycolor2": 1.4.3
    "@types/uuid": 8.3.4
    "@types/webpack-env": 1.18.0
-    "@typescript-eslint/eslint-plugin": 5.31.0
-    "@typescript-eslint/parser": 5.31.0
+    "@typescript-eslint/eslint-plugin": 5.36.2
+    "@typescript-eslint/parser": 5.36.2
    "@visx/event": 2.6.0
    "@visx/gradient": 2.10.0
    "@visx/group": 2.10.0
@ -22414,7 +22418,7 @@ __metadata:
    ts-loader: 9.3.1
    ts-node: 10.9.1
    tslib: 2.4.0
-    typescript: 4.7.4
+    typescript: 4.8.2
    uplot: 1.6.22
    uuid: 8.3.2
    vendor: "link:./public/vendor"
@ -37217,7 +37221,17 @@ __metadata:
  languageName: node
  linkType: hard

-"typescript@npm:4.7.4, typescript@npm:>=2.7":
+"typescript@npm:4.8.2":
+  version: 4.8.2
+  resolution: "typescript@npm:4.8.2"
+  bin:
+    tsc: bin/tsc
+    tsserver: bin/tsserver
+  checksum: 7f5b81d0d558c9067f952c7af52ab7f19c2e70a916817929e4a5b256c93990bf3178eccb1ac8a850bc75df35f6781b6f4cb3370ce20d8b1ded92ed462348f628
+  languageName: node
+  linkType: hard
+
+"typescript@npm:>=2.7":
  version: 4.7.4
  resolution: "typescript@npm:4.7.4"
  bin:
@ -37229,7 +37243,7 @@ __metadata:

 "typescript@patch:typescript@4.6.4#~builtin<compat/typescript>":
  version: 4.6.4
-  resolution: "typescript@patch:typescript@npm%3A4.6.4#~builtin<compat/typescript>::version=4.6.4&hash=f456af"
+  resolution: "typescript@patch:typescript@npm%3A4.6.4#~builtin<compat/typescript>::version=4.6.4&hash=a1c5e5"
  bin:
    tsc: bin/tsc
    tsserver: bin/tsserver
@ -37237,9 +37251,19 @@ __metadata:
  languageName: node
  linkType: hard

-"typescript@patch:typescript@4.7.4#~builtin<compat/typescript>, typescript@patch:typescript@>=2.7#~builtin<compat/typescript>":
+"typescript@patch:typescript@4.8.2#~builtin<compat/typescript>":
+  version: 4.8.2
+  resolution: "typescript@patch:typescript@npm%3A4.8.2#~builtin<compat/typescript>::version=4.8.2&hash=a1c5e5"
+  bin:
+    tsc: bin/tsc
+    tsserver: bin/tsserver
+  checksum: 5cb0f02f414f5405f4b0e7ee1fd7fa9177b6a8783c9017b6cad85f56ce4c4f93e0e6f2ce37e863cb597d44227cd009474c9fbd85bf7a50004e5557426cb58079
+  languageName: node
+  linkType: hard
+
+"typescript@patch:typescript@>=2.7#~builtin<compat/typescript>":
  version: 4.7.4
-  resolution: "typescript@patch:typescript@npm%3A4.7.4#~builtin<compat/typescript>::version=4.7.4&hash=f456af"
+  resolution: "typescript@patch:typescript@npm%3A4.7.4#~builtin<compat/typescript>::version=4.7.4&hash=a1c5e5"
  bin:
    tsc: bin/tsc
    tsserver: bin/tsserver