Chartjs geo - Example USA map prints all features on top of the map

I'm having a hard time to create a properly working example of the chartjs geo package: https://www.npmjs.com/package/chartjs-chart-geo/v/4.1.2

I'm using Webpack with Laravel mix to import the dependencies:

import Chart from 'chart.js/auto';
import ChartDataLabels from 'chartjs-plugin-datalabels';
import { topojson, ChoroplethController, ProjectionScale, ColorScale, GeoFeature } from 'chartjs-chart-geo';

Chart.register(ChartDataLabels, ChoroplethController, ProjectionScale, ColorScale, GeoFeature);
Chart.defaults.set('plugins.datalabels', {
    color: 'white',
    textStrokeWidth: 2,
    textStrokeColor: '#363636',
    // textShadowBlur: 1,
    // textShadowColor: '363636',

    font: {
        family: 'lato, sans-serif',
        size: 16,
        weight: 600
    }

});

window.Chart = Chart;
window.topojson = topojson;

Here's the package.json:

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "mix",
        "watch": "mix watch",
        "watch-poll": "mix watch -- --watch-options-poll=1000",
        "hot": "mix watch --hot",
        "prod": "npm run production",
        "production": "mix --production"
    },
    "devDependencies": {
        "laravel-mix": "^6.0.6"
    },
    "dependencies": {
        "chart.js": "^4.1.0",
        "chartjs-chart-geo": "^4.1.0",
        "chartjs-plugin-datalabels": "^2.1.0",
        "datamaps": "^0.5.9"
    }
}

Here's the code I try to run:

<div  class="p-2 space-y-2 bg-white border-1 border-neutral-200 rounded-md shadow">
    <canvas class="container" id="testtesttest"></canvas>
</div>

<style>
    .container {
        height: 1200px;
        min-width: 310px;
        max-width: 800px;
        margin: 0 auto;
    }

    .loading {
        margin-top: 10em;
        text-align: center;
        color: gray;
    }
</style>
@push('scripts')
    <script>
        function test(){
            fetch('https://unpkg.com/us-atlas/states-10m.json').then((r) => r.json()).then((us) => {
                const nation = topojson.feature(us, us.objects.nation).features[0];
                let states = topojson.feature(us, us.objects.states).features;
                states = states.map((d) => ({feature: d, value: Math.random() * 10}));

                const chart = new Chart(document.getElementById("testtesttest").getContext("2d"), {
                    type: 'choropleth',
                    data: {
                        datasets: [{
                            data: states,
                        }]
                    }
                });
            });

        }

        test();

    </script>
@endpush

Which results in the following map:

Anyone seen this issue before? I've tried to use multiple versions of chartjs and chartjs geo (tried 4.1.2 and 3.9.0) but I seem to get the same error. I also tried to render a worldmap which has exactly the same issue:

With thanks to Maxi Schvindt, which triggered me to look into the labels. I had turned on the chartjs-plugin-datalabels plugin. After turning it off, it started working.