JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/sankey.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container"></div>

CSS

#container {
    min-width: 300px;
    max-width: 800px;
    height: 400px;
    margin: 1em auto;
}

JavaScript

Highcharts.chart('container', {

    title: {
        text: 'Sankey diagram'
    },

    series: [{
        keys: ['from', 'to', 'weight'],
        data: [
            ['A', '', 7],
            ['', 'C', 7],
            ['A', 'B', 5],
            ['B', 'C', 5]

        ],
        nodes: [{
            "id": "A",
            column: [0],
            color: "blue"
        }, {
            "id": "B",
            column: [1],
            color: "red"
        },{
            "id": "",
            column: [1],
            color: "blue"
        },{
            "id": "C",
            column: [2],
            color: "green"
        }],
        type: 'sankey',
        name: 'Flow'
    }]

});