JSFiddle - React, Tailwind, and code Playground
HTML
<div class="mydiv">
<textarea class="textdiv"></textarea>
</div>
CSS
.mydiv {
width:100%;
overflow:auto;
}
.textdiv {
width:100%;
height:auto;
}
JavaScript
var extraLineHeight = 15,
keyupTimeoutBuffer = 100,
keyupTimeout;
function textareaChanged(input) {
input.style.height = "1px";
input.style.height = (extraLineHeight+input.scrollHeight)+"px";
};
$('.textdiv').on("keyup change input paste", function () {
clearTimeout(keyupTimeout);
var input = this;
keyupTimeout = setTimeout(function () {
textareaChanged(input);
}, keyupTimeoutBuffer);
});