Rxova
Skip to content

Quick start

Every rxova input is a controlled component: give it a value and an onChange and it behaves like any other form field. onChange always hands you the value — never a DOM event — so these drop straight into a form library’s controlled adapter. Here are three of the nine; the rest follow the same shape.

import { useState } from 'react'
import { CurrencyInput, Rating, OtpInput } from '@rxova/react-inputs'
function Example() {
const [price, setPrice] = useState<number | null>(null)
const [score, setScore] = useState(0)
const [code, setCode] = useState('')
return (
<>
<CurrencyInput locale="en-US" currency="USD" value={price} onChange={setPrice} />
<Rating value={score} onChange={setScore} precision={0.5} label="Rate your meal" />
<OtpInput length={6} value={code} onChange={setCode} />
</>
)
}

That single install covers all nine. If you’d rather depend on just one, the individual packages (@rxova/react-intl-currency-input, @rxova/react-rating-input, @rxova/react-otp-input) are equivalent — install the one you want and import from its own name instead. See Installation for the trade-off, which is smaller than you’d think.

Each component’s own page has live, editable examples and its full prop reference:

  • Currency input — locale-aware money entry with no cursor bugs.
  • Rating input — any icon, any precision, accessible.
  • OTP input — one-time-code entry with paste and WebOTP support.
  • Password input — reveal toggle, Caps Lock warning, 1 kB strength meter.
  • Phone input — international numbers, E.164 in and out, no metadata blob.
  • Date input — segmented and locale-ordered, YYYY-MM-DD, no calendar.
  • Time input — segmented, 12/24-hour by locale, canonical 24-hour value.
  • Tags input — delimiters, paste splitting, a real roving tab order.
  • File input — picker and drop zone, managed preview URLs, no upload.

Each component’s own About page carries the cross-cutting guides for that component — accessibility, styling tokens, and recipes for React Hook Form, Formik, React Final Form and TanStack Form.