The Changelog

What's new around here?

Succinct and informative updates about Flux.

November 25, 2025

OTP Input

Version ^2.8.0

Two-factor authentication, email verification codes, PIN entries—OTP inputs are everywhere. We figured Flux should handle them beautifully.

Meet OTP Input, a component for capturing one-time passwords with individual input fields. Let's take a look.

Copy to clipboard

<flux:otp wire:model="code" length="6" />

Auto-submit

Add submit="auto" and the form submits automatically once all fields are filled—no submit button needed. Perfect for streamlined verification flows where speed matters.

Copy to clipboard

<flux:otp wire:model="code" length="6" submit="auto" />

More than numbers

OTP input component with alphanumeric characters

Need alphanumeric codes or PINs? The mode prop has you covered. Set it to alphanumeric for license keys, or use private to mask sensitive values like PIN codes.

Copy to clipboard

<!-- License keys --><flux:otp wire:model="licenseKey" length="10" mode="alphanumeric" /><!-- PIN codes --><flux:otp wire:model="pin" length="4" private />

Custom layouts

OTP inputs showing different layouts with separators and groups

Use separators and groups to match your design. Great for phone numbers, credit cards, or any grouped format:

Copy to clipboard

<flux:otp wire:model="code">    <flux:otp.group>        <flux:otp.input />        <flux:otp.input />        <flux:otp.input />    </flux:otp.group>    <flux:otp.separator />    <flux:otp.group>        <flux:otp.input />        <flux:otp.input />        <flux:otp.input />    </flux:otp.group></flux:otp>

Smart input behavior

As always we went to great lengths to make sure this component is world-class.

Smart paste: Paste an entire code and it automatically distributes the characters across all input fields—no need to manually type each digit.

Intelligent navigation: Arrow keys move between fields, backspace jumps back to clear previous digits, and typing automatically advances to the next field.

Autocomplete support: The first field includes autocomplete="one-time-code" by default, so browsers and password managers can automatically suggest codes from SMS or authenticator apps.

Accessibility

And of course, we made sure this component honors expected keyboard navigation, proper focus management, and appropriate ARIA labels so that screen readers can use it just as well. Each input announces its position and the total number of digits expected.

Check out the OTP Input documentation for more examples and the full API reference.