JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<body>
    <textarea id="cagetextbox" placeholder='Auto-Expanding Textarea'></textarea>
</body>

CSS

textarea {
    display:block;
    box-sizing: padding-box;
    overflow:hidden;
    padding:10px;
    width:250px;
    font-size:14px;
    margin:50px auto;
    border-radius:8px;
    border:6px solid #556677;
}

JavaScript

function autoheight(a) {
    if (!$(a).prop('scrollTop')) {
        do {
            var b = $(a).prop('scrollHeight');
            var h = $(a).height();
            $(a).height(h - 5);
        }
        while (b && (b != $(a).prop('scrollHeight')));
    };
    $(a).height($(a).prop('scrollHeight'));
}

$("#cagetextbox").on("keyup change", function (e) {
    autoheight(this);
});

function updateTextbox(text) {
    $('#cagetextbox').val(text);
    autoheight($("#cagetextbox"));
};

updateTextbox("filetext filetext filetext filetext filetext filetext grow please I beg you sweet textbox with the nice css Come on!");