diff --git a/.gitignore b/.gitignore index 3e9012c..4b013bc 100644 --- a/.gitignore +++ b/.gitignore @@ -58,4 +58,4 @@ buck-out/ ReactotronConfig.js # ts build dir -dist \ No newline at end of file +# dist \ No newline at end of file diff --git a/dist/helpers/codeToArray.d.ts b/dist/helpers/codeToArray.d.ts new file mode 100644 index 0000000..56e61df --- /dev/null +++ b/dist/helpers/codeToArray.d.ts @@ -0,0 +1,5 @@ +export declare const codeToArray: (code?: string | undefined) => string[]; +declare const _default: { + codeToArray: (code?: string | undefined) => string[]; +}; +export default _default; diff --git a/dist/helpers/codeToArray.js b/dist/helpers/codeToArray.js new file mode 100644 index 0000000..2bda90d --- /dev/null +++ b/dist/helpers/codeToArray.js @@ -0,0 +1,3 @@ +export const codeToArray = (code) => { var _a; return (_a = code === null || code === void 0 ? void 0 : code.split("")) !== null && _a !== void 0 ? _a : []; }; +export default { codeToArray }; +//# sourceMappingURL=codeToArray.js.map \ No newline at end of file diff --git a/dist/helpers/codeToArray.js.map b/dist/helpers/codeToArray.js.map new file mode 100644 index 0000000..de917a5 --- /dev/null +++ b/dist/helpers/codeToArray.js.map @@ -0,0 +1 @@ +{"version":3,"file":"codeToArray.js","sourceRoot":"","sources":["../../helpers/codeToArray.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAa,EAAY,EAAE,wBAAC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,CAAC,EAAE,oCAAK,EAAE,GAAA,CAAC;AAE9E,eAAe,EAAE,WAAW,EAAE,CAAA"} \ No newline at end of file diff --git a/dist/helpers/device.d.ts b/dist/helpers/device.d.ts new file mode 100644 index 0000000..b61927d --- /dev/null +++ b/dist/helpers/device.d.ts @@ -0,0 +1,5 @@ +export declare const isAutoFillSupported: boolean; +declare const _default: { + isAutoFillSupported: boolean; +}; +export default _default; diff --git a/dist/helpers/device.js b/dist/helpers/device.js new file mode 100644 index 0000000..943ee0c --- /dev/null +++ b/dist/helpers/device.js @@ -0,0 +1,5 @@ +import { Platform } from 'react-native'; +const majorVersionIOS = parseInt(String(Platform.Version), 10); +export const isAutoFillSupported = (Platform.OS === 'ios' && majorVersionIOS >= 12); +export default { isAutoFillSupported }; +//# sourceMappingURL=device.js.map \ No newline at end of file diff --git a/dist/helpers/device.js.map b/dist/helpers/device.js.map new file mode 100644 index 0000000..187c762 --- /dev/null +++ b/dist/helpers/device.js.map @@ -0,0 +1 @@ +{"version":3,"file":"device.js","sourceRoot":"","sources":["../../helpers/device.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAEvC,MAAM,eAAe,GAAG,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC;AAC/D,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,QAAQ,CAAC,EAAE,KAAK,KAAK,IAAI,eAAe,IAAI,EAAE,CAAC,CAAA;AAEnF,eAAe,EAAE,mBAAmB,EAAE,CAAA"} \ No newline at end of file diff --git a/dist/index.d.ts b/dist/index.d.ts new file mode 100644 index 0000000..df13487 --- /dev/null +++ b/dist/index.d.ts @@ -0,0 +1,30 @@ +/// +import { InputProps, OTPInputViewState } from '@twotalltotems/react-native-otp-input'; +import { Component } from 'react'; +import { TextInput } from 'react-native'; +export default class OTPInputView extends Component { + static defaultProps: InputProps; + private fields; + private keyboardDidHideListener?; + private timer?; + private hasCheckedClipBoard?; + private clipBoardCode?; + constructor(props: InputProps); + UNSAFE_componentWillReceiveProps(nextProps: InputProps): void; + componentDidMount(): void; + componentWillUnmount(): void; + private copyCodeFromClipBoardOnAndroid; + bringUpKeyBoardIfNeeded: () => void; + getDigits: () => string[]; + private handleKeyboardDidHide; + private notifyCodeChanged; + checkPinCodeFromClipBoard: () => void; + private handleChangeText; + private handleKeyPressTextInput; + focusField: (index: number) => void; + blurAllFields: () => void; + clearAllFields: () => void; + renderOneInputField: (_: TextInput, index: number) => JSX.Element; + renderTextFields: () => JSX.Element[]; + render(): JSX.Element; +} diff --git a/dist/index.js b/dist/index.js new file mode 100644 index 0000000..d8493d8 --- /dev/null +++ b/dist/index.js @@ -0,0 +1,200 @@ +import React, { Component } from 'react'; +import { View, TextInput, TouchableWithoutFeedback, Keyboard, Platform, I18nManager, } from 'react-native'; +import * as Clipboard from 'expo-clipboard'; +import styles from './styles'; +import { isAutoFillSupported } from './helpers/device'; +import { codeToArray } from './helpers/codeToArray'; +export default class OTPInputView extends Component { + constructor(props) { + super(props); + this.fields = []; + this.copyCodeFromClipBoardOnAndroid = () => { + if (Platform.OS === "android") { + this.checkPinCodeFromClipBoard(); + this.timer = setInterval(this.checkPinCodeFromClipBoard, 400); + } + }; + this.bringUpKeyBoardIfNeeded = () => { + const { autoFocusOnLoad, pinCount } = this.props; + const digits = this.getDigits(); + const focusIndex = digits.length ? digits.length - 1 : 0; + if (focusIndex < pinCount && autoFocusOnLoad) { + this.focusField(focusIndex); + } + }; + this.getDigits = () => { + const { digits: innerDigits } = this.state; + const { code } = this.props; + return code === undefined ? innerDigits : code.split(""); + }; + this.handleKeyboardDidHide = () => { + this.blurAllFields(); + }; + this.notifyCodeChanged = () => { + const { digits } = this.state; + const code = digits.join(""); + const { onCodeChanged } = this.props; + if (onCodeChanged) { + onCodeChanged(code); + } + }; + this.checkPinCodeFromClipBoard = () => { + const { pinCount, onCodeFilled } = this.props; + const regexp = new RegExp(`^\\d{${pinCount}}$`); + Clipboard.getStringAsync().then(code => { + if (this.hasCheckedClipBoard && regexp.test(code) && (this.clipBoardCode !== code)) { + this.setState({ + digits: code.split(""), + }, () => { + this.blurAllFields(); + this.notifyCodeChanged(); + onCodeFilled && onCodeFilled(code); + }); + } + this.clipBoardCode = code; + this.hasCheckedClipBoard = true; + }).catch(() => { + }); + }; + this.handleChangeText = (index, text) => { + const { onCodeFilled, pinCount } = this.props; + const digits = this.getDigits(); + let newdigits = digits.slice(); + const oldTextLength = newdigits[index] ? newdigits[index].length : 0; + const newTextLength = text.length; + if (newTextLength - oldTextLength === pinCount) { // user pasted text in. + newdigits = text.split("").slice(oldTextLength, newTextLength); + this.setState({ digits: newdigits }, this.notifyCodeChanged); + } + else { + if (text.length === 0) { + if (newdigits.length > 0) { + newdigits = newdigits.slice(0, newdigits.length - 1); + } + } + else { + text.split("").forEach((value) => { + if (index < pinCount) { + newdigits[index] = value; + index += 1; + } + }); + index -= 1; + } + this.setState({ digits: newdigits }, this.notifyCodeChanged); + } + let result = newdigits.join(""); + if (result.length >= pinCount) { + onCodeFilled && onCodeFilled(result); + this.focusField(pinCount - 1); + this.blurAllFields(); + } + else { + if (text.length > 0 && index < pinCount - 1) { + this.focusField(index + 1); + } + } + }; + this.handleKeyPressTextInput = (index, key) => { + const digits = this.getDigits(); + if (key === 'Backspace') { + if (!digits[index] && index > 0) { + this.handleChangeText(index - 1, ''); + this.focusField(index - 1); + } + } + }; + this.focusField = (index) => { + if (index < this.fields.length) { + this.fields[index].focus(); + this.setState({ + selectedIndex: index + }); + } + }; + this.blurAllFields = () => { + this.fields.forEach((field) => field.blur()); + this.setState({ + selectedIndex: -1, + }); + }; + this.clearAllFields = () => { + const { clearInputs, code } = this.props; + if (clearInputs && code === "") { + this.setState({ digits: [], selectedIndex: 0 }); + } + }; + this.renderOneInputField = (_, index) => { + 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 ( + { 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}/> + ); + }; + this.renderTextFields = () => { + const { pinCount } = this.props; + const array = new Array(pinCount).fill(0); + return array.map(this.renderOneInputField); + }; + const { code } = props; + this.state = { + digits: codeToArray(code), + selectedIndex: props.autoFocusOnLoad ? 0 : -1, + }; + } + UNSAFE_componentWillReceiveProps(nextProps) { + const { code } = this.props; + if (nextProps.code !== code) { + this.setState({ digits: codeToArray(nextProps.code) }); + } + } + componentDidMount() { + this.copyCodeFromClipBoardOnAndroid(); + this.bringUpKeyBoardIfNeeded(); + this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this.handleKeyboardDidHide); + } + componentWillUnmount() { + var _a; + if (this.timer) { + clearInterval(this.timer); + } + (_a = this.keyboardDidHideListener) === null || _a === void 0 ? void 0 : _a.remove(); + } + render() { + const { pinCount, style, clearInputs } = this.props; + const digits = this.getDigits(); + return ( + { + if (!clearInputs) { + let filledPinCount = digits.filter((digit) => { return (digit !== null && digit !== undefined); }).length; + this.focusField(Math.min(filledPinCount, pinCount - 1)); + } + else { + this.clearAllFields(); + this.focusField(0); + } + }}> + + {this.renderTextFields()} + + + ); + } +} +OTPInputView.defaultProps = { + pinCount: 6, + autoFocusOnLoad: true, + secureTextEntry: false, + editable: true, + keyboardAppearance: "default", + keyboardType: "number-pad", + clearInputs: false, + placeholderCharacter: "", + selectionColor: '#000', +}; +//# sourceMappingURL=index.js.map \ No newline at end of file diff --git a/dist/index.js.map b/dist/index.js.map new file mode 100644 index 0000000..3dacd20 --- /dev/null +++ b/dist/index.js.map @@ -0,0 +1 @@ +{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.tsx"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/styles.d.ts b/dist/styles.d.ts new file mode 100644 index 0000000..cc0ff76 --- /dev/null +++ b/dist/styles.d.ts @@ -0,0 +1,6 @@ +import { TextStyle } from 'react-native'; +interface Styles { + defaultTextFieldStyle: TextStyle; +} +declare const styles: Styles; +export default styles; diff --git a/dist/styles.js b/dist/styles.js new file mode 100644 index 0000000..9f25e87 --- /dev/null +++ b/dist/styles.js @@ -0,0 +1,14 @@ +import { StyleSheet } from 'react-native'; +const styles = StyleSheet.create({ + defaultTextFieldStyle: { + width: 45, + height: 45, + borderColor: 'rgba(226, 226, 226, 1)', + borderWidth: 1, + borderRadius: 2, + textAlign: 'center', + color: 'rgba(226, 226, 226, 1)', + }, +}); +export default styles; +//# sourceMappingURL=styles.js.map \ No newline at end of file diff --git a/dist/styles.js.map b/dist/styles.js.map new file mode 100644 index 0000000..59446f9 --- /dev/null +++ b/dist/styles.js.map @@ -0,0 +1 @@ +{"version":3,"file":"styles.js","sourceRoot":"","sources":["../styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,cAAc,CAAC;AAMrD,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAS;IACrC,qBAAqB,EAAG;QACpB,KAAK,EAAG,EAAE;QACV,MAAM,EAAG,EAAE;QACX,WAAW,EAAG,wBAAwB;QACtC,WAAW,EAAG,CAAC;QACf,YAAY,EAAG,CAAC;QAChB,SAAS,EAAG,QAAQ;QACpB,KAAK,EAAE,wBAAwB;KAClC;CACJ,CAAC,CAAC;AAEH,eAAe,MAAM,CAAC"} \ No newline at end of file diff --git a/index.tsx b/index.tsx index 6c56ef8..3ea6d20 100644 --- a/index.tsx +++ b/index.tsx @@ -2,7 +2,7 @@ import { InputProps, OTPInputViewState } from '@twotalltotems/react-native-otp-input'; import React, { Component } from 'react' import { View, TextInput, TouchableWithoutFeedback, Keyboard, Platform, I18nManager, EmitterSubscription, } from 'react-native' -import Clipboard from '@react-native-community/clipboard'; +import * as Clipboard from 'expo-clipboard'; import styles from './styles' import { isAutoFillSupported } from './helpers/device' import { codeToArray } from './helpers/codeToArray' @@ -93,7 +93,7 @@ export default class OTPInputView extends Component { const { pinCount, onCodeFilled } = this.props const regexp = new RegExp(`^\\d{${pinCount}}$`) - Clipboard.getString().then(code => { + Clipboard.getStringAsync().then(code => { if (this.hasCheckedClipBoard && regexp.test(code) && (this.clipBoardCode !== code)) { this.setState({ digits: code.split(""), diff --git a/jest.config.js b/jest.config.js new file mode 100644 index 0000000..827b5c1 --- /dev/null +++ b/jest.config.js @@ -0,0 +1,5 @@ +module.exports = { + transformIgnorePatterns: [ + 'node_modules/(?!(expo-clipboard)/)', + ], +} \ No newline at end of file diff --git a/package.json b/package.json index 00fb01e..a64a051 100644 --- a/package.json +++ b/package.json @@ -70,6 +70,6 @@ "typescript": "^3.8.3" }, "dependencies": { - "@react-native-community/clipboard": "^1.2.2" + "expo-clipboard": "~2.0.3" } } diff --git a/yarn.lock b/yarn.lock index f826a0c..192abe6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1995,6 +1995,11 @@ commondir@^1.0.1: resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b" integrity sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs= +compare-versions@^3.4.0: + version "3.6.0" + resolved "https://registry.yarnpkg.com/compare-versions/-/compare-versions-3.6.0.tgz#1a5689913685e5a87637b8d3ffca75514ec41d62" + integrity sha512-W6Af2Iw1z4CB7q4uU4hv646dW9GQuBM+YpC0UvUCWSD8w90SJjp+ujJuXaEMtAXBtSqGfMPuFOVn4/+FlaqfBA== + component-emitter@^1.2.1: version "1.3.0" resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.3.0.tgz#16e4070fba8ae29b679f2215853ee181ab2eabc0" @@ -2685,6 +2690,21 @@ expect@^25.1.0: jest-message-util "^25.1.0" jest-regex-util "^25.1.0" +expo-clipboard@~2.0.3: + version "2.0.3" + resolved "https://registry.yarnpkg.com/expo-clipboard/-/expo-clipboard-2.0.3.tgz#4f2b1f441a26c45e77e218506256ab0cebf58d62" + integrity sha512-fcv9rUFoKSMWknL4wJnln+DGnPQdYKYjILap58k9MPsywZ5Gp2PRI17oqMVyM9r/yIhsr5PKUsSGGIjvxUBYrA== + dependencies: + expo-modules-core "~0.4.4" + +expo-modules-core@~0.4.4: + version "0.4.10" + resolved "https://registry.yarnpkg.com/expo-modules-core/-/expo-modules-core-0.4.10.tgz#6c7e7e211b3056fc23a462e9faea88cc7653fe9b" + integrity sha512-uCZA3QzF0syRaHwYY99iaNhnye4vSQGsJ/y6IAiesXdbeVahWibX4G1KoKNPUyNsKXIM4tqA+4yByUSvJe4AAw== + dependencies: + compare-versions "^3.4.0" + invariant "^2.2.4" + extend-shallow@^1.1.2: version "1.1.4" resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-1.1.4.tgz#19d6bf94dfc09d76ba711f39b872d21ff4dd9071"