InputOTP

One-time password input component. Built with input-otp.

Installation

# Install @opencosmos/ui to use InputOTP
pnpm add @opencosmos/ui

Preview

Loading preview...

Customize

maxLength— Maximum number of characters

Usage

Import

import { InputOTP } from '@opencosmos/ui';

Example

<InputOTP>
  Content
</InputOTP>

Eject

Copy this component into your project for full customization

API Reference

Prop	Type	Default	Description
maxLength	text	"6"	Maximum number of characters

Code Examples

Basic Usage

6-digit OTP input

import { InputOTP, InputOTPGroup, InputOTPSlot } from "@opencosmos/ui"

<InputOTP maxLength={6}>
  <InputOTPGroup>
    <InputOTPSlot index={0} />
    <InputOTPSlot index={1} />
    <InputOTPSlot index={2} />
    <InputOTPSlot index={3} />
    <InputOTPSlot index={4} />
    <InputOTPSlot index={5} />
  </InputOTPGroup>
</InputOTP>