JSFiddle - React, Tailwind, and code Playground

by Ztyx

HTML

<script src="https://raw.github.com/jackmoore/autosize/master/jquery.autosize-min.js"></script>
<textarea name="fieldname1" class="input-hidden-until-focused not-resizable blur-on-return-key-down autosized" style="width: 100%;">
To be or not to be; that is the question
Whether 'tis nobler in the mind to suffer,
the slings and arrows of outrageous fortune;
or to take arms against a sea of troubles</textarea>

CSS

.input-hidden-until-focused {
    border: none;
    cursor: pointer;
}
.input-hidden-until-focused:focus {
    cursor: text;
}

.not-resizable {
    resize: none;
}

JavaScript

jQuery(function() {
    $('.blur-on-return-key-down').keydown(function(e) {
        if (e.keyCode==13) {
            $(e.target).blur();
        }
    });
    $('.autosized').autosize();
});