use-mask-input 3.7.2 → 3.7.4

package/dist/index.cjs

@@ -1,36 +1,26 @@
 'use strict';
 
-var chunkNIHSNNRR_cjs = require('./chunk-NIHSNNRR.cjs');
+var chunkVK6LQ75W_cjs = require('./chunk-VK6LQ75W.cjs');
 var react = require('react');
 
 function useMaskInput(props) {
   const { mask, register, options } = props;
   const ref = react.useRef(null);
-  const maskInput = react.useMemo(
-    () => chunkNIHSNNRR_cjs.isServer_default ? null : chunkNIHSNNRR_cjs.createMaskInstance(mask, options),
-    [mask, options]
-  );
+  const maskRef = react.useRef(mask);
+  const optionsRef = react.useRef(options);
   const refCallback = react.useCallback((input) => {
     if (!input) {
       ref.current = null;
       return;
     }
-    ref.current = chunkNIHSNNRR_cjs.resolveInputRef(input);
+    ref.current = chunkVK6LQ75W_cjs.resolveInputRef(input);
+    chunkVK6LQ75W_cjs.withMask(maskRef.current, optionsRef.current)(ref.current);
   }, []);
   react.useEffect(() => {
-    if (chunkNIHSNNRR_cjs.isServer_default || !ref.current) return;
-    if (!chunkNIHSNNRR_cjs.isHTMLElement(ref.current)) {
-      return;
-    }
-    const inputElement = chunkNIHSNNRR_cjs.findInputElement(ref.current);
-    if (maskInput && inputElement && chunkNIHSNNRR_cjs.isHTMLElement(inputElement)) {
-      maskInput.mask(inputElement);
-    }
-    if (register && chunkNIHSNNRR_cjs.isHTMLElement(ref.current)) {
-      register(ref.current);
-    }
-  }, [mask, register, options, maskInput]);
-  if (chunkNIHSNNRR_cjs.isServer_default) {
+    if (chunkVK6LQ75W_cjs.isServer_default || !ref.current || !register) return;
+    register(ref.current);
+  }, [register]);
+  if (chunkVK6LQ75W_cjs.isServer_default) {
     return () => {
     };
   }
@@ -43,49 +33,27 @@ function useHookFormMask(registerFn) {
       if (!registerFn) throw new Error("registerFn is required");
       const registerReturn = registerFn(fieldName, options);
       const { ref } = registerReturn;
-      const cacheKey = chunkNIHSNNRR_cjs.makeMaskCacheKey(fieldName, mask);
+      const cacheKey = chunkVK6LQ75W_cjs.makeMaskCacheKey(fieldName, mask);
       if (!refCache2.has(cacheKey)) {
         const applyMaskToRef = (_ref) => {
-          if (_ref) chunkNIHSNNRR_cjs.applyMaskToElement(_ref, mask, options);
+          if (_ref) chunkVK6LQ75W_cjs.applyMaskToElement(_ref, mask, options);
           return _ref;
         };
         refCache2.set(
           cacheKey,
-          ref ? chunkNIHSNNRR_cjs.flow(applyMaskToRef, ref) : applyMaskToRef
+          ref ? chunkVK6LQ75W_cjs.flow(applyMaskToRef, ref) : applyMaskToRef
         );
       }
       const result = {
         ...registerReturn,
         ref: refCache2.get(cacheKey)
       };
-      chunkNIHSNNRR_cjs.setPrevRef(result, ref);
+      chunkVK6LQ75W_cjs.setPrevRef(result, ref);
       return result;
     };
   }, [registerFn]);
 }
 
-// src/api/withMask.ts
-var import_inputmask = chunkNIHSNNRR_cjs.__toESM(chunkNIHSNNRR_cjs.require_inputmask(), 1);
-var callbackCache = /* @__PURE__ */ new Map();
-function withMask(mask, options) {
-  if (!options) {
-    const cacheKey = chunkNIHSNNRR_cjs.makeMaskCacheKey("", mask);
-    if (callbackCache.has(cacheKey)) {
-      return callbackCache.get(cacheKey);
-    }
-  }
-  const callback = (input) => {
-    if (chunkNIHSNNRR_cjs.isServer_default || mask === null || !input) return;
-    const maskInput = chunkNIHSNNRR_cjs.interopDefaultSync(import_inputmask.default)(chunkNIHSNNRR_cjs.getMaskOptions(mask, options));
-    maskInput.mask(input);
-  };
-  if (!options) {
-    const cacheKey = chunkNIHSNNRR_cjs.makeMaskCacheKey("", mask);
-    callbackCache.set(cacheKey, callback);
-  }
-  return callback;
-}
-
 // src/api/withHookFormMask.ts
 var refCache = /* @__PURE__ */ new WeakMap();
 function withHookFormMask(register, mask, options) {
@@ -95,35 +63,38 @@ function withHookFormMask(register, mask, options) {
       ...register,
       ref: null
     };
-    chunkNIHSNNRR_cjs.setPrevRef(result2, ref);
+    chunkVK6LQ75W_cjs.setPrevRef(result2, ref);
     return result2;
   }
   if (!refCache.has(ref)) {
     refCache.set(ref, /* @__PURE__ */ new Map());
   }
   const maskCache = refCache.get(ref);
