# react-country-dropdown

> A simple react country selection dropdown component

Latest version **3.0.0** (published 2024-08-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-country-dropdown
pnpm add react-country-dropdown
yarn add react-country-dropdown
bun add react-country-dropdown
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 3.0.0 |
| Published | 2024-08-05 |
| First published | 2020-06-28 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=18 |
| Dependencies | 0 |
| Unpacked size | 228.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 14 |
| Author | Rocktim Saikia |
| Maintainers | rocktimsaikia |
| Keywords | country, select, dropdown, react-dropdown |

## Links

- npm: https://www.npmjs.com/package/react-country-dropdown
- Repository: https://github.com/rocktimsaikia/react-country-dropdown
- Homepage: https://github.com/rocktimsaikia/react-country-dropdown#readme
- Issues: https://github.com/rocktimsaikia/react-country-dropdown/issues
- npm.io page: https://npm.io/package/react-country-dropdown

## Recent versions

- 3.0.0 (latest) — 2024-08-05
- 2.2.0 — 2024-08-05
- 2.1.0 — 2024-08-05
- 2.0.1 — 2024-08-05
- 2.0.0 — 2024-08-05
- 1.1.1 — 2024-05-11
- 1.1.0 — 2023-03-25
- 1.0.4 — 2020-07-08
- 1.0.3 — 2020-07-08
- 1.0.2 — 2020-07-08
- 1.0.1 — 2020-06-28
- 1.0.0 — 2020-06-28

## README

# react-country-dropdown

A simple react country selection dropdown component.

> No external dependencies, just a clean functional component.

[![npm](https://img.shields.io/npm/dt/react-country-dropdown?color=bright)](https://npmjs.com/package/react-country-dropdown) [![npm](https://img.shields.io/npm/v/react-country-dropdown?color=bright)](https://npmjs.com/package/react-country-dropdown)

![Demo Screenshot](./screenshot.png)

## Install

```sh
npm i react-country-dropdown
```

## Usage

Check the full documentation and demo [here](https://rocktimsaikia.github.io/react-country-dropdown/).

```jsx
import ReactCountryDropdown from "react-country-dropdown";

const Example = () => {
	return (
		<ReactCountryDropdown
			defaultCountry="JP"
			onSelect={(country) => console.log(country.name)}
		/>
	);
};
```

## API

The `<ReactCountryDropdown/>` component accepts only two props.

### Props:

| Name             | Type   | Required | Default | Description                                                               |
| ---------------- | ------ | -------- | ------- | ------------------------------------------------------------------------- |
| `defaultCountry` | string | Yes      | `null`  | The default country code to be selected.                                  |
| `onSelect`       | func   | Yes      | `null`  | Callback function when a country is selected. Returns the country object. |

#### Country Object:

```json
{
	"name": "Japan",
	"code": "JP",
	"code2": "JPN",
	"capital": "Tokyo",
	"region": "Asia",
	"citizen": "Japanese",
	"flagUrl": "https://flagcdn.com/jp.svg",
	"callingCodes": ["81"],
	"timezones": ["UTC+09:00"],
	"latlng": [36, 138],
	"currencies": [{ "code": "JPY", "name": "Japanese yen", "symbol": "¥" }]
}
```

## License

[MIT](./LICENSE) &copy; 2024 [Rocktim Saikia](https://github.com/rocktimsaikia)

---
_Source: https://npm.io/package/react-country-dropdown · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._