JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="test" onBlur="addCommas(this)">
<input type="hidden" id="testRealValue">

JavaScript

function isNumber(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
}
function addCommas(input){
    nStr = input.value;
    if(!isNumber(nStr))return;
    document.getElementById("testRealValue").value = nStr;
    var offset = nStr.length % 3;
    if (offset == 0)
        input.value = nStr.substring(0, offset) + nStr.substring(offset).replace(/([0-9]{3})(?=[0-9]+)/g, "$1,");
    else
        input.value = nStr.substring(0, offset) + nStr.substring(offset).replace(/([0-9]{3})/g,    ",$1");
}