-  const cacheKey = chunkNIHSNNRR_cjs.makeMaskCacheKey(register.name, mask);
+  const cacheKey = chunkVK6LQ75W_cjs.makeMaskCacheKey(register.name, mask);
   if (!maskCache?.has(cacheKey)) {
     const applyMaskToRef = (_ref) => {
-      if (_ref) chunkNIHSNNRR_cjs.applyMaskToElement(_ref, mask, options);
+      if (_ref) chunkVK6LQ75W_cjs.applyMaskToElement(_ref, mask, options);
       return _ref;
     };
     maskCache?.set(
       cacheKey,
-      chunkNIHSNNRR_cjs.flow(applyMaskToRef, ref)
+      chunkVK6LQ75W_cjs.flow(applyMaskToRef, ref)
     );
   }
   const result = {
     ...register,
     ref: maskCache?.get(cacheKey)
   };
-  chunkNIHSNNRR_cjs.setPrevRef(result, ref);
+  chunkVK6LQ75W_cjs.setPrevRef(result, ref);
   return result;
 }
 
+Object.defineProperty(exports, "withMask", {
+  enumerable: true,
+  get: function () { return chunkVK6LQ75W_cjs.withMask; }
+});
 exports.useHookFormMask = useHookFormMask;
 exports.useMaskInput = useMaskInput;
 exports.withHookFormMask = withHookFormMask;
