mirror of
https://github.com/FlipsideCrypto/DefinitelyTyped.git
synced 2026-02-06 10:56:53 +00:00
36 lines
692 B
TypeScript
36 lines
692 B
TypeScript
|
|
import * as React from "react";
|
||
|
|
import OTPInput from "react-otp-input";
|
||
|
|
|
||
|
|
interface InputOtpProps {
|
||
|
|
inputCount: number;
|
||
|
|
}
|
||
|
|
|
||
|
|
interface OtpInputState {
|
||
|
|
otp: number;
|
||
|
|
}
|
||
|
|
|
||
|
|
class OtpInputPage extends React.Component<InputOtpProps, OtpInputState> {
|
||
|
|
state = {
|
||
|
|
otp: 123456
|
||
|
|
};
|
||
|
|
|
||
|
|
handleChange = (otp: number) => {
|
||
|
|
this.setState({ otp });
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
const { otp } = this.state;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<OTPInput
|
||
|
|
value={otp}
|
||
|
|
onChange={this.handleChange}
|
||
|
|
numInputs={6}
|
||
|
|
separator={<span>-</span>}
|
||
|
|
/>
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|