JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="t">
Line1
Line2
Line3
Line4
Line5
Line6
Line7
Line8
Line9
Line10
Line11
Line12</textarea>

<br />If you try to add a trailing space on a line, the line cursor will jump to the last line.

CSS

textarea{
    height: 100px; width: 200px; resize: none;
}

JavaScript

$("textarea").on('input',function(){
    var currentPosition = this.selectionStart;
    var trimmedInput = $.map($(this).val().split(""), function(line){
        return $.trim(line).substring(0,10);
    });
    
    $("textarea").val(trimmedInput.join("\n"));
     setSelectionRange(this, currentPosition, currentPosition);
    
});

function setSelectionRange(input, selectionStart, selectionEnd) {
  if (input.setSelectionRange) {
    input.focus();
    input.setSelectionRange(selectionStart, selectionEnd);
  }
  else if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(true);
    range.moveEnd('character', selectionEnd);
    range.moveStart('character', selectionStart);
    range.select();
  }
}