JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="text"></textarea>

<p id="parag"></p>

Height:<br />
<input type="text" id="height" /><br />

<br />

Text length:<br />
<input type="text" id="count" />

CSS

textarea{
	width:250px;
	height:60px;
}

p{
	width:250px;
	min-height:20px;
	border:1px solid black;
}

JavaScript

var limits = {
	textarea: 100,
	paragraph: 50
};

var text   = document.getElementById('text'),
	parag  = document.getElementById('parag'),
	height = document.getElementById('height'),
    count  = document.getElementById('count');

var textOnKeyDown1 = function(evt)
{
	if (evt !== undefined)
	{
		var unicode = evt.keyCode ? evt.keyCode : evt.charCode;
	}
	
	else if (event !== undefined)
	{
		var unicode = event.keyCode ? event.keyCode : event.charCode;
	}
	
    if (unicode !== 8 && (unicode < 33 || unicode > 40) && unicode !== 46)
	{
		switch(true)
		{
			case (this.value.length >= limits.textarea):
			case (parag.scrollHeight >= limits.paragraph):
			{
				console.log("OK");
				this.onkeydown = textOnKeyDown2;
				return false;
			}
		}
	}
};

var textOnKeyDown2 = function(evt)
{
	if (evt !== undefined)
	var unicode = evt.keyCode ? evt.keyCode : evt.charCode;	
	
	else if (event !== undefined)
	var unicode = event.keyCode ? event.keyCode : event.charCode;
	
	
    if (unicode === 8 || (unicode >= 33 && unicode <= 40) || unicode === 46)
    {
    	console.log("OK");
    	this.onkeydown = textOnKeyDown1;
    }
	

    else return false;
};

var textOnKeyUp1 = function(evt)
{
	if (evt !== undefined)
	var unicode = evt.keyCode ? evt.keyCode : evt.charCode;	
	
	else if (event !== undefined)
	var unicode = event.keyCode ? event.keyCode : event.charCode;
	
	
	if (unicode < 33 || unicode > 40)
	{
		this.value      = this.value.substr(0, limits.textarea);
		parag.innerHTML = this.value;
		height.value    = parseInt(getStyle(parag, 'height')) || parag.offsetHeight,
    	count.value     = this.value.length;
    } 
};

var getStyle = function(elm, styleName)
{
	if (typeof(elm) !== 'object')
	return;
	
	if (elm.currentStyle)
	return elm.currentStyle[styleName];
	
	else if (window.getComputedStyle)
	return document.defaultView.getComputedStyle(elm,null).getPropertyValue(styleName);
}
	
text.onkeydown = textOnKeyDown1;
text.onkeyup   = textOnKeyUp1;
text.onblur    = text.onkeyup;