eduardoborges / use-mask-input

✏️ A react Hook for build elegant input masks. Compatible with React Hook Form
https://npmjs.com/package/use-mask-input
265 stars 13 forks source link

Dynamic mask #67

Open riessnico opened 10 months ago

riessnico commented 10 months ago

Hi, congratulations on the amazing library first!

Is there a way to apply dynamic masking? I could not make it work with the examples provided on the doc. I am using react-hook-form as the form manager. The input is abstracted away using the withHookFormMask under the hood and I tried to experiment with the options from the third argument of this function with no success, though.

The same input could be either an email or a telephone number and I wanted to show the mask if the input is a telephone.

Thanks again!

eduardoborges commented 8 months ago

Hey @riessnico im sorry about the response time.

In docs i describe how dynamic masks works. i know, i need to describe better :/

In your case, this mask resolves.

<input type="text" ref={withMask(["(99) 9999 9999", "(99) 9 9999 9999", "*{1,20}[.*{1,20}][.*{1,20}][.*{1,20}]@*{1,20}[.*{2,6}][.*{1,2}]"])} />