JSFiddle - React, Tailwind, and code Playground

HTML

<h1>log</h1><div id="log"></div>
<h1>result</h1><div id="result"></div>

<textarea cols="80" rows="10" id="input">
[UM08A31] [UM08A51] [UM08A71] [UM08A72] [UM08A73] [UM08A74] [UM08B31] [UM08B51] [UM08B71] [UM08B72] [UM08B73] [UM08B74]  HSTNN-I97C-3, HSTNN-I97C-4, HSTNN-I98C-5, HSTNN-I99C-3, HSTNN-I99C-4, HSTNN-IB2R, HSTNN-LB2R, HSTNN-OB2R, HSTNN-OB2T, HSTNN-Q87C-4, HSTNN-Q87C-5, HSTNN-Q88C-4, HSTNN-Q88C-5, HSTNN-Q89C, HSTNN-XB2E, HSTNN-XB2F [nokia 3310] [щачло попячтса]gfg добавим немножко ошибок [] fg][fg[    
</textarea>

<button id="btn">пущ!</button>

CSS

h1 {
    font-size: 120%;
    margin: 5px 0;
    padding: 0;
    background-color: #ffc;
}
.badge {
    float: left;
    margin: .1em .2em; padding: .1em .2em;
    background-color: #9f9;
    border-radius: 2px;
}

JavaScript

$('#btn').click(function(){
        var textarea = $('#input')
        var input = textarea.val()
        
        $('div#result').html('')
        $('div#log').html('')
        
        var myLogger = function(txt) {
            $('div#log').append('<div>'+txt+'</div>')
        }
        
        if(input.length) {
            // get shielded values protected with []
            var inRange = false
            var shieldedValues = []
            var val = ''
            var unparsed = ''
            var shieldStartPos = 0
            var shieldEndPos = 0
            
            for(var i in input) {
                ch = input[i]
                if(ch == '[') {
                    if(inRange) {
                        myLogger('лишняя открывающая скобка, на позиции '+i)
                    }
                    inRange = true
                    shieldStartPos = i
                } else if(ch == ']') {
                    if(!inRange) {
                        myLogger('лишняя закрывающая скобка, на позиции '+i)
                    }
                    inRange = false
                    shieldEndPos = i
                    if(val.length) {
                        // TODO: check in original values
                        shieldedValues.push(val)
                    }
                    val = ''
                } else if(inRange) {
                    val += ch
                } else {
                    unparsed += ch
                }
            }
            if(inRange) myLogger('не закрыта скобка ' + shieldStartPos)
            myLogger('shieldedValues: ' + shieldedValues)
            myLogger('unparsed: ' + unparsed)
            
            
            var output = ''
            var splitted = unparsed.replace(/\n/g, ' ')
                                   .replace(/\t/g, ' ')
                                   .replace(/,/g, ' ')
                                   .replace(/;/g, ' ')
                                   .split(' ')

            for(var...