JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
<textarea id="ta" class="autosize"></textarea>
</div>

CSS

textarea.autosize { width: 20%; overflow: hidden; }
div.box { margin: 1em; padding: 1em; background: #eee; }

JavaScript

var shadow = document.createElement('textarea');
shadow.className = 'autosize';
shadow.visibility = 'hidden';


document.getElementById('ta').onkeyup = function() {
    
    this.parentNode.appendChild(shadow);
    shadow.value = this.value + '\n';
    
    if (shadow.scrollHeight > shadow.offsetHeight) {
        this.style.height = shadow.scrollHeight + 'px';
    }
    
    this.parentNode.removeChild(shadow);

}