JSFiddle - React, Tailwind, and code Playground

HTML

<div class="sq">
    <input id="id_sq_pl" name="sq_pl" type="number" value="" />
</div>

CSS

/* странная реактиция у формы
хотелось бы:
- если () пустое поле, то все ОК
- если (a) буква, то что-то к примеру alert
- если (1 -> 1) число - ОК
- если (1,1 -> 1,1; 1.1 -> 1,1) дробное число, до 1 цифры после запятой - ОК
- если (1,11111 -> 1,1) дробное больше 1 цифры, то все лишние округляются, и - Ок
- если (,5 -> 0,5; .5 -> 0,5) начинается с точки или запятой, в любом случае и .и, превращается в запятую
*/

JavaScript

document.getElementById('id_sq_pl').onblur = function() {
    if (/^[0-9]?\d{0,5}[\.,]?\d{0,1}$/.test(this.value)) {
        this.value = ((Math.round(((this.value).replace(',','.'))*10)/10)+'').replace('.',',');
    } else {
        alert('Введите число');
    }
}