use-mask-input 3.9.0 → 3.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/dist/antd.cjs +14 -12
- package/dist/antd.cjs.map +1 -1
- package/dist/antd.d.cts +3 -2
- package/dist/antd.d.ts +3 -2
- package/dist/antd.js +6 -4
- package/dist/antd.js.map +1 -1
- package/dist/{chunk-X5SEJVSB.cjs → chunk-DTC7JTZP.cjs} +78 -26
- package/dist/{chunk-X5SEJVSB.cjs.map → chunk-DTC7JTZP.cjs.map} +1 -1
- package/dist/{chunk-ICLWBMH4.js → chunk-TVCNC3TP.js} +77 -27
- package/dist/{chunk-ICLWBMH4.js.map → chunk-TVCNC3TP.js.map} +1 -1
- package/dist/{index-BoaVtWUr.d.cts → index-D8KkaDbQ.d.cts} +7 -3
- package/dist/{index-BoaVtWUr.d.ts → index-D8KkaDbQ.d.ts} +7 -3
- package/dist/index.cjs +45 -38
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +5 -4
- package/dist/index.d.ts +5 -4
- package/dist/index.js +30 -23
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/antd/useMaskInputAntd.spec.tsx +22 -0
- package/src/antd/useMaskInputAntd.ts +11 -7
- package/src/api/useHookFormMask.ts +4 -1
- package/src/api/useMaskInput.spec.tsx +18 -0
- package/src/api/useMaskInput.ts +11 -5
- package/src/api/withHookFormMask.spec.ts +43 -74
- package/src/api/withHookFormMask.ts +18 -10
- package/src/api/withMask.spec.ts +16 -0
- package/src/api/withMask.ts +11 -8
- package/src/api/withTanStackFormMask.ts +19 -10
- package/src/index.tsx +2 -0
- package/src/types/index.ts +8 -2
- package/src/utils/index.ts +6 -1
- package/src/utils/maskHelpers.ts +44 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
## [3.6.0](https://github.com/eduardoborges/use-mask-input/compare/3.5.2...3.6.0) (2026-01-13)
|
|
2
2
|
|
|
3
|
+
## 3.10.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 2885f4b: Expose `unmaskedValue()` on mask hook and helper returns so consumers can read the current unmasked datetime value directly from the API.
|
|
8
|
+
|
|
3
9
|
## 3.9.0
|
|
4
10
|
|
|
5
11
|
### Minor Changes
|
package/dist/antd.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkDTC7JTZP_cjs = require('./chunk-DTC7JTZP.cjs');
|
|
4
4
|
var react = require('react');
|
|
5
5
|
|
|
6
6
|
function useHookFormMaskAntd(registerFn) {
|
|
@@ -10,11 +10,11 @@ function useHookFormMaskAntd(registerFn) {
|
|
|
10
10
|
if (!registerFn) throw new Error("registerFn is required");
|
|
11
11
|
const registerReturn = registerFn(fieldName, options);
|
|
12
12
|
const { ref } = registerReturn;
|
|
13
|
-
const cacheKey =
|
|
13
|
+
const cacheKey = chunkDTC7JTZP_cjs.makeMaskCacheKey(fieldName, mask);
|
|
14
14
|
if (!refCache.has(cacheKey)) {
|
|
15
15
|
const refWithMask = (inputRef) => {
|
|
16
|
-
const element = inputRef ?
|
|
17
|
-
if (element)
|
|
16
|
+
const element = inputRef ? chunkDTC7JTZP_cjs.resolveInputRef(inputRef.input) : null;
|
|
17
|
+
if (element) chunkDTC7JTZP_cjs.applyMaskToElement(element, mask, options);
|
|
18
18
|
if (ref) ref(element);
|
|
19
19
|
};
|
|
20
20
|
refCache.set(cacheKey, refWithMask);
|
|
@@ -23,7 +23,7 @@ function useHookFormMaskAntd(registerFn) {
|
|
|
23
23
|
...registerReturn,
|
|
24
24
|
ref: refCache.get(cacheKey)
|
|
25
25
|
};
|
|
26
|
-
|
|
26
|
+
chunkDTC7JTZP_cjs.setPrevRef(result, ref);
|
|
27
27
|
return result;
|
|
28
28
|
};
|
|
29
29
|
}, [registerFn]);
|
|
@@ -34,6 +34,7 @@ function useMaskInputAntd(props) {
|
|
|
34
34
|
const maskRef = react.useRef(mask);
|
|
35
35
|
const optionsRef = react.useRef(options);
|
|
36
36
|
const maskedElementRef = react.useRef(null);
|
|
37
|
+
const unmaskedValue = react.useCallback(() => chunkDTC7JTZP_cjs.getUnmaskedValue(ref.current), []);
|
|
37
38
|
maskRef.current = mask;
|
|
38
39
|
optionsRef.current = options;
|
|
39
40
|
const refCallback = react.useCallback((input) => {
|
|
@@ -41,21 +42,22 @@ function useMaskInputAntd(props) {
|
|
|
41
42
|
ref.current = null;
|
|
42
43
|
return;
|
|
43
44
|
}
|
|
44
|
-
ref.current =
|
|
45
|
+
ref.current = chunkDTC7JTZP_cjs.resolveInputRef(input.input);
|
|
45
46
|
if (ref.current && ref.current !== maskedElementRef.current) {
|
|
46
|
-
|
|
47
|
+
chunkDTC7JTZP_cjs.withMask(maskRef.current, optionsRef.current)(ref.current);
|
|
47
48
|
maskedElementRef.current = ref.current;
|
|
48
49
|
}
|
|
49
50
|
}, []);
|
|
50
51
|
react.useEffect(() => {
|
|
51
|
-
if (
|
|
52
|
+
if (chunkDTC7JTZP_cjs.isServer_default || !ref.current || !register) return;
|
|
52
53
|
register(ref.current);
|
|
53
54
|
}, [register]);
|
|
54
|
-
if (
|
|
55
|
-
|
|
56
|
-
};
|
|
55
|
+
if (chunkDTC7JTZP_cjs.isServer_default) {
|
|
56
|
+
const noop = (() => {
|
|
57
|
+
});
|
|
58
|
+
return chunkDTC7JTZP_cjs.setUnmaskedValue(noop, () => "");
|
|
57
59
|
}
|
|
58
|
-
return refCallback;
|
|
60
|
+
return chunkDTC7JTZP_cjs.setUnmaskedValue(refCallback, unmaskedValue);
|
|
59
61
|
}
|
|
60
62
|
|
|
61
63
|
exports.useHookFormMaskAntd = useHookFormMaskAntd;
|
package/dist/antd.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/antd/useHookFormMaskAntd.ts","../src/antd/useMaskInputAntd.ts"],"names":["useMemo","makeMaskCacheKey","resolveInputRef","applyMaskToElement","setPrevRef","useRef","useCallback","withMask","useEffect","isServer_default"],"mappings":";;;;;AA6Be,SAAR,oBAEL,UAAA,EAC6D;AAE7D,EAAA,OAAOA,cAAQ,MAAM;AACnB,IAAA,MAAM,QAAA,uBAAe,GAAA,EAA0C;AAE/D,IAAA,OAAO,CAAC,SAAA,EAAoB,IAAA,EAAY,OAAA,KACuB;AAC7D,MAAA,IAAI,CAAC,UAAA,EAAY,MAAM,IAAI,MAAM,wBAAwB,CAAA;AAEzD,MAAA,MAAM,cAAA,GAAiB,UAAA,CAAW,SAAA,EAAW,OAAkB,CAAA;AAC/D,MAAA,MAAM,EAAE,KAAI,GAAI,cAAA;AAEhB,MAAA,MAAM,QAAA,GAAWC,kCAAA,CAAiB,SAAA,EAAW,IAAI,CAAA;AAEjD,MAAA,IAAI,CAAC,QAAA,CAAS,GAAA,CAAI,QAAQ,CAAA,EAAG;AAC3B,QAAA,MAAM,WAAA,GAA4C,CAAC,QAAA,KAAa;AAC9D,UAAA,MAAM,OAAA,GAAU,QAAA,GAAWC,iCAAA,CAAgB,QAAA,CAAS,KAAK,CAAA,GAAI,IAAA;AAC7D,UAAA,IAAI,OAAA,EAASC,oCAAA,CAAmB,OAAA,EAAS,IAAA,EAAM,OAAkB,CAAA;AACjE,UAAA,IAAI,GAAA,MAAS,OAAO,CAAA;AAAA,QACtB,CAAA;AACA,QAAA,QAAA,CAAS,GAAA,CAAI,UAAU,WAAW,CAAA;AAAA,MACpC;AAEA,MAAA,MAAM,MAAA,GAAS;AAAA,QACb,GAAG,cAAA;AAAA,QACH,GAAA,EAAK,QAAA,CAAS,GAAA,CAAI,QAAQ;AAAA,OAC5B;AAEA,MAAAC,4BAAA,CAAW,QAAQ,GAAG,CAAA;AAEtB,MAAA,OAAO,MAAA;AAAA,IACT,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AACjB;
|
|
1
|
+
{"version":3,"sources":["../src/antd/useHookFormMaskAntd.ts","../src/antd/useMaskInputAntd.ts"],"names":["useMemo","makeMaskCacheKey","resolveInputRef","applyMaskToElement","setPrevRef","useRef","useCallback","getUnmaskedValue","withMask","useEffect","isServer_default","setUnmaskedValue"],"mappings":"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","file":"antd.cjs","sourcesContent":["import { useMemo } from 'react';\n\nimport { applyMaskToElement, resolveInputRef } from '../core';\nimport { makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { InputRef } from 'antd';\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\nexport type UseHookFormMaskAntdReturn<T extends FieldValues> = Omit<\n UseHookFormMaskReturn<T>,\n 'ref'\n> & { ref: RefCallback<InputRef | null> };\n\n/**\n * Ant Design version of useHookFormMask.\n * Creates a masked register that works with Ant Design Input (ref receives InputRef).\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 for Ant Design Input\n */\nexport default function useHookFormMaskAntd<\n T extends FieldValues, D extends RegisterOptions,\n>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (\n D & Options) | Options | D) => UseHookFormMaskAntdReturn<T>) {\n //\n return useMemo(() => {\n const refCache = new Map<string, RefCallback<InputRef | null>>();\n\n return (fieldName: Path<T>, mask: Mask, options?: (\n D & Options) | Options | D): UseHookFormMaskAntdReturn<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 refWithMask: RefCallback<InputRef | null> = (inputRef) => {\n const element = inputRef ? resolveInputRef(inputRef.input) : null;\n if (element) applyMaskToElement(element, mask, options as Options);\n if (ref) ref(element);\n };\n refCache.set(cacheKey, refWithMask);\n }\n\n const result = {\n ...registerReturn,\n ref: refCache.get(cacheKey),\n } as UseHookFormMaskAntdReturn<T>;\n\n setPrevRef(result, ref);\n\n return result;\n };\n }, [registerFn]);\n}\n","import { useCallback, useEffect, useRef } from 'react';\n\nimport withMask from '../api/withMask';\nimport { resolveInputRef } from '../core';\nimport isServer from '../utils/isServer';\nimport { getUnmaskedValue, setUnmaskedValue } from '../utils';\n\nimport type { InputRef } from 'antd';\n\nimport type { Mask, Options, UnmaskedValueApi } from '../types';\n\ntype UseMaskInputAntdReturn = ((input: InputRef | null) => void) & UnmaskedValueApi;\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 Ant Design form elements.\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 Ant Design Input element\n */\nexport default function useMaskInputAntd(props: UseMaskInputOptions): UseMaskInputAntdReturn {\n const { mask, register, options } = props;\n const ref = useRef<HTMLInputElement | null>(null);\n const maskRef = useRef(mask);\n const optionsRef = useRef(options);\n const maskedElementRef = useRef<HTMLInputElement | null>(null);\n const unmaskedValue = useCallback(() => getUnmaskedValue(ref.current), []);\n\n maskRef.current = mask;\n optionsRef.current = options;\n\n const refCallback = useCallback((input: InputRef | null): void => {\n if (!input) {\n ref.current = null;\n return;\n }\n\n ref.current = resolveInputRef(input.input);\n\n if (ref.current && ref.current !== maskedElementRef.current) {\n withMask(maskRef.current, optionsRef.current)(ref.current);\n maskedElementRef.current = ref.current;\n }\n }, []);\n\n useEffect(() => {\n if (isServer || !ref.current || !register) return;\n register(ref.current);\n }, [register]);\n\n if (isServer) {\n const noop = (() => {\n // server doesn't have dom, so just do nothing\n }) as unknown as UseMaskInputAntdReturn;\n\n return setUnmaskedValue(noop, () => '');\n }\n\n return setUnmaskedValue(refCallback as UseMaskInputAntdReturn, unmaskedValue);\n}\n"]}
|
package/dist/antd.d.cts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { InputRef } from 'antd';
|
|
2
2
|
import { RefCallback } from 'react';
|
|
3
3
|
import { FieldValues, RegisterOptions, UseFormRegister, Path } from 'react-hook-form';
|
|
4
|
-
import {
|
|
4
|
+
import { a as UseHookFormMaskReturn, M as Mask, O as Options, c as UnmaskedValueApi } from './index-D8KkaDbQ.cjs';
|
|
5
5
|
|
|
6
6
|
type UseHookFormMaskAntdReturn<T extends FieldValues> = Omit<UseHookFormMaskReturn<T>, 'ref'> & {
|
|
7
7
|
ref: RefCallback<InputRef | null>;
|
|
@@ -17,6 +17,7 @@ type UseHookFormMaskAntdReturn<T extends FieldValues> = Omit<UseHookFormMaskRetu
|
|
|
17
17
|
*/
|
|
18
18
|
declare function useHookFormMaskAntd<T extends FieldValues, D extends RegisterOptions>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (D & Options) | Options | D) => UseHookFormMaskAntdReturn<T>);
|
|
19
19
|
|
|
20
|
+
type UseMaskInputAntdReturn = ((input: InputRef | null) => void) & UnmaskedValueApi;
|
|
20
21
|
interface UseMaskInputOptions {
|
|
21
22
|
mask: Mask;
|
|
22
23
|
register?: (element: HTMLElement) => void;
|
|
@@ -31,6 +32,6 @@ interface UseMaskInputOptions {
|
|
|
31
32
|
* @param props.options - Optional mask configuration options
|
|
32
33
|
* @returns A ref callback function to attach to the Ant Design Input element
|
|
33
34
|
*/
|
|
34
|
-
declare function useMaskInputAntd(props: UseMaskInputOptions):
|
|
35
|
+
declare function useMaskInputAntd(props: UseMaskInputOptions): UseMaskInputAntdReturn;
|
|
35
36
|
|
|
36
37
|
export { type UseHookFormMaskAntdReturn, useHookFormMaskAntd, useMaskInputAntd };
|
package/dist/antd.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { InputRef } from 'antd';
|
|
2
2
|
import { RefCallback } from 'react';
|
|
3
3
|
import { FieldValues, RegisterOptions, UseFormRegister, Path } from 'react-hook-form';
|
|
4
|
-
import {
|
|
4
|
+
import { a as UseHookFormMaskReturn, M as Mask, O as Options, c as UnmaskedValueApi } from './index-D8KkaDbQ.js';
|
|
5
5
|
|
|
6
6
|
type UseHookFormMaskAntdReturn<T extends FieldValues> = Omit<UseHookFormMaskReturn<T>, 'ref'> & {
|
|
7
7
|
ref: RefCallback<InputRef | null>;
|
|
@@ -17,6 +17,7 @@ type UseHookFormMaskAntdReturn<T extends FieldValues> = Omit<UseHookFormMaskRetu
|
|
|
17
17
|
*/
|
|
18
18
|
declare function useHookFormMaskAntd<T extends FieldValues, D extends RegisterOptions>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (D & Options) | Options | D) => UseHookFormMaskAntdReturn<T>);
|
|
19
19
|
|
|
20
|
+
type UseMaskInputAntdReturn = ((input: InputRef | null) => void) & UnmaskedValueApi;
|
|
20
21
|
interface UseMaskInputOptions {
|
|
21
22
|
mask: Mask;
|
|
22
23
|
register?: (element: HTMLElement) => void;
|
|
@@ -31,6 +32,6 @@ interface UseMaskInputOptions {
|
|
|
31
32
|
* @param props.options - Optional mask configuration options
|
|
32
33
|
* @returns A ref callback function to attach to the Ant Design Input element
|
|
33
34
|
*/
|
|
34
|
-
declare function useMaskInputAntd(props: UseMaskInputOptions):
|
|
35
|
+
declare function useMaskInputAntd(props: UseMaskInputOptions): UseMaskInputAntdReturn;
|
|
35
36
|
|
|
36
37
|
export { type UseHookFormMaskAntdReturn, useHookFormMaskAntd, useMaskInputAntd };
|
package/dist/antd.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { makeMaskCacheKey, setPrevRef, resolveInputRef, withMask, isServer_default, applyMaskToElement } from './chunk-
|
|
1
|
+
import { makeMaskCacheKey, setPrevRef, getUnmaskedValue, resolveInputRef, withMask, isServer_default, setUnmaskedValue, applyMaskToElement } from './chunk-TVCNC3TP.js';
|
|
2
2
|
import { useMemo, useRef, useCallback, useEffect } from 'react';
|
|
3
3
|
|
|
4
4
|
function useHookFormMaskAntd(registerFn) {
|
|
@@ -32,6 +32,7 @@ function useMaskInputAntd(props) {
|
|
|
32
32
|
const maskRef = useRef(mask);
|
|
33
33
|
const optionsRef = useRef(options);
|
|
34
34
|
const maskedElementRef = useRef(null);
|
|
35
|
+
const unmaskedValue = useCallback(() => getUnmaskedValue(ref.current), []);
|
|
35
36
|
maskRef.current = mask;
|
|
36
37
|
optionsRef.current = options;
|
|
37
38
|
const refCallback = useCallback((input) => {
|
|
@@ -50,10 +51,11 @@ function useMaskInputAntd(props) {
|
|
|
50
51
|
register(ref.current);
|
|
51
52
|
}, [register]);
|
|
52
53
|
if (isServer_default) {
|
|
53
|
-
|
|
54
|
-
};
|
|
54
|
+
const noop = (() => {
|
|
55
|
+
});
|
|
56
|
+
return setUnmaskedValue(noop, () => "");
|
|
55
57
|
}
|
|
56
|
-
return refCallback;
|
|
58
|
+
return setUnmaskedValue(refCallback, unmaskedValue);
|
|
57
59
|
}
|
|
58
60
|
|
|
59
61
|
export { useHookFormMaskAntd, useMaskInputAntd };
|
package/dist/antd.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/antd/useHookFormMaskAntd.ts","../src/antd/useMaskInputAntd.ts"],"names":[],"mappings":";;;AA6Be,SAAR,oBAEL,UAAA,EAC6D;AAE7D,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAA,MAAM,QAAA,uBAAe,GAAA,EAA0C;AAE/D,IAAA,OAAO,CAAC,SAAA,EAAoB,IAAA,EAAY,OAAA,KACuB;AAC7D,MAAA,IAAI,CAAC,UAAA,EAAY,MAAM,IAAI,MAAM,wBAAwB,CAAA;AAEzD,MAAA,MAAM,cAAA,GAAiB,UAAA,CAAW,SAAA,EAAW,OAAkB,CAAA;AAC/D,MAAA,MAAM,EAAE,KAAI,GAAI,cAAA;AAEhB,MAAA,MAAM,QAAA,GAAW,gBAAA,CAAiB,SAAA,EAAW,IAAI,CAAA;AAEjD,MAAA,IAAI,CAAC,QAAA,CAAS,GAAA,CAAI,QAAQ,CAAA,EAAG;AAC3B,QAAA,MAAM,WAAA,GAA4C,CAAC,QAAA,KAAa;AAC9D,UAAA,MAAM,OAAA,GAAU,QAAA,GAAW,eAAA,CAAgB,QAAA,CAAS,KAAK,CAAA,GAAI,IAAA;AAC7D,UAAA,IAAI,OAAA,EAAS,kBAAA,CAAmB,OAAA,EAAS,IAAA,EAAM,OAAkB,CAAA;AACjE,UAAA,IAAI,GAAA,MAAS,OAAO,CAAA;AAAA,QACtB,CAAA;AACA,QAAA,QAAA,CAAS,GAAA,CAAI,UAAU,WAAW,CAAA;AAAA,MACpC;AAEA,MAAA,MAAM,MAAA,GAAS;AAAA,QACb,GAAG,cAAA;AAAA,QACH,GAAA,EAAK,QAAA,CAAS,GAAA,CAAI,QAAQ;AAAA,OAC5B;AAEA,MAAA,UAAA,CAAW,QAAQ,GAAG,CAAA;AAEtB,MAAA,OAAO,MAAA;AAAA,IACT,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AACjB;
|
|
1
|
+
{"version":3,"sources":["../src/antd/useHookFormMaskAntd.ts","../src/antd/useMaskInputAntd.ts"],"names":[],"mappings":";;;AA6Be,SAAR,oBAEL,UAAA,EAC6D;AAE7D,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAA,MAAM,QAAA,uBAAe,GAAA,EAA0C;AAE/D,IAAA,OAAO,CAAC,SAAA,EAAoB,IAAA,EAAY,OAAA,KACuB;AAC7D,MAAA,IAAI,CAAC,UAAA,EAAY,MAAM,IAAI,MAAM,wBAAwB,CAAA;AAEzD,MAAA,MAAM,cAAA,GAAiB,UAAA,CAAW,SAAA,EAAW,OAAkB,CAAA;AAC/D,MAAA,MAAM,EAAE,KAAI,GAAI,cAAA;AAEhB,MAAA,MAAM,QAAA,GAAW,gBAAA,CAAiB,SAAA,EAAW,IAAI,CAAA;AAEjD,MAAA,IAAI,CAAC,QAAA,CAAS,GAAA,CAAI,QAAQ,CAAA,EAAG;AAC3B,QAAA,MAAM,WAAA,GAA4C,CAAC,QAAA,KAAa;AAC9D,UAAA,MAAM,OAAA,GAAU,QAAA,GAAW,eAAA,CAAgB,QAAA,CAAS,KAAK,CAAA,GAAI,IAAA;AAC7D,UAAA,IAAI,OAAA,EAAS,kBAAA,CAAmB,OAAA,EAAS,IAAA,EAAM,OAAkB,CAAA;AACjE,UAAA,IAAI,GAAA,MAAS,OAAO,CAAA;AAAA,QACtB,CAAA;AACA,QAAA,QAAA,CAAS,GAAA,CAAI,UAAU,WAAW,CAAA;AAAA,MACpC;AAEA,MAAA,MAAM,MAAA,GAAS;AAAA,QACb,GAAG,cAAA;AAAA,QACH,GAAA,EAAK,QAAA,CAAS,GAAA,CAAI,QAAQ;AAAA,OAC5B;AAEA,MAAA,UAAA,CAAW,QAAQ,GAAG,CAAA;AAEtB,MAAA,OAAO,MAAA;AAAA,IACT,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AACjB;ACrCe,SAAR,iBAAkC,KAAA,EAAoD;AAC3F,EAAA,MAAM,EAAE,IAAA,EAAM,QAAA,EAAU,OAAA,EAAQ,GAAI,KAAA;AACpC,EAAA,MAAM,GAAA,GAAM,OAAgC,IAAI,CAAA;AAChD,EAAA,MAAM,OAAA,GAAU,OAAO,IAAI,CAAA;AAC3B,EAAA,MAAM,UAAA,GAAa,OAAO,OAAO,CAAA;AACjC,EAAA,MAAM,gBAAA,GAAmB,OAAgC,IAAI,CAAA;AAC7D,EAAA,MAAM,aAAA,GAAgB,YAAY,MAAM,gBAAA,CAAiB,IAAI,OAAO,CAAA,EAAG,EAAE,CAAA;AAEzE,EAAA,OAAA,CAAQ,OAAA,GAAU,IAAA;AAClB,EAAA,UAAA,CAAW,OAAA,GAAU,OAAA;AAErB,EAAA,MAAM,WAAA,GAAc,WAAA,CAAY,CAAC,KAAA,KAAiC;AAChE,IAAA,IAAI,CAAC,KAAA,EAAO;AACV,MAAA,GAAA,CAAI,OAAA,GAAU,IAAA;AACd,MAAA;AAAA,IACF;AAEA,IAAA,GAAA,CAAI,OAAA,GAAU,eAAA,CAAgB,KAAA,CAAM,KAAK,CAAA;AAEzC,IAAA,IAAI,GAAA,CAAI,OAAA,IAAW,GAAA,CAAI,OAAA,KAAY,iBAAiB,OAAA,EAAS;AAC3D,MAAA,QAAA,CAAS,QAAQ,OAAA,EAAS,UAAA,CAAW,OAAO,CAAA,CAAE,IAAI,OAAO,CAAA;AACzD,MAAA,gBAAA,CAAiB,UAAU,GAAA,CAAI,OAAA;AAAA,IACjC;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,gBAAA,IAAY,CAAC,GAAA,CAAI,OAAA,IAAW,CAAC,QAAA,EAAU;AAC3C,IAAA,QAAA,CAAS,IAAI,OAAO,CAAA;AAAA,EACtB,CAAA,EAAG,CAAC,QAAQ,CAAC,CAAA;AAEb,EAAA,IAAI,gBAAA,EAAU;AACZ,IAAA,MAAM,QAAQ,MAAM;AAAA,IAEpB,CAAA,CAAA;AAEA,IAAA,OAAO,gBAAA,CAAiB,IAAA,EAAM,MAAM,EAAE,CAAA;AAAA,EACxC;AAEA,EAAA,OAAO,gBAAA,CAAiB,aAAuC,aAAa,CAAA;AAC9E","file":"antd.js","sourcesContent":["import { useMemo } from 'react';\n\nimport { applyMaskToElement, resolveInputRef } from '../core';\nimport { makeMaskCacheKey, setPrevRef } from '../utils';\n\nimport type { InputRef } from 'antd';\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\nexport type UseHookFormMaskAntdReturn<T extends FieldValues> = Omit<\n UseHookFormMaskReturn<T>,\n 'ref'\n> & { ref: RefCallback<InputRef | null> };\n\n/**\n * Ant Design version of useHookFormMask.\n * Creates a masked register that works with Ant Design Input (ref receives InputRef).\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 for Ant Design Input\n */\nexport default function useHookFormMaskAntd<\n T extends FieldValues, D extends RegisterOptions,\n>(registerFn: UseFormRegister<T>): ((fieldName: Path<T>, mask: Mask, options?: (\n D & Options) | Options | D) => UseHookFormMaskAntdReturn<T>) {\n //\n return useMemo(() => {\n const refCache = new Map<string, RefCallback<InputRef | null>>();\n\n return (fieldName: Path<T>, mask: Mask, options?: (\n D & Options) | Options | D): UseHookFormMaskAntdReturn<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 refWithMask: RefCallback<InputRef | null> = (inputRef) => {\n const element = inputRef ? resolveInputRef(inputRef.input) : null;\n if (element) applyMaskToElement(element, mask, options as Options);\n if (ref) ref(element);\n };\n refCache.set(cacheKey, refWithMask);\n }\n\n const result = {\n ...registerReturn,\n ref: refCache.get(cacheKey),\n } as UseHookFormMaskAntdReturn<T>;\n\n setPrevRef(result, ref);\n\n return result;\n };\n }, [registerFn]);\n}\n","import { useCallback, useEffect, useRef } from 'react';\n\nimport withMask from '../api/withMask';\nimport { resolveInputRef } from '../core';\nimport isServer from '../utils/isServer';\nimport { getUnmaskedValue, setUnmaskedValue } from '../utils';\n\nimport type { InputRef } from 'antd';\n\nimport type { Mask, Options, UnmaskedValueApi } from '../types';\n\ntype UseMaskInputAntdReturn = ((input: InputRef | null) => void) & UnmaskedValueApi;\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 Ant Design form elements.\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 Ant Design Input element\n */\nexport default function useMaskInputAntd(props: UseMaskInputOptions): UseMaskInputAntdReturn {\n const { mask, register, options } = props;\n const ref = useRef<HTMLInputElement | null>(null);\n const maskRef = useRef(mask);\n const optionsRef = useRef(options);\n const maskedElementRef = useRef<HTMLInputElement | null>(null);\n const unmaskedValue = useCallback(() => getUnmaskedValue(ref.current), []);\n\n maskRef.current = mask;\n optionsRef.current = options;\n\n const refCallback = useCallback((input: InputRef | null): void => {\n if (!input) {\n ref.current = null;\n return;\n }\n\n ref.current = resolveInputRef(input.input);\n\n if (ref.current && ref.current !== maskedElementRef.current) {\n withMask(maskRef.current, optionsRef.current)(ref.current);\n maskedElementRef.current = ref.current;\n }\n }, []);\n\n useEffect(() => {\n if (isServer || !ref.current || !register) return;\n register(ref.current);\n }, [register]);\n\n if (isServer) {\n const noop = (() => {\n // server doesn't have dom, so just do nothing\n }) as unknown as UseMaskInputAntdReturn;\n\n return setUnmaskedValue(noop, () => '');\n }\n\n return setUnmaskedValue(refCallback as UseMaskInputAntdReturn, unmaskedValue);\n}\n"]}
|
|
@@ -3778,6 +3778,48 @@ function interopDefaultSync(module) {
|
|
|
3778
3778
|
return module;
|
|
3779
3779
|
}
|
|
3780
3780
|
|
|
3781
|
+
// src/core/elementResolver.ts
|
|
3782
|
+
function isHTMLElement(element) {
|
|
3783
|
+
return element !== null && typeof element === "object" && "nodeType" in element && "querySelector" in element && typeof element.querySelector === "function";
|
|
3784
|
+
}
|
|
3785
|
+
function findInputElement(element) {
|
|
3786
|
+
if (!element) return null;
|
|
3787
|
+
if (!isHTMLElement(element)) {
|
|
3788
|
+
return null;
|
|
3789
|
+
}
|
|
3790
|
+
if (element.nodeName === "INPUT" || element.nodeName === "TEXTAREA") {
|
|
3791
|
+
return element;
|
|
3792
|
+
}
|
|
3793
|
+
if (!("querySelector" in element) || typeof element.querySelector !== "function") {
|
|
3794
|
+
return null;
|
|
3795
|
+
}
|
|
3796
|
+
try {
|
|
3797
|
+
const inputElement = element.querySelector("input, textarea");
|
|
3798
|
+
if (inputElement && isHTMLElement(inputElement)) {
|
|
3799
|
+
return inputElement;
|
|
3800
|
+
}
|
|
3801
|
+
} catch {
|
|
3802
|
+
return null;
|
|
3803
|
+
}
|
|
3804
|
+
return null;
|
|
3805
|
+
}
|
|
3806
|
+
function resolveInputRef(input) {
|
|
3807
|
+
if (!input) {
|
|
3808
|
+
return null;
|
|
3809
|
+
}
|
|
3810
|
+
if (typeof input === "object" && "current" in input) {
|
|
3811
|
+
const refValue = input.current;
|
|
3812
|
+
if (isHTMLElement(refValue)) {
|
|
3813
|
+
return refValue;
|
|
3814
|
+
}
|
|
3815
|
+
return null;
|
|
3816
|
+
}
|
|
3817
|
+
if (isHTMLElement(input)) {
|
|
3818
|
+
return input;
|
|
3819
|
+
}
|
|
3820
|
+
return null;
|
|
3821
|
+
}
|
|
3822
|
+
|
|
3781
3823
|
// src/utils/maskHelpers.ts
|
|
3782
3824
|
function makeMaskCacheKey(fieldName, mask) {
|
|
3783
3825
|
return `${fieldName}:${Array.isArray(mask) ? mask.join(",") : String(mask)}`;
|
|
@@ -3790,6 +3832,33 @@ function setPrevRef(result, ref) {
|
|
|
3790
3832
|
configurable: true
|
|
3791
3833
|
});
|
|
3792
3834
|
}
|
|
3835
|
+
function resolveUnmaskedInput(input) {
|
|
3836
|
+
const resolved = resolveInputRef(input);
|
|
3837
|
+
if (!resolved) return null;
|
|
3838
|
+
const inputElement = findInputElement(resolved);
|
|
3839
|
+
if (inputElement) {
|
|
3840
|
+
return inputElement;
|
|
3841
|
+
}
|
|
3842
|
+
return resolved;
|
|
3843
|
+
}
|
|
3844
|
+
function getUnmaskedValue(input) {
|
|
3845
|
+
const element = resolveUnmaskedInput(input);
|
|
3846
|
+
if (!element) return "";
|
|
3847
|
+
const inputmask3 = element.inputmask;
|
|
3848
|
+
if (inputmask3 && typeof inputmask3.unmaskedvalue === "function") {
|
|
3849
|
+
return inputmask3.unmaskedvalue();
|
|
3850
|
+
}
|
|
3851
|
+
return "value" in element ? element.value : "";
|
|
3852
|
+
}
|
|
3853
|
+
function setUnmaskedValue(result, getter) {
|
|
3854
|
+
Object.defineProperty(result, "unmaskedValue", {
|
|
3855
|
+
value: getter,
|
|
3856
|
+
enumerable: false,
|
|
3857
|
+
writable: true,
|
|
3858
|
+
configurable: true
|
|
3859
|
+
});
|
|
3860
|
+
return result;
|
|
3861
|
+
}
|
|
3793
3862
|
|
|
3794
3863
|
// src/api/withMask.ts
|
|
3795
3864
|
var callbackCache = /* @__PURE__ */ new Map();
|
|
@@ -3800,37 +3869,18 @@ function withMask(mask, options) {
|
|
|
3800
3869
|
return callbackCache.get(cacheKey);
|
|
3801
3870
|
}
|
|
3802
3871
|
}
|
|
3803
|
-
|
|
3872
|
+
let currentInput = null;
|
|
3873
|
+
const callback = ((input) => {
|
|
3804
3874
|
if (isServer_default || mask === null || !input) return;
|
|
3875
|
+
currentInput = input;
|
|
3805
3876
|
const maskInput = interopDefaultSync(import_inputmask.default)(getMaskOptions(mask, options));
|
|
3806
3877
|
maskInput.mask(input);
|
|
3807
|
-
};
|
|
3878
|
+
});
|
|
3808
3879
|
if (!options) {
|
|
3809
3880
|
const cacheKey = makeMaskCacheKey("", mask);
|
|
3810
3881
|
callbackCache.set(cacheKey, callback);
|
|
3811
3882
|
}
|
|
3812
|
-
return callback;
|
|
3813
|
-
}
|
|
3814
|
-
|
|
3815
|
-
// src/core/elementResolver.ts
|
|
3816
|
-
function isHTMLElement(element) {
|
|
3817
|
-
return element !== null && typeof element === "object" && "nodeType" in element && "querySelector" in element && typeof element.querySelector === "function";
|
|
3818
|
-
}
|
|
3819
|
-
function resolveInputRef(input) {
|
|
3820
|
-
if (!input) {
|
|
3821
|
-
return null;
|
|
3822
|
-
}
|
|
3823
|
-
if (typeof input === "object" && "current" in input) {
|
|
3824
|
-
const refValue = input.current;
|
|
3825
|
-
if (isHTMLElement(refValue)) {
|
|
3826
|
-
return refValue;
|
|
3827
|
-
}
|
|
3828
|
-
return null;
|
|
3829
|
-
}
|
|
3830
|
-
if (isHTMLElement(input)) {
|
|
3831
|
-
return input;
|
|
3832
|
-
}
|
|
3833
|
-
return null;
|
|
3883
|
+
return setUnmaskedValue(callback, () => getUnmaskedValue(currentInput));
|
|
3834
3884
|
}
|
|
3835
3885
|
|
|
3836
3886
|
// src/core/maskEngine.ts
|
|
@@ -3864,10 +3914,12 @@ inputmask/dist/inputmask.js:
|
|
|
3864
3914
|
|
|
3865
3915
|
exports.applyMaskToElement = applyMaskToElement;
|
|
3866
3916
|
exports.flow = flow;
|
|
3917
|
+
exports.getUnmaskedValue = getUnmaskedValue;
|
|
3867
3918
|
exports.isServer_default = isServer_default;
|
|
3868
3919
|
exports.makeMaskCacheKey = makeMaskCacheKey;
|
|
3869
3920
|
exports.resolveInputRef = resolveInputRef;
|
|
3870
3921
|
exports.setPrevRef = setPrevRef;
|
|
3922
|
+
exports.setUnmaskedValue = setUnmaskedValue;
|
|
3871
3923
|
exports.withMask = withMask;
|
|
3872
|
-
//# sourceMappingURL=chunk-
|
|
3873
|
-
//# sourceMappingURL=chunk-
|
|
3924
|
+
//# sourceMappingURL=chunk-DTC7JTZP.cjs.map
|
|
3925
|
+
//# sourceMappingURL=chunk-DTC7JTZP.cjs.map
|