react-flag-icon-css

A simple React SVG country flags component.

Installation

React Flag Icon Css is distributed as an npm package:

$ npm install --save react-flag-icon-css

Prerequisites

The webpack module bundler and ecosystem are recommended. You will need to install a few packages, including:

$ npm install --save-dev babel-loader css-loader file-loader sass-loader node-sass style-loader extract-text-webpack-plugin classnames tcomb tcomb-react

Basic usage

Import the factory from 'react-flag-icon-css', it accepts the React module as the first argument and creates the FlagIcon component. This approach ensures that FlagIcon uses your app's React instance, avoiding issues such as two versions of React being loaded at the same time.

import React from 'react'
import ReactDOM from 'react-dom'
import FlagIconFactory from 'react-flag-icon-css'

const FlagIcon = FlagIconFactory(React)
// If you are not using css modules, write the following:
// const FlagIcon = FlagIconFactory(React, { useCssModules: false })

const App = (props = {}) =>
  <div>
    <FlagIcon code={props.code} size={props.size} />
  </div>

const rootEL = document.body.querySelector('#app')

const appProps = { code: 'it', size: '3x' }
ReactDOM.render(<App {...appProps} />, rootEL)

An example project is available.

FlagIcon props

| Prop | Type | Default | Description | Supported values | | --- | --- | --- | --- | | code * | String | | ISO 3166-1-alpha-2 code | The list is [here](relative link/static/countries.json) | | size | String | | | lg, 2x, 3x, 4x, 5x | | flip | String | | | horizontal, vertical | | rotate | Number | | | 30, 60, 90, 180, 270 | | squared | Boolean | false | | | | Component | String | span | | e.g span, div | | Children | String | false | React element | e.g <Something /> |

In development mode, you will see warnings in the console if you attempt to use an unsupported prop value.

Development

TODO

Contributing

TODO

Origin of the flags

This project uses the flag-icon-css SVG country flags and CSS.

License

This project is licensed under the terms of the [MIT license](relative link/LICENSE).

Changelog

1.0.4 (2016-10-05)

• docs(README): more updates (0405d49)

<a name="1.0.3"></a>