{"_id":"@aibuild/react-native-country-picker-modal","_rev":"1-99fed746fc1a665cc1338a1b6b2ab78d","name":"@aibuild/react-native-country-picker-modal","dist-tags":{"latest":"2.0.0"},"versions":{"2.0.0":{"name":"@aibuild/react-native-country-picker-modal","version":"2.0.0","description":"Forked from react-native country picker, added Chinese translation","main":"lib/index.js","types":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/happy-hackers/react-native-country-picker-modal.git"},"scripts":{"start":"yarn config:dev && expo start","start:web":"yarn config:dev && expo start -w --dev","tsc":"tsc --noEmit","build":"rm -rf lib/ && node_modules/.bin/tsc && cp -rf ./src/assets ./lib && yarn minify","minify":"yarn minify:emoji","minify:emoji":"./scripts/minify.js ./lib/assets/data/countries-emoji.json","config:dev":"json -I -f package.json -e 'this.main=\"node_modules/expo/AppEntry.js\"'","config:npm":"json -I -f package.json -e 'this.main=\"lib/index.js\"'","lint":"tslint --project .","test":"TZ=Europe/Paris jest","data:image":"rm -rf ./data/countries.json && ./scripts/transform-world-countries.js > ./data/countries.json","data:emoji":"rm -rf ./data/countries-emoji.json && ./scripts/transform-world-countries.js --emoji > ./data/countries-emoji.json","data:cca2":"rm -rf ./data/cca2.json && ./scripts/transform-world-countries.js --cca2 > ./data/cca2.json","data:regions":"rm -rf ./data/cca2.json && ./scripts/transform-world-countries.js --regions > ./data/regions.json","data:subregions":"rm -rf ./data/cca2.json && ./scripts/transform-world-countries.js --subregions > ./data/subregions.json","cleaning":"rm -rf node_modules && rm -f yarn.lock && yarn cache clean && yarn install && watchman watch-del-all && rm -fr $TMPDIR/react-*","verify":"yarn lint && yarn build && yarn test","prepublishOnly":"yarn verify && yarn config:npm","postpublish":"yarn config:dev","deploy":"gh-pages -d web-build","predeploy":"yarn verify && expo build:web && mkdir web-build/countries && cp ./data/countries.json web-build/countries/index.json"},"keywords":["react-native","components","country-picker","country","flag"],"author":{"name":"Xavier Carpentier","email":"xcapetir@gmail.com","url":"https://xaviercarpentier.com/"},"license":"MIT","bugs":{"url":"https://github.com/happy-hackers/react-native-country-picker-modal/issues"},"homepage":"http://happy-hackers.github.io/react-native-country-picker-modal","dependencies":{"@callstack/react-theme-provider":"3.0.3","fuse.js":"3.4.5","modal-react-native-web":"0.2.0","node-emoji":"1.10.0","prop-types":"15.7.2","react-async-hook":"3.6.1"},"devDependencies":{"@types/jest":"24.0.17","@types/node-emoji":"1.8.1","@types/prop-types":"15.7.3","@types/react":"16.9.4","@types/react-native":"0.60.17","@types/react-test-renderer":"16.9.1","babel-cli":"6.14.0","babel-eslint":"6.1.2","babel-jest":"24.9.0","babel-preset-expo":"^7.0.0","expo":"^35.0.0","gh-pages":"2.1.1","husky":"^3.0.0","jest-expo":"^35.0.0","json":"^9.0.6","prettier":"1.18.0","react":"16.8.3","react-dom":"16.8.3","react-native":"https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz","react-native-web":"^0.11.1","react-test-renderer":"16.8.3","tslint":"5.12.0","tslint-config-prettier":"1.17.0","typescript":"3.4.5","world-countries":"2.1.0"},"peerDependencies":{"react":"*","react-dom":"*","react-native":"*","react-native-web":"*"},"jest":{"preset":"react-native","moduleFileExtensions":["js","jsx","json","ts","tsx"],"transform":{"^.+\\.(js|jsx|ts|tsx)$":"babel-jest"},"testMatch":["**/*.test.ts?(x)"],"modulePathIgnorePatterns":["<rootDir>/example-expo","<rootDir>/example-slack-message"]},"husky":{"hooks":{"pre-commit":"yarn lint && yarn tsc"}},"resolutions":{"mem":"^4.0.0"},"gitHead":"3cd45a07f236a284ceed6c4db20471ec6ea33d8c","_id":"@aibuild/react-native-country-picker-modal@2.0.0","_nodeVersion":"15.4.0","_npmVersion":"7.0.15","dist":{"integrity":"sha512-dmuoqnov0jAmF0TFhiOb+1ZH4NHQDlRiIlPAPmSjSX7vYPbXVzu10CKtDjFqJWisq5LC50MBwTu48lS80gF9hA==","shasum":"fe5f3d0bf8f04e3dd0f2a9568bae2f63caecb734","tarball":"https://registry.npmjs.org/@aibuild/react-native-country-picker-modal/-/react-native-country-picker-modal-2.0.0.tgz","fileCount":70,"unpackedSize":267827,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgF3u4CRA9TVsSAnZWagAAXvUP/3tUEyOEVxUC2eZWs5RE\nIO6Vc8sec3pYh9qwRAYl61z8+QzjlFshiUWG3g4Rtys55TSO+6kYDMTs+Bgp\nj43NcYYYBskAiys6CDIG67ZiwF3j+/LjB5d5dm82yOKVsG3FD/QkJHRA157h\nzPlQzPjFXSRCccDVTFdb0UQMSRbejZLh3T1x2b9maGbHfbH4GTBmLKO9Ocbd\nvpieSZqY0/alODtVhBtVGK5sk1Y6t2Br0+jvy2WwfcEIBu5ZGH27E7z9FfII\ng85c5IPG1VyqRzvAOYpukdQhA1hTYkUxO7+9Iye2IY74bFZbc6fIC7O59+Yd\n3nYx+nVguypq4YM1DvdeNoo2YyFSLrvemcTJea2XyDanpp/BTG8pf0J67LjD\nxQ7Ea9qw96FVDL3aJ2m85+6ANAkAXSi1iKdnG2WtVdK1YOHsvtAy2rr134Iz\nNA8SeDD3Uug3IfdEzaC+GBiygNiB490naMwq4XrKlppD+Ee418AppjmSZWU2\naRjdItnxtEZXE6bYPodqkdQkT0pKnrr3ToKpE1BXHUBIDA6l5yn14txXKVKP\ns/Cy3npte9RKE8IKkWUDuGtH//71sNifs5Y0Rm+ADXY8LnmY3yElb9jzKUVK\n2fS0iZM3JLJH/6ifkx5kCszwX15NCkLvgW4+qcvohWHIUFHitI0u6qxWYZSa\n1OOY\r\n=yORq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCv/0P2LrKZdGCsEsAMWGI0fa8lsGq9qRJ2O1v5B7xdrAIgdxDSe7a5oZ0nbB4bMF11dA5cAVVfEmgiXtuXdFIUqGc="}]},"_npmUser":{"name":"aibuild","email":"dev@happyhackers.com.au"},"directories":{},"maintainers":[{"name":"aibuild","email":"dev@happyhackers.com.au"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-native-country-picker-modal_2.0.0_1612151735953_0.7521354495467061"},"_hasShrinkwrap":false}},"time":{"created":"2021-02-01T03:55:35.952Z","2.0.0":"2021-02-01T03:55:36.130Z","modified":"2022-04-04T12:15:27.522Z"},"maintainers":[{"name":"aibuild","email":"dev@happyhackers.com.au"}],"description":"Forked from react-native country picker, added Chinese translation","homepage":"http://happy-hackers.github.io/react-native-country-picker-modal","keywords":["react-native","components","country-picker","country","flag"],"repository":{"type":"git","url":"git+https://github.com/happy-hackers/react-native-country-picker-modal.git"},"author":{"name":"Xavier Carpentier","email":"xcapetir@gmail.com","url":"https://xaviercarpentier.com/"},"bugs":{"url":"https://github.com/happy-hackers/react-native-country-picker-modal/issues"},"license":"MIT","readme":"<h3>\n  Country Picker for React Native.\n</h3>\n\n<p>\n   <a href=\"https://reactnative.gallery/xcarpentier/country-picker\"><img src=\"https://img.shields.io/badge/reactnative.gallery-%F0%9F%8E%AC-green.svg\"/></a>\n  <a href=\"https://www.npmjs.com/package/react-native-country-picker-modal\"><img src=\"https://img.shields.io/npm/v/react-native-country-picker-modal.svg?style=flat-square\"></a>\n  <a href=\"https://www.npmjs.com/package/react-native-country-picker-modal\"><img src=\"https://img.shields.io/npm/dm/react-native-country-picker-modal.svg?style=flat-square\"></a>\n  <a href=\"#hire-an-expert\"><img src=\"https://img.shields.io/badge/%F0%9F%92%AA-hire%20an%20expert-brightgreen\"/></a>\n</p>\n\n| iOS                                                                                               | Android                                                                                           | Web                                                                                               |\n| ------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- |\n| <img  src=\"https://media.giphy.com/media/cKmlP4Ue5pUrH0DQLi/giphy.gif\" width=\"200\" height=\"400\"/> | <img  src=\"https://media.giphy.com/media/Q7SDti4eARGx2CQIGE/giphy.gif\" width=\"200\" height=\"400\"/> | <img  src=\"https://media.giphy.com/media/gKl3z3c7sVVL7KSSh8/giphy.gif\" width=\"250\" height=\"400\"/> |\n\n## Demo\n\n- 🎉[ GO TO WEB DEMO ](http://xcarpentier.github.io/react-native-country-picker-modal/) 🎉\n- [snack example](https://snack.expo.io/@xcarpentier/bossy-marshmallows)\n\n## Installation\n\n```bash\n$ yarn add react-native-country-picker-modal\n```\n\n## Basic Usage\n\nFor more complete example open [App.tsx](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/App.tsx)\n\n```tsx\nimport React, { useState } from 'react'\nimport { View, Text, StyleSheet, PixelRatio, Switch } from 'react-native'\nimport CountryPicker from 'react-native-country-picker-modal'\nimport { CountryCode, Country } from './src/types'\n\nconst styles = StyleSheet.create({\n  // ...\n})\n\nexport default function App() {\n  const [countryCode, setCountryCode] = useState<CountryCode>('FR')\n  const [country, setCountry] = useState<Country>(null)\n  const [withCountryNameButton, setWithCountryNameButton] = useState<boolean>(\n    false,\n  )\n  const [withFlag, setWithFlag] = useState<boolean>(true)\n  const [withEmoji, setWithEmoji] = useState<boolean>(true)\n  const [withFilter, setWithFilter] = useState<boolean>(true)\n  const [withAlphaFilter, setWithAlphaFilter] = useState<boolean>(false)\n  const [withCallingCode, setWithCallingCode] = useState<boolean>(false)\n  const onSelect = (country: Country) => {\n    setCountryCode(country.cca2)\n    setCountry(country)\n  }\n  return (\n    <View style={styles.container}>\n      <Text style={styles.welcome}>Welcome to Country Picker !</Text>\n      <Option\n        title='With country name on button'\n        value={withCountryNameButton}\n        onValueChange={setWithCountryNameButton}\n      />\n      <Option title='With flag' value={withFlag} onValueChange={setWithFlag} />\n      <Option\n        title='With emoji'\n        value={withEmoji}\n        onValueChange={setWithEmoji}\n      />\n      <Option\n        title='With filter'\n        value={withFilter}\n        onValueChange={setWithFilter}\n      />\n      <Option\n        title='With calling code'\n        value={withCallingCode}\n        onValueChange={setWithCallingCode}\n      />\n      <Option\n        title='With alpha filter code'\n        value={withAlphaFilter}\n        onValueChange={setWithAlphaFilter}\n      />\n      <CountryPicker\n        {...{\n          countryCode,\n          withFilter,\n          withFlag,\n          withCountryNameButton,\n          withAlphaFilter,\n          withCallingCode,\n          withEmoji,\n          onSelect,\n        }}\n        visible\n      />\n      <Text style={styles.instructions}>Press on the flag to open modal</Text>\n      {country !== null && (\n        <Text style={styles.data}>{JSON.stringify(country, null, 2)}</Text>\n      )}\n    </View>\n  )\n}\n```\n\n## Props\n\n- `countryCode`: [CountryCode](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/types.ts#L252)\n- `region?`:[Region](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/types.ts#L272)\n- `subregion?`: [Subregion](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/types.ts#L282)\n- `countryCodes?`: [CountryCode](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/types.ts#L254)\n- `theme?`: [Theme](https://github.com/xcarpentier/react-native-country-picker-modal/blob/7611d34fa35744dbec3fbcdd9b4401494b1ba8c4/src/CountryTheme.ts#L5)\n- `translation?`: [TranslationLanguageCode](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/types.ts#L309)\n- `modalProps?`: [ModalProps](https://facebook.github.io/react-native/docs/modal#props)\n- `filterProps?`: [CountryFilterProps](https://facebook.github.io/react-native/docs/textinput#props)\n- `flatListProps?`: [FlatListProps<Country>](https://facebook.github.io/react-native/docs/flatlist#props)\n- `withAlphaFilter?`: boolean\n- `withCallingCode?`: boolean\n- `withCurrency?`: boolean\n- `withEmoji?`: boolean\n- `withCountryNameButton?`: boolean\n- `withCurrencyButton?`: boolean\n- `withCallingCodeButton?`: boolean\n- `withFlagButton?`: boolean\n- `withCloseButton?`: boolean\n- `withFilter?`: boolean\n- `withFlag?`: boolean\n- `withModal?`: boolean\n- `visible?`: boolean\n- `containerButtonStyle?`: `StyleProp<ViewStyle>`\n- `renderFlagButton?`(props: (FlagButton['props'])): ReactNode ([FlagButton props](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/FlagButton.tsx#L73))\n- `renderCountryFilter?`(props: CountryFilter['props']): ReactNode ([CountryFilter props is TextInputProps](https://facebook.github.io/react-native/docs/textinput#props))\n- `onSelect`(country: Country): void ([Country](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/types.ts#L263))\n- `onOpen`(): void\n- `onClose`(): void\n- `closeButtonImage?`: [ImageSourcePropType](https://facebook.github.io/react-native/docs/image#props)\n- `closeButtonStyle?`: StyleProp<ViewStyle>\n- `closeButtonImageStyle?`: StyleProp<ImageStyle>\n- `disableNativeModal?`: boolean (you have to wrap your all app with CountryModalProvider)\n- `preferredCountries`: [CountryCode](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/src/types.ts#L254) preferred countries they appear first (`withAlphaFilter` must be false)\n\n## Dark theme example\n\n<p align=\"center\">\n    <img alt=\"react-native-country-picker-modal-dark\" src=\"https://user-images.githubusercontent.com/2692166/40585272-094f817a-61b0-11e8-9668-abff0aeddb0e.png\" width=150>\n</p>\n\nA simple example to display a `CountryPicker` component with a dark theme.\n\n```tsx\nimport CountryPicker, { DARK_THEME } from 'react-native-country-picker-modal'\n\nconst MyDarkView = () => <CountryPicker theme={DARK_THEME} />\n```\n\n## Dependencies\n\n- world-countries : https://www.npmjs.com/package/world-countries\n\n## FAQ\n\n### Is it supported and tested both on android and iOS?\n\nYES\n\n### Is the data that is populated inside the list saved offline once I install your package?\n\nYES : It used the world-countries package and image is stored into json and base64.\n\n## Tiers lib using this lib\n\n- [react-native-phone-verification](https://github.com/joinspontaneous/react-native-phone-verification)\n\n[> Your project?](https://github.com/xcarpentier/react-native-linkedin/issues/new)\n\n## See also\n\n- [react-native-linkedin](https://github.com/xcarpentier/react-native-linkedin)\n\n## Contribution\n\n- [@xcapentier](mailto:contact@xaviercarpentier.com) The main author.\n\n## Questions\n\nFeel free to [contact me](mailto:contact@xaviercarpentier.com) or [create an issue](https://github.com/xcarpentier/react-native-country-picker/issues/new)\n\n> made with ♥\n\n## Licence\n\n[MIT](https://github.com/xcarpentier/react-native-country-picker-modal/blob/master/LICENSE.md)\n\n## Hire an expert!\n\nLooking for a ReactNative freelance expert with more than 12 years experience? Contact me from my [website](https://xaviercarpentier.com)!\n","readmeFilename":"README.md"}