dhre-ui-kit 0.0.259 → 0.0.261

package/lib/index.mjs

@@ -3995,7 +3995,8 @@ const OTPInput = React.forwardRef(
       }
       return () => clearInterval(timer);
     }, [timeLeft, isResendOtpEnable]);
-    const otpRefs = useRef(Array(length).fill(null));
+    const refs = useRef([]);
+    refs.current = Array(length).fill(0).map((_, index) => refs.current[index] || null);
     useEffect(() => {
       enableResendOtp();
     }, []);
@@ -4014,7 +4015,11 @@ const OTPInput = React.forwardRef(
       }
     };
     const disableResendButton = () => {
-      return disabled || resendOTPCount >= maxResendCount;
+      if (disabled === true && resendOTPCount >= maxResendCount) {
+        return true;
+      } else {
+        return false;
+      }
     };
     const enableResendOtp = () => {
       setTimeout(() => {
@@ -4040,39 +4045,42 @@ const OTPInput = React.forwardRef(
         const otp2 = otpRegex.exec(message)?.[1];
         setOTP(otp2 ?? "");
         if (otp2) {
-          otpRefs.current[otp2?.length - 1]?.focus();
+          refs.current[otp2?.length - 1]?.focus();
         }
       });
     };
-    const reset = () => {
-      setOTP("");
-      otpRefs.current[0]?.focus();
-    };
     React.useImperativeHandle(ref, () => ({
-      reset
+      reset() {
+        setOTP("");
+        refs.current[0]?.focus();
+      },
+      set(newOtp) {
+        setOTP(newOtp);
+        refs.current[newOtp?.length - 1]?.focus();
+      }
     }));
     const handleChange = (index, value) => {
       const regex = /^\d+$/;
       if (value.length === 1 && regex.test(value) && index >= 0 && index < length) {
         const newOTP = `${otp}${value}`;
         setOTP(newOTP);
-        otpRefs.current[index + 1]?.focus();
+        refs.current[index + 1]?.focus();
       } else if (value.length === 0 && index > 0) {
         const newOTP = otp.slice(0, -1);
         setOTP(newOTP);
-        otpRefs.current[index - 1]?.focus();
+        refs.current[index - 1]?.focus();
       } else if (value?.length === length) {
         setOTP(value);
-        otpRefs.current[length - 1]?.focus();
+        refs.current[length - 1]?.focus();
       } else {
         const newOTP = otp.slice(0, -1);
         setOTP(newOTP);
-        otpRefs.current[index]?.focus();
+        refs.current[index]?.focus();
       }
     };
     const handleKeyPress = (e, index) => {
       if (e.nativeEvent.key === "Backspace" && index > 0) {
-        otpRefs.current[index - 1]?.focus();
+        refs.current[index - 1]?.focus();
       }
     };
     useEffect(() => {
@@ -4108,7 +4116,7 @@ const OTPInput = React.forwardRef(
         value: otp[index] ? "\u25CF" : "",
         placeholder: "",
         keyboardType: "numeric",
-        ref: (el) => otpRefs.current[index] = el,
+        ref: (el) => refs.current[index] = el,
         returnKeyType: otp.length === length ? "done" : "next",
         importantForAutofill: "yes",
         textContentType: "oneTimeCode",