React phone number input

React phone number input

import React, {useState} from 'react'
export function PhoneNumberInput() {
  const [number, setNumber] = useState<string>("");
  const validate = (e: React.ChangeEvent<HTMLInputElement>) => {
    const val = e.target.value;
    let nVal = val.replace(/\D/g, "");
    if (nVal.length > 10) nVal = nVal.slice(0, 10);
    if (nVal.length > 6) nVal = `${nVal.slice(0, 6)}-${nVal.slice(6)}`;
    if (nVal.length > 3) nVal = `(${nVal.slice(0, 3)})${nVal.slice(3)}`;
    setNumber(nVal);
  }
  return <input onChange={validate} value={number} data-testid="phone-number-input"/>
}