FlagImage API

FlagImage is component for rendering country flag. It's used in CountrySelector and CountrySelectorDropdown components.

Usage Example

Import component

import { FlagImage } from 'react-international-phone';

Use by providing the dialCode and prefix properties.

<FlagImage iso2="ua" size="30px" />

Output:

Properties

iso2 *

iso2 code of country flag

• Type: string

src

Custom src of flag

• Type: string
• Default: undefined

protocol

Protocol to use with twemoji cnd

• Type: "http" | "https"
• Default: "https"

disableLazyLoading

Disable lazy loading of flags (loading="lazy" attribute will not be set)

• Type: boolean
• Default: "https"

Style properties

Prop	Type	Description
size	CSSProperties['width']	Size of flag (set width and height)
style	CSSProperties	Custom styles prop
className	string	Custom className prop

CSS variables

Variable	Default value
--react-international-phone-flag-width	24px
--react-international-phone-flag-height	24px