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) {
    var scrollHeight = input[0].scrollHeight,
        clientHeight = input[0].clientHeight;

    if (clientHeight < scrollHeight) {
        var paddingTop = parseFloat(input.css("padding-top")),
            paddingBottom = parseFloat(input.css("padding-bottom")),
            paddingHeight = paddingTop + paddingBottom;

        input.height(scrollHeight - paddingHeight + extraLineHeight);
    }
};

$('.textdiv').on("keyup change input paste", function () {
    clearTimeout(keyupTimeout);
    var input = $(this);
    keyupTimeout = setTimeout(function () {
        textareaChanged(input);
    }, keyupTimeoutBuffer);
});