search

tttstudios / react-native-otp-input

Tiny Javascript library which provides an elegant UI for user to input one time passcode.
MIT License
528 stars 239 forks source link

Cursor showing right side instead of center #141

Open kranthikumar-uppula opened 3 years ago

kranthikumar-uppula commented 3 years ago

Describe the bug Enter the OTP and then start removing then the cursor showing on right side instead in center.

To Reproduce Steps to reproduce the behavior:

  1. Give placeholderCharacter={'-'}
  2. Start entering the code / number
  3. After entering all the code
  4. now remove the entered number and observe
  5. the cursor showing right side (tried with giving textAlign : 'center' also, but did not work)

Expected behavior Should show cursor in center if textAlign is center

Screenshots Screenshot_20210601_134225

Smartphone (please complete the following information):

Additional context After removing code the value inside digits[index] is undefined. So I tried by updating code and it has worked. value={!clearInputs ? (digits[index] || "") : ""} I have created a PR to fix this issue (https://github.com/tttstudios/react-native-otp-input/pull/142). Please check and do the needful. Thank you

tearjuIce commented 3 years ago

so you find a solution for this? im getting this too

arunpugahz commented 3 years ago

I'm not sure whether it's the default behavior or the developers have set it like this. Already addressed https://github.com/tttstudios/react-native-otp-input/issues/116#issuecomment-873310411

D-Navadiya commented 3 years ago

Having the same issue!

mithunsalinda commented 1 year ago

multiline={true} in node package index and patch the package worked for me.