JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="code">// some code here</textarea>

JavaScript

$('#code').keydown(function(e){
    if (e.keyCode == 9) { // tab
        e.preventDefault();
        if (!e.shiftKey) {
            var text = $(this).val().substr(0, getCaret(this)) + '\t' + $(this).val().substr(getCaret(this), $(this).val().length);
            $(this).val(text);
        } else {
            var text = $(this).val().substr(getCaret(this) - 1, 1);
            if (text == '\t') {
                var newText = $(this).val().substr(0, getCaret(this) - 1) + $(this).val().substr(getCaret(this), $(this).val().length - getCaret(this));
                $(this).val(newText);
            }
        }
    }
});

function getCaret(el) { 
  if (el.selectionStart) { 
    return el.selectionStart; 
  } else if (document.selection) { 
    el.focus(); 

    var r = document.selection.createRange(); 
    if (r == null) { 
      return 0; 
    } 

    var re = el.createTextRange(), 
        rc = re.duplicate(); 
    re.moveToBookmark(r.getBookmark()); 
    rc.setEndPoint('EndToStart', re); 

    return rc.text.length; 
  }  
  return 0; 
}