JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<div id="container" style="min-width: 400px; height: 00px; margin: 0 auto"></div>

JavaScript

$(function () {
    (function (H) {

        H.seriesTypes.boxplot.prototype.pointArrayMap = ['low', 'q1', 'median', 'q3', 'high', 'mean'];

        H.seriesTypes.boxplot.prototype.toYData = function (point) {
            return [point.low, point.q1, point.median, point.q3, point.high, point.mean];
        };

        H.wrap(H.seriesTypes.boxplot.prototype, 'drawPoints', function (p) {
            p.call(this);
            var chart = this.chart,
                r = chart.renderer,
                xAxis = this.xAxis,
                yAxis = this.yAxis,
                x, y;

            H.each(this.points, function (p, i) {
                x = p.shapeArgs.x;
                y = p.meanPlot;

                if (p.meanPlotX) {
                    p.meanPlotX.attr({
                        d: ['M', x, y, 'L', x + p.shapeArgs.width, y]
                    });
                } else {
                    p.meanPlotX = r.path(['M', x, y, 'L', x + p.shapeArgs.width, y]).attr({
                        stroke: 'black',
                            'stroke-width': 2
                    }).add(p.series.group);
                }

            });
        });

    })(Highcharts)


    $('#container').highcharts({

        chart: {
            type: 'boxplot',
            inverted: true
        },

        title: {
            text: 'Sample Base Salary Range'
        },

        legend: {
            enabled: false
        },

        xAxis: {
            categories: ['4', '3', '2', '1', '0'],
            title: {
                text: 'Job Level'
            }
        },

        yAxis: {
            title: {
                text: 'Base Salary'
            }
        },

        plotOptions: {
            boxplot: {
                fillColor: '#F0F0E0',
                lineWidth: 2,
                medianColor: '#0C5DA5',
                medianWidth: 3
            }
        },

        series: [{
            name: "Observation Data",
            data: [{
                x: '0',
...