-exports.withMask = withMask;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/api/useMaskInput.ts","../src/api/useHookFormMask.ts","../src/api/withMask.ts","../src/api/withHookFormMask.ts"],"names":["useRef","useMemo","isServer_default","createMaskInstance","useCallback","resolveInputRef","useEffect","isHTMLElement","findInputElement","refCache","makeMaskCacheKey","applyMaskToElement","flow","setPrevRef","__toESM","require_inputmask","interopDefaultSync","inputmask","getMaskOptions","result"],"mappings":"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","file":"index.cjs","sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport {\n  createMaskInstance, findInputElement, isHTMLElement, resolveInputRef,\n} from '../core';\nimport isServer from '../utils/isServer';\n\nimport type { Input, Mask, Options } from '../types';\n\ninterface UseMaskInputOptions {\n  mask: Mask;\n  register?: (element: HTMLElement) => void;\n  options?: Options;\n}\n\n/**\n * React hook for applying input masks to form elements.\n * Works with Ant Design and other wrapped components too.\n *\n * @param props - Configuration object\n * @param props.mask - The mask pattern to apply\n * @param props.register - Optional callback that receives the element\n * @param props.options - Optional mask configuration options\n * @returns A ref callback function to attach to the input element\n */\nexport default function useMaskInput(props: UseMaskInputOptions): ((input: Input | null) => void) {\n  const { mask, register, options } = props;\n  const ref = useRef<HTMLInputElement | null>(null);\n  const maskInput = useMemo(\n    () => (isServer ? null : createMaskInstance(mask, options)),\n    [mask, options],\n  );\n\n  const refCallback = useCallback((input: Input | null): void => {\n    if (!input) {\n      ref.current = null;\n      return;\n    }\n\n    ref.current = resolveInputRef(input);\n  }, []);\n\n  useEffect(() => {\n    if (isServer || !ref.current) return;\n\n    if (!isHTMLElement(ref.current)) {\n      return;\n    }\n\n    const inputElement = findInputElement(ref.current);\n\n    if (maskInput && inputElement && isHTMLElement(inputElement)) {\n      maskInput.mask(inputElement);\n    }\n\n    if (register && isHTMLElement(ref.current)) {\n      register(ref.current);\n    }\n  }, [mask, register, options, maskInput]);\n\n  if (isServer) {\n    return (): void => {\n      // server doesn't have dom, so just do nothing\n    };\n  }\n\n  return refCallback;\n}\n","import { useMemo } from 'react';\n\nimport { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type {\n  FieldValues, Path,\n  RegisterOptions,\n  UseFormRegister,\n} from 'react-hook-form';\n\nimport type { Mask, Options, UseHookFormMaskReturn } from '../types';\n\n/**\n * Creates a masked version of React Hook Form's register function.\n * Takes react-hook-form's register and adds automatic masking. Like an upgrade.\n *\n * @template T - The form data type\n * @template D - The register options type\n * @param registerFn - The register function from useForm hook\n * @returns A function that registers a field with mask support\n */\nexport default function useHookFormMask<\n  T extends FieldValues, D extends RegisterOptions,\n>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (\n  D & Options) | Options | D) => UseHookFormMaskReturn<T>) {\n  //\n  return useMemo(() => {\n    const refCache = new Map<string, RefCallback<HTMLElement | null>>();\n\n    return (fieldName: Path<T>, mask: Mask, options?: (\n      D & Options) | Options | D): UseHookFormMaskReturn<T> => {\n      if (!registerFn) throw new Error('registerFn is required');\n\n      const registerReturn = registerFn(fieldName, options as Options);\n      const { ref } = registerReturn as UseHookFormMaskReturn<T>;\n\n      const cacheKey = makeMaskCacheKey(fieldName, mask);\n\n      if (!refCache.has(cacheKey)) {\n        const applyMaskToRef = (_ref: HTMLElement | null) => {\n          if (_ref) applyMaskToElement(_ref, mask, options as Options);\n          return _ref;\n        };\n        refCache.set(\n          cacheKey,\n          (ref ? flow(applyMaskToRef, ref) : applyMaskToRef) as RefCallback<HTMLElement | null>,\n        );\n      }\n\n      const result = {\n        ...registerReturn,\n        ref: refCache.get(cacheKey),\n      } as UseHookFormMaskReturn<T>;\n\n      setPrevRef(result, ref);\n\n      return result;\n    };\n  }, [registerFn]);\n}\n","/* eslint-disable import-x/no-extraneous-dependencies */\nimport inputmask from 'inputmask';\n\nimport { getMaskOptions } from '../core/maskConfig';\nimport { makeMaskCacheKey } from '../utils';\nimport isServer from '../utils/isServer';\nimport interopDefaultSync from '../utils/moduleInterop';\n\nimport type { Input, Mask, Options } from '../types';\n\nconst callbackCache = new Map<string, (input: Input | null) => void>();\n\n/**\n * Higher-order function that creates a ref callback for applying input masks.\n * Simple function to apply mask via ref. No hooks, no drama.\n *\n * @param mask - The mask pattern to apply\n * @param options - Optional mask configuration options\n * @returns A ref callback function that applies the mask\n */\nexport default function withMask(mask: Mask, options?: Options): ((input: Input | null) => void) {\n  // without options, we cant cache, so we always return a fresh callback. :P\n  if (!options) {\n    const cacheKey = makeMaskCacheKey('', mask);\n    if (callbackCache.has(cacheKey)) {\n      return callbackCache.get(cacheKey) as (input: Input | null) => void;\n    }\n  }\n\n  const callback = (input: Input | null): void => {\n    if (isServer || mask === null || !input) return;\n\n    const maskInput = interopDefaultSync(inputmask)(getMaskOptions(mask, options));\n    maskInput.mask(input as HTMLElement);\n  };\n\n  if (!options) {\n    const cacheKey = makeMaskCacheKey('', mask);\n    callbackCache.set(cacheKey, callback);\n  }\n\n  return callback;\n}\n","import { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type { FieldValues } from 'react-hook-form';\n\nimport type {\n  Mask, Options, UseFormRegisterReturn, UseHookFormMaskReturn,\n} from '../types';\n\nconst refCache = new WeakMap<\n  RefCallback<HTMLElement | null>,\n  Map<string, RefCallback<HTMLElement | null>>\n>();\n\n/**\n * Enhances a React Hook Form register return object with mask support.\n * Takes an already registered field and adds mask to it.\n * Useful when you registered the field before.\n *\n * @param register - The register return object from React Hook Form\n * @param mask - The mask pattern to apply\n * @param options - Optional mask configuration options\n * @returns A new register return object with mask applied\n */\nexport default function withHookFormMask(\n  register: UseFormRegisterReturn,\n  mask: Mask,\n  options?: Options,\n): UseHookFormMaskReturn<FieldValues> {\n  const { ref } = register as UseHookFormMaskReturn<FieldValues>;\n\n  // null ref — nothing to cache, return as-is.\n  if (!ref) {\n    const result = {\n      ...register,\n      ref: null as unknown as RefCallback<HTMLElement | null>,\n    } as UseHookFormMaskReturn<FieldValues>;\n    setPrevRef(result, ref);\n    return result;\n  }\n\n  if (!refCache.has(ref)) {\n    refCache.set(ref, new Map());\n  }\n  const maskCache = refCache.get(ref);\n  const cacheKey = makeMaskCacheKey(register.name, mask);\n\n  if (!maskCache?.has(cacheKey)) {\n    const applyMaskToRef = (_ref: HTMLElement | null) => {\n      if (_ref) applyMaskToElement(_ref, mask, options);\n      return _ref;\n    };\n    maskCache?.set(\n      cacheKey,\n      flow(applyMaskToRef, ref) as RefCallback<HTMLElement | null>,\n    );\n  }\n\n  const result = {\n    ...register,\n    ref: maskCache?.get(cacheKey),\n  } as UseHookFormMaskReturn<FieldValues>;\n\n  setPrevRef(result, ref);\n\n  return result;\n}\n"]}
+{"version":3,"sources":["../src/api/useMaskInput.ts","../src/api/useHookFormMask.ts","../src/api/withHookFormMask.ts"],"names":["useRef","useCallback","resolveInputRef","withMask","useEffect","isServer_default","useMemo","refCache","makeMaskCacheKey","applyMaskToElement","flow","setPrevRef","result"],"mappings":"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","file":"index.cjs","sourcesContent":["import {\n  useCallback, useEffect, useRef,\n} from 'react';\n\nimport { resolveInputRef } from '../core';\nimport withMask from './withMask';\nimport isServer from '../utils/isServer';\n\nimport type { Input, Mask, Options } from '../types';\n\ninterface UseMaskInputOptions {\n  mask: Mask;\n  register?: (element: HTMLElement) => void;\n  options?: Options;\n}\n\n/**\n * React hook for applying input masks to form elements.\n * Works with Ant Design and other wrapped components too.\n *\n * @param props - Configuration object\n * @param props.mask - The mask pattern to apply\n * @param props.register - Optional callback that receives the element\n * @param props.options - Optional mask configuration options\n * @returns A ref callback function to attach to the input element\n */\nexport default function useMaskInput(props: UseMaskInputOptions): ((input: Input | null) => void) {\n  const { mask, register, options } = props;\n  const ref = useRef<HTMLInputElement | null>(null);\n  const maskRef = useRef(mask);\n  const optionsRef = useRef(options);\n\n  const refCallback = useCallback((input: Input | null): void => {\n    if (!input) {\n      ref.current = null;\n      return;\n    }\n\n    ref.current = resolveInputRef(input);\n    withMask(maskRef.current, optionsRef.current)(ref.current);\n  }, []);\n\n  useEffect(() => {\n    if (isServer || !ref.current || !register) return;\n    register(ref.current);\n  }, [register]);\n\n  if (isServer) {\n    return (): void => {\n      // server doesn't have dom, so just do nothing\n    };\n  }\n\n  return refCallback;\n}\n","import { useMemo } from 'react';\n\nimport { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type {\n  FieldValues, Path,\n  RegisterOptions,\n  UseFormRegister,\n} from 'react-hook-form';\n\nimport type { Mask, Options, UseHookFormMaskReturn } from '../types';\n\n/**\n * Creates a masked version of React Hook Form's register function.\n * Takes react-hook-form's register and adds automatic masking. Like an upgrade.\n *\n * @template T - The form data type\n * @template D - The register options type\n * @param registerFn - The register function from useForm hook\n * @returns A function that registers a field with mask support\n */\nexport default function useHookFormMask<\n  T extends FieldValues, D extends RegisterOptions,\n>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (\n  D & Options) | Options | D) => UseHookFormMaskReturn<T>) {\n  //\n  return useMemo(() => {\n    const refCache = new Map<string, RefCallback<HTMLElement | null>>();\n\n    return (fieldName: Path<T>, mask: Mask, options?: (\n      D & Options) | Options | D): UseHookFormMaskReturn<T> => {\n      if (!registerFn) throw new Error('registerFn is required');\n\n      const registerReturn = registerFn(fieldName, options as Options);\n      const { ref } = registerReturn as UseHookFormMaskReturn<T>;\n\n      const cacheKey = makeMaskCacheKey(fieldName, mask);\n\n      if (!refCache.has(cacheKey)) {\n        const applyMaskToRef = (_ref: HTMLElement | null) => {\n          if (_ref) applyMaskToElement(_ref, mask, options as Options);\n          return _ref;\n        };\n        refCache.set(\n          cacheKey,\n          (ref ? flow(applyMaskToRef, ref) : applyMaskToRef) as RefCallback<HTMLElement | null>,\n        );\n      }\n\n      const result = {\n        ...registerReturn,\n        ref: refCache.get(cacheKey),\n      } as UseHookFormMaskReturn<T>;\n\n      setPrevRef(result, ref);\n\n      return result;\n    };\n  }, [registerFn]);\n}\n","import { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type { FieldValues } from 'react-hook-form';\n\nimport type {\n  Mask, Options, UseFormRegisterReturn, UseHookFormMaskReturn,\n} from '../types';\n\nconst refCache = new WeakMap<\n  RefCallback<HTMLElement | null>,\n  Map<string, RefCallback<HTMLElement | null>>\n>();\n\n/**\n * Enhances a React Hook Form register return object with mask support.\n * Takes an already registered field and adds mask to it.\n * Useful when you registered the field before.\n *\n * @param register - The register return object from React Hook Form\n * @param mask - The mask pattern to apply\n * @param options - Optional mask configuration options\n * @returns A new register return object with mask applied\n */\nexport default function withHookFormMask(\n  register: UseFormRegisterReturn,\n  mask: Mask,\n  options?: Options,\n): UseHookFormMaskReturn<FieldValues> {\n  const { ref } = register as UseHookFormMaskReturn<FieldValues>;\n\n  // null ref — nothing to cache, return as-is.\n  if (!ref) {\n    const result = {\n      ...register,\n      ref: null as unknown as RefCallback<HTMLElement | null>,\n    } as UseHookFormMaskReturn<FieldValues>;\n    setPrevRef(result, ref);\n    return result;\n  }\n\n  if (!refCache.has(ref)) {\n    refCache.set(ref, new Map());\n  }\n  const maskCache = refCache.get(ref);\n  const cacheKey = makeMaskCacheKey(register.name, mask);\n\n  if (!maskCache?.has(cacheKey)) {\n    const applyMaskToRef = (_ref: HTMLElement | null) => {\n      if (_ref) applyMaskToElement(_ref, mask, options);\n      return _ref;\n    };\n    maskCache?.set(\n      cacheKey,\n      flow(applyMaskToRef, ref) as RefCallback<HTMLElement | null>,\n    );\n  }\n\n  const result = {\n    ...register,\n    ref: maskCache?.get(cacheKey),\n  } as UseHookFormMaskReturn<FieldValues>;\n\n  setPrevRef(result, ref);\n\n  return result;\n}\n"]}

package/dist/index.js

@@ -1,33 +1,24 @@
-import { __toESM, require_inputmask, isServer_default, createMaskInstance, resolveInputRef, isHTMLElement, findInputElement, makeMaskCacheKey, flow, setPrevRef, applyMaskToElement, interopDefaultSync, getMaskOptions } from './chunk-FDD3PKBM.js';
-import { useRef, useMemo, useCallback, useEffect } from 'react';
+import { resolveInputRef, withMask, isServer_default, makeMaskCacheKey, flow, setPrevRef, applyMaskToElement } from './chunk-QCWLMMDI.js';
+export { withMask } from './chunk-QCWLMMDI.js';
+import { useRef, useCallback, useEffect, useMemo } from 'react';
 
 function useMaskInput(props) {
   const { mask, register, options } = props;
   const ref = useRef(null);
-  const maskInput = useMemo(
-    () => isServer_default ? null : createMaskInstance(mask, options),
-    [mask, options]
-  );
+  const maskRef = useRef(mask);
+  const optionsRef = useRef(options);
   const refCallback = useCallback((input) => {
     if (!input) {
       ref.current = null;
       return;
     }
     ref.current = resolveInputRef(input);
+    withMask(maskRef.current, optionsRef.current)(ref.current);
   }, []);
   useEffect(() => {
-    if (isServer_default || !ref.current) return;
-    if (!isHTMLElement(ref.current)) {
-      return;
-    }
-    const inputElement = findInputElement(ref.current);
-    if (maskInput && inputElement && isHTMLElement(inputElement)) {
-      maskInput.mask(inputElement);
-    }
-    if (register && isHTMLElement(ref.current)) {
-      register(ref.current);
-    }
-  }, [mask, register, options, maskInput]);
+    if (isServer_default || !ref.current || !register) return;
+    register(ref.current);
+  }, [register]);
   if (isServer_default) {
     return () => {
     };
@@ -62,28 +53,6 @@ function useHookFormMask(registerFn) {
   }, [registerFn]);
 }
 
-// src/api/withMask.ts
-var import_inputmask = __toESM(require_inputmask(), 1);
-var callbackCache = /* @__PURE__ */ new Map();
-function withMask(mask, options) {
-  if (!options) {
-    const cacheKey = makeMaskCacheKey("", mask);
-    if (callbackCache.has(cacheKey)) {
-      return callbackCache.get(cacheKey);
-    }
-  }
-  const callback = (input) => {
-    if (isServer_default || mask === null || !input) return;
-    const maskInput = interopDefaultSync(import_inputmask.default)(getMaskOptions(mask, options));
-    maskInput.mask(input);
-  };
-  if (!options) {
-    const cacheKey = makeMaskCacheKey("", mask);
-    callbackCache.set(cacheKey, callback);
-  }
-  return callback;
-}
-
 // src/api/withHookFormMask.ts
 var refCache = /* @__PURE__ */ new WeakMap();
 function withHookFormMask(register, mask, options) {
@@ -119,6 +88,6 @@ function withHookFormMask(register, mask, options) {
   return result;
 }
 
-export { useHookFormMask, useMaskInput, withHookFormMask, withMask };
+export { useHookFormMask, useMaskInput, withHookFormMask };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/api/useMaskInput.ts","../src/api/useHookFormMask.ts","../src/api/withMask.ts","../src/api/withHookFormMask.ts"],"names":["useMemo","refCache","inputmask","result"],"mappings":"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","file":"index.js","sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport {\n  createMaskInstance, findInputElement, isHTMLElement, resolveInputRef,\n} from '../core';\nimport isServer from '../utils/isServer';\n\nimport type { Input, Mask, Options } from '../types';\n\ninterface UseMaskInputOptions {\n  mask: Mask;\n  register?: (element: HTMLElement) => void;\n  options?: Options;\n}\n\n/**\n * React hook for applying input masks to form elements.\n * Works with Ant Design and other wrapped components too.\n *\n * @param props - Configuration object\n * @param props.mask - The mask pattern to apply\n * @param props.register - Optional callback that receives the element\n * @param props.options - Optional mask configuration options\n * @returns A ref callback function to attach to the input element\n */\nexport default function useMaskInput(props: UseMaskInputOptions): ((input: Input | null) => void) {\n  const { mask, register, options } = props;\n  const ref = useRef<HTMLInputElement | null>(null);\n  const maskInput = useMemo(\n    () => (isServer ? null : createMaskInstance(mask, options)),\n    [mask, options],\n  );\n\n  const refCallback = useCallback((input: Input | null): void => {\n    if (!input) {\n      ref.current = null;\n      return;\n    }\n\n    ref.current = resolveInputRef(input);\n  }, []);\n\n  useEffect(() => {\n    if (isServer || !ref.current) return;\n\n    if (!isHTMLElement(ref.current)) {\n      return;\n    }\n\n    const inputElement = findInputElement(ref.current);\n\n    if (maskInput && inputElement && isHTMLElement(inputElement)) {\n      maskInput.mask(inputElement);\n    }\n\n    if (register && isHTMLElement(ref.current)) {\n      register(ref.current);\n    }\n  }, [mask, register, options, maskInput]);\n\n  if (isServer) {\n    return (): void => {\n      // server doesn't have dom, so just do nothing\n    };\n  }\n\n  return refCallback;\n}\n","import { useMemo } from 'react';\n\nimport { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type {\n  FieldValues, Path,\n  RegisterOptions,\n  UseFormRegister,\n} from 'react-hook-form';\n\nimport type { Mask, Options, UseHookFormMaskReturn } from '../types';\n\n/**\n * Creates a masked version of React Hook Form's register function.\n * Takes react-hook-form's register and adds automatic masking. Like an upgrade.\n *\n * @template T - The form data type\n * @template D - The register options type\n * @param registerFn - The register function from useForm hook\n * @returns A function that registers a field with mask support\n */\nexport default function useHookFormMask<\n  T extends FieldValues, D extends RegisterOptions,\n>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (\n  D & Options) | Options | D) => UseHookFormMaskReturn<T>) {\n  //\n  return useMemo(() => {\n    const refCache = new Map<string, RefCallback<HTMLElement | null>>();\n\n    return (fieldName: Path<T>, mask: Mask, options?: (\n      D & Options) | Options | D): UseHookFormMaskReturn<T> => {\n      if (!registerFn) throw new Error('registerFn is required');\n\n      const registerReturn = registerFn(fieldName, options as Options);\n      const { ref } = registerReturn as UseHookFormMaskReturn<T>;\n\n      const cacheKey = makeMaskCacheKey(fieldName, mask);\n\n      if (!refCache.has(cacheKey)) {\n        const applyMaskToRef = (_ref: HTMLElement | null) => {\n          if (_ref) applyMaskToElement(_ref, mask, options as Options);\n          return _ref;\n        };\n        refCache.set(\n          cacheKey,\n          (ref ? flow(applyMaskToRef, ref) : applyMaskToRef) as RefCallback<HTMLElement | null>,\n        );\n      }\n\n      const result = {\n        ...registerReturn,\n        ref: refCache.get(cacheKey),\n      } as UseHookFormMaskReturn<T>;\n\n      setPrevRef(result, ref);\n\n      return result;\n    };\n  }, [registerFn]);\n}\n","/* eslint-disable import-x/no-extraneous-dependencies */\nimport inputmask from 'inputmask';\n\nimport { getMaskOptions } from '../core/maskConfig';\nimport { makeMaskCacheKey } from '../utils';\nimport isServer from '../utils/isServer';\nimport interopDefaultSync from '../utils/moduleInterop';\n\nimport type { Input, Mask, Options } from '../types';\n\nconst callbackCache = new Map<string, (input: Input | null) => void>();\n\n/**\n * Higher-order function that creates a ref callback for applying input masks.\n * Simple function to apply mask via ref. No hooks, no drama.\n *\n * @param mask - The mask pattern to apply\n * @param options - Optional mask configuration options\n * @returns A ref callback function that applies the mask\n */\nexport default function withMask(mask: Mask, options?: Options): ((input: Input | null) => void) {\n  // without options, we cant cache, so we always return a fresh callback. :P\n  if (!options) {\n    const cacheKey = makeMaskCacheKey('', mask);\n    if (callbackCache.has(cacheKey)) {\n      return callbackCache.get(cacheKey) as (input: Input | null) => void;\n    }\n  }\n\n  const callback = (input: Input | null): void => {\n    if (isServer || mask === null || !input) return;\n\n    const maskInput = interopDefaultSync(inputmask)(getMaskOptions(mask, options));\n    maskInput.mask(input as HTMLElement);\n  };\n\n  if (!options) {\n    const cacheKey = makeMaskCacheKey('', mask);\n    callbackCache.set(cacheKey, callback);\n  }\n\n  return callback;\n}\n","import { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type { FieldValues } from 'react-hook-form';\n\nimport type {\n  Mask, Options, UseFormRegisterReturn, UseHookFormMaskReturn,\n} from '../types';\n\nconst refCache = new WeakMap<\n  RefCallback<HTMLElement | null>,\n  Map<string, RefCallback<HTMLElement | null>>\n>();\n\n/**\n * Enhances a React Hook Form register return object with mask support.\n * Takes an already registered field and adds mask to it.\n * Useful when you registered the field before.\n *\n * @param register - The register return object from React Hook Form\n * @param mask - The mask pattern to apply\n * @param options - Optional mask configuration options\n * @returns A new register return object with mask applied\n */\nexport default function withHookFormMask(\n  register: UseFormRegisterReturn,\n  mask: Mask,\n  options?: Options,\n): UseHookFormMaskReturn<FieldValues> {\n  const { ref } = register as UseHookFormMaskReturn<FieldValues>;\n\n  // null ref — nothing to cache, return as-is.\n  if (!ref) {\n    const result = {\n      ...register,\n      ref: null as unknown as RefCallback<HTMLElement | null>,\n    } as UseHookFormMaskReturn<FieldValues>;\n    setPrevRef(result, ref);\n    return result;\n  }\n\n  if (!refCache.has(ref)) {\n    refCache.set(ref, new Map());\n  }\n  const maskCache = refCache.get(ref);\n  const cacheKey = makeMaskCacheKey(register.name, mask);\n\n  if (!maskCache?.has(cacheKey)) {\n    const applyMaskToRef = (_ref: HTMLElement | null) => {\n      if (_ref) applyMaskToElement(_ref, mask, options);\n      return _ref;\n    };\n    maskCache?.set(\n      cacheKey,\n      flow(applyMaskToRef, ref) as RefCallback<HTMLElement | null>,\n    );\n  }\n\n  const result = {\n    ...register,\n    ref: maskCache?.get(cacheKey),\n  } as UseHookFormMaskReturn<FieldValues>;\n\n  setPrevRef(result, ref);\n\n  return result;\n}\n"]}
+{"version":3,"sources":["../src/api/useMaskInput.ts","../src/api/useHookFormMask.ts","../src/api/withHookFormMask.ts"],"names":["refCache","result"],"mappings":"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","file":"index.js","sourcesContent":["import {\n  useCallback, useEffect, useRef,\n} from 'react';\n\nimport { resolveInputRef } from '../core';\nimport withMask from './withMask';\nimport isServer from '../utils/isServer';\n\nimport type { Input, Mask, Options } from '../types';\n\ninterface UseMaskInputOptions {\n  mask: Mask;\n  register?: (element: HTMLElement) => void;\n  options?: Options;\n}\n\n/**\n * React hook for applying input masks to form elements.\n * Works with Ant Design and other wrapped components too.\n *\n * @param props - Configuration object\n * @param props.mask - The mask pattern to apply\n * @param props.register - Optional callback that receives the element\n * @param props.options - Optional mask configuration options\n * @returns A ref callback function to attach to the input element\n */\nexport default function useMaskInput(props: UseMaskInputOptions): ((input: Input | null) => void) {\n  const { mask, register, options } = props;\n  const ref = useRef<HTMLInputElement | null>(null);\n  const maskRef = useRef(mask);\n  const optionsRef = useRef(options);\n\n  const refCallback = useCallback((input: Input | null): void => {\n    if (!input) {\n      ref.current = null;\n      return;\n    }\n\n    ref.current = resolveInputRef(input);\n    withMask(maskRef.current, optionsRef.current)(ref.current);\n  }, []);\n\n  useEffect(() => {\n    if (isServer || !ref.current || !register) return;\n    register(ref.current);\n  }, [register]);\n\n  if (isServer) {\n    return (): void => {\n      // server doesn't have dom, so just do nothing\n    };\n  }\n\n  return refCallback;\n}\n","import { useMemo } from 'react';\n\nimport { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type {\n  FieldValues, Path,\n  RegisterOptions,\n  UseFormRegister,\n} from 'react-hook-form';\n\nimport type { Mask, Options, UseHookFormMaskReturn } from '../types';\n\n/**\n * Creates a masked version of React Hook Form's register function.\n * Takes react-hook-form's register and adds automatic masking. Like an upgrade.\n *\n * @template T - The form data type\n * @template D - The register options type\n * @param registerFn - The register function from useForm hook\n * @returns A function that registers a field with mask support\n */\nexport default function useHookFormMask<\n  T extends FieldValues, D extends RegisterOptions,\n>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (\n  D & Options) | Options | D) => UseHookFormMaskReturn<T>) {\n  //\n  return useMemo(() => {\n    const refCache = new Map<string, RefCallback<HTMLElement | null>>();\n\n    return (fieldName: Path<T>, mask: Mask, options?: (\n      D & Options) | Options | D): UseHookFormMaskReturn<T> => {\n      if (!registerFn) throw new Error('registerFn is required');\n\n      const registerReturn = registerFn(fieldName, options as Options);\n      const { ref } = registerReturn as UseHookFormMaskReturn<T>;\n\n      const cacheKey = makeMaskCacheKey(fieldName, mask);\n\n      if (!refCache.has(cacheKey)) {\n        const applyMaskToRef = (_ref: HTMLElement | null) => {\n          if (_ref) applyMaskToElement(_ref, mask, options as Options);\n          return _ref;\n        };\n        refCache.set(\n          cacheKey,\n          (ref ? flow(applyMaskToRef, ref) : applyMaskToRef) as RefCallback<HTMLElement | null>,\n        );\n      }\n\n      const result = {\n        ...registerReturn,\n        ref: refCache.get(cacheKey),\n      } as UseHookFormMaskReturn<T>;\n\n      setPrevRef(result, ref);\n\n      return result;\n    };\n  }, [registerFn]);\n}\n","import { applyMaskToElement } from '../core';\nimport { flow, makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { RefCallback } from 'react';\nimport type { FieldValues } from 'react-hook-form';\n\nimport type {\n  Mask, Options, UseFormRegisterReturn, UseHookFormMaskReturn,\n} from '../types';\n\nconst refCache = new WeakMap<\n  RefCallback<HTMLElement | null>,\n  Map<string, RefCallback<HTMLElement | null>>\n>();\n\n/**\n * Enhances a React Hook Form register return object with mask support.\n * Takes an already registered field and adds mask to it.\n * Useful when you registered the field before.\n *\n * @param register - The register return object from React Hook Form\n * @param mask - The mask pattern to apply\n * @param options - Optional mask configuration options\n * @returns A new register return object with mask applied\n */\nexport default function withHookFormMask(\n  register: UseFormRegisterReturn,\n  mask: Mask,\n  options?: Options,\n): UseHookFormMaskReturn<FieldValues> {\n  const { ref } = register as UseHookFormMaskReturn<FieldValues>;\n\n  // null ref — nothing to cache, return as-is.\n  if (!ref) {\n    const result = {\n      ...register,\n      ref: null as unknown as RefCallback<HTMLElement | null>,\n    } as UseHookFormMaskReturn<FieldValues>;\n    setPrevRef(result, ref);\n    return result;\n  }\n\n  if (!refCache.has(ref)) {\n    refCache.set(ref, new Map());\n  }\n  const maskCache = refCache.get(ref);\n  const cacheKey = makeMaskCacheKey(register.name, mask);\n\n  if (!maskCache?.has(cacheKey)) {\n    const applyMaskToRef = (_ref: HTMLElement | null) => {\n      if (_ref) applyMaskToElement(_ref, mask, options);\n      return _ref;\n    };\n    maskCache?.set(\n      cacheKey,\n      flow(applyMaskToRef, ref) as RefCallback<HTMLElement | null>,\n    );\n  }\n\n  const result = {\n    ...register,\n    ref: maskCache?.get(cacheKey),\n  } as UseHookFormMaskReturn<FieldValues>;\n\n  setPrevRef(result, ref);\n\n  return result;\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "use-mask-input",
-  "version": "3.7.2",
+  "version": "3.7.4",
   "private": false,
   "description": "A react Hook for build elegant input masks. Compatible with React Hook Form",
   "author": "Eduardo Borges<euduardoborges@gmail.com>",

package/src/antd/useMaskInputAntd.ts

@@ -1,13 +1,7 @@
-import {
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-} from 'react';
+import { useCallback, useEffect, useRef } from 'react';
 
-import {
-  createMaskInstance, findInputElement, isHTMLElement, resolveInputRef,
-} from '../core';
+import withMask from '../api/withMask';
+import { resolveInputRef } from '../core';
 import isServer from '../utils/isServer';
 
 import type { InputRef } from 'antd';
@@ -21,51 +15,44 @@ interface UseMaskInputOptions {
 }
 
 /**
- * React hook for applying input masks to form elements.
- * Works with Ant Design and other wrapped components too.
+ * React hook for applying input masks to Ant Design form elements.
  *
  * @param props - Configuration object
  * @param props.mask - The mask pattern to apply
  * @param props.register - Optional callback that receives the element
  * @param props.options - Optional mask configuration options
- * @returns A ref callback function to attach to the input element
+ * @returns A ref callback function to attach to the Ant Design Input element
  */
 export default function useMaskInputAntd(props: UseMaskInputOptions): (
   input: InputRef | null
 ) => void {
   const { mask, register, options } = props;
-  const ref = useRef<InputRef | null>(null);
-  const maskInput = useMemo(
-    () => (isServer ? null : createMaskInstance(mask, options)),
-    [mask, options],
-  );
+  const ref = useRef<HTMLInputElement | null>(null);
+  const maskRef = useRef(mask);
+  const optionsRef = useRef(options);
+  const maskedElementRef = useRef<HTMLInputElement | null>(null);
 
-  const refCallback = useCallback((input: InputRef | null) => {
+  maskRef.current = mask;
+  optionsRef.current = options;
+
+  const refCallback = useCallback((input: InputRef | null): void => {
     if (!input) {
       ref.current = null;
       return;
     }
 
-    ref.current = resolveInputRef(input.input) as unknown as InputRef;
-  }, []);
-
-  useEffect(() => {
-    if (isServer || !ref.current) return;
+    ref.current = resolveInputRef(input.input);
 
-    if (!isHTMLElement(ref.current)) {
-      return;
-    }
-
-    const inputElement = findInputElement(ref.current);
-
-    if (maskInput && inputElement && isHTMLElement(inputElement)) {
-      maskInput.mask(inputElement);
+    if (ref.current && ref.current !== maskedElementRef.current) {
+      withMask(maskRef.current, optionsRef.current)(ref.current);
+      maskedElementRef.current = ref.current;
     }
+  }, []);
 
-    if (register && isHTMLElement(ref.current)) {
-      register(ref.current);
-    }
-  }, [mask, register, options, maskInput]);
+  useEffect(() => {
+    if (isServer || !ref.current || !register) return;
+    register(ref.current);
+  }, [register]);
 
   if (isServer) {
     return (): void => {

package/src/api/useMaskInput.ts

@@ -1,13 +1,9 @@
 import {
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
+  useCallback, useEffect, useRef,
 } from 'react';
 
-import {
-  createMaskInstance, findInputElement, isHTMLElement, resolveInputRef,
-} from '../core';
+import { resolveInputRef } from '../core';
+import withMask from './withMask';
 import isServer from '../utils/isServer';
 
 import type { Input, Mask, Options } from '../types';
@@ -31,10 +27,8 @@ interface UseMaskInputOptions {
 export default function useMaskInput(props: UseMaskInputOptions): ((input: Input | null) => void) {
   const { mask, register, options } = props;
   const ref = useRef<HTMLInputElement | null>(null);
-  const maskInput = useMemo(
-    () => (isServer ? null : createMaskInstance(mask, options)),
-    [mask, options],
-  );
+  const maskRef = useRef(mask);
+  const optionsRef = useRef(options);
 
   const refCallback = useCallback((input: Input | null): void => {
     if (!input) {
@@ -43,25 +37,13 @@ export default function useMaskInput(props: UseMaskInputOptions): ((input: Input
     }
 
     ref.current = resolveInputRef(input);
+    withMask(maskRef.current, optionsRef.current)(ref.current);
   }, []);
 
   useEffect(() => {
-    if (isServer || !ref.current) return;
-
-    if (!isHTMLElement(ref.current)) {
-      return;
-    }
-
-    const inputElement = findInputElement(ref.current);
-
-    if (maskInput && inputElement && isHTMLElement(inputElement)) {
-      maskInput.mask(inputElement);
-    }
-
-    if (register && isHTMLElement(ref.current)) {
-      register(ref.current);
-    }
-  }, [mask, register, options, maskInput]);
+    if (isServer || !ref.current || !register) return;
+    register(ref.current);
+  }, [register]);
 
   if (isServer) {
     return (): void => {