eduardoborges / use-mask-input

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

Type error when using the lib with @types/react@18.3.0 and @types/react-dom@18.3.0 #80

Closed adrianorocha-dev closed 5 months ago

adrianorocha-dev commented 7 months ago

I recently updated react and react-dom to their latest versions, and I ran into the following error when compiling my project: Type '(input: HTMLInputElement | null) => HTMLInputElement | null | undefined' is not assignable to type '((instance: HTMLInputElement | null) => void | (() => VoidOrUndefinedOnly)) | RefObject<HTMLInputElement> | null | undefined'.

I went into the .d.ts file to investigate, and I was able to solve the problem by changing the withMask type from:

declare const withMask: (mask: Mask, options?: Options) => (input: Input) => Input;

to:

declare const withMask: (mask: Mask, options?: Options) => (input: Input) => void;
adrianorocha-dev commented 6 months ago

I was reading about the upcoming React 19 update, and found something that maybe related. https://react.dev/blog/2024/04/25/react-19#cleanup-functions-for-refs Apparently refs will now support cleanup function and as such, we cannot return anything other than a function from a ref function. Maybe the react types has already updated to reflect that.

eduardoborges commented 5 months ago

@adrianorocha-dev Published on #83