PinInput
Multi-cell PIN or one-time-code entry.
Use PinInput for a named fixed-length PIN or one-time code that must participate in native form submission.
Interactive example
Loading interactive example
API
Inherited prop contracts
AccessibleNameRequires exactly one accessible name:label,aria-label, oraria-labelledby.Omit<HTMLInputAttributes, 'type' | 'value' | 'maxlength' | 'minlength' | 'pattern' | 'aria-label' | 'aria-labelledby' | 'class' | 'style'>Props from this native base are accepted except the listed members.
| Member | Type | Kind | Required | Default |
|---|---|---|---|---|
allowPaste | boolean | prop | No | true |
aria-label | string | prop | No | undefined |
aria-labelledby | string | prop | No | undefined |
characters | 'numeric' | 'alphanumeric' | 'any' | prop | No | 'numeric' |
error | string | prop | No | undefined |
label | string | prop | No | undefined |
length | number | prop | No | 6 |
mask | boolean | prop | No | false |
onComplete | (value: string) => void | callback | No | undefined |
onError | (error: PinInputError) => void | callback | No | undefined |
value | string | binding | No | '' |
Examples
Source
Loading source