RN Speaker Picker

A fork of react-native-country-picker-modal with tweaks for use in MUNctl.

Tweaks

• Upgraded dependencies
• Add custom countries/speakers at runtime
• Improved alpha filter
• Visual redesign

| iOS | Android | Web | |------------------------------------------------------------|--------------------------------------------------------------------------------------------------|---------------------------------------------------------------------------------------------------| | | | |

Example

For an example, open App.tsx

Props

• countryCode: CountryCode
• region?:Region
• subregion?: Subregion
• countryCodes?: CountryCode
• theme?: Theme
• translation?: TranslationLanguageCode
• modalProps?: ModalProps
• filterProps?: CountryFilterProps
• flatListProps?: FlatListProps
• withAlphaFilter?: boolean
• withCallingCode?: boolean
• withCurrency?: boolean
• withEmoji?: boolean
• withCountryNameButton?: boolean
• withCurrencyButton?: boolean
• withCallingCodeButton?: boolean
• withFlagButton?: boolean
• withCloseButton?: boolean
• withFilter?: boolean
• withFlag?: boolean
• withModal?: boolean
• visible?: boolean
• containerButtonStyle?: StyleProp<ViewStyle>
• renderFlagButton?(props: (FlagButton['props'])): ReactNode (FlagButton props)
• renderCountryFilter?(props: CountryFilter['props']): ReactNode (CountryFilter props is TextInputProps)
• onSelect(country: Country): void (Country)
• onOpen(): void
• onClose(): void
• closeButtonImage?: ImageSourcePropType
• closeButtonStyle?: StyleProp
• closeButtonImageStyle?: StyleProp
• disableNativeModal?: boolean (you have to wrap your all app with CountryModalProvider)
• preferredCountries: CountryCode preferred countries they appear first (withAlphaFilter must be false)

Dark theme example

A simple example to display a CountryPicker component with a dark theme.

import CountryPicker, { DARK_THEME } from 'react-native-country-picker-modal'

const MyDarkView = () => <CountryPicker theme={DARK_THEME} />

License

MIT