@meowster404/verifio-react 0.1.1
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/dist/index.d.mts +101 -0
- package/dist/index.d.ts +101 -0
- package/dist/index.js +334 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +312 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +58 -0
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
import { ValidationResult } from 'verifio';
|
|
2
|
+
import React$1, { InputHTMLAttributes } from 'react';
|
|
3
|
+
|
|
4
|
+
interface UseVerifioProps {
|
|
5
|
+
initialValue?: string;
|
|
6
|
+
validator: (value: string) => ValidationResult;
|
|
7
|
+
onChange?: (value: string, isValid: boolean) => void;
|
|
8
|
+
format?: (value: string) => string;
|
|
9
|
+
}
|
|
10
|
+
interface UseVerifioReturn {
|
|
11
|
+
value: string;
|
|
12
|
+
setValue: (value: string) => void;
|
|
13
|
+
valid: boolean;
|
|
14
|
+
error: string | null;
|
|
15
|
+
validate: () => boolean;
|
|
16
|
+
reset: () => void;
|
|
17
|
+
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
18
|
+
}
|
|
19
|
+
declare function useVerifio({ initialValue, validator, onChange, format }: UseVerifioProps): UseVerifioReturn;
|
|
20
|
+
|
|
21
|
+
declare function usePANValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
22
|
+
declare function useGSTValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
23
|
+
declare function useAadhaarValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
24
|
+
declare function useEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
25
|
+
declare function useStudentEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
26
|
+
declare function usePhoneValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
27
|
+
declare function usePincodeValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
28
|
+
declare function useURLValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
29
|
+
declare function useIFSCValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
30
|
+
|
|
31
|
+
interface BaseInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
|
|
32
|
+
value: string;
|
|
33
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
34
|
+
error?: string | null;
|
|
35
|
+
onBlurValidate?: () => void;
|
|
36
|
+
containerClassName?: string;
|
|
37
|
+
errorClassName?: string;
|
|
38
|
+
}
|
|
39
|
+
declare const BaseInput: React$1.ForwardRefExoticComponent<BaseInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
40
|
+
|
|
41
|
+
interface PANInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
42
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
43
|
+
validate?: () => void;
|
|
44
|
+
}
|
|
45
|
+
declare const PANInput: React$1.ForwardRefExoticComponent<PANInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
46
|
+
|
|
47
|
+
interface AadhaarInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
48
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
49
|
+
validate?: () => void;
|
|
50
|
+
}
|
|
51
|
+
declare const AadhaarInput: React$1.ForwardRefExoticComponent<AadhaarInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
52
|
+
|
|
53
|
+
interface EmailInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
54
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
55
|
+
validate?: () => void;
|
|
56
|
+
}
|
|
57
|
+
declare const EmailInput: React$1.ForwardRefExoticComponent<EmailInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
58
|
+
|
|
59
|
+
interface GSTInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
60
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
61
|
+
validate?: () => void;
|
|
62
|
+
}
|
|
63
|
+
declare const GSTInput: React$1.ForwardRefExoticComponent<GSTInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
64
|
+
|
|
65
|
+
interface IFSCInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
66
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
67
|
+
validate?: () => void;
|
|
68
|
+
}
|
|
69
|
+
declare const IFSCInput: React$1.ForwardRefExoticComponent<IFSCInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
70
|
+
|
|
71
|
+
interface PasswordInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
72
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
73
|
+
validate?: () => void;
|
|
74
|
+
}
|
|
75
|
+
declare const PasswordInput: React$1.ForwardRefExoticComponent<PasswordInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
76
|
+
|
|
77
|
+
interface PhoneInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
78
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
79
|
+
validate?: () => void;
|
|
80
|
+
}
|
|
81
|
+
declare const PhoneInput: React$1.ForwardRefExoticComponent<PhoneInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
82
|
+
|
|
83
|
+
interface PincodeInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
84
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
85
|
+
validate?: () => void;
|
|
86
|
+
}
|
|
87
|
+
declare const PincodeInput: React$1.ForwardRefExoticComponent<PincodeInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
88
|
+
|
|
89
|
+
interface StudentEmailInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
90
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
91
|
+
validate?: () => void;
|
|
92
|
+
}
|
|
93
|
+
declare const StudentEmailInput: React$1.ForwardRefExoticComponent<StudentEmailInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
94
|
+
|
|
95
|
+
interface URLInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
96
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
97
|
+
validate?: () => void;
|
|
98
|
+
}
|
|
99
|
+
declare const URLInput: React$1.ForwardRefExoticComponent<URLInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
100
|
+
|
|
101
|
+
export { AadhaarInput, type AadhaarInputProps, BaseInput, EmailInput, type EmailInputProps, GSTInput, type GSTInputProps, IFSCInput, type IFSCInputProps, PANInput, type PANInputProps, PasswordInput, type PasswordInputProps, PhoneInput, type PhoneInputProps, PincodeInput, type PincodeInputProps, StudentEmailInput, type StudentEmailInputProps, URLInput, type URLInputProps, useAadhaarValidation, useEmailValidation, useGSTValidation, useIFSCValidation, usePANValidation, usePhoneValidation, usePincodeValidation, useStudentEmailValidation, useURLValidation, useVerifio };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
import { ValidationResult } from 'verifio';
|
|
2
|
+
import React$1, { InputHTMLAttributes } from 'react';
|
|
3
|
+
|
|
4
|
+
interface UseVerifioProps {
|
|
5
|
+
initialValue?: string;
|
|
6
|
+
validator: (value: string) => ValidationResult;
|
|
7
|
+
onChange?: (value: string, isValid: boolean) => void;
|
|
8
|
+
format?: (value: string) => string;
|
|
9
|
+
}
|
|
10
|
+
interface UseVerifioReturn {
|
|
11
|
+
value: string;
|
|
12
|
+
setValue: (value: string) => void;
|
|
13
|
+
valid: boolean;
|
|
14
|
+
error: string | null;
|
|
15
|
+
validate: () => boolean;
|
|
16
|
+
reset: () => void;
|
|
17
|
+
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
18
|
+
}
|
|
19
|
+
declare function useVerifio({ initialValue, validator, onChange, format }: UseVerifioProps): UseVerifioReturn;
|
|
20
|
+
|
|
21
|
+
declare function usePANValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
22
|
+
declare function useGSTValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
23
|
+
declare function useAadhaarValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
24
|
+
declare function useEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
25
|
+
declare function useStudentEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
26
|
+
declare function usePhoneValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
27
|
+
declare function usePincodeValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
28
|
+
declare function useURLValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
29
|
+
declare function useIFSCValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void): UseVerifioReturn;
|
|
30
|
+
|
|
31
|
+
interface BaseInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
|
|
32
|
+
value: string;
|
|
33
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
34
|
+
error?: string | null;
|
|
35
|
+
onBlurValidate?: () => void;
|
|
36
|
+
containerClassName?: string;
|
|
37
|
+
errorClassName?: string;
|
|
38
|
+
}
|
|
39
|
+
declare const BaseInput: React$1.ForwardRefExoticComponent<BaseInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
40
|
+
|
|
41
|
+
interface PANInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
42
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
43
|
+
validate?: () => void;
|
|
44
|
+
}
|
|
45
|
+
declare const PANInput: React$1.ForwardRefExoticComponent<PANInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
46
|
+
|
|
47
|
+
interface AadhaarInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
48
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
49
|
+
validate?: () => void;
|
|
50
|
+
}
|
|
51
|
+
declare const AadhaarInput: React$1.ForwardRefExoticComponent<AadhaarInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
52
|
+
|
|
53
|
+
interface EmailInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
54
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
55
|
+
validate?: () => void;
|
|
56
|
+
}
|
|
57
|
+
declare const EmailInput: React$1.ForwardRefExoticComponent<EmailInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
58
|
+
|
|
59
|
+
interface GSTInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
60
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
61
|
+
validate?: () => void;
|
|
62
|
+
}
|
|
63
|
+
declare const GSTInput: React$1.ForwardRefExoticComponent<GSTInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
64
|
+
|
|
65
|
+
interface IFSCInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
66
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
67
|
+
validate?: () => void;
|
|
68
|
+
}
|
|
69
|
+
declare const IFSCInput: React$1.ForwardRefExoticComponent<IFSCInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
70
|
+
|
|
71
|
+
interface PasswordInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
72
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
73
|
+
validate?: () => void;
|
|
74
|
+
}
|
|
75
|
+
declare const PasswordInput: React$1.ForwardRefExoticComponent<PasswordInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
76
|
+
|
|
77
|
+
interface PhoneInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
78
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
79
|
+
validate?: () => void;
|
|
80
|
+
}
|
|
81
|
+
declare const PhoneInput: React$1.ForwardRefExoticComponent<PhoneInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
82
|
+
|
|
83
|
+
interface PincodeInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
84
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
85
|
+
validate?: () => void;
|
|
86
|
+
}
|
|
87
|
+
declare const PincodeInput: React$1.ForwardRefExoticComponent<PincodeInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
88
|
+
|
|
89
|
+
interface StudentEmailInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
90
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
91
|
+
validate?: () => void;
|
|
92
|
+
}
|
|
93
|
+
declare const StudentEmailInput: React$1.ForwardRefExoticComponent<StudentEmailInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
94
|
+
|
|
95
|
+
interface URLInputProps extends Omit<BaseInputProps, 'onChange'> {
|
|
96
|
+
onChange: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
|
|
97
|
+
validate?: () => void;
|
|
98
|
+
}
|
|
99
|
+
declare const URLInput: React$1.ForwardRefExoticComponent<URLInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
100
|
+
|
|
101
|
+
export { AadhaarInput, type AadhaarInputProps, BaseInput, EmailInput, type EmailInputProps, GSTInput, type GSTInputProps, IFSCInput, type IFSCInputProps, PANInput, type PANInputProps, PasswordInput, type PasswordInputProps, PhoneInput, type PhoneInputProps, PincodeInput, type PincodeInputProps, StudentEmailInput, type StudentEmailInputProps, URLInput, type URLInputProps, useAadhaarValidation, useEmailValidation, useGSTValidation, useIFSCValidation, usePANValidation, usePhoneValidation, usePincodeValidation, useStudentEmailValidation, useURLValidation, useVerifio };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,334 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var react = require('react');
|
|
4
|
+
var verifio = require('verifio');
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
|
|
7
|
+
// src/hooks/useVerifio.ts
|
|
8
|
+
function useVerifio({
|
|
9
|
+
initialValue = "",
|
|
10
|
+
validator,
|
|
11
|
+
onChange,
|
|
12
|
+
format
|
|
13
|
+
}) {
|
|
14
|
+
const [value, setInternalValue] = react.useState(initialValue);
|
|
15
|
+
const [error, setError] = react.useState(null);
|
|
16
|
+
const [valid, setValid] = react.useState(true);
|
|
17
|
+
const validate = react.useCallback((currentValue = value) => {
|
|
18
|
+
if (!currentValue) {
|
|
19
|
+
setValid(true);
|
|
20
|
+
setError(null);
|
|
21
|
+
return true;
|
|
22
|
+
}
|
|
23
|
+
const result = validator(currentValue);
|
|
24
|
+
setValid(result.valid);
|
|
25
|
+
setError(result.valid ? null : result.errors[0] || "Invalid input");
|
|
26
|
+
return result.valid;
|
|
27
|
+
}, [value, validator]);
|
|
28
|
+
const setValue = react.useCallback((newValue) => {
|
|
29
|
+
const formattedValue = format ? format(newValue) : newValue;
|
|
30
|
+
setInternalValue(formattedValue);
|
|
31
|
+
}, [format]);
|
|
32
|
+
const handleChange = react.useCallback((e) => {
|
|
33
|
+
const newValue = e.target.value;
|
|
34
|
+
const formattedValue = format ? format(newValue) : newValue;
|
|
35
|
+
setInternalValue(formattedValue);
|
|
36
|
+
if (error) {
|
|
37
|
+
const result = validator(formattedValue);
|
|
38
|
+
setValid(result.valid);
|
|
39
|
+
setError(result.valid ? null : result.errors[0] || "Invalid input");
|
|
40
|
+
onChange?.(formattedValue, result.valid);
|
|
41
|
+
} else {
|
|
42
|
+
onChange?.(formattedValue, true);
|
|
43
|
+
}
|
|
44
|
+
}, [error, validator, onChange, format]);
|
|
45
|
+
const reset = react.useCallback(() => {
|
|
46
|
+
setInternalValue("");
|
|
47
|
+
setError(null);
|
|
48
|
+
setValid(true);
|
|
49
|
+
}, []);
|
|
50
|
+
return {
|
|
51
|
+
value,
|
|
52
|
+
setValue,
|
|
53
|
+
valid,
|
|
54
|
+
error,
|
|
55
|
+
validate: () => validate(value),
|
|
56
|
+
reset,
|
|
57
|
+
onChange: handleChange
|
|
58
|
+
};
|
|
59
|
+
}
|
|
60
|
+
function usePANValidation(initialValue, onChange) {
|
|
61
|
+
return useVerifio({
|
|
62
|
+
initialValue,
|
|
63
|
+
validator: verifio.validatePAN,
|
|
64
|
+
onChange,
|
|
65
|
+
format: (val) => val.toUpperCase()
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
function useGSTValidation(initialValue, onChange) {
|
|
69
|
+
return useVerifio({
|
|
70
|
+
initialValue,
|
|
71
|
+
validator: verifio.validateGST,
|
|
72
|
+
onChange,
|
|
73
|
+
format: (val) => val.toUpperCase()
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
function useAadhaarValidation(initialValue, onChange) {
|
|
77
|
+
return useVerifio({
|
|
78
|
+
initialValue,
|
|
79
|
+
validator: verifio.validateAadhaar,
|
|
80
|
+
onChange,
|
|
81
|
+
// Add spaces every 4 digits for aadhaar display if desired,
|
|
82
|
+
// but better to handle strictly on input
|
|
83
|
+
format: (val) => {
|
|
84
|
+
const digits = val.replace(/\D/g, "");
|
|
85
|
+
return digits.replace(/(.{4})/g, "$1 ").trim().substring(0, 14);
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
function useEmailValidation(initialValue, onChange) {
|
|
90
|
+
return useVerifio({
|
|
91
|
+
initialValue,
|
|
92
|
+
validator: verifio.validateEmail,
|
|
93
|
+
onChange
|
|
94
|
+
});
|
|
95
|
+
}
|
|
96
|
+
function useStudentEmailValidation(initialValue, onChange) {
|
|
97
|
+
return useVerifio({
|
|
98
|
+
initialValue,
|
|
99
|
+
validator: verifio.validateStudentEmail,
|
|
100
|
+
onChange
|
|
101
|
+
});
|
|
102
|
+
}
|
|
103
|
+
function usePhoneValidation(initialValue, onChange) {
|
|
104
|
+
return useVerifio({
|
|
105
|
+
initialValue,
|
|
106
|
+
validator: verifio.validatePhone,
|
|
107
|
+
onChange
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
function usePincodeValidation(initialValue, onChange) {
|
|
111
|
+
return useVerifio({
|
|
112
|
+
initialValue,
|
|
113
|
+
validator: verifio.validatePincode,
|
|
114
|
+
onChange
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
function useURLValidation(initialValue, onChange) {
|
|
118
|
+
return useVerifio({
|
|
119
|
+
initialValue,
|
|
120
|
+
validator: verifio.validateURL,
|
|
121
|
+
onChange
|
|
122
|
+
});
|
|
123
|
+
}
|
|
124
|
+
function useIFSCValidation(initialValue, onChange) {
|
|
125
|
+
return useVerifio({
|
|
126
|
+
initialValue,
|
|
127
|
+
validator: verifio.validateIFSC,
|
|
128
|
+
onChange
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
var BaseInput = react.forwardRef(({
|
|
132
|
+
value,
|
|
133
|
+
onChange,
|
|
134
|
+
error,
|
|
135
|
+
onBlurValidate,
|
|
136
|
+
className,
|
|
137
|
+
containerClassName,
|
|
138
|
+
errorClassName,
|
|
139
|
+
...props
|
|
140
|
+
}, ref) => {
|
|
141
|
+
const wrapperStyle = {
|
|
142
|
+
display: "flex",
|
|
143
|
+
flexDirection: "column",
|
|
144
|
+
gap: "0.5rem",
|
|
145
|
+
fontFamily: "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif"
|
|
146
|
+
};
|
|
147
|
+
const inputStyle = {
|
|
148
|
+
padding: "0.5rem 0.75rem",
|
|
149
|
+
border: `1px solid ${error ? "#ef4444" : "#d1d5db"}`,
|
|
150
|
+
borderRadius: "0.375rem",
|
|
151
|
+
fontSize: "1rem",
|
|
152
|
+
outline: "none",
|
|
153
|
+
transition: "border-color 0.2s, box-shadow 0.2s",
|
|
154
|
+
boxSizing: "border-box"
|
|
155
|
+
};
|
|
156
|
+
const errorTextStyle = {
|
|
157
|
+
color: "#ef4444",
|
|
158
|
+
fontSize: "0.875rem"
|
|
159
|
+
};
|
|
160
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: containerClassName || "", style: wrapperStyle, children: [
|
|
161
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
162
|
+
"input",
|
|
163
|
+
{
|
|
164
|
+
ref,
|
|
165
|
+
type: "text",
|
|
166
|
+
className: className || "",
|
|
167
|
+
style: inputStyle,
|
|
168
|
+
value,
|
|
169
|
+
onChange,
|
|
170
|
+
onBlur: onBlurValidate,
|
|
171
|
+
...props
|
|
172
|
+
}
|
|
173
|
+
),
|
|
174
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("span", { className: errorClassName || "", style: errorTextStyle, children: error })
|
|
175
|
+
] });
|
|
176
|
+
});
|
|
177
|
+
BaseInput.displayName = "BaseInput";
|
|
178
|
+
var BaseInput_default = BaseInput;
|
|
179
|
+
var PANInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
180
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
181
|
+
BaseInput_default,
|
|
182
|
+
{
|
|
183
|
+
ref,
|
|
184
|
+
maxLength: 10,
|
|
185
|
+
placeholder: "ABCDE1234F",
|
|
186
|
+
onBlurValidate: validate,
|
|
187
|
+
...props
|
|
188
|
+
}
|
|
189
|
+
);
|
|
190
|
+
});
|
|
191
|
+
PANInput.displayName = "PANInput";
|
|
192
|
+
var AadhaarInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
193
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
194
|
+
BaseInput_default,
|
|
195
|
+
{
|
|
196
|
+
ref,
|
|
197
|
+
maxLength: 14,
|
|
198
|
+
placeholder: "1234 5678 9012",
|
|
199
|
+
onBlurValidate: validate,
|
|
200
|
+
...props
|
|
201
|
+
}
|
|
202
|
+
);
|
|
203
|
+
});
|
|
204
|
+
AadhaarInput.displayName = "AadhaarInput";
|
|
205
|
+
var EmailInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
206
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
207
|
+
BaseInput_default,
|
|
208
|
+
{
|
|
209
|
+
ref,
|
|
210
|
+
type: "email",
|
|
211
|
+
placeholder: "example@domain.com",
|
|
212
|
+
onBlurValidate: validate,
|
|
213
|
+
...props
|
|
214
|
+
}
|
|
215
|
+
);
|
|
216
|
+
});
|
|
217
|
+
EmailInput.displayName = "EmailInput";
|
|
218
|
+
var GSTInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
219
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
220
|
+
BaseInput_default,
|
|
221
|
+
{
|
|
222
|
+
ref,
|
|
223
|
+
maxLength: 15,
|
|
224
|
+
placeholder: "22AAAAA0000A1Z5",
|
|
225
|
+
onBlurValidate: validate,
|
|
226
|
+
...props
|
|
227
|
+
}
|
|
228
|
+
);
|
|
229
|
+
});
|
|
230
|
+
GSTInput.displayName = "GSTInput";
|
|
231
|
+
var IFSCInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
232
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
233
|
+
BaseInput_default,
|
|
234
|
+
{
|
|
235
|
+
ref,
|
|
236
|
+
maxLength: 11,
|
|
237
|
+
placeholder: "SBIN0001234",
|
|
238
|
+
onBlurValidate: validate,
|
|
239
|
+
...props
|
|
240
|
+
}
|
|
241
|
+
);
|
|
242
|
+
});
|
|
243
|
+
IFSCInput.displayName = "IFSCInput";
|
|
244
|
+
var PasswordInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
245
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
246
|
+
BaseInput_default,
|
|
247
|
+
{
|
|
248
|
+
ref,
|
|
249
|
+
type: "password",
|
|
250
|
+
placeholder: "Enter your password",
|
|
251
|
+
onBlurValidate: validate,
|
|
252
|
+
...props
|
|
253
|
+
}
|
|
254
|
+
);
|
|
255
|
+
});
|
|
256
|
+
PasswordInput.displayName = "PasswordInput";
|
|
257
|
+
var PhoneInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
258
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
259
|
+
BaseInput_default,
|
|
260
|
+
{
|
|
261
|
+
ref,
|
|
262
|
+
type: "tel",
|
|
263
|
+
placeholder: "+91 9876543210",
|
|
264
|
+
onBlurValidate: validate,
|
|
265
|
+
...props
|
|
266
|
+
}
|
|
267
|
+
);
|
|
268
|
+
});
|
|
269
|
+
PhoneInput.displayName = "PhoneInput";
|
|
270
|
+
var PincodeInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
271
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
272
|
+
BaseInput_default,
|
|
273
|
+
{
|
|
274
|
+
ref,
|
|
275
|
+
maxLength: 6,
|
|
276
|
+
placeholder: "110001",
|
|
277
|
+
type: "text",
|
|
278
|
+
inputMode: "numeric",
|
|
279
|
+
onBlurValidate: validate,
|
|
280
|
+
...props
|
|
281
|
+
}
|
|
282
|
+
);
|
|
283
|
+
});
|
|
284
|
+
PincodeInput.displayName = "PincodeInput";
|
|
285
|
+
var StudentEmailInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
286
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
287
|
+
BaseInput_default,
|
|
288
|
+
{
|
|
289
|
+
ref,
|
|
290
|
+
type: "email",
|
|
291
|
+
placeholder: "student@university.edu",
|
|
292
|
+
onBlurValidate: validate,
|
|
293
|
+
...props
|
|
294
|
+
}
|
|
295
|
+
);
|
|
296
|
+
});
|
|
297
|
+
StudentEmailInput.displayName = "StudentEmailInput";
|
|
298
|
+
var URLInput = react.forwardRef(({ validate, ...props }, ref) => {
|
|
299
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
300
|
+
BaseInput_default,
|
|
301
|
+
{
|
|
302
|
+
ref,
|
|
303
|
+
type: "url",
|
|
304
|
+
placeholder: "https://example.com",
|
|
305
|
+
onBlurValidate: validate,
|
|
306
|
+
...props
|
|
307
|
+
}
|
|
308
|
+
);
|
|
309
|
+
});
|
|
310
|
+
URLInput.displayName = "URLInput";
|
|
311
|
+
|
|
312
|
+
exports.AadhaarInput = AadhaarInput;
|
|
313
|
+
exports.BaseInput = BaseInput_default;
|
|
314
|
+
exports.EmailInput = EmailInput;
|
|
315
|
+
exports.GSTInput = GSTInput;
|
|
316
|
+
exports.IFSCInput = IFSCInput;
|
|
317
|
+
exports.PANInput = PANInput;
|
|
318
|
+
exports.PasswordInput = PasswordInput;
|
|
319
|
+
exports.PhoneInput = PhoneInput;
|
|
320
|
+
exports.PincodeInput = PincodeInput;
|
|
321
|
+
exports.StudentEmailInput = StudentEmailInput;
|
|
322
|
+
exports.URLInput = URLInput;
|
|
323
|
+
exports.useAadhaarValidation = useAadhaarValidation;
|
|
324
|
+
exports.useEmailValidation = useEmailValidation;
|
|
325
|
+
exports.useGSTValidation = useGSTValidation;
|
|
326
|
+
exports.useIFSCValidation = useIFSCValidation;
|
|
327
|
+
exports.usePANValidation = usePANValidation;
|
|
328
|
+
exports.usePhoneValidation = usePhoneValidation;
|
|
329
|
+
exports.usePincodeValidation = usePincodeValidation;
|
|
330
|
+
exports.useStudentEmailValidation = useStudentEmailValidation;
|
|
331
|
+
exports.useURLValidation = useURLValidation;
|
|
332
|
+
exports.useVerifio = useVerifio;
|
|
333
|
+
//# sourceMappingURL=index.js.map
|
|
334
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useVerifio.ts","../src/hooks/index.ts","../src/components/BaseInput.tsx","../src/components/PANInput.tsx","../src/components/AadhaarInput.tsx","../src/components/EmailInput.tsx","../src/components/GSTInput.tsx","../src/components/IFSCInput.tsx","../src/components/PasswordInput.tsx","../src/components/PhoneInput.tsx","../src/components/PincodeInput.tsx","../src/components/StudentEmailInput.tsx","../src/components/URLInput.tsx"],"names":["useState","useCallback","validatePAN","validateGST","validateAadhaar","validateEmail","validateStudentEmail","validatePhone","validatePincode","validateURL","validateIFSC","forwardRef","jsx"],"mappings":"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","file":"index.js","sourcesContent":["import { useState, useCallback, useEffect } from 'react';\r\nimport { ValidationResult } from 'verifio';\r\n\r\nexport interface UseVerifioProps {\r\n initialValue?: string;\r\n validator: (value: string) => ValidationResult;\r\n onChange?: (value: string, isValid: boolean) => void;\r\n format?: (value: string) => string;\r\n}\r\n\r\nexport interface UseVerifioReturn {\r\n value: string;\r\n setValue: (value: string) => void;\r\n valid: boolean;\r\n error: string | null;\r\n validate: () => boolean;\r\n reset: () => void;\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n}\r\n\r\nexport function useVerifio({ \r\n initialValue = '', \r\n validator, \r\n onChange,\r\n format \r\n}: UseVerifioProps): UseVerifioReturn {\r\n const [value, setInternalValue] = useState(initialValue);\r\n const [error, setError] = useState<string | null>(null);\r\n const [valid, setValid] = useState<boolean>(true); // start true unless validated\r\n\r\n const validate = useCallback((currentValue: string = value) => {\r\n if (!currentValue) {\r\n setValid(true);\r\n setError(null);\r\n return true;\r\n }\r\n const result = validator(currentValue);\r\n setValid(result.valid);\r\n setError(result.valid ? null : result.errors[0] || 'Invalid input');\r\n return result.valid;\r\n }, [value, validator]);\r\n\r\n const setValue = useCallback((newValue: string) => {\r\n const formattedValue = format ? format(newValue) : newValue;\r\n setInternalValue(formattedValue);\r\n }, [format]);\r\n\r\n const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n const newValue = e.target.value;\r\n const formattedValue = format ? format(newValue) : newValue;\r\n setInternalValue(formattedValue);\r\n \r\n // Auto-validate on change if there's already an error, or we could wait for blur\r\n if (error) {\r\n const result = validator(formattedValue);\r\n setValid(result.valid);\r\n setError(result.valid ? null : result.errors[0] || 'Invalid input');\r\n onChange?.(formattedValue, result.valid);\r\n } else {\r\n onChange?.(formattedValue, true); // Assuming optimistic valid until blur/submit\r\n }\r\n }, [error, validator, onChange, format]);\r\n\r\n const reset = useCallback(() => {\r\n setInternalValue('');\r\n setError(null);\r\n setValid(true);\r\n }, []);\r\n\r\n return {\r\n value,\r\n setValue,\r\n valid,\r\n error,\r\n validate: () => validate(value),\r\n reset,\r\n onChange: handleChange\r\n };\r\n}\r\n","import { useVerifio } from './useVerifio';\nimport {\n validatePAN,\n validateGST,\n validateAadhaar,\n validateEmail,\n validateStudentEmail,\n validatePhone,\n validatePincode,\n validateURL,\n validateIFSC,\n} from 'verifio';\n\r\nexport { useVerifio };\n\nexport function usePANValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\r\n initialValue,\r\n validator: validatePAN,\r\n onChange,\r\n format: (val) => val.toUpperCase()\r\n });\r\n}\r\n\r\nexport function useGSTValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\r\n return useVerifio({\r\n initialValue,\r\n validator: validateGST,\r\n onChange,\r\n format: (val) => val.toUpperCase()\r\n });\r\n}\r\n\r\nexport function useAadhaarValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\r\n return useVerifio({\r\n initialValue,\r\n validator: validateAadhaar,\r\n onChange,\r\n // Add spaces every 4 digits for aadhaar display if desired, \r\n // but better to handle strictly on input\r\n format: (val) => {\r\n const digits = val.replace(/\\D/g, '');\r\n return digits.replace(/(.{4})/g, '$1 ').trim().substring(0, 14);\r\n }\r\n });\r\n}\r\n\r\nexport function useEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateEmail,\n onChange\n });\n}\n\nexport function useStudentEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateStudentEmail,\n onChange\n });\n}\n\nexport function usePhoneValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validatePhone,\n onChange\n });\n}\n\nexport function usePincodeValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validatePincode,\n onChange\n });\n}\n\nexport function useURLValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateURL,\n onChange\n });\n}\n\nexport function useIFSCValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateIFSC,\n onChange\n });\n}\n","import React, { InputHTMLAttributes, forwardRef } from 'react';\n\nexport interface BaseInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {\n value: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n error?: string | null;\r\n onBlurValidate?: () => void;\r\n containerClassName?: string;\r\n errorClassName?: string;\r\n}\r\n\r\nconst BaseInput = forwardRef<HTMLInputElement, BaseInputProps>(({\r\n value,\r\n onChange,\r\n error,\r\n onBlurValidate,\r\n className,\r\n containerClassName,\r\n errorClassName,\n ...props\n}, ref) => {\n const wrapperStyle: React.CSSProperties = {\n display: 'flex',\n flexDirection: 'column',\n gap: '0.5rem',\n fontFamily: \"system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif\",\n };\n\n const inputStyle: React.CSSProperties = {\n padding: '0.5rem 0.75rem',\n border: `1px solid ${error ? '#ef4444' : '#d1d5db'}`,\n borderRadius: '0.375rem',\n fontSize: '1rem',\n outline: 'none',\n transition: 'border-color 0.2s, box-shadow 0.2s',\n boxSizing: 'border-box',\n };\n\n const errorTextStyle: React.CSSProperties = {\n color: '#ef4444',\n fontSize: '0.875rem',\n };\n\n return (\n <div className={containerClassName || ''} style={wrapperStyle}>\n <input\n ref={ref}\n type=\"text\"\n className={className || ''}\n style={inputStyle}\n value={value}\n onChange={onChange}\n onBlur={onBlurValidate}\n {...props}\n />\n {error && <span className={errorClassName || ''} style={errorTextStyle}>{error}</span>}\n </div>\n );\n});\n\r\nBaseInput.displayName = 'BaseInput';\r\nexport default BaseInput;\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PANInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PANInput = forwardRef<HTMLInputElement, PANInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={10}\r\n placeholder=\"ABCDE1234F\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPANInput.displayName = 'PANInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface AadhaarInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const AadhaarInput = forwardRef<HTMLInputElement, AadhaarInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={14} // 12 digits + 2 spaces\r\n placeholder=\"1234 5678 9012\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nAadhaarInput.displayName = 'AadhaarInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface EmailInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const EmailInput = forwardRef<HTMLInputElement, EmailInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"email\"\r\n placeholder=\"example@domain.com\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nEmailInput.displayName = 'EmailInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface GSTInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const GSTInput = forwardRef<HTMLInputElement, GSTInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={15}\r\n placeholder=\"22AAAAA0000A1Z5\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nGSTInput.displayName = 'GSTInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface IFSCInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const IFSCInput = forwardRef<HTMLInputElement, IFSCInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={11}\r\n placeholder=\"SBIN0001234\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nIFSCInput.displayName = 'IFSCInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PasswordInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"password\"\r\n placeholder=\"Enter your password\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPasswordInput.displayName = 'PasswordInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PhoneInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PhoneInput = forwardRef<HTMLInputElement, PhoneInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"tel\"\r\n placeholder=\"+91 9876543210\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPhoneInput.displayName = 'PhoneInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PincodeInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PincodeInput = forwardRef<HTMLInputElement, PincodeInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={6}\r\n placeholder=\"110001\"\r\n type=\"text\"\r\n inputMode=\"numeric\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPincodeInput.displayName = 'PincodeInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface StudentEmailInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const StudentEmailInput = forwardRef<HTMLInputElement, StudentEmailInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"email\"\r\n placeholder=\"student@university.edu\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nStudentEmailInput.displayName = 'StudentEmailInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface URLInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const URLInput = forwardRef<HTMLInputElement, URLInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"url\"\r\n placeholder=\"https://example.com\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nURLInput.displayName = 'URLInput';\r\n"]}
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,312 @@
|
|
|
1
|
+
import { forwardRef, useState, useCallback } from 'react';
|
|
2
|
+
import { validatePAN, validateGST, validateAadhaar, validateEmail, validateStudentEmail, validatePhone, validatePincode, validateURL, validateIFSC } from 'verifio';
|
|
3
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
// src/hooks/useVerifio.ts
|
|
6
|
+
function useVerifio({
|
|
7
|
+
initialValue = "",
|
|
8
|
+
validator,
|
|
9
|
+
onChange,
|
|
10
|
+
format
|
|
11
|
+
}) {
|
|
12
|
+
const [value, setInternalValue] = useState(initialValue);
|
|
13
|
+
const [error, setError] = useState(null);
|
|
14
|
+
const [valid, setValid] = useState(true);
|
|
15
|
+
const validate = useCallback((currentValue = value) => {
|
|
16
|
+
if (!currentValue) {
|
|
17
|
+
setValid(true);
|
|
18
|
+
setError(null);
|
|
19
|
+
return true;
|
|
20
|
+
}
|
|
21
|
+
const result = validator(currentValue);
|
|
22
|
+
setValid(result.valid);
|
|
23
|
+
setError(result.valid ? null : result.errors[0] || "Invalid input");
|
|
24
|
+
return result.valid;
|
|
25
|
+
}, [value, validator]);
|
|
26
|
+
const setValue = useCallback((newValue) => {
|
|
27
|
+
const formattedValue = format ? format(newValue) : newValue;
|
|
28
|
+
setInternalValue(formattedValue);
|
|
29
|
+
}, [format]);
|
|
30
|
+
const handleChange = useCallback((e) => {
|
|
31
|
+
const newValue = e.target.value;
|
|
32
|
+
const formattedValue = format ? format(newValue) : newValue;
|
|
33
|
+
setInternalValue(formattedValue);
|
|
34
|
+
if (error) {
|
|
35
|
+
const result = validator(formattedValue);
|
|
36
|
+
setValid(result.valid);
|
|
37
|
+
setError(result.valid ? null : result.errors[0] || "Invalid input");
|
|
38
|
+
onChange?.(formattedValue, result.valid);
|
|
39
|
+
} else {
|
|
40
|
+
onChange?.(formattedValue, true);
|
|
41
|
+
}
|
|
42
|
+
}, [error, validator, onChange, format]);
|
|
43
|
+
const reset = useCallback(() => {
|
|
44
|
+
setInternalValue("");
|
|
45
|
+
setError(null);
|
|
46
|
+
setValid(true);
|
|
47
|
+
}, []);
|
|
48
|
+
return {
|
|
49
|
+
value,
|
|
50
|
+
setValue,
|
|
51
|
+
valid,
|
|
52
|
+
error,
|
|
53
|
+
validate: () => validate(value),
|
|
54
|
+
reset,
|
|
55
|
+
onChange: handleChange
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
function usePANValidation(initialValue, onChange) {
|
|
59
|
+
return useVerifio({
|
|
60
|
+
initialValue,
|
|
61
|
+
validator: validatePAN,
|
|
62
|
+
onChange,
|
|
63
|
+
format: (val) => val.toUpperCase()
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
function useGSTValidation(initialValue, onChange) {
|
|
67
|
+
return useVerifio({
|
|
68
|
+
initialValue,
|
|
69
|
+
validator: validateGST,
|
|
70
|
+
onChange,
|
|
71
|
+
format: (val) => val.toUpperCase()
|
|
72
|
+
});
|
|
73
|
+
}
|
|
74
|
+
function useAadhaarValidation(initialValue, onChange) {
|
|
75
|
+
return useVerifio({
|
|
76
|
+
initialValue,
|
|
77
|
+
validator: validateAadhaar,
|
|
78
|
+
onChange,
|
|
79
|
+
// Add spaces every 4 digits for aadhaar display if desired,
|
|
80
|
+
// but better to handle strictly on input
|
|
81
|
+
format: (val) => {
|
|
82
|
+
const digits = val.replace(/\D/g, "");
|
|
83
|
+
return digits.replace(/(.{4})/g, "$1 ").trim().substring(0, 14);
|
|
84
|
+
}
|
|
85
|
+
});
|
|
86
|
+
}
|
|
87
|
+
function useEmailValidation(initialValue, onChange) {
|
|
88
|
+
return useVerifio({
|
|
89
|
+
initialValue,
|
|
90
|
+
validator: validateEmail,
|
|
91
|
+
onChange
|
|
92
|
+
});
|
|
93
|
+
}
|
|
94
|
+
function useStudentEmailValidation(initialValue, onChange) {
|
|
95
|
+
return useVerifio({
|
|
96
|
+
initialValue,
|
|
97
|
+
validator: validateStudentEmail,
|
|
98
|
+
onChange
|
|
99
|
+
});
|
|
100
|
+
}
|
|
101
|
+
function usePhoneValidation(initialValue, onChange) {
|
|
102
|
+
return useVerifio({
|
|
103
|
+
initialValue,
|
|
104
|
+
validator: validatePhone,
|
|
105
|
+
onChange
|
|
106
|
+
});
|
|
107
|
+
}
|
|
108
|
+
function usePincodeValidation(initialValue, onChange) {
|
|
109
|
+
return useVerifio({
|
|
110
|
+
initialValue,
|
|
111
|
+
validator: validatePincode,
|
|
112
|
+
onChange
|
|
113
|
+
});
|
|
114
|
+
}
|
|
115
|
+
function useURLValidation(initialValue, onChange) {
|
|
116
|
+
return useVerifio({
|
|
117
|
+
initialValue,
|
|
118
|
+
validator: validateURL,
|
|
119
|
+
onChange
|
|
120
|
+
});
|
|
121
|
+
}
|
|
122
|
+
function useIFSCValidation(initialValue, onChange) {
|
|
123
|
+
return useVerifio({
|
|
124
|
+
initialValue,
|
|
125
|
+
validator: validateIFSC,
|
|
126
|
+
onChange
|
|
127
|
+
});
|
|
128
|
+
}
|
|
129
|
+
var BaseInput = forwardRef(({
|
|
130
|
+
value,
|
|
131
|
+
onChange,
|
|
132
|
+
error,
|
|
133
|
+
onBlurValidate,
|
|
134
|
+
className,
|
|
135
|
+
containerClassName,
|
|
136
|
+
errorClassName,
|
|
137
|
+
...props
|
|
138
|
+
}, ref) => {
|
|
139
|
+
const wrapperStyle = {
|
|
140
|
+
display: "flex",
|
|
141
|
+
flexDirection: "column",
|
|
142
|
+
gap: "0.5rem",
|
|
143
|
+
fontFamily: "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif"
|
|
144
|
+
};
|
|
145
|
+
const inputStyle = {
|
|
146
|
+
padding: "0.5rem 0.75rem",
|
|
147
|
+
border: `1px solid ${error ? "#ef4444" : "#d1d5db"}`,
|
|
148
|
+
borderRadius: "0.375rem",
|
|
149
|
+
fontSize: "1rem",
|
|
150
|
+
outline: "none",
|
|
151
|
+
transition: "border-color 0.2s, box-shadow 0.2s",
|
|
152
|
+
boxSizing: "border-box"
|
|
153
|
+
};
|
|
154
|
+
const errorTextStyle = {
|
|
155
|
+
color: "#ef4444",
|
|
156
|
+
fontSize: "0.875rem"
|
|
157
|
+
};
|
|
158
|
+
return /* @__PURE__ */ jsxs("div", { className: containerClassName || "", style: wrapperStyle, children: [
|
|
159
|
+
/* @__PURE__ */ jsx(
|
|
160
|
+
"input",
|
|
161
|
+
{
|
|
162
|
+
ref,
|
|
163
|
+
type: "text",
|
|
164
|
+
className: className || "",
|
|
165
|
+
style: inputStyle,
|
|
166
|
+
value,
|
|
167
|
+
onChange,
|
|
168
|
+
onBlur: onBlurValidate,
|
|
169
|
+
...props
|
|
170
|
+
}
|
|
171
|
+
),
|
|
172
|
+
error && /* @__PURE__ */ jsx("span", { className: errorClassName || "", style: errorTextStyle, children: error })
|
|
173
|
+
] });
|
|
174
|
+
});
|
|
175
|
+
BaseInput.displayName = "BaseInput";
|
|
176
|
+
var BaseInput_default = BaseInput;
|
|
177
|
+
var PANInput = forwardRef(({ validate, ...props }, ref) => {
|
|
178
|
+
return /* @__PURE__ */ jsx(
|
|
179
|
+
BaseInput_default,
|
|
180
|
+
{
|
|
181
|
+
ref,
|
|
182
|
+
maxLength: 10,
|
|
183
|
+
placeholder: "ABCDE1234F",
|
|
184
|
+
onBlurValidate: validate,
|
|
185
|
+
...props
|
|
186
|
+
}
|
|
187
|
+
);
|
|
188
|
+
});
|
|
189
|
+
PANInput.displayName = "PANInput";
|
|
190
|
+
var AadhaarInput = forwardRef(({ validate, ...props }, ref) => {
|
|
191
|
+
return /* @__PURE__ */ jsx(
|
|
192
|
+
BaseInput_default,
|
|
193
|
+
{
|
|
194
|
+
ref,
|
|
195
|
+
maxLength: 14,
|
|
196
|
+
placeholder: "1234 5678 9012",
|
|
197
|
+
onBlurValidate: validate,
|
|
198
|
+
...props
|
|
199
|
+
}
|
|
200
|
+
);
|
|
201
|
+
});
|
|
202
|
+
AadhaarInput.displayName = "AadhaarInput";
|
|
203
|
+
var EmailInput = forwardRef(({ validate, ...props }, ref) => {
|
|
204
|
+
return /* @__PURE__ */ jsx(
|
|
205
|
+
BaseInput_default,
|
|
206
|
+
{
|
|
207
|
+
ref,
|
|
208
|
+
type: "email",
|
|
209
|
+
placeholder: "example@domain.com",
|
|
210
|
+
onBlurValidate: validate,
|
|
211
|
+
...props
|
|
212
|
+
}
|
|
213
|
+
);
|
|
214
|
+
});
|
|
215
|
+
EmailInput.displayName = "EmailInput";
|
|
216
|
+
var GSTInput = forwardRef(({ validate, ...props }, ref) => {
|
|
217
|
+
return /* @__PURE__ */ jsx(
|
|
218
|
+
BaseInput_default,
|
|
219
|
+
{
|
|
220
|
+
ref,
|
|
221
|
+
maxLength: 15,
|
|
222
|
+
placeholder: "22AAAAA0000A1Z5",
|
|
223
|
+
onBlurValidate: validate,
|
|
224
|
+
...props
|
|
225
|
+
}
|
|
226
|
+
);
|
|
227
|
+
});
|
|
228
|
+
GSTInput.displayName = "GSTInput";
|
|
229
|
+
var IFSCInput = forwardRef(({ validate, ...props }, ref) => {
|
|
230
|
+
return /* @__PURE__ */ jsx(
|
|
231
|
+
BaseInput_default,
|
|
232
|
+
{
|
|
233
|
+
ref,
|
|
234
|
+
maxLength: 11,
|
|
235
|
+
placeholder: "SBIN0001234",
|
|
236
|
+
onBlurValidate: validate,
|
|
237
|
+
...props
|
|
238
|
+
}
|
|
239
|
+
);
|
|
240
|
+
});
|
|
241
|
+
IFSCInput.displayName = "IFSCInput";
|
|
242
|
+
var PasswordInput = forwardRef(({ validate, ...props }, ref) => {
|
|
243
|
+
return /* @__PURE__ */ jsx(
|
|
244
|
+
BaseInput_default,
|
|
245
|
+
{
|
|
246
|
+
ref,
|
|
247
|
+
type: "password",
|
|
248
|
+
placeholder: "Enter your password",
|
|
249
|
+
onBlurValidate: validate,
|
|
250
|
+
...props
|
|
251
|
+
}
|
|
252
|
+
);
|
|
253
|
+
});
|
|
254
|
+
PasswordInput.displayName = "PasswordInput";
|
|
255
|
+
var PhoneInput = forwardRef(({ validate, ...props }, ref) => {
|
|
256
|
+
return /* @__PURE__ */ jsx(
|
|
257
|
+
BaseInput_default,
|
|
258
|
+
{
|
|
259
|
+
ref,
|
|
260
|
+
type: "tel",
|
|
261
|
+
placeholder: "+91 9876543210",
|
|
262
|
+
onBlurValidate: validate,
|
|
263
|
+
...props
|
|
264
|
+
}
|
|
265
|
+
);
|
|
266
|
+
});
|
|
267
|
+
PhoneInput.displayName = "PhoneInput";
|
|
268
|
+
var PincodeInput = forwardRef(({ validate, ...props }, ref) => {
|
|
269
|
+
return /* @__PURE__ */ jsx(
|
|
270
|
+
BaseInput_default,
|
|
271
|
+
{
|
|
272
|
+
ref,
|
|
273
|
+
maxLength: 6,
|
|
274
|
+
placeholder: "110001",
|
|
275
|
+
type: "text",
|
|
276
|
+
inputMode: "numeric",
|
|
277
|
+
onBlurValidate: validate,
|
|
278
|
+
...props
|
|
279
|
+
}
|
|
280
|
+
);
|
|
281
|
+
});
|
|
282
|
+
PincodeInput.displayName = "PincodeInput";
|
|
283
|
+
var StudentEmailInput = forwardRef(({ validate, ...props }, ref) => {
|
|
284
|
+
return /* @__PURE__ */ jsx(
|
|
285
|
+
BaseInput_default,
|
|
286
|
+
{
|
|
287
|
+
ref,
|
|
288
|
+
type: "email",
|
|
289
|
+
placeholder: "student@university.edu",
|
|
290
|
+
onBlurValidate: validate,
|
|
291
|
+
...props
|
|
292
|
+
}
|
|
293
|
+
);
|
|
294
|
+
});
|
|
295
|
+
StudentEmailInput.displayName = "StudentEmailInput";
|
|
296
|
+
var URLInput = forwardRef(({ validate, ...props }, ref) => {
|
|
297
|
+
return /* @__PURE__ */ jsx(
|
|
298
|
+
BaseInput_default,
|
|
299
|
+
{
|
|
300
|
+
ref,
|
|
301
|
+
type: "url",
|
|
302
|
+
placeholder: "https://example.com",
|
|
303
|
+
onBlurValidate: validate,
|
|
304
|
+
...props
|
|
305
|
+
}
|
|
306
|
+
);
|
|
307
|
+
});
|
|
308
|
+
URLInput.displayName = "URLInput";
|
|
309
|
+
|
|
310
|
+
export { AadhaarInput, BaseInput_default as BaseInput, EmailInput, GSTInput, IFSCInput, PANInput, PasswordInput, PhoneInput, PincodeInput, StudentEmailInput, URLInput, useAadhaarValidation, useEmailValidation, useGSTValidation, useIFSCValidation, usePANValidation, usePhoneValidation, usePincodeValidation, useStudentEmailValidation, useURLValidation, useVerifio };
|
|
311
|
+
//# sourceMappingURL=index.mjs.map
|
|
312
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useVerifio.ts","../src/hooks/index.ts","../src/components/BaseInput.tsx","../src/components/PANInput.tsx","../src/components/AadhaarInput.tsx","../src/components/EmailInput.tsx","../src/components/GSTInput.tsx","../src/components/IFSCInput.tsx","../src/components/PasswordInput.tsx","../src/components/PhoneInput.tsx","../src/components/PincodeInput.tsx","../src/components/StudentEmailInput.tsx","../src/components/URLInput.tsx"],"names":["forwardRef","jsx"],"mappings":"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","file":"index.mjs","sourcesContent":["import { useState, useCallback, useEffect } from 'react';\r\nimport { ValidationResult } from 'verifio';\r\n\r\nexport interface UseVerifioProps {\r\n initialValue?: string;\r\n validator: (value: string) => ValidationResult;\r\n onChange?: (value: string, isValid: boolean) => void;\r\n format?: (value: string) => string;\r\n}\r\n\r\nexport interface UseVerifioReturn {\r\n value: string;\r\n setValue: (value: string) => void;\r\n valid: boolean;\r\n error: string | null;\r\n validate: () => boolean;\r\n reset: () => void;\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n}\r\n\r\nexport function useVerifio({ \r\n initialValue = '', \r\n validator, \r\n onChange,\r\n format \r\n}: UseVerifioProps): UseVerifioReturn {\r\n const [value, setInternalValue] = useState(initialValue);\r\n const [error, setError] = useState<string | null>(null);\r\n const [valid, setValid] = useState<boolean>(true); // start true unless validated\r\n\r\n const validate = useCallback((currentValue: string = value) => {\r\n if (!currentValue) {\r\n setValid(true);\r\n setError(null);\r\n return true;\r\n }\r\n const result = validator(currentValue);\r\n setValid(result.valid);\r\n setError(result.valid ? null : result.errors[0] || 'Invalid input');\r\n return result.valid;\r\n }, [value, validator]);\r\n\r\n const setValue = useCallback((newValue: string) => {\r\n const formattedValue = format ? format(newValue) : newValue;\r\n setInternalValue(formattedValue);\r\n }, [format]);\r\n\r\n const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n const newValue = e.target.value;\r\n const formattedValue = format ? format(newValue) : newValue;\r\n setInternalValue(formattedValue);\r\n \r\n // Auto-validate on change if there's already an error, or we could wait for blur\r\n if (error) {\r\n const result = validator(formattedValue);\r\n setValid(result.valid);\r\n setError(result.valid ? null : result.errors[0] || 'Invalid input');\r\n onChange?.(formattedValue, result.valid);\r\n } else {\r\n onChange?.(formattedValue, true); // Assuming optimistic valid until blur/submit\r\n }\r\n }, [error, validator, onChange, format]);\r\n\r\n const reset = useCallback(() => {\r\n setInternalValue('');\r\n setError(null);\r\n setValid(true);\r\n }, []);\r\n\r\n return {\r\n value,\r\n setValue,\r\n valid,\r\n error,\r\n validate: () => validate(value),\r\n reset,\r\n onChange: handleChange\r\n };\r\n}\r\n","import { useVerifio } from './useVerifio';\nimport {\n validatePAN,\n validateGST,\n validateAadhaar,\n validateEmail,\n validateStudentEmail,\n validatePhone,\n validatePincode,\n validateURL,\n validateIFSC,\n} from 'verifio';\n\r\nexport { useVerifio };\n\nexport function usePANValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\r\n initialValue,\r\n validator: validatePAN,\r\n onChange,\r\n format: (val) => val.toUpperCase()\r\n });\r\n}\r\n\r\nexport function useGSTValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\r\n return useVerifio({\r\n initialValue,\r\n validator: validateGST,\r\n onChange,\r\n format: (val) => val.toUpperCase()\r\n });\r\n}\r\n\r\nexport function useAadhaarValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\r\n return useVerifio({\r\n initialValue,\r\n validator: validateAadhaar,\r\n onChange,\r\n // Add spaces every 4 digits for aadhaar display if desired, \r\n // but better to handle strictly on input\r\n format: (val) => {\r\n const digits = val.replace(/\\D/g, '');\r\n return digits.replace(/(.{4})/g, '$1 ').trim().substring(0, 14);\r\n }\r\n });\r\n}\r\n\r\nexport function useEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateEmail,\n onChange\n });\n}\n\nexport function useStudentEmailValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateStudentEmail,\n onChange\n });\n}\n\nexport function usePhoneValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validatePhone,\n onChange\n });\n}\n\nexport function usePincodeValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validatePincode,\n onChange\n });\n}\n\nexport function useURLValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateURL,\n onChange\n });\n}\n\nexport function useIFSCValidation(initialValue?: string, onChange?: (val: string, valid: boolean) => void) {\n return useVerifio({\n initialValue,\n validator: validateIFSC,\n onChange\n });\n}\n","import React, { InputHTMLAttributes, forwardRef } from 'react';\n\nexport interface BaseInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {\n value: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n error?: string | null;\r\n onBlurValidate?: () => void;\r\n containerClassName?: string;\r\n errorClassName?: string;\r\n}\r\n\r\nconst BaseInput = forwardRef<HTMLInputElement, BaseInputProps>(({\r\n value,\r\n onChange,\r\n error,\r\n onBlurValidate,\r\n className,\r\n containerClassName,\r\n errorClassName,\n ...props\n}, ref) => {\n const wrapperStyle: React.CSSProperties = {\n display: 'flex',\n flexDirection: 'column',\n gap: '0.5rem',\n fontFamily: \"system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif\",\n };\n\n const inputStyle: React.CSSProperties = {\n padding: '0.5rem 0.75rem',\n border: `1px solid ${error ? '#ef4444' : '#d1d5db'}`,\n borderRadius: '0.375rem',\n fontSize: '1rem',\n outline: 'none',\n transition: 'border-color 0.2s, box-shadow 0.2s',\n boxSizing: 'border-box',\n };\n\n const errorTextStyle: React.CSSProperties = {\n color: '#ef4444',\n fontSize: '0.875rem',\n };\n\n return (\n <div className={containerClassName || ''} style={wrapperStyle}>\n <input\n ref={ref}\n type=\"text\"\n className={className || ''}\n style={inputStyle}\n value={value}\n onChange={onChange}\n onBlur={onBlurValidate}\n {...props}\n />\n {error && <span className={errorClassName || ''} style={errorTextStyle}>{error}</span>}\n </div>\n );\n});\n\r\nBaseInput.displayName = 'BaseInput';\r\nexport default BaseInput;\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PANInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PANInput = forwardRef<HTMLInputElement, PANInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={10}\r\n placeholder=\"ABCDE1234F\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPANInput.displayName = 'PANInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface AadhaarInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const AadhaarInput = forwardRef<HTMLInputElement, AadhaarInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={14} // 12 digits + 2 spaces\r\n placeholder=\"1234 5678 9012\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nAadhaarInput.displayName = 'AadhaarInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface EmailInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const EmailInput = forwardRef<HTMLInputElement, EmailInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"email\"\r\n placeholder=\"example@domain.com\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nEmailInput.displayName = 'EmailInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface GSTInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const GSTInput = forwardRef<HTMLInputElement, GSTInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={15}\r\n placeholder=\"22AAAAA0000A1Z5\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nGSTInput.displayName = 'GSTInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface IFSCInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const IFSCInput = forwardRef<HTMLInputElement, IFSCInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={11}\r\n placeholder=\"SBIN0001234\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nIFSCInput.displayName = 'IFSCInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PasswordInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"password\"\r\n placeholder=\"Enter your password\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPasswordInput.displayName = 'PasswordInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PhoneInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PhoneInput = forwardRef<HTMLInputElement, PhoneInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"tel\"\r\n placeholder=\"+91 9876543210\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPhoneInput.displayName = 'PhoneInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface PincodeInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const PincodeInput = forwardRef<HTMLInputElement, PincodeInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n maxLength={6}\r\n placeholder=\"110001\"\r\n type=\"text\"\r\n inputMode=\"numeric\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nPincodeInput.displayName = 'PincodeInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface StudentEmailInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const StudentEmailInput = forwardRef<HTMLInputElement, StudentEmailInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"email\"\r\n placeholder=\"student@university.edu\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nStudentEmailInput.displayName = 'StudentEmailInput';\r\n","import React, { forwardRef } from 'react';\r\nimport BaseInput, { BaseInputProps } from './BaseInput';\r\n\r\nexport interface URLInputProps extends Omit<BaseInputProps, 'onChange'> {\r\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\r\n validate?: () => void;\r\n}\r\n\r\nexport const URLInput = forwardRef<HTMLInputElement, URLInputProps>(({ validate, ...props }, ref) => {\r\n return (\r\n <BaseInput\r\n ref={ref}\r\n type=\"url\"\r\n placeholder=\"https://example.com\"\r\n onBlurValidate={validate}\r\n {...props}\r\n />\r\n );\r\n});\r\n\r\nURLInput.displayName = 'URLInput';\r\n"]}
|
package/package.json
ADDED
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@meowster404/verifio-react",
|
|
3
|
+
"version": "0.1.1",
|
|
4
|
+
"description": "React hooks and components for Verifio",
|
|
5
|
+
"main": "./dist/index.js",
|
|
6
|
+
"module": "./dist/index.mjs",
|
|
7
|
+
"types": "./dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.mjs",
|
|
11
|
+
"require": "./dist/index.js",
|
|
12
|
+
"types": "./dist/index.d.ts"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"sideEffects": false,
|
|
16
|
+
"publishConfig": {
|
|
17
|
+
"access": "public"
|
|
18
|
+
},
|
|
19
|
+
"files": [
|
|
20
|
+
"dist"
|
|
21
|
+
],
|
|
22
|
+
"scripts": {
|
|
23
|
+
"build": "tsup",
|
|
24
|
+
"dev": "tsup --watch",
|
|
25
|
+
"test": "vitest run",
|
|
26
|
+
"test:coverage": "vitest run --coverage",
|
|
27
|
+
"storybook": "storybook dev -p 6006",
|
|
28
|
+
"build-storybook": "storybook build"
|
|
29
|
+
},
|
|
30
|
+
"peerDependencies": {
|
|
31
|
+
"react": "^18.0.0 || ^19.0.0",
|
|
32
|
+
"react-dom": "^18.0.0 || ^19.0.0"
|
|
33
|
+
},
|
|
34
|
+
"dependencies": {
|
|
35
|
+
"@meowster404/verifio": "*",
|
|
36
|
+
"@verifio/react": "^0.1.1"
|
|
37
|
+
},
|
|
38
|
+
"devDependencies": {
|
|
39
|
+
"@storybook/addon-essentials": "^8.0.0",
|
|
40
|
+
"@storybook/addon-interactions": "^8.0.0",
|
|
41
|
+
"@storybook/addon-links": "^8.0.0",
|
|
42
|
+
"@storybook/blocks": "^8.0.0",
|
|
43
|
+
"@storybook/react": "^8.0.0",
|
|
44
|
+
"@storybook/react-vite": "^8.0.0",
|
|
45
|
+
"@testing-library/react": "^14.2.1",
|
|
46
|
+
"@types/react": "^18.2.64",
|
|
47
|
+
"@types/react-dom": "^18.2.21",
|
|
48
|
+
"@vitejs/plugin-react": "^4.2.1",
|
|
49
|
+
"jsdom": "^24.0.0",
|
|
50
|
+
"react": "^18.2.0",
|
|
51
|
+
"react-dom": "^18.2.0",
|
|
52
|
+
"storybook": "^8.0.0",
|
|
53
|
+
"tsup": "^8.0.2",
|
|
54
|
+
"typescript": "^5.4.2",
|
|
55
|
+
"vitest": "^1.4.0"
|
|
56
|
+
},
|
|
57
|
+
"license": "MIT"
|
|
58
|
+
}
|