react-country-flag
React component for emoji/svg country flags.
Install
npm install --save react-country-flagBREAKING CHANGES
v3.x NONE only Typescript Types were introduced, enjoy!
v2.x has breaking changes
codeis nowcountryCodetitleandaria-labelare not defined any more, it is up to the developer to pass these instylePropsis nowstyle
Usage
All props are passed onto the element, everything can be overwritten.
import React from "react"
import ReactCountryFlag from "react-country-flag"
function ExampleComponent {
return (
<div>
<ReactCountryFlag countryCode="US" />
<ReactCountryFlag
className="emojiFlag"
countryCode="US"
style={{
fontSize: '2em',
lineHeight: '2em',
}}
aria-label="United States"
/>
<ReactCountryFlag countryCode="US" svg />
<ReactCountryFlag
countryCode="US"
svg
style={{
width: '2em',
height: '2em',
}}
title="US"
/>
<ReactCountryFlag
countryCode="US"
svg
cdnUrl="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.4.3/flags/1x1/"
cdnSuffix="svg"
title="US"
/>
</div>
)
}
export default ExampleComponentDetecting Emoji support
Try this out and conditionally render your country flag https://github.com/danalloway/detect-emoji-support
License
MIT © danalloway