react-pin
React overlay component for transitions and lock screens.
npm i -S react-pin
This project is working but its interface may change rapidly prior to version 1.0.
What's it do?
Exports a component that can be used in lock screens or page transitions.
Usage
/** Import reactPin factory */ /** Translate the factory to a Pin component, ensures you don't accidentally bundle two versions of popular libraries. */const Pin = /** Wrap pin with one of your components to set its props. */ <Pin maxDigits=4 minDigits=4 validate= pin === 1234 title="Enter Pin" successMessage="That was the correct pin!" failureMessage="That was the wrong pin!" onSuccess= console onFailure= console theme="solarized" />
PropTypes and DefaultProps
PinpropTypes = validate: PropTypesfuncisRequired maxDigits: PropTypesnumberisRequired minDigits: PropTypesnumberisRequired title: PropTypesstring successMessage: PropTypesstring failureMessage: PropTypesstring onSuccess: PropTypesfuncisRequired onFailure: PropTypesfunc theme: PropTypesisRequired
PindefaultProps = maxDigits: 4 minDigits: 4 title: 'Enter Pin' successMessage: 'Success!' failureMessage: 'Incorrect Pin!' theme: 'carbon'