Package Exports

react-international-phone
react-international-phone/build/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-international-phone) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-international-phone

🤙 International phone input component for React

build-status-badge install-size-badge

Live demo: Storybook

demo

Features

😎 Easy to integrate - Just import and use, no need for the initial setup.
🔍 Country guessing - Just start typing and the component will guess the country.
🏳️ Country flags - Country flags are rendered using Twemoji.
⌨ Caret position handling - Typing in the middle of the input, selection and deletion feels naturally.
✨ Lightweight - Low bundle size, no third-party dependencies.
🌈 Easy to customize - Customize styles and component behavior using props.

Installation

$ npm i react-international-phone

Basic usage

import { useState } from 'react';
import { PhoneInput } from 'react-international-phone';

const App = () => {
  const [phone, setPhone] = useState('');

  return (
    <div>
      <PhoneInput
        initialCountry="ua"
        value={phone}
        onChange={(phone) => setPhone(phone)}
      />
    </div>
  );
};

Documentation

Find the full API reference on official documentation.