react-chartjs-2 v3.0.5 not recognizing the "cutout" property inside the config options for Doughnut chart

[georgewfsantos]

Hello,
We are having an issue in our React application where cutout is not recognized as part of the config options for the Doughnut chart. The problem happened after the lib was upgraded to version 3.0.5 and we're using chart.js v3.5.1. We've tried a lot of things but the problem seems to be type related, since after adding " as any " to the config object inside the options prop, the problem disappears. I'm also attaching some screenshots below showing the error and that it disappears after typying the object as "any".Thank you in advance.
The code is as follows:

<Doughnut
              data={{
                labels: recognitionsByEvent.breakdown.map(
                  breakdown => breakdown.name,
                ),
                datasets: [
                  {
                    data: recognitionsByEvent.breakdown.map(
                      breakdown => breakdown.total,
                    ),
                    backgroundColor: getRandomColor(),
                  },
                ],
              }}
              height={200}
              options={{
                maintainAspectRatio: false,
                responsive: true,
                cutout: '75%',
                plugins: {
                  legend: { display: false },
                },
              }}
            /> 

[esslamben]

Can confirm TS is giving us the same errors for the cutout property.

[honzahruby]

The Doughnut component doesn't correctly recognize its respective type of options. As a workaround, you can give it a hint and cast your options object to ChartOptions<'doughnut'>

[dangreen]

@georgewfsantos Hi. Can you try react-chartjs-2@v3.1.1? Is this issue still there?

[georgewfsantos]

@dangreen Hi. We need to take some time to test with that version. As soon as we do that, I'll let you know. Thanks.