kora-ui
Special components · Input

Phone input

International phone input backed by libphonenumber-js. Country picker with flag, live as-you-type formatting, and E.164 output.

E.164: (empty)valid: false

Usage

 
TSX
import { PhoneInput } from "kora-ui/client";

const [phone, setPhone] = useState("");
const [valid, setValid] = useState(false);

<PhoneInput
  defaultCountry="MX"
  countries={["MX", "US", "CA", "ES"]}
  onChange={(e164, isValid) => {
    setPhone(e164);
    setValid(isValid);
  }}
/>