page set code

2024-06-24 03:56:29 +03:30
parent 2e561762fa
commit 4fbef73d00
6 changed files with 106 additions and 12 deletions
@@ -0,0 +1,30 @@
+import { useState } from "react"
+
+function OTPForm({ handleOTP }) {
+
+    const [code, setCode] = useState('');
+
+    return (
+        <input
+            value={code}
+            onChange={e => {
+                const value = e.target.value
+
+                if (/^\d+$/.test(value) && value.length < 2) {
+                    setCode(value)
+                    handleOTP(e)
+                } else {
+                    setCode('')
+                    e.target.value = ''
+                }
+            }}
+            className={`w-12 h-12 border border-solid border-[#ADB5BD] rounded-[6px] text-center transition-all duration-500 ease-out
+            outline-none focus:!border-[1px] focus:!border-solid focus:!border-[#5559CE]
+            focus:!outline-[1px] focus:!outline-solid focus:!outline-[#5559CE] 
+            ${code && '!border-[1px] !border-solid !border-[#5559CE]'}
+            `}
+        />
+    )
+}
+
+export default OTPForm