dhre-ui-kit 0.0.309 → 0.0.311
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/lib/index.d.ts +2 -0
- package/lib/index.js +9 -10
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +9 -10
- package/lib/index.mjs.map +1 -1
- package/package.json +1 -1
package/lib/index.mjs
CHANGED
|
@@ -4052,6 +4052,7 @@ const OTPInput = React.forwardRef(
|
|
|
4052
4052
|
resendOTP,
|
|
4053
4053
|
errorMessage,
|
|
4054
4054
|
testId = "",
|
|
4055
|
+
errorMessageMaxReachCountProps,
|
|
4055
4056
|
otpContainerStyle,
|
|
4056
4057
|
otpHeaderTextStyle,
|
|
4057
4058
|
textInputStyle,
|
|
@@ -4063,20 +4064,18 @@ const OTPInput = React.forwardRef(
|
|
|
4063
4064
|
disabled,
|
|
4064
4065
|
maxResendCount = 2,
|
|
4065
4066
|
timerToResend = 6e4,
|
|
4066
|
-
timerIcon
|
|
4067
|
+
timerIcon,
|
|
4068
|
+
isInValidOtp
|
|
4067
4069
|
}, ref) => {
|
|
4068
4070
|
const [otp, setOTP] = useState("");
|
|
4069
4071
|
const [isResendOtpEnable, setIsResendOtpEnable] = useState(false);
|
|
4070
4072
|
const [activeInput, setActiveInput] = useState(null);
|
|
4071
4073
|
const [resendOTPCount, setResendOTPCount] = useState(0);
|
|
4072
4074
|
const [errorMessageMaxReachCount, setErrorMessageMaxReachCount] = useState("");
|
|
4073
|
-
const filteredTheme = Object?.keys(theme)?.reduce(
|
|
4074
|
-
|
|
4075
|
-
|
|
4076
|
-
|
|
4077
|
-
},
|
|
4078
|
-
{}
|
|
4079
|
-
);
|
|
4075
|
+
const filteredTheme = Object?.keys(theme)?.reduce((acc, key) => {
|
|
4076
|
+
acc[key] = theme[key][mode];
|
|
4077
|
+
return acc;
|
|
4078
|
+
}, {});
|
|
4080
4079
|
const { theme: theme$1 } = mode ? { theme: filteredTheme } : useTheme();
|
|
4081
4080
|
const [timeLeft, setTimeLeft] = useState(60);
|
|
4082
4081
|
useEffect(() => {
|
|
@@ -4098,7 +4097,7 @@ const OTPInput = React.forwardRef(
|
|
|
4098
4097
|
const onClickResendOTP = () => {
|
|
4099
4098
|
if (resendOTPCount > maxResendCount - 1) {
|
|
4100
4099
|
setErrorMessageMaxReachCount(
|
|
4101
|
-
"You have exceeded the maximum number of attempts."
|
|
4100
|
+
errorMessageMaxReachCountProps ? errorMessageMaxReachCountProps : "You have exceeded the maximum number of attempts."
|
|
4102
4101
|
);
|
|
4103
4102
|
}
|
|
4104
4103
|
if (resendOTPCount < maxResendCount) {
|
|
@@ -4201,7 +4200,7 @@ const OTPInput = React.forwardRef(
|
|
|
4201
4200
|
style: {
|
|
4202
4201
|
...styles$5.textInputStyle,
|
|
4203
4202
|
color: theme$1.CONTENT_PRIMARY,
|
|
4204
|
-
borderColor: errorMessage ? theme$1.ERROR : otp.length === length ? theme$1.SUCCESS : activeInput === index ? theme$1.BORDER_INVERTED : theme$1.BORDER_PRIMARY,
|
|
4203
|
+
borderColor: errorMessage || isInValidOtp ? theme$1.ERROR : otp.length === length ? theme$1.SUCCESS : activeInput === index ? theme$1.BORDER_INVERTED : theme$1.BORDER_PRIMARY,
|
|
4205
4204
|
...textInputStyle
|
|
4206
4205
|
},
|
|
4207
4206
|
onFocus: () => setActiveInput(index),
|