diff --git a/README.md b/README.md index 9c66c05..4536338 100644 --- a/README.md +++ b/README.md @@ -131,6 +131,17 @@ export default function App() { +### ⚠️ Warning +Do not override the following props on the input component that you return from the `renderInput` prop. Doing so might lead to unexpected behaviour. +- `ref` +- `value` +- `onChange` +- `onFocus` +- `onBlur` +- `onKeyDown` +- `onPaste` +- `type` + ## Migrating from v2 The v3 of `react-otp-input` is a complete rewrite of the library. Apart from making the API more customizable and flexible, this version is a complete rewrite of the library using TypeScript and React Hooks. Here are the breaking changes that you need to be aware of: diff --git a/package.json b/package.json index 368bc0d..3dfbae5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-otp-input", - "version": "3.0.1", + "version": "3.0.2", "description": "A fully customizable, one-time password input component for the web built with React", "main": "lib/index.js", "module": "lib/index.esm.js", diff --git a/src/index.tsx b/src/index.tsx index f6b6d11..de05ad6 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -151,6 +151,8 @@ const OTPInput = ({ event.code === 'ArrowDown' ) { event.preventDefault(); + } else if (isInputNum && !isInputValueValid(event.key)) { + event.preventDefault(); } };