@twotalltotems/react-native-otp-input - npm Package Compare versions

Comparing version 1.1.2 to 1.1.3

index.js

 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'
@@ -17,2 +17,3 @@ import styles from './styles'
         secureTextEntry: PropTypes.bool,
+        keyboardType: PropTypes.string,
     }
@@ -26,3 +27,4 @@
         autoFocusOnLoad: true,
-        secureTextEntry: false
+        secureTextEntry: false,
+        keyboardType: "number-pad"
     }
@@ -86,3 +88,3 @@
     handleKeyboardDidHide = () => {
-        this.blurAllFields() 
+        this.blurAllFields()
     }
@@ -124,7 +126,7 @@
             newdigits = text.split("").slice(oldTextLength, newTextLength)
-            this.setState( {digits: newdigits }, this.notifyCodeChanged)
+            this.setState({ digits: newdigits }, this.notifyCodeChanged)
         } else {
             if (text.length === 0) {
                 if (newdigits.length > 0) {
-                    newdigits = newdigits.slice(0, newdigits.length-1)
+                    newdigits = newdigits.slice(0, newdigits.length - 1)
                 }
@@ -155,3 +157,3 @@ } else {
         const digits = this.getDigits()
-        if(key === 'Backspace') {
+        if (key === 'Backspace') {
             if (!digits[index] && index > 0) {
@@ -180,4 +182,4 @@ this.handleChangeText(index - 1, '')
 
-    renderOneInputField = ( _ , index ) => {
-        const { codeInputFieldStyle, codeInputHighlightStyle, secureTextEntry } = this.props
+    renderOneInputField = (_, index) => {
+        const { codeInputFieldStyle, codeInputHighlightStyle, secureTextEntry, keyboardType } = this.props
         const { defaultTextFieldStyle } = styles
@@ -189,3 +191,3 @@ const { selectedIndex, digits } = this.state
                     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 }}
@@ -197,4 +199,4 @@ onChangeText={text => {
                     value={digits[index]}
-                    keyboardType="number-pad"
-                    textContentType= {isAutoFillSupported ? "oneTimeCode" : "none"}
+                    keyboardType={keyboardType}
+                    textContentType={isAutoFillSupported ? "oneTimeCode" : "none"}
                     key={index}
@@ -229,3 +231,3 @@ selectionColor="#00000000"
                     <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%' }}
                     >
@@ -238,2 +240,2 @@ {this.renderTextFields()}
     }
-}
+}

package.json

 {
   "name": "@twotalltotems/react-native-otp-input",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "description": "is a tiny JS library for one time passcode (OTP). Supports smart input suggestion on iOS and code autofill on Android (it will be filled when you press the copy button on the SMS notification bar)",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -71,2 +71,3 @@ ![PaginatableList](https://raw.githubusercontent.com/Twotalltotems/react-native-otp-input/master/assets/otp_banner.jpg)
 | secureTextEntry | NO | Hide contents of text fields |
+| keyboardType | NO | Keyboard type |
 
@@ -73,0 +74,0 @@ ## Notes

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

18781

increased by1.05%

Lines of code

223

increased by1.36%

Number of lines in readme file

130

increased by0.78%

No dependency changes