Merge pull request #27 from AZIMAT/master

Fixing RTL issue.
tttstudios · Dec 28, 2019 · ed8802b · ed8802b
2 parents e8c7817 + f409f75
commit ed8802b
Showing 1 changed file with 4 additions and 4 deletions.
diff --git a/index.js b/index.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import { View, TextInput, TouchableWithoutFeedback, Clipboard, Keyboard, Platform } from 'react-native'
+import { View, TextInput, TouchableWithoutFeedback, Clipboard, Keyboard, Platform, I18nManager, } from 'react-native'
 import PropTypes from 'prop-types'
 import styles from './styles'
 import { isAutoFillSupported } from './helpers/device'
@@ -182,7 +182,7 @@ export default class OTPInputView extends Component {
             <View pointerEvents="none" key={index + "view"}>
                 <TextInput
                     underlineColorAndroid='rgba(0,0,0,0)'
-                    style={selectedIndex === index ? [defaultTextFieldStyle, codeInputFieldStyle, codeInputHighlightStyle] : [defaultTextFieldStyle, codeInputFieldStyle]}
+                    style={selectedIndex === index || digits[index] ? [defaultTextFieldStyle, codeInputFieldStyle, codeInputHighlightStyle] : [defaultTextFieldStyle, codeInputFieldStyle]}
                     ref={ref => { this.fields[index] = ref }}
                     onChangeText={text => {
                         this.handleChangeText(index, text)
@@ -220,12 +220,12 @@ export default class OTPInputView extends Component {
                     }}
                 >
                     <View
-                        style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', width: '100%', height: '100%' }}
+                        style={{ flexDirection: I18nManager.isRTL ? 'row-reverse' : 'row', justifyContent: 'space-between', alignItems: 'center', width: '100%', height: '100%' }}
                     >
                         {this.renderTextFields()}
                     </View>
                 </TouchableWithoutFeedback>
             </View>
         );
     }
-}
+}