## A UI library support biometry authentication with passcode fallback for React Native
npm install react-native-biometry-modulesh
yarn add git+https://github.com/dangttp97/rn-biometry-module
`$3
`tsx
import {Biometry, ScreenType} from 'react-native-biometry-module'/*
Your render method
*/
return
`$3
#### ScreenType
Type of screen to show. Includes:
- select Set passcode screen.
- input Input passcode screen.
- changePasscode Change passcode screen.$3
- #### Generals
|Key |Type |Default |Description |
|----------------------------------|------------------------------------------------------|---------|------------------------------------------------------------------------------|
|type |ScreenType | |Type of screen to display |
|numberOfAttempts |number
undefined |3 |Number of max attempts before screen is locked |
|lockedTime |number
undefined |300000 |Locked time in millisecond before screen unlocked. |
|alphabetCharsVisible |boolean
undefined |false |Is alphabet characters show below numeric char in keypad |
|biometryEnabled |boolean | |Is using biometry for authenticate user |
|passcodeVisible |boolean
undefined |false |Is passcode input visible |
|timePasscodeLockedAsyncStorageName|string
undefined |undefined|Locked time AsyncStorage save key |
|passcodeKeychainName |string
undefined |undefined|Key for saving passcode to keychain system |
|passcodeAttemptsAsyncStorageName |string
undefined |undefined|Key for saving number of failed attempts in AsyncStorage |
|onSuccess |(passcode: string) => void
undefined |undefined|Handler for confirm passcode success, input passcode success, biometry success|
|onFailed |(error?: any) => void
undefined |undefined|Handler for confirm failed, input passcode failed, biometry failed |
|passcodeSelectTitle |string
undefined |undefined|Title for select passcode screen |
|passcodeSelectSubtitle |string
undefined |undefined|Subtitle for select passcode screen |
|passcodeSelectErrorTitle |string
undefined |undefined|Title for select passcode screen when error |
|passcodeSelectErrorSubtitle |string
undefined |undefined|Subtitle for select passcode screen when error |
|passcodeConfirmTitle |string
undefined |undefined|Title for confirm passcode screen |
|passcodeConfirmSubtitle |string
undefined |undefined|Subtitle for confirm passcode screen |
|passcodeConfirmErrorTitle |string
undefined |undefined|Title for confirm passcode screen when error |
|passcodeConfirmErrorSubtitle |string
undefined |undefined|Subtitle for confirm passcode screen when error |
|passcodeInputTitle |string
undefined |undefined|Title for input passcode screen |
|passcodeInputSubtitle |string
undefined |undefined|Subtitle for input passcode screen |
|passcodeInputErrorTitle |string
undefined |undefined|Title for input passcode screen when error |
|passcodeInputErrorSubtitle |string
undefined |undefined|Subtitle for input passcode screen when error |
|lockedTitle |string
undefined |undefined|Title for locked screen |
|lockedSubtitle |(timer: number) => string
undefined |undefined|Subtitle with remain locked time for locked screen |- #### Custom components
|Key |Type |Default |Description |
|------------------|-------------------------------------------------------------------------------------------------|---------|---------------------------------------------------------|
|deleteButtonIcon |
JSX.Element
undefined |undefined|Set icon for delete button keypad |
|biometryButtonIcon|JSX.Element
undefined |undefined|Set icon for biometry trigger keypad (bottom left button)|
|lockedButton |JSX.Element
undefined |undefined|Locked page button |
|lockedPage |JSX.Element
undefined |undefined|Custom locked page |
|bottomLeftButton |JSX.Element
undefined |undefined|Custom bottom left button (biometry trigger button) |
|deleteButton |(handler: () => void) => JSX.Element
undefined |undefined|Custom delete button keypad with handler method in module|
|keypadButton |(index: number, handler: (buttonIndex: string) => void) => JSX.Element
undefined|undefined|Custom keypad button with handler and button index |- #### Styles
|Key |Type |Default |Description |
|----------------------------------|-----------------------------------------------|---------|--------------------------------------------------|
|styleLockedContainer |
StyleProp
undefined|undefined|Style of locked screen's container |
|styleLockedTextContainer |StyleProp
undefined|undefined|Style of locked screen text container |
|styleLockedTitle |StyleProp
undefined|undefined|Style of locked screen's container |
|styleLockedSubtitle |StyleProp
undefined|undefined|Style of locked screen's container |
|styleLockedTimerContainer |StyleProp
undefined|undefined|Style of locked screen's timer container |
|styleLockedTimerText |StyleProp
undefined|undefined|Style of locked screen's timer text |
|styleLockedIconContainer |StyleProp
undefined|undefined|Style of locked screen's center icon container |
|stylePasscodeContainer |StyleProp
undefined|undefined|Style of passcode container |
|stylePasscodeTitle |StyleProp
undefined|undefined|Style of passcode title |
|stylePasscodeSubtitle |StyleProp
undefined|undefined|Style of passcode subtitle |
|stylePasscodeHidden |StyleProp
undefined|undefined|Style of passcode indicator when hidden |
|stylePasscodeText |StyleProp
undefined|undefined|Style of passcode indicator when show text |
|styleKeypadAlphabetCharHighlighted|StyleProp
undefined|undefined|Style of alphabet chars when keypad pressed |
|styleKeypadNumberCharHighlighted |StyleProp
undefined|undefined|Style of numeric chars when keypad pressed |
|styleKeypadAlphabetCharNormal |StyleProp
undefined|undefined|Style of alphabet chars when keypad normal |
|styleKeypadNumberCharNormal |StyleProp
undefined|undefined|Style of numeric chars when keypad normal |$3
#### async hasUserSetPasscode(serviceName?: string) => Promise
Returns a promise contains if passcode had been set or not
#### async deleteUserPasscode(serviceName?: string) => Promise
Delete keychain stored passcode if existed
#### async resetPasscodeInternalStates = (passcodeAttempsStorageName?: string, timePasscodeLockedStorageName?: string) => Promise