# @beldore/react-otp-input

> A fully customizable, one-time password input component for the web built with React

Latest version **2.4.1** (published 2022-06-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install @beldore/react-otp-input
pnpm add @beldore/react-otp-input
yarn add @beldore/react-otp-input
bun add @beldore/react-otp-input
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.4.1 |
| Published | 2022-06-01 |
| First published | 2022-06-01 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 595 |
| Unpacked size | 46.4 KB |
| Known vulnerabilities | 0 (+32 in 15 direct dependencies) |
| Install scripts | no |
| GitHub stars | 699 |
| Author | Devfolio |
| Maintainers | abeltolu |
| Keywords | otp, input, code, passcode, component |

## Links

- npm: https://www.npmjs.com/package/@beldore/react-otp-input
- Repository: https://github.com/devfolioco/react-otp-input
- Homepage: https://devfolioco.github.io/react-otp-input
- Issues: https://github.com/devfolioco/react-otp-input/issues
- npm.io page: https://npm.io/package/@beldore/react-otp-input

## Dependencies (595)

- [he](https://npm.io/package/he.md) ^1.2.0
- [ip](https://npm.io/package/ip.md) ^1.1.5
- [ms](https://npm.io/package/ms.md) ^2.0.0
- [ws](https://npm.io/package/ws.md) ^6.2.2
- [ajv](https://npm.io/package/ajv.md) ^6.5.0
- [has](https://npm.io/package/has.md) ^1.0.3
- [ini](https://npm.io/package/ini.md) ^1.3.7
- [nan](https://npm.io/package/nan.md) ^2.14.0
- [prr](https://npm.io/package/prr.md) ^1.0.1
- [ret](https://npm.io/package/ret.md) ^0.1.15
- [url](https://npm.io/package/url.md) ^0.11.0
- [use](https://npm.io/package/use.md) ^3.1.0
- [atob](https://npm.io/package/atob.md) ^2.1.1
- [base](https://npm.io/package/base.md) ^0.11.2
- [depd](https://npm.io/package/depd.md) ^1.1.2
- [etag](https://npm.io/package/etag.md) ^1.8.1
- [glob](https://npm.io/package/glob.md) ^7.1.2
- [levn](https://npm.io/package/levn.md) ^0.4.1
- [mime](https://npm.io/package/mime.md) ^2.4.6
- [obuf](https://npm.io/package/obuf.md) ^1.1.2
- [once](https://npm.io/package/once.md) ^1.4.0
- [pako](https://npm.io/package/pako.md) ^1.0.11
- [pify](https://npm.io/package/pify.md) ^3.0.0
- [pump](https://npm.io/package/pump.md) ^3.0.0
- [rxjs](https://npm.io/package/rxjs.md) ^6.6.7
- [send](https://npm.io/package/send.md) ^0.17.1
- [spdy](https://npm.io/package/spdy.md) ^4.0.2
- [ssri](https://npm.io/package/ssri.md) ^6.0.2
- [urix](https://npm.io/package/urix.md) ^0.1.0
- [util](https://npm.io/package/util.md) ^0.11.1
- [uuid](https://npm.io/package/uuid.md) ^3.3.2
- [vary](https://npm.io/package/vary.md) ^1.1.2
- [wbuf](https://npm.io/package/wbuf.md) ^1.7.3
- [y18n](https://npm.io/package/y18n.md) ^4.0.1
- [acorn](https://npm.io/package/acorn.md) ^7.4.1
- [async](https://npm.io/package/async.md) ^2.6.3
- [batch](https://npm.io/package/batch.md) ^0.6.1
- [bn.js](https://npm.io/package/bn.js.md) ^5.2.0
- [bytes](https://npm.io/package/bytes.md) ^3.0.0
- [chalk](https://npm.io/package/chalk.md) ^2.4.1
- [cliui](https://npm.io/package/cliui.md) ^5.0.0
- [debug](https://npm.io/package/debug.md) ^2.6.9
- [errno](https://npm.io/package/errno.md) ^0.1.7
- [fresh](https://npm.io/package/fresh.md) ^0.5.2
- [from2](https://npm.io/package/from2.md) ^2.3.0
- [iferr](https://npm.io/package/iferr.md) ^0.1.5
- [isexe](https://npm.io/package/isexe.md) ^2.0.0
- [jsesc](https://npm.io/package/jsesc.md) ^0.5.0
- [json3](https://npm.io/package/json3.md) ^3.3.3
- [json5](https://npm.io/package/json5.md) ^0.5.1
- [p-try](https://npm.io/package/p-try.md) ^1.0.0
- [retry](https://npm.io/package/retry.md) ^0.12.0
- [slash](https://npm.io/package/slash.md) ^2.0.0
- [table](https://npm.io/package/table.md) ^6.7.1
- [tslib](https://npm.io/package/tslib.md) ^1.9.2
- [upath](https://npm.io/package/upath.md) ^1.1.2
- [utila](https://npm.io/package/utila.md) ^0.4.0
- [which](https://npm.io/package/which.md) ^1.3.1
- [xtend](https://npm.io/package/xtend.md) ^4.0.2
- [yargs](https://npm.io/package/yargs.md) ^13.3.2
- [aproba](https://npm.io/package/aproba.md) ^1.2.0
- [assert](https://npm.io/package/assert.md) ^1.5.0
- [big.js](https://npm.io/package/big.js.md) ^3.2.0
- [braces](https://npm.io/package/braces.md) ^2.3.2
- [buffer](https://npm.io/package/buffer.md) ^4.9.2
- [chownr](https://npm.io/package/chownr.md) ^1.1.4
- [cookie](https://npm.io/package/cookie.md) ^0.4.0
- [cssesc](https://npm.io/package/cssesc.md) ^3.0.0
- [des.js](https://npm.io/package/des.js.md) ^1.0.1
- [espree](https://npm.io/package/espree.md) ^7.3.1
- [events](https://npm.io/package/events.md) ^3.3.0
- [for-in](https://npm.io/package/for-in.md) ^1.0.2
- [globby](https://npm.io/package/globby.md) ^6.1.0
- [ignore](https://npm.io/package/ignore.md) ^4.0.6
- [is-odd](https://npm.io/package/is-odd.md) ^2.0.0
- [is-wsl](https://npm.io/package/is-wsl.md) ^1.1.0
- [lodash](https://npm.io/package/lodash.md) ^4.17.21
- [md5.js](https://npm.io/package/md5.js.md) ^1.3.5
- [mkdirp](https://npm.io/package/mkdirp.md) ^0.5.5
- [pbkdf2](https://npm.io/package/pbkdf2.md) ^3.1.2
- [pinkie](https://npm.io/package/pinkie.md) ^2.0.4
- [pkg-up](https://npm.io/package/pkg-up.md) ^2.0.0
- [rimraf](https://npm.io/package/rimraf.md) ^2.6.2
- [semver](https://npm.io/package/semver.md) ^5.5.0
- [sha.js](https://npm.io/package/sha.js.md) ^2.4.11
- [sockjs](https://npm.io/package/sockjs.md) ^0.3.21
- [terser](https://npm.io/package/terser.md) ^4.8.0
- [thunky](https://npm.io/package/thunky.md) ^1.1.0
- [unpipe](https://npm.io/package/unpipe.md) ^1.0.0
- [uri-js](https://npm.io/package/uri-js.md) ^4.2.2
- [wrappy](https://npm.io/package/wrappy.md) ^1.0.2
- [accepts](https://npm.io/package/accepts.md) ^1.3.7
- [asn1.js](https://npm.io/package/asn1.js.md) ^5.4.1
- [bonjour](https://npm.io/package/bonjour.md) ^3.5.0
- [brorand](https://npm.io/package/brorand.md) ^1.1.0
- [cacache](https://npm.io/package/cacache.md) ^12.0.4
- [cyclist](https://npm.io/package/cyclist.md) ^1.0.1
- [deep-is](https://npm.io/package/deep-is.md) ^0.1.3
- [destroy](https://npm.io/package/destroy.md) ^1.0.4
- [dns-txt](https://npm.io/package/dns-txt.md) ^2.0.2
- [esprima](https://npm.io/package/esprima.md) ^4.0.1
- [esquery](https://npm.io/package/esquery.md) ^1.4.0
- [esutils](https://npm.io/package/esutils.md) ^2.0.2
- [express](https://npm.io/package/express.md) ^4.17.1
- [extglob](https://npm.io/package/extglob.md) ^2.0.4
- [find-up](https://npm.io/package/find-up.md) ^2.1.0
- [flatted](https://npm.io/package/flatted.md) ^3.1.1
- [foreach](https://npm.io/package/foreach.md) ^2.0.5
- [gensync](https://npm.io/package/gensync.md) ^1.0.0-beta.2
- [globals](https://npm.io/package/globals.md) ^11.5.0
- [hash.js](https://npm.io/package/hash.js.md) ^1.1.7
- [ieee754](https://npm.io/package/ieee754.md) ^1.2.1
- [is-glob](https://npm.io/package/is-glob.md) ^4.0.1
- [isarray](https://npm.io/package/isarray.md) ^1.0.0
- [js-yaml](https://npm.io/package/js-yaml.md) ^3.14.1
- [kind-of](https://npm.io/package/kind-of.md) ^3.2.2
- [methods](https://npm.io/package/methods.md) ^1.1.2
- [mime-db](https://npm.io/package/mime-db.md) ^1.44.0
- [no-case](https://npm.io/package/no-case.md) ^3.0.4
- [p-limit](https://npm.io/package/p-limit.md) ^1.3.0
- [p-retry](https://npm.io/package/p-retry.md) ^3.0.1
- [pkg-dir](https://npm.io/package/pkg-dir.md) ^2.0.0
- [postcss](https://npm.io/package/postcss.md) ^7.0.36
- [process](https://npm.io/package/process.md) ^0.11.10
- [pumpify](https://npm.io/package/pumpify.md) ^1.5.1
- [regexpp](https://npm.io/package/regexpp.md) ^3.1.0
- [resolve](https://npm.io/package/resolve.md) ^1.20.0
- [tapable](https://npm.io/package/tapable.md) ^1.1.3
- [type-is](https://npm.io/package/type-is.md) ^1.6.18
- [yallist](https://npm.io/package/yallist.md) ^4.0.0
- [anymatch](https://npm.io/package/anymatch.md) ^2.0.0
- [argparse](https://npm.io/package/argparse.md) ^1.0.10
- [arr-diff](https://npm.io/package/arr-diff.md) ^4.0.0
- [axe-core](https://npm.io/package/axe-core.md) ^4.2.1
- [bindings](https://npm.io/package/bindings.md) ^1.5.0
- [bluebird](https://npm.io/package/bluebird.md) ^3.7.2
- [boolbase](https://npm.io/package/boolbase.md) ^1.0.0
- [chokidar](https://npm.io/package/chokidar.md) ^3.5.1
- [date-fns](https://npm.io/package/date-fns.md) ^2.22.1
- [doctrine](https://npm.io/package/doctrine.md) ^3.0.0
- [dot-case](https://npm.io/package/dot-case.md) ^3.0.4
- [ee-first](https://npm.io/package/ee-first.md) ^1.1.1
- [elliptic](https://npm.io/package/elliptic.md) ^6.5.4
- [enquirer](https://npm.io/package/enquirer.md) ^2.3.6
- [entities](https://npm.io/package/entities.md) ^2.2.0
- [error-ex](https://npm.io/package/error-ex.md) ^1.3.1
- [escalade](https://npm.io/package/escalade.md) ^3.1.1
- [fs-extra](https://npm.io/package/fs-extra.md) ^8.1.0
- [fsevents](https://npm.io/package/fsevents.md) ^2.3.2
- [has-flag](https://npm.io/package/has-flag.md) ^3.0.0
- [hpack.js](https://npm.io/package/hpack.js.md) ^2.1.6
- [inflight](https://npm.io/package/inflight.md) ^1.0.6
- [inherits](https://npm.io/package/inherits.md) ^2.0.3
- [ip-regex](https://npm.io/package/ip-regex.md) ^2.1.0
- [is-regex](https://npm.io/package/is-regex.md) ^1.0.4
- [isobject](https://npm.io/package/isobject.md) ^3.0.1
- [jsonfile](https://npm.io/package/jsonfile.md) ^4.0.0
- [killable](https://npm.io/package/killable.md) ^1.0.1
- [loglevel](https://npm.io/package/loglevel.md) ^1.6.8
- [make-dir](https://npm.io/package/make-dir.md) ^3.1.0
- [minimist](https://npm.io/package/minimist.md) ^1.2.5
- [nice-try](https://npm.io/package/nice-try.md) ^1.0.5
- [original](https://npm.io/package/original.md) ^1.0.2
- [p-locate](https://npm.io/package/p-locate.md) ^2.0.0
- [parseurl](https://npm.io/package/parseurl.md) ^1.3.3
- [path-key](https://npm.io/package/path-key.md) ^2.0.1
- [progress](https://npm.io/package/progress.md) ^2.0.3
- [punycode](https://npm.io/package/punycode.md) ^1.4.1
- [raw-body](https://npm.io/package/raw-body.md) ^2.4.0
- [react-is](https://npm.io/package/react-is.md) ^16.13.1
- [read-pkg](https://npm.io/package/read-pkg.md) ^3.0.0
- [readdirp](https://npm.io/package/readdirp.md) ^2.2.1
- [statuses](https://npm.io/package/statuses.md) ^1.5.0
- [through2](https://npm.io/package/through2.md) ^2.0.5
- [to-regex](https://npm.io/package/to-regex.md) ^3.0.2
- [acorn-jsx](https://npm.io/package/acorn-jsx.md) ^5.3.1
- [ansi-html](https://npm.io/package/ansi-html.md) ^0.0.7
- [arr-union](https://npm.io/package/arr-union.md) ^3.1.0
- [base64-js](https://npm.io/package/base64-js.md) ^1.5.1
- [call-bind](https://npm.io/package/call-bind.md) ^1.0.2
- [callsites](https://npm.io/package/callsites.md) ^3.1.0
- [camelcase](https://npm.io/package/camelcase.md) ^5.3.1
- [clean-css](https://npm.io/package/clean-css.md) ^4.2.3
- [colorette](https://npm.io/package/colorette.md) ^1.2.2
- [commander](https://npm.io/package/commander.md) ^2.20.3
- [commondir](https://npm.io/package/commondir.md) ^1.0.1
- [dns-equal](https://npm.io/package/dns-equal.md) ^1.0.0
- [duplexify](https://npm.io/package/duplexify.md) ^3.7.1
- [encodeurl](https://npm.io/package/encodeurl.md) ^1.0.2
- [esrecurse](https://npm.io/package/esrecurse.md) ^4.2.1
- [fast-diff](https://npm.io/package/fast-diff.md) ^1.2.0
- [forwarded](https://npm.io/package/forwarded.md) ^0.1.2
- [get-value](https://npm.io/package/get-value.md) ^2.0.6
- [has-value](https://npm.io/package/has-value.md) ^1.0.0
- [hash-base](https://npm.io/package/hash-base.md) ^3.1.0
- [hmac-drbg](https://npm.io/package/hmac-drbg.md) ^1.0.1
- [interpret](https://npm.io/package/interpret.md) ^1.4.0
- [ipaddr.js](https://npm.io/package/ipaddr.js.md) ^1.9.1
- [is-bigint](https://npm.io/package/is-bigint.md) ^1.0.2
- [is-buffer](https://npm.io/package/is-buffer.md) ^1.1.6
- [is-number](https://npm.io/package/is-number.md) ^3.0.0
- [is-stream](https://npm.io/package/is-stream.md) ^1.1.0
- [is-string](https://npm.io/package/is-string.md) ^1.0.5
- [is-symbol](https://npm.io/package/is-symbol.md) ^1.0.4
- [js-tokens](https://npm.io/package/js-tokens.md) ^3.0.2
- [lru-cache](https://npm.io/package/lru-cache.md) ^6.0.0
- [map-cache](https://npm.io/package/map-cache.md) ^0.2.2
- [map-visit](https://npm.io/package/map-visit.md) ^1.0.0
- [memory-fs](https://npm.io/package/memory-fs.md) ^0.4.1
- [minimatch](https://npm.io/package/minimatch.md) ^3.0.4
- [nanomatch](https://npm.io/package/nanomatch.md) ^1.2.9
- [neo-async](https://npm.io/package/neo-async.md) ^2.6.2
- [object-is](https://npm.io/package/object-is.md) ^1.1.2
- [p-finally](https://npm.io/package/p-finally.md) ^1.0.0
- [path-type](https://npm.io/package/path-type.md) ^3.0.0
- [picomatch](https://npm.io/package/picomatch.md) ^2.2.2
- [regex-not](https://npm.io/package/regex-not.md) ^1.0.2
- [relateurl](https://npm.io/package/relateurl.md) ^0.2.7
- [renderkid](https://npm.io/package/renderkid.md) ^2.0.7
- [ripemd160](https://npm.io/package/ripemd160.md) ^2.0.2
- [run-queue](https://npm.io/package/run-queue.md) ^1.0.3
- [scheduler](https://npm.io/package/scheduler.md) ^0.22.0
- [set-value](https://npm.io/package/set-value.md) ^2.0.1
- [strip-bom](https://npm.io/package/strip-bom.md) ^3.0.0
- [strip-eof](https://npm.io/package/strip-eof.md) ^1.0.0
- [tree-kill](https://npm.io/package/tree-kill.md) ^1.2.2
- [type-fest](https://npm.io/package/type-fest.md) ^0.8.1
- [url-parse](https://npm.io/package/url-parse.md) ^1.5.1
- [watchpack](https://npm.io/package/watchpack.md) ^1.7.5
- [word-wrap](https://npm.io/package/word-wrap.md) ^1.2.3
- [wrap-ansi](https://npm.io/package/wrap-ansi.md) ^5.1.0
- [ajv-errors](https://npm.io/package/ajv-errors.md) ^1.0.1
- [ansi-regex](https://npm.io/package/ansi-regex.md) ^4.1.0
- [aria-query](https://npm.io/package/aria-query.md) ^4.2.2
- [array-uniq](https://npm.io/package/array-uniq.md) ^1.0.3
- [async-each](https://npm.io/package/async-each.md) ^1.0.1
- [buffer-xor](https://npm.io/package/buffer-xor.md) ^1.0.3
- [cache-base](https://npm.io/package/cache-base.md) ^1.0.1
- [camel-case](https://npm.io/package/camel-case.md) ^4.1.2
- [color-name](https://npm.io/package/color-name.md) ^1.1.3
- [concat-map](https://npm.io/package/concat-map.md) ^0.0.1
- [decamelize](https://npm.io/package/decamelize.md) ^1.2.0
- [deep-equal](https://npm.io/package/deep-equal.md) ^1.1.1
- [dns-packet](https://npm.io/package/dns-packet.md) ^1.3.4
- [estraverse](https://npm.io/package/estraverse.md) ^4.2.0
- [filenamify](https://npm.io/package/filenamify.md) ^4.3.0
- [fill-range](https://npm.io/package/fill-range.md) ^4.0.0
- [flat-cache](https://npm.io/package/flat-cache.md) ^3.0.4
- [get-stream](https://npm.io/package/get-stream.md) ^4.1.0
- [has-values](https://npm.io/package/has-values.md) ^1.0.0
- [http-proxy](https://npm.io/package/http-proxy.md) ^1.18.1
- [icss-utils](https://npm.io/package/icss-utils.md) ^4.1.1
- [is-extglob](https://npm.io/package/is-extglob.md) ^2.1.1
- [is-windows](https://npm.io/package/is-windows.md) ^1.0.2
- [lower-case](https://npm.io/package/lower-case.md) ^2.0.2
- [micromatch](https://npm.io/package/micromatch.md) ^3.1.10
- [mime-types](https://npm.io/package/mime-types.md) ^2.1.27
- [mixin-deep](https://npm.io/package/mixin-deep.md) ^1.3.2
- [negotiator](https://npm.io/package/negotiator.md) ^0.6.2
- [node-forge](https://npm.io/package/node-forge.md) ^0.10.0
- [on-headers](https://npm.io/package/on-headers.md) ^1.0.2
- [optionator](https://npm.io/package/optionator.md) ^0.9.1
- [param-case](https://npm.io/package/param-case.md) ^3.0.4
- [parse-asn1](https://npm.io/package/parse-asn1.md) ^5.1.6
- [parse-json](https://npm.io/package/parse-json.md) ^4.0.0
- [pascalcase](https://npm.io/package/pascalcase.md) ^0.1.1
- [path-parse](https://npm.io/package/path-parse.md) ^1.0.7
- [portfinder](https://npm.io/package/portfinder.md) ^1.0.26
- [prelude-ls](https://npm.io/package/prelude-ls.md) ^1.2.1
- [prop-types](https://npm.io/package/prop-types.md) ^15.7.2
- [proxy-addr](https://npm.io/package/proxy-addr.md) ^2.0.6
- [randomfill](https://npm.io/package/randomfill.md) ^1.0.4
- [regenerate](https://npm.io/package/regenerate.md) ^1.4.0
- [safe-regex](https://npm.io/package/safe-regex.md) ^1.1.0
- [selfsigned](https://npm.io/package/selfsigned.md) ^1.10.11
- [slice-ansi](https://npm.io/package/slice-ansi.md) ^4.0.0
- [snapdragon](https://npm.io/package/snapdragon.md) ^0.8.2
- [source-map](https://npm.io/package/source-map.md) ^0.5.7
- [sprintf-js](https://npm.io/package/sprintf-js.md) ^1.0.3
- [strip-ansi](https://npm.io/package/strip-ansi.md) ^3.0.1
- [text-table](https://npm.io/package/text-table.md) ^0.2.0
- [type-check](https://npm.io/package/type-check.md) ^0.4.0
- [typedarray](https://npm.io/package/typedarray.md) ^0.0.6
- [ansi-colors](https://npm.io/package/ansi-colors.md) ^3.2.4
- [ansi-styles](https://npm.io/package/ansi-styles.md) ^3.2.1
- [arr-flatten](https://npm.io/package/arr-flatten.md) ^1.1.0
- [array-union](https://npm.io/package/array-union.md) ^1.0.2
- [body-parser](https://npm.io/package/body-parser.md) ^1.19.0
- [buffer-from](https://npm.io/package/buffer-from.md) ^1.1.0
- [cipher-base](https://npm.io/package/cipher-base.md) ^1.0.4
- [class-utils](https://npm.io/package/class-utils.md) ^0.3.6
- [compression](https://npm.io/package/compression.md) ^1.7.4
- [create-ecdh](https://npm.io/package/create-ecdh.md) ^4.0.4
- [create-hash](https://npm.io/package/create-hash.md) ^1.2.0
- [create-hmac](https://npm.io/package/create-hmac.md) ^1.1.7
- [cross-spawn](https://npm.io/package/cross-spawn.md) ^6.0.5
- [detect-file](https://npm.io/package/detect-file.md) ^1.0.0
- [detect-node](https://npm.io/package/detect-node.md) ^2.0.4
- [emoji-regex](https://npm.io/package/emoji-regex.md) ^7.0.3
- [emojis-list](https://npm.io/package/emojis-list.md) ^2.1.0
- [es-abstract](https://npm.io/package/es-abstract.md) ^1.18.3
- [escape-html](https://npm.io/package/escape-html.md) ^1.0.3
- [findup-sync](https://npm.io/package/findup-sync.md) ^3.0.0
- [fs.realpath](https://npm.io/package/fs.realpath.md) ^1.0.0
- [glob-parent](https://npm.io/package/glob-parent.md) ^3.1.0
- [graceful-fs](https://npm.io/package/graceful-fs.md) ^4.1.11
- [has-bigints](https://npm.io/package/has-bigints.md) ^1.0.1
- [has-symbols](https://npm.io/package/has-symbols.md) ^1.0.0
- [http-errors](https://npm.io/package/http-errors.md) ^1.7.2
- [imurmurhash](https://npm.io/package/imurmurhash.md) ^0.1.4
- [infer-owner](https://npm.io/package/infer-owner.md) ^1.0.4
- [internal-ip](https://npm.io/package/internal-ip.md) ^4.3.0
- [is-arrayish](https://npm.io/package/is-arrayish.md) ^0.2.1
- [is-callable](https://npm.io/package/is-callable.md) ^1.2.3
- [is-path-cwd](https://npm.io/package/is-path-cwd.md) ^2.2.0
- [locate-path](https://npm.io/package/locate-path.md) ^2.0.0
- [media-typer](https://npm.io/package/media-typer.md) ^0.3.0
- [mississippi](https://npm.io/package/mississippi.md) ^3.0.0
- [object-copy](https://npm.io/package/object-copy.md) ^0.1.0
- [object-keys](https://npm.io/package/object-keys.md) ^1.0.11
- [object.pick](https://npm.io/package/object.pick.md) ^1.3.0
- [on-finished](https://npm.io/package/on-finished.md) ^2.3.0
- [pascal-case](https://npm.io/package/pascal-case.md) ^3.1.2
- [path-exists](https://npm.io/package/path-exists.md) ^3.0.0
- [querystring](https://npm.io/package/querystring.md) ^0.2.0
- [randombytes](https://npm.io/package/randombytes.md) ^2.1.0
- [read-pkg-up](https://npm.io/package/read-pkg-up.md) ^3.0.0
- [resolve-dir](https://npm.io/package/resolve-dir.md) ^1.0.1
- [resolve-url](https://npm.io/package/resolve-url.md) ^0.2.1
- [safe-buffer](https://npm.io/package/safe-buffer.md) ^5.1.2
- [select-hose](https://npm.io/package/select-hose.md) ^2.0.0
- [serve-index](https://npm.io/package/serve-index.md) ^1.9.1
- [signal-exit](https://npm.io/package/signal-exit.md) ^3.0.2
- [stream-each](https://npm.io/package/stream-each.md) ^1.2.3
- [stream-http](https://npm.io/package/stream-http.md) ^2.8.3
- [strip-outer](https://npm.io/package/strip-outer.md) ^1.0.1
- [union-value](https://npm.io/package/union-value.md) ^1.0.1
- [unique-slug](https://npm.io/package/unique-slug.md) ^2.0.2
- [unset-value](https://npm.io/package/unset-value.md) ^1.0.0
- [utils-merge](https://npm.io/package/utils-merge.md) ^1.0.1
- [webpack-log](https://npm.io/package/webpack-log.md) ^2.0.0
- [worker-farm](https://npm.io/package/worker-farm.md) ^1.7.0
- [ajv-keywords](https://npm.io/package/ajv-keywords.md) ^3.2.0
- [array-unique](https://npm.io/package/array-unique.md) ^0.3.2
- [astral-regex](https://npm.io/package/astral-regex.md) ^2.0.0
- [browserslist](https://npm.io/package/browserslist.md) ^4.16.6
- [caniuse-lite](https://npm.io/package/caniuse-lite.md) ^1.0.30001341
- [compressible](https://npm.io/package/compressible.md) ^2.0.18
- [content-type](https://npm.io/package/content-type.md) ^1.0.4
- [core-js-pure](https://npm.io/package/core-js-pure.md) ^3.13.0
- [core-util-is](https://npm.io/package/core-util-is.md) ^1.0.2
- [eslint-scope](https://npm.io/package/eslint-scope.md) ^5.1.1
- [eslint-utils](https://npm.io/package/eslint-utils.md) ^2.1.0
- [expand-tilde](https://npm.io/package/expand-tilde.md) ^2.0.2
- [finalhandler](https://npm.io/package/finalhandler.md) ^1.1.2
- [handle-thing](https://npm.io/package/handle-thing.md) ^2.0.1
- [import-fresh](https://npm.io/package/import-fresh.md) ^3.3.0
- [import-local](https://npm.io/package/import-local.md) ^2.0.0
- [is-arguments](https://npm.io/package/is-arguments.md) ^1.0.4
- [loader-utils](https://npm.io/package/loader-utils.md) ^1.1.0
- [lodash.merge](https://npm.io/package/lodash.merge.md) ^4.6.2
- [loose-envify](https://npm.io/package/loose-envify.md) ^1.3.1
- [miller-rabin](https://npm.io/package/miller-rabin.md) ^4.0.1
- [npm-run-path](https://npm.io/package/npm-run-path.md) ^2.0.2
- [object-visit](https://npm.io/package/object-visit.md) ^1.0.1
- [parse-passwd](https://npm.io/package/parse-passwd.md) ^1.0.0
- [path-dirname](https://npm.io/package/path-dirname.md) ^1.0.2
- [pretty-error](https://npm.io/package/pretty-error.md) ^2.1.2
- [range-parser](https://npm.io/package/range-parser.md) ^1.2.1
- [regexpu-core](https://npm.io/package/regexpu-core.md) ^4.7.1
- [resolve-from](https://npm.io/package/resolve-from.md) ^4.0.0
- [safer-buffer](https://npm.io/package/safer-buffer.md) ^2.1.2
- [schema-utils](https://npm.io/package/schema-utils.md) ^0.4.5
- [serve-static](https://npm.io/package/serve-static.md) ^1.14.1
- [set-blocking](https://npm.io/package/set-blocking.md) ^2.0.0
- [setimmediate](https://npm.io/package/setimmediate.md) ^1.0.5
- [side-channel](https://npm.io/package/side-channel.md) ^1.0.4
- [spdx-correct](https://npm.io/package/spdx-correct.md) ^3.0.0
- [split-string](https://npm.io/package/split-string.md) ^3.1.0
- [stream-shift](https://npm.io/package/stream-shift.md) ^1.0.1
- [string-width](https://npm.io/package/string-width.md) ^4.2.2
- [toidentifier](https://npm.io/package/toidentifier.md) ^1.0.0
- [universalify](https://npm.io/package/universalify.md) ^0.1.2
- [which-module](https://npm.io/package/which-module.md) ^2.0.0
- [array-flatten](https://npm.io/package/array-flatten.md) ^1.1.1
- [async-limiter](https://npm.io/package/async-limiter.md) ^1.0.1
- [color-convert](https://npm.io/package/color-convert.md) ^1.9.1
- [concat-stream](https://npm.io/package/concat-stream.md) ^1.6.2
- [dom-converter](https://npm.io/package/dom-converter.md) ^0.2.0
- [end-of-stream](https://npm.io/package/end-of-stream.md) ^1.4.1
- [figgy-pudding](https://npm.io/package/figgy-pudding.md) ^3.5.2
- [function-bind](https://npm.io/package/function-bind.md) ^1.1.1
- [get-intrinsic](https://npm.io/package/get-intrinsic.md) ^1.1.1
- [global-prefix](https://npm.io/package/global-prefix.md) ^1.0.2
- [html-entities](https://npm.io/package/html-entities.md) ^1.3.1
- [http-deceiver](https://npm.io/package/http-deceiver.md) ^1.2.7
- [internal-slot](https://npm.io/package/internal-slot.md) ^1.0.3
- [is-descriptor](https://npm.io/package/is-descriptor.md) ^0.1.6
- [is-extendable](https://npm.io/package/is-extendable.md) ^0.1.1
- [jsx-ast-utils](https://npm.io/package/jsx-ast-utils.md) ^3.2.0
- [language-tags](https://npm.io/package/language-tags.md) ^1.0.5
- [loader-runner](https://npm.io/package/loader-runner.md) ^2.4.0
- [multicast-dns](https://npm.io/package/multicast-dns.md) ^6.2.3
- [node-releases](https://npm.io/package/node-releases.md) ^1.1.72
- [object-assign](https://npm.io/package/object-assign.md) ^4.1.1
- [object.assign](https://npm.io/package/object.assign.md) ^4.1.0
- [object.values](https://npm.io/package/object.values.md) ^1.1.4
- [os-browserify](https://npm.io/package/os-browserify.md) ^0.3.0
- [parent-module](https://npm.io/package/parent-module.md) ^1.0.1
- [repeat-string](https://npm.io/package/repeat-string.md) ^1.6.1
- [requires-port](https://npm.io/package/requires-port.md) ^1.0.0
- [shebang-regex](https://npm.io/package/shebang-regex.md) ^1.0.0
- [spawn-command](https://npm.io/package/spawn-command.md) ^0.0.2-1
- [static-extend](https://npm.io/package/static-extend.md) ^0.1.2
- [trim-repeated](https://npm.io/package/trim-repeated.md) ^1.0.0
- [vm-browserify](https://npm.io/package/vm-browserify.md) ^1.1.2
- [array-includes](https://npm.io/package/array-includes.md) ^3.1.3
- [assign-symbols](https://npm.io/package/assign-symbols.md) ^1.0.0
- [ast-types-flow](https://npm.io/package/ast-types-flow.md) ^0.0.7
- [axobject-query](https://npm.io/package/axobject-query.md) ^2.2.0
- [browserify-aes](https://npm.io/package/browserify-aes.md) ^1.2.0
- [browserify-des](https://npm.io/package/browserify-des.md) ^1.0.2
- [browserify-rsa](https://npm.io/package/browserify-rsa.md) ^4.1.0
- [buffer-indexof](https://npm.io/package/buffer-indexof.md) ^1.1.1
- [core-js-compat](https://npm.io/package/core-js-compat.md) ^3.13.0
- [diffie-hellman](https://npm.io/package/diffie-hellman.md) ^5.0.3
- [domain-browser](https://npm.io/package/domain-browser.md) ^1.2.0
- [evp_bytestokey](https://npm.io/package/evp_bytestokey.md) ^1.0.3
- [extend-shallow](https://npm.io/package/extend-shallow.md) ^3.0.2
- [faye-websocket](https://npm.io/package/faye-websocket.md) ^0.11.3
- [find-cache-dir](https://npm.io/package/find-cache-dir.md) ^3.3.1
- [fragment-cache](https://npm.io/package/fragment-cache.md) ^0.2.1
- [global-modules](https://npm.io/package/global-modules.md) ^1.0.0
- [http-parser-js](https://npm.io/package/http-parser-js.md) ^0.5.2
- [is-binary-path](https://npm.io/package/is-binary-path.md) ^1.0.1
- [is-core-module](https://npm.io/package/is-core-module.md) ^2.4.0
- [is-date-object](https://npm.io/package/is-date-object.md) ^1.0.1
- [is-path-in-cwd](https://npm.io/package/is-path-in-cwd.md) ^2.1.0
- [is-path-inside](https://npm.io/package/is-path-inside.md) ^2.1.0
- [load-json-file](https://npm.io/package/load-json-file.md) ^4.0.0
- [normalize-path](https://npm.io/package/normalize-path.md) ^2.1.1
- [object-inspect](https://npm.io/package/object-inspect.md) ^1.8.0
- [object.entries](https://npm.io/package/object.entries.md) ^1.1.4
- [path-is-inside](https://npm.io/package/path-is-inside.md) ^1.0.2
- [path-to-regexp](https://npm.io/package/path-to-regexp.md) ^0.1.7
- [pinkie-promise](https://npm.io/package/pinkie-promise.md) ^2.0.1
- [public-encrypt](https://npm.io/package/public-encrypt.md) ^4.0.3
- [querystringify](https://npm.io/package/querystringify.md) ^2.1.1
- [repeat-element](https://npm.io/package/repeat-element.md) ^1.1.2
- [setprototypeof](https://npm.io/package/setprototypeof.md) ^1.1.1
- [source-map-url](https://npm.io/package/source-map-url.md) ^0.4.0
- [spdy-transport](https://npm.io/package/spdy-transport.md) ^3.0.0
- [string_decoder](https://npm.io/package/string_decoder.md) ^1.1.1
- [supports-color](https://npm.io/package/supports-color.md) ^5.4.0
- [to-arraybuffer](https://npm.io/package/to-arraybuffer.md) ^1.0.1
- [to-object-path](https://npm.io/package/to-object-path.md) ^0.3.0
- [to-regex-range](https://npm.io/package/to-regex-range.md) ^2.1.1
- [tsconfig-paths](https://npm.io/package/tsconfig-paths.md) ^3.9.0
- [tty-browserify](https://npm.io/package/tty-browserify.md) ^0.0.0
- [util-deprecate](https://npm.io/package/util-deprecate.md) ^1.0.2
- [util.promisify](https://npm.io/package/util.promisify.md) ^1.0.0
- [brace-expansion](https://npm.io/package/brace-expansion.md) ^1.1.11
- [browserify-sign](https://npm.io/package/browserify-sign.md) ^4.2.1
- [browserify-zlib](https://npm.io/package/browserify-zlib.md) ^0.2.0
- [copy-descriptor](https://npm.io/package/copy-descriptor.md) ^0.1.1
- [default-gateway](https://npm.io/package/default-gateway.md) ^4.2.0
- [define-property](https://npm.io/package/define-property.md) ^2.0.2
- [email-addresses](https://npm.io/package/email-addresses.md) ^3.1.0
- [es-to-primitive](https://npm.io/package/es-to-primitive.md) ^1.2.1
- [fast-deep-equal](https://npm.io/package/fast-deep-equal.md) ^2.0.1
- [get-caller-file](https://npm.io/package/get-caller-file.md) ^2.0.5
- [hosted-git-info](https://npm.io/package/hosted-git-info.md) ^2.8.9
- [is-absolute-url](https://npm.io/package/is-absolute-url.md) ^3.0.3
- [is-plain-object](https://npm.io/package/is-plain-object.md) ^2.0.4
- [lodash.debounce](https://npm.io/package/lodash.debounce.md) ^4.0.8
- [lodash.truncate](https://npm.io/package/lodash.truncate.md) ^4.4.2
- [natural-compare](https://npm.io/package/natural-compare.md) ^1.4.0
- [path-browserify](https://npm.io/package/path-browserify.md) ^0.0.1
- [querystring-es3](https://npm.io/package/querystring-es3.md) ^0.2.1
- [readable-stream](https://npm.io/package/readable-stream.md) ^2.3.6
- [shebang-command](https://npm.io/package/shebang-command.md) ^1.2.0
- [snapdragon-node](https://npm.io/package/snapdragon-node.md) ^2.1.1
- [snapdragon-util](https://npm.io/package/snapdragon-util.md) ^3.0.1
- [source-list-map](https://npm.io/package/source-list-map.md) ^2.0.1
- [spdx-exceptions](https://npm.io/package/spdx-exceptions.md) ^2.1.0
- [unbox-primitive](https://npm.io/package/unbox-primitive.md) ^1.0.1
- [unique-filename](https://npm.io/package/unique-filename.md) ^1.1.1
- [webpack-sources](https://npm.io/package/webpack-sources.md) ^1.4.3
- [collection-visit](https://npm.io/package/collection-visit.md) ^1.0.0
- [cookie-signature](https://npm.io/package/cookie-signature.md) ^1.0.6
- [enhanced-resolve](https://npm.io/package/enhanced-resolve.md) ^4.5.0
- [fast-levenshtein](https://npm.io/package/fast-levenshtein.md) ^2.0.6
- [file-entry-cache](https://npm.io/package/file-entry-cache.md) ^6.0.1
- [file-uri-to-path](https://npm.io/package/file-uri-to-path.md) ^1.0.0
- [follow-redirects](https://npm.io/package/follow-redirects.md) ^1.5.10
- [homedir-polyfill](https://npm.io/package/homedir-polyfill.md) ^1.0.3
- [https-browserify](https://npm.io/package/https-browserify.md) ^1.0.0
- [is-negative-zero](https://npm.io/package/is-negative-zero.md) ^2.0.1
- [is-number-object](https://npm.io/package/is-number-object.md) ^1.0.5
- [lodash.clonedeep](https://npm.io/package/lodash.clonedeep.md) ^4.5.0
- [path-is-absolute](https://npm.io/package/path-is-absolute.md) ^1.0.1
- [promise-inflight](https://npm.io/package/promise-inflight.md) ^1.0.1
- [spdx-license-ids](https://npm.io/package/spdx-license-ids.md) ^3.0.0
- [v8-compile-cache](https://npm.io/package/v8-compile-cache.md) ^2.3.0
- [websocket-driver](https://npm.io/package/websocket-driver.md) ^0.7.4
- [binary-extensions](https://npm.io/package/binary-extensions.md) ^1.11.0
- [browserify-cipher](https://npm.io/package/browserify-cipher.md) ^1.0.1
- [component-emitter](https://npm.io/package/component-emitter.md) ^1.2.1
- [copy-concurrently](https://npm.io/package/copy-concurrently.md) ^1.0.5
- [crypto-browserify](https://npm.io/package/crypto-browserify.md) ^3.12.0
- [define-properties](https://npm.io/package/define-properties.md) ^1.1.2
- [is-boolean-object](https://npm.io/package/is-boolean-object.md) ^1.1.1
- [lines-and-columns](https://npm.io/package/lines-and-columns.md) ^1.1.6
- [merge-descriptors](https://npm.io/package/merge-descriptors.md) ^1.0.1
- [move-concurrently](https://npm.io/package/move-concurrently.md) ^1.0.1
- [node-libs-browser](https://npm.io/package/node-libs-browser.md) ^2.2.1
- [require-directory](https://npm.io/package/require-directory.md) ^2.1.1
- [stream-browserify](https://npm.io/package/stream-browserify.md) ^2.0.2
- [timers-browserify](https://npm.io/package/timers-browserify.md) ^2.0.12
- [chrome-trace-event](https://npm.io/package/chrome-trace-event.md) ^1.0.3
- [console-browserify](https://npm.io/package/console-browserify.md) ^1.2.0
- [convert-source-map](https://npm.io/package/convert-source-map.md) ^1.7.0
- [flush-write-stream](https://npm.io/package/flush-write-stream.md) ^1.1.1
- [is-data-descriptor](https://npm.io/package/is-data-descriptor.md) ^0.1.4
- [object.fromentries](https://npm.io/package/object.fromentries.md) ^2.0.4
- [parallel-transform](https://npm.io/package/parallel-transform.md) ^1.2.0
- [source-map-resolve](https://npm.io/package/source-map-resolve.md) ^0.5.2
- [to-fast-properties](https://npm.io/package/to-fast-properties.md) ^2.0.0
- [content-disposition](https://npm.io/package/content-disposition.md) ^0.5.3
- [damerau-levenshtein](https://npm.io/package/damerau-levenshtein.md) ^1.0.7
- [eslint-module-utils](https://npm.io/package/eslint-module-utils.md) ^2.6.1
- [eslint-visitor-keys](https://npm.io/package/eslint-visitor-keys.md) ^2.1.0
- [minimalistic-assert](https://npm.io/package/minimalistic-assert.md) ^1.0.1
- [regenerator-runtime](https://npm.io/package/regenerator-runtime.md) ^0.13.7
- [require-from-string](https://npm.io/package/require-from-string.md) ^2.0.2
- [strip-json-comments](https://npm.io/package/strip-json-comments.md) ^3.1.1
- [watchpack-chokidar2](https://npm.io/package/watchpack-chokidar2.md) ^2.0.1
- [array.prototype.flat](https://npm.io/package/array.prototype.flat.md) ^1.2.4
- [builtin-status-codes](https://npm.io/package/builtin-status-codes.md) ^3.0.0
- [constants-browserify](https://npm.io/package/constants-browserify.md) ^1.0.0
- [decode-uri-component](https://npm.io/package/decode-uri-component.md) ^0.2.0
- [escape-string-regexp](https://npm.io/package/escape-string-regexp.md) ^1.0.5
- [fs-readdir-recursive](https://npm.io/package/fs-readdir-recursive.md) ^1.1.0
- [html-minifier-terser](https://npm.io/package/html-minifier-terser.md) ^5.1.1
- [json-schema-traverse](https://npm.io/package/json-schema-traverse.md) ^0.3.1
- [postcss-value-parser](https://npm.io/package/postcss-value-parser.md) ^4.1.0
- [process-nextick-args](https://npm.io/package/process-nextick-args.md) ^2.0.0
- [serialize-javascript](https://npm.io/package/serialize-javascript.md) ^4.0.0
- [websocket-extensions](https://npm.io/package/websocket-extensions.md) ^0.1.4
- [http-proxy-middleware](https://npm.io/package/http-proxy-middleware.md) ^0.19.1
- [postcss-modules-scope](https://npm.io/package/postcss-modules-scope.md) ^2.2.0
- [regenerator-transform](https://npm.io/package/regenerator-transform.md) ^0.14.5
- [require-main-filename](https://npm.io/package/require-main-filename.md) ^2.0.0
- [spdx-expression-parse](https://npm.io/package/spdx-expression-parse.md) ^3.0.0
- [terser-webpack-plugin](https://npm.io/package/terser-webpack-plugin.md) ^1.4.5
- [which-boxed-primitive](https://npm.io/package/which-boxed-primitive.md) ^1.0.2
- [fs-write-stream-atomic](https://npm.io/package/fs-write-stream-atomic.md) ^1.0.10
- [is-accessor-descriptor](https://npm.io/package/is-accessor-descriptor.md) ^0.1.6
- [normalize-package-data](https://npm.io/package/normalize-package-data.md) ^2.5.0
- [postcss-modules-values](https://npm.io/package/postcss-modules-values.md) ^3.0.0
- [regexp.prototype.flags](https://npm.io/package/regexp.prototype.flags.md) ^1.3.0
- [webpack-dev-middleware](https://npm.io/package/webpack-dev-middleware.md) ^3.7.2
- [array.prototype.flatmap](https://npm.io/package/array.prototype.flatmap.md) ^1.2.4
- [filename-reserved-regex](https://npm.io/package/filename-reserved-regex.md) ^2.0.0
- [is-fullwidth-code-point](https://npm.io/package/is-fullwidth-code-point.md) ^2.0.0
- [posix-character-classes](https://npm.io/package/posix-character-classes.md) ^0.1.1
- [postcss-selector-parser](https://npm.io/package/postcss-selector-parser.md) ^6.0.6
- [prettier-linter-helpers](https://npm.io/package/prettier-linter-helpers.md) ^1.0.0
- [json-parse-better-errors](https://npm.io/package/json-parse-better-errors.md) ^1.0.2
- [language-subtag-registry](https://npm.io/package/language-subtag-registry.md) ^0.3.21
- [string.prototype.trimend](https://npm.io/package/string.prototype.trimend.md) ^1.0.1
- [functional-red-black-tree](https://npm.io/package/functional-red-black-tree.md) ^1.0.1
- [minimalistic-crypto-utils](https://npm.io/package/minimalistic-crypto-utils.md) ^1.0.1
- [remove-trailing-separator](https://npm.io/package/remove-trailing-separator.md) ^1.1.0
- [string.prototype.matchall](https://npm.io/package/string.prototype.matchall.md) ^4.0.5
- [fast-json-stable-stringify](https://npm.io/package/fast-json-stable-stringify.md) ^2.0.0
- [string.prototype.trimstart](https://npm.io/package/string.prototype.trimstart.md) ^1.0.1
- [eslint-import-resolver-node](https://npm.io/package/eslint-import-resolver-node.md) ^0.3.4
- [multicast-dns-service-types](https://npm.io/package/multicast-dns-service-types.md) ^1.1.0
- [connect-history-api-fallback](https://npm.io/package/connect-history-api-fallback.md) ^1.6.0
- [validate-npm-package-license](https://npm.io/package/validate-npm-package-license.md) ^3.0.3
- [babel-plugin-polyfill-corejs2](https://npm.io/package/babel-plugin-polyfill-corejs2.md) ^0.2.2
- [babel-plugin-polyfill-corejs3](https://npm.io/package/babel-plugin-polyfill-corejs3.md) ^0.2.2
- [json-parse-even-better-errors](https://npm.io/package/json-parse-even-better-errors.md) ^2.3.1
- [regenerate-unicode-properties](https://npm.io/package/regenerate-unicode-properties.md) ^8.2.0
- [postcss-modules-extract-imports](https://npm.io/package/postcss-modules-extract-imports.md) ^2.0.0
- [babel-plugin-dynamic-import-node](https://npm.io/package/babel-plugin-dynamic-import-node.md) ^2.3.3
- [object.getownpropertydescriptors](https://npm.io/package/object.getownpropertydescriptors.md) ^2.1.2
- [postcss-modules-local-by-default](https://npm.io/package/postcss-modules-local-by-default.md) ^3.0.3
- [babel-plugin-polyfill-regenerator](https://npm.io/package/babel-plugin-polyfill-regenerator.md) ^0.2.2
- [unicode-match-property-ecmascript](https://npm.io/package/unicode-match-property-ecmascript.md) ^1.0.4
- [unicode-property-aliases-ecmascript](https://npm.io/package/unicode-property-aliases-ecmascript.md) ^1.1.0
- [json-stable-stringify-without-jsonify](https://npm.io/package/json-stable-stringify-without-jsonify.md) ^1.0.1
- [unicode-match-property-value-ecmascript](https://npm.io/package/unicode-match-property-value-ecmascript.md) ^1.2.0
- [unicode-canonical-property-names-ecmascript](https://npm.io/package/unicode-canonical-property-names-ecmascript.md) ^1.0.4

## Alternatives

- [flatbuffers](https://npm.io/package/flatbuffers.md) — 6.0M weekly downloads
- [jwt-simple](https://npm.io/package/jwt-simple.md) — 259.5K weekly downloads
- [@exodus/patch-broken-hermes-typed-arrays](https://npm.io/package/@exodus/patch-broken-hermes-typed-arrays.md) — 28.5K weekly downloads
- [@native-to-anchor/buffer-layout](https://npm.io/package/@native-to-anchor/buffer-layout.md) — 12.2K weekly downloads
- [binary-parser-encoder](https://npm.io/package/binary-parser-encoder.md) — 5.3K weekly downloads

## Recent versions

- 2.4.1 (latest) — 2022-06-01
- 2.4.0 — 2022-06-01

## README

# react-otp-input

[![npm version](https://badge.fury.io/js/react-otp-input.svg)](https://badge.fury.io/js/react-otp-input) [![npm](https://img.shields.io/npm/dw/react-otp-input.svg?logo=npm)](https://www.npmjs.com/package/react-otp-input) [![npm](https://img.shields.io/bundlephobia/minzip/react-otp-input)](https://www.npmjs.com/package/react-otp-input)
[![All Contributors](https://img.shields.io/badge/all_contributors-7-orange.svg?style=flat-square)](#contributors-)

<!-- ALL-CONTRIBUTORS-BADGE:END -->

A fully customizable, one-time password input component for the web built with React.

![see here](https://media.giphy.com/media/lN98dFU6h3oP0wWS5x/giphy.gif)

[Live Demo](https://devfolioco.github.io/react-otp-input)

[CodeSandbox](https://codesandbox.io/s/react-otp-input-demo-v2-1iy52)

## Installation

[![NPM](https://nodei.co/npm/react-otp-input.png?compact=true)](https://nodei.co/npm/react-otp-input/)

#### To install the latest stable version:

```
npm install --save react-otp-input
```

#### Basic usage:

```jsx
import React, { Component } from 'react';
import OtpInput from 'react-otp-input';

export default class App extends Component {
  state = { otp: '' };

  handleChange = (otp) => this.setState({ otp });

  render() {
    return (
      <OtpInput
        value={this.state.otp}
        onChange={this.handleChange}
        numInputs={6}
        separator={<span>-</span>}
      />
    );
  }
}
```

## API

<table>
  <tr>
    <th>Name<br/></th>
    <th>Type</th>
    <th>Required</th>
    <th>Default</th>
    <th>Description</th>
  </tr>
  <tr>
    <td>numInputs</td>
    <td>number</td>
    <td>true</td>
    <td>4</td>
    <td>Number of OTP inputs to be rendered.</td>
  </tr>
  <tr>
    <td>onChange</td>
    <td>function</td>
    <td>true</td>
    <td>console.log</td>
    <td>Returns OTP code typed in inputs.</td>
  </tr>
  <tr>
    <td>value</td>
    <td>string / number</td>
    <td>true</td>
    <td>''</td>
    <td>The value of the OTP passed into the component.</td>
  </tr>
    <tr>
     <td>placeholder</td>
     <td>string</td>
     <td>false</td>
     <td>none</td>
     <td>Specify an expected value of each input. The length of this string should be equal to <code>numInputs</code>.</td>
   </tr>
  <tr>
    <td>separator</td>
    <td>component<br/></td>
    <td>false</td>
    <td>none</td>
    <td>Provide a custom separator between inputs by passing a component. For instance, <code>&lt;span&gt;-&lt;/span&gt;</code> would add <code>-</code> between each input.</td>
  </tr>
  <tr>
    <td>containerStyle</td>
    <td>style (object) / className (string)</td>
    <td>false</td>
    <td>none</td>
    <td>Style applied or class passed to container of inputs.</td>
  </tr>
  <tr>
    <td>inputStyle</td>
    <td>style (object) / className (string)</td>
    <td>false</td>
    <td>none</td>
    <td>Style applied or class passed to each input.</td>
  </tr>
  <tr>
    <td>focusStyle</td>
    <td>style (object) / className (string)</td>
    <td>false</td>
    <td>none</td>
    <td>Style applied or class passed to inputs on focus.</td>
  </tr>
  <tr>
    <td>isDisabled</td>
    <td>boolean</td>
    <td>false</td>
    <td>false</td>
    <td>Disables all the inputs.</td>
  </tr>
  <tr>
    <td>disabledStyle</td>
    <td>style (object) / className (string)</td>
    <td>false</td>
    <td>none</td>
    <td>Style applied or class passed to each input when disabled.</td>
  </tr>
  <tr>
    <td>hasErrored</td>
    <td>boolean</td>
    <td>false</td>
    <td>false</td>
    <td>Indicates there is an error in the inputs.</td>
  </tr>
  <tr>
    <td>errorStyle</td>
    <td>style (object) / className (string)</td>
    <td>false</td>
    <td>none</td>
    <td>Style applied or class passed to each input when errored.</td>
  </tr>
  <tr>
    <td>shouldAutoFocus</td>
    <td>boolean</td>
    <td>false</td>
    <td>false</td>
    <td>Auto focuses input on initial page load.</td>
  </tr>
  <tr>
    <td>isInputNum</td>
    <td>boolean</td>
    <td>false</td>
    <td>false</td>
    <td>Restrict input to only numbers.</td>
  </tr>
  <tr>
    <td>isInputSecure</td>
    <td>boolean</td>
    <td>false</td>
    <td>false</td>
    <td>Masks input characters.</td>
  </tr>
  <tr>
    <td>data-cy</td>
    <td>string</td>
    <td>false</td>
    <td>-</td>
    <td>Test attribute passed to the inputs.</td>
  </tr>
  <tr>
    <td>data-testid</td>
    <td>string</td>
    <td>false</td>
    <td>-</td>
    <td>Test attribute passed to the inputs.</td>
  </tr>
</table>

## Breaking changes when porting to v1.0.0

`react-otp-input` is now a controlled component to facilitate functionalities that weren't possible before from the application using it, such as clearing or pre-assigning values. For `v1.0.0` and above, a `value` prop needs to be passed in the component for it to function as expected.

## Development

#### To run the development server:

```
npm run dev
```

## Checklist

[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat&logo=github)](https://github.com/devfolioco/react-otp-input/pulls) [![Open Source Love](https://badges.frapsoft.com/os/v2/open-source.svg?v=103)](https://github.com/devfolioco/react-otp-input)

- [x] Add flowtypes
- [x] Add ESLint, Prettier for code quality
- [x] Add styling support for states including focus/disabled
- [ ] Write tests

## Contributing

[![GitHub issues](https://img.shields.io/github/issues-raw/devfolioco/react-otp-input?logo=github)](https://github.com/devfolioco/react-otp-input/issues) [![GitHub pull requests](https://img.shields.io/github/issues-pr/devfolioco/react-otp-input?logo=git)](https://github.com/devfolioco/react-otp-input/pulls)

Feel free to open [issues](https://github.com/devfolioco/react-otp-input/issues/new/choose) and [pull requests](https://github.com/devfolioco/react-otp-input/pulls)!

## License

[![NPM](https://img.shields.io/npm/l/react-otp-input)](https://github.com/devfolioco/react-otp-input/blob/master/LICENSE)

## Contributors ✨

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
<table>
  <tr>
    <td align="center"><a href="https://github.com/apollonian"><img src="https://avatars2.githubusercontent.com/u/2150306?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Abhishek Warokar</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/commits?author=apollonian" title="Code">💻</a> <a href="#design-apollonian" title="Design">🎨</a> <a href="#maintenance-apollonian" title="Maintenance">🚧</a> <a href="#ideas-apollonian" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/devfolioco/react-otp-input/pulls?q=is%3Apr+reviewed-by%3Aapollonian" title="Reviewed Pull Requests">👀</a></td>
    <td align="center"><a href="https://ajayns.me"><img src="https://avatars0.githubusercontent.com/u/20743219?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Aj</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/commits?author=ajayns" title="Code">💻</a> <a href="#design-ajayns" title="Design">🎨</a> <a href="#ideas-ajayns" title="Ideas, Planning, & Feedback">🤔</a></td>
    <td align="center"><a href="http://aromalanil.me"><img src="https://avatars1.githubusercontent.com/u/49222186?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Aromal Anil</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/commits?author=aromalanil" title="Code">💻</a> <a href="#tool-aromalanil" title="Tools">🔧</a></td>
    <td align="center"><a href="https://borntofrappe.github.io"><img src="https://avatars0.githubusercontent.com/u/33316703?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Gabriele Corti</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/commits?author=borntofrappe" title="Code">💻</a> <a href="#a11y-borntofrappe" title="Accessibility">️️️️♿️</a></td>
    <td align="center"><a href="https://www.anoopms.me"><img src="https://avatars1.githubusercontent.com/u/46913894?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Anoop</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/commits?author=anoopmsivadas" title="Code">💻</a></td>
    <td align="center"><a href="http://dewanshrawat.xyz"><img src="https://avatars0.githubusercontent.com/u/17003127?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Dewansh Rawat</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/issues?q=author%3Adewanshrawat15" title="Bug reports">🐛</a></td>
    <td align="center"><a href="http://ishanchhabra.com"><img src="https://avatars3.githubusercontent.com/u/32290367?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Ishan Chhabra</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/commits?author=ishan-chhabra" title="Code">💻</a></td>
  </tr>
  <tr>
    <td align="center"><a href="http://www.causztic.com"><img src="https://avatars.githubusercontent.com/u/2081441?v=4?s=100" width="100px;" alt=""/><br /><sub><b>yaojie</b></sub></a><br /><a href="https://github.com/devfolioco/react-otp-input/commits?author=causztic" title="Code">💻</a></td>
  </tr>
</table>

<!-- markdownlint-restore -->
<!-- prettier-ignore-end -->

<!-- ALL-CONTRIBUTORS-LIST:END -->

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

---
_Source: https://npm.io/package/@beldore/react-otp-input · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._