-
Notifications
You must be signed in to change notification settings - Fork 251
Open
Description
Hi! 👋
Firstly, thanks for your work on this project! 🙂
The package used depreceated import Clipboard from '@react-native-community/clipboard';
Here is the diff that solved my problem:
Note : Test IDs are not required to fix this issue its optional
diff --git a/node_modules/@twotalltotems/react-native-otp-input/dist/index.js b/node_modules/@twotalltotems/react-native-otp-input/dist/index.js
index 71580b8..788bcdf 100644
--- a/node_modules/@twotalltotems/react-native-otp-input/dist/index.js
+++ b/node_modules/@twotalltotems/react-native-otp-input/dist/index.js
@@ -1,6 +1,6 @@
import React, { Component } from 'react';
import { View, TextInput, TouchableWithoutFeedback, Keyboard, Platform, I18nManager, } from 'react-native';
-import Clipboard from '@react-native-community/clipboard';
+import Clipboard from '@react-native-clipboard/clipboard';
import styles from './styles';
import { isAutoFillSupported } from './helpers/device';
import { codeToArray } from './helpers/codeToArray';
@@ -125,13 +125,14 @@ export default class OTPInputView extends Component {
}
};
this.renderOneInputField = (_, index) => {
+ const { testID } = this.props;
const { codeInputFieldStyle, codeInputHighlightStyle, secureTextEntry, editable, keyboardType, selectionColor, keyboardAppearance } = this.props;
const { defaultTextFieldStyle } = styles;
const { selectedIndex, digits } = this.state;
const { clearInputs, placeholderCharacter, placeholderTextColor } = this.props;
const { color: defaultPlaceholderTextColor } = { ...defaultTextFieldStyle, ...codeInputFieldStyle };
return (<View pointerEvents="none" key={index + "view"} testID="inputSlotView">
- <TextInput testID="textInput" underlineColorAndroid='rgba(0,0,0,0)' style={selectedIndex === index ? [defaultTextFieldStyle, codeInputFieldStyle, codeInputHighlightStyle] : [defaultTextFieldStyle, codeInputFieldStyle]} ref={ref => { this.fields[index] = ref; }} onChangeText={text => {
+ <TextInput testID={`${testID??"OTP_Input"}_${index}}`} accessibilityLabel={`${testID??"OTP_Input"}_${index}}`} underlineColorAndroid='rgba(0,0,0,0)' style={selectedIndex === index ? [defaultTextFieldStyle, codeInputFieldStyle, codeInputHighlightStyle] : [defaultTextFieldStyle, codeInputFieldStyle]} ref={ref => { this.fields[index] = ref; }} onChangeText={text => {
this.handleChangeText(index, text);
}} onKeyPress={({ nativeEvent: { key } }) => { this.handleKeyPressTextInput(index, key); }} value={!clearInputs ? digits[index] : ""} keyboardAppearance={keyboardAppearance} keyboardType={keyboardType} textContentType={isAutoFillSupported ? "oneTimeCode" : "none"} key={index} selectionColor={selectionColor} secureTextEntry={secureTextEntry} editable={editable} placeholder={placeholderCharacter} placeholderTextColor={placeholderTextColor || defaultPlaceholderTextColor}/>
</View>);
diff --git a/node_modules/@twotalltotems/react-native-otp-input/index.d.ts b/node_modules/@twotalltotems/react-native-otp-input/index.d.ts
index aec5d5b..d8af8de 100644
--- a/node_modules/@twotalltotems/react-native-otp-input/index.d.ts
+++ b/node_modules/@twotalltotems/react-native-otp-input/index.d.ts
@@ -19,6 +19,10 @@ declare module '@twotalltotems/react-native-otp-input' {
* Digits of pins in the OTP
*/
pinCount: number;
+ /**
+ * Test Id for OTP Input field
+ */
+ testID?: string;
/**
* Style of the input fields
*/Metadata
Metadata
Assignees
Labels
No labels