BetaPublic beta — Read the release notes
Solidiom
Get Started
Documentation

Input OTP

A one-time password input with individual character slots.

Package
@solidiom/input-otp
Version
0.0.1-next.0
Status
stable

Generated from the package's public source.

API

Groupcomponent

                        Group(props: InputOTPGroupProps): Element

Props

class?
string
style?
string | CSSProperties

children: Element

View source

InputOTPGroupPropsinterface

Props

class?
string
style?
string | CSSProperties

children: Element

View source

InputOTPRootPropsinterface

Props

class?
string
defaultValue?
string — Default value (uncontrolled).
disabled?
boolean — Whether the input is disabled.
maxLength
number — Total number of characters.
onComplete?
(value: string) => void — Called when all slots are filled.
onValueChange?
(value: string) => void — Called when value changes.
pattern?
string — Regex pattern for allowed characters (e.g. "^[0-9]*$").
style?
string | CSSProperties
value?
Accessor<string | undefined> — Controlled value.

children: Element

View source

InputOTPSlotPropsinterface

Props

class?
string
index
number — Zero-based index of this slot.
style?
string | CSSProperties

View source

Rootcomponent

                        Root(props: InputOTPRootProps): Element

Props

class?
string
defaultValue?
string — Default value (uncontrolled).
disabled?
boolean — Whether the input is disabled.
maxLength
number — Total number of characters.
onComplete?
(value: string) => void — Called when all slots are filled.
onValueChange?
(value: string) => void — Called when value changes.
pattern?
string — Regex pattern for allowed characters (e.g. "^[0-9]*$").
style?
string | CSSProperties
value?
Accessor<string | undefined> — Controlled value.

children: Element

View source

Slotcomponent

                        Slot(props: InputOTPSlotProps): Element

Props

class?
string
index
number — Zero-based index of this slot.
style?
string | CSSProperties

View source