TypeScript Compile Error for Mixed Chart Type

## Issue
I'm unable to get the below TypeScript to compile due to a type error when using a mixed chart type. According to the [Chart.js documentation](https://www.chartjs.org/docs/latest/charts/mixed.html) the *type* property is set on each dataset when creating a mixed chart (not outside of it like all other charts). The [chartjs-plugin-datalabels documentation](https://chartjs-plugin-datalabels.netlify.app/guide/getting-started.html#configuration) states that the plugin options can be set per data level so I'm unsure as to why this error is happening. Any insight is appreciated. Thank you!

``` typescript
import { Chart } from "chart.js/auto";
import ChartDataLabels from "chartjs-plugin-datalabels";

const chart = new Chart(document.getElementById("mixed"), {
plugins: [ChartDataLabels],
data: {
datasets: [
{
// Change options only for labels of THIS DATASET
datalabels: { // <-- these three lines cause the error
color: "#FFCE56", //
}, //
type: "bubble",
label: "Bar Dataset",
data: [
// 10, 20, 30, 40,
{ x: 15, y: 20, r: 10 },
{ x: 25, y: 10, r: 20 },
],
},
{
type: "line",
label: "Line Dataset",
data: [
{ x: 10, y: 10 },
{ x: 20, y: 20 },
{ x: 30, y: 30 },
],
},
],
},
});
```

Here is the full error:
```
[tsl] ERROR in /home/isaac/typescript/my-project/src/index.ts(10,9)
TS2345: Argument of type '{ plugins: Plugin[]; data: { datasets: ({ datalabels: { color: string; }; type: "bubble"; label: string; data: { x: number; y: number; r: number; }[]; } | { ...; })[]; }; }' is not assignable to parameter of type 'ChartConfiguration | ChartConfigurationCustomTypesPerDataset'.
Type '{ plugins: Plugin[]; data: { datasets: ({ datalabels: { color: string; }; type: "bubble"; label: string; data: { x: number; y: number; r: number; }[]; } | { ...; })[]; }; }' is not assignable to type 'ChartConfigurationCustomTypesPerDataset'.
The types of 'data.datasets' are incompatible between these types.
Type '({ datalabels: { color: string; }; type: "bubble"; label: string; data: { x: number; y: number; r: number; }[]; } | { type: "line"; label: string; data: { x: number; y: number; }[]; })[]' is not assignable to type 'ChartDatasetCustomTypesPerDataset[]'.
Type '{ datalabels: { color: string; }; type: "bubble"; label: string; data: { x: number; y: number; r: number; }[]; } | { type: "line"; label: string; data: { x: number; y: number; }[]; }' is not assignable to type 'ChartDatasetCustomTypesPerDataset'.
Type '{ datalabels: { color: string; }; type: "bubble"; label: string; data: { x: number; y: number; r: number; }[]; }' is not assignable to type 'ChartDatasetCustomTypesPerDataset'.
Object literal may only specify known properties, and 'datalabels' does not exist in type '_DeepPartialObject<{ type: "bubble"; } & BubbleControllerDatasetOptions> & ChartDatasetPropertiesCustomTypesPerDataset'.
```

## Environment Info
I'm using VS Code for editing and Webpack when compiling.

**Chart.js:** 4.0.1
**chartjs-plugin-datalabels:** 2.2.0

**TypeScript:** 4.9.4
tsconfig.json
```
{
"compilerOptions": {
"outDir": "./dist/",
"noImplicitAny": true,
"target": "es5",
"module": "es6",
"allowJs": true,
"jsx": "react",
"moduleResolution": "node",
"sourceMap": true
}
}
```

webpack.config.js
```
const path = require("path");

module.exports = {
entry: "./src/index.ts",
devtool: "inline-source-map",
module: {
rules: [
{
test: /\.tsx?$/,
use: "ts-loader",
exclude: /node_modules/,
},
],
},
resolve: {
extensions: [".tsx", ".ts", ".js"],
},
output: {
filename: "bundle.js",
path: path.resolve(__dirname, "dist"),
},
};
```