React Hook Form создание маски

У меня есть форма созданная при помощи react-hook-form. Мне необходимо сделать маску , которая бы автоматически добавляла тире в нужные места. Я пытался сделать это при помощи react-text-mask однако, несмотря на то что в интернете есть примеры как можно совместить эти две библиотеки, на данный момент они не работают.

Сейчас я нашел ролик на Youtube в котором показан процесс создания маски. Однако мои попытки создать регулярное выражение для нужных мне полей ввода оказались провальными.

Вот код из видео:

const normalizeCardNumber = (value)=>{
    return value.replace(/\s/g,'').match(/.{1,4}/g).join(" ").substr(0,19) || ""

Мне нужно регулярное выражение для .match()

Можете пожалуйста объяснить как создать подобное выражение на одном из 3 примеров ниже, чтобы я смог сам написать оставшиеся (в видео показано на примере карты, где все 4 группы одного размера, а мне необходимо создать несколько групп разной длинны):

  1. Регулярное выражение, которое бы создало маску формата 00-0000000
  2. Регулярное выражение, которое бы создало маску формата 0-000-000-0000 (номер телефона)
  3. Регулярное выражение, которое бы создало маску формата 000-00-0000

Если вы знаете другой способ сделать маску для react-hook-form нужного мне формата, пожалуйста напишите его.


Ответы (0 шт):