react-native-country-select 0.1.1 → 0.1.3

package/lib/components/styles.ts

@@ -1,83 +1,98 @@
-import {StyleSheet} from 'react-native';
-
-export const createStyles = (theme: 'light' | 'dark') =>
-  StyleSheet.create({
-    backdrop: {
-      flex: 1,
-      backgroundColor: 'rgba(0, 0, 0, 0.5)',
-    },
-    popupContainer: {
-      width: '90%',
-      maxWidth: 600,
-      height: '60%',
-      alignItems: 'center',
-      justifyContent: 'center',
-      alignSelf: 'center',
-    },
-    popupContent: {
-      flex: 1,
-      width: '100%',
-      backgroundColor: theme === 'dark' ? '#202020' : '#FFFFFF',
-      borderRadius: 20,
-      alignSelf: 'center',
-      padding: 16,
-    },
-    searchContainer: {
-      marginBottom: 16,
-      paddingTop: 16,
-      flexDirection: 'row',
-    },
-    searchInput: {
-      flex: 1,
-      borderRadius: 8,
-      paddingHorizontal: 16,
-      fontSize: 16,
-      borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
-      borderWidth: 1,
-      color: theme === 'dark' ? '#FFFFFF' : '#000000',
-    },
-    searchInputPlaceholder: {
-      color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
-    },
-    list: {
-      flex: 1,
-    },
-    countryItem: {
-      flex: 1,
-      flexDirection: 'row',
-      alignItems: 'center',
-      padding: 12,
-      marginBottom: 8,
-      backgroundColor: theme === 'dark' ? '#404040' : '#F3F3F3',
-      borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
-      borderWidth: 1,
-      borderRadius: 8,
-    },
-    flag: {
-      flex: 0.1,
-      fontSize: 16,
-      color: theme === 'dark' ? '#FFFFFF' : '#000000',
-    },
-    countryInfo: {
-      flex: 0.9,
-      flexDirection: 'row',
-      alignItems: 'center',
-    },
-    callingCode: {
-      flex: 0.2,
-      fontSize: 14,
-      color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
-    },
-    countryName: {
-      flex: 0.8,
-      fontSize: 16,
-      fontWeight: '500',
-      color: theme === 'dark' ? '#FFFFFF' : '#000000',
-    },
-    sectionTitle: {
-      fontSize: 16,
-      fontWeight: '600',
-      paddingVertical: 8,
-      color: theme === 'dark' ? '#FFFFFF' : '#000000',
-    },
-  });
+import {StatusBar, StyleSheet} from 'react-native';
+
+export const createStyles = (theme: 'light' | 'dark') =>
+  StyleSheet.create({
+    backdrop: {
+      flex: 1,
+      backgroundColor: 'rgba(0, 0, 0, 0.5)',
+    },
+    popupContainer: {
+      paddingTop: StatusBar.currentHeight,
+      width: '90%',
+      maxWidth: 600,
+      height: '60%',
+      alignItems: 'center',
+      justifyContent: 'center',
+      alignSelf: 'center',
+    },
+    popupContent: {
+      flex: 1,
+      width: '100%',
+      backgroundColor: theme === 'dark' ? '#202020' : '#FFFFFF',
+      borderRadius: 20,
+      alignSelf: 'center',
+      padding: 16,
+    },
+    searchContainer: {
+      marginBottom: 16,
+      paddingTop: 16,
+      flexDirection: 'row',
+    },
+    searchInput: {
+      flex: 1,
+      borderRadius: 8,
+      paddingHorizontal: 16,
+      minHeight: 44,
+      fontSize: 16,
+      borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
+      borderWidth: 1,
+      color: theme === 'dark' ? '#FFFFFF' : '#000000',
+    },
+    searchInputPlaceholder: {
+      color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
+    },
+    list: {
+      flex: 1,
+    },
+    countryItem: {
+      flex: 1,
+      flexDirection: 'row',
+      alignItems: 'center',
+      padding: 12,
+      marginBottom: 8,
+      backgroundColor: theme === 'dark' ? '#404040' : '#F3F3F3',
+      borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
+      borderWidth: 1,
+      borderRadius: 8,
+    },
+    flag: {
+      flex: 0.1,
+      fontSize: 16,
+      color: theme === 'dark' ? '#FFFFFF' : '#000000',
+    },
+    countryInfo: {
+      flex: 0.9,
+      flexDirection: 'row',
+      alignItems: 'center',
+    },
+    callingCode: {
+      flex: 0.2,
+      fontSize: 14,
+      color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
+    },
+    countryName: {
+      flex: 0.8,
+      fontSize: 16,
+      fontWeight: '500',
+      color: theme === 'dark' ? '#FFFFFF' : '#000000',
+    },
+    sectionTitle: {
+      fontSize: 16,
+      fontWeight: '600',
+      paddingVertical: 8,
+      color: theme === 'dark' ? '#FFFFFF' : '#000000',
+    },
+    closeButton: {
+      marginRight: 10,
+      paddingHorizontal: 18,
+      alignItems: 'center',
+      justifyContent: 'center',
+      backgroundColor: theme === 'dark' ? '#303030' : '#F5F5F5',
+      borderRadius: 12,
+    },
+    closeButtonText: {
+      fontSize: 24,
+      lineHeight: 28,
+      color: theme === 'dark' ? '#FFFFFF' : '#000000',
+    },
+  });

package/lib/index.d.ts

@@ -1,21 +1,23 @@
-import * as React from 'react';
-
-import {
-  ICountry,
-  ICountryCca2,
-  ICountryItemProps,
-  ICountrySelectProps,
-  ICountrySelectLanguages,
-} from './interface';
-
-declare const CountrySelect: React.FC<ICountrySelectProps>;
-
-export default CountrySelect;
-
-export {
-  ICountry,
-  ICountryCca2,
-  ICountryItemProps,
-  ICountrySelectProps,
-  ICountrySelectLanguages,
-};
+import * as React from 'react';
+
+import {
+  ICountry,
+  ICountryCca2,
+  ICountryItemProps,
+  ICountrySelectProps,
+  ICountrySelectStyle,
+  ICountrySelectLanguages,
+} from './interface';
+
+declare const CountrySelect: React.FC<ICountrySelectProps>;
+
+export default CountrySelect;
+
+export {
+  ICountry,
+  ICountryCca2,
+  ICountryItemProps,
+  ICountrySelectProps,
+  ICountrySelectStyle,
+  ICountrySelectLanguages,
+};

package/lib/index.tsx

@@ -1,18 +1,18 @@
-import {CountrySelect} from './components';
-import {
-  ICountry,
-  ICountryCca2,
-  ICountryItemProps,
-  ICountrySelectProps,
-  ICountrySelectLanguages,
-} from './interface';
-
-export default CountrySelect;
-
-export type {
-  ICountry,
-  ICountryCca2,
-  ICountryItemProps,
-  ICountrySelectProps,
-  ICountrySelectLanguages,
-};
+import {CountrySelect} from './components';
+import {
+  ICountry,
+  ICountryCca2,
+  ICountryItemProps,
+  ICountrySelectProps,
+  ICountrySelectLanguages,
+} from './interface';
+
+export default CountrySelect;
+
+export type {
+  ICountry,
+  ICountryCca2,
+  ICountryItemProps,
+  ICountrySelectProps,
+  ICountrySelectLanguages,
+};

package/lib/interface/country.ts

@@ -1,111 +1,111 @@
-import {ICountryCca2} from './countryCca2';
-
-// Currency interface
-export interface ICountryCurrency {
-  name: string;
-  symbol: string;
-}
-
-// Currencies object interface
-export interface ICountryCurrencies {
-  [key: string]: ICountryCurrency | undefined;
-}
-
-// Demonym interface
-export interface ICountryDemonym {
-  f: string;
-  m: string;
-}
-
-// Demonyms object interface
-export interface ICountryDemonyms {
-  [key: string]: ICountryDemonym;
-}
-
-export interface ICountryNameTranslation {
-  official: string;
-  common: string;
-}
-
-export interface ICountryNativeName {
-  [key: string]: ICountryNameTranslation | undefined;
-}
-
-export interface ICountryName {
-  common: string;
-  official: string;
-  native: ICountryNativeName;
-}
-
-// Country name translation interface
-export interface ICountryTranslations {
-  ara?: ICountryNameTranslation; // Arabic
-  bel?: ICountryNameTranslation; // Belarusian
-  bre?: ICountryNameTranslation; // Breton
-  bul?: ICountryNameTranslation; // Bulgarian
-  ces?: ICountryNameTranslation; // Czech
-  deu?: ICountryNameTranslation; // German
-  ell?: ICountryNameTranslation; // Greek
-  eng?: ICountryNameTranslation; // English
-  est?: ICountryNameTranslation; // Estonian
-  fin?: ICountryNameTranslation; // Finnish
-  fra?: ICountryNameTranslation; // French
-  heb?: ICountryNameTranslation; // Hebrew
-  hrv?: ICountryNameTranslation; // Croatian
-  hun?: ICountryNameTranslation; // Hungarian
-  ita?: ICountryNameTranslation; // Italian
-  jpn?: ICountryNameTranslation; // Japanese
-  kor?: ICountryNameTranslation; // Korean
-  nld?: ICountryNameTranslation; // Dutch
-  per?: ICountryNameTranslation; // Persian
-  pol?: ICountryNameTranslation; // Polish
-  por?: ICountryNameTranslation; // Portuguese
-  ron?: ICountryNameTranslation; // Romanian
-  rus?: ICountryNameTranslation; // Russian
-  slk?: ICountryNameTranslation; // Slovak
-  spa?: ICountryNameTranslation; // Spanish
-  srp?: ICountryNameTranslation; // Serbian
-  swe?: ICountryNameTranslation; // Swedish
-  tur?: ICountryNameTranslation; // Turkish
-  ukr?: ICountryNameTranslation; // Ukrainian
-  urd?: ICountryNameTranslation; // Urdu
-  zho?: ICountryNameTranslation; // Chinese
-  'zho-Hans'?: ICountryNameTranslation; // Simplified Chinese
-  'zho-Hant'?: ICountryNameTranslation; // Traditional Chinese
-}
-
-// Languages object interface
-export interface ICountryLanguages {
-  [key: string]: string;
-}
-
-// Complete Country interface matching countries.json structure
-export interface ICountry {
-  name: ICountryName;
-  tld: string[];
-  cca2: ICountryCca2;
-  ccn3: string;
-  cca3: string;
-  cioc: string;
-  independent: boolean;
-  status: string;
-  unMember: boolean;
-  unRegionalGroup: string;
-  currencies: ICountryCurrencies;
-  idd: {
-    root: string;
-    suffixes: string[];
-  };
-  capital: string[];
-  altSpellings: string[];
-  region: string;
-  subregion: string;
-  languages: ICountryLanguages;
-  translations: ICountryTranslations;
-  latlng: [number, number];
-  landlocked: boolean;
-  borders: string[];
-  area: number;
-  flag: string;
-  demonyms: ICountryDemonyms;
-}
+import {ICountryCca2} from './countryCca2';
+
+// Currency interface
+export interface ICountryCurrency {
+  name: string;
+  symbol: string;
+}
+
+// Currencies object interface
+export interface ICountryCurrencies {
+  [key: string]: ICountryCurrency | undefined;
+}
+
+// Demonym interface
+export interface ICountryDemonym {
+  f: string;
+  m: string;
+}
+
+// Demonyms object interface
+export interface ICountryDemonyms {
+  [key: string]: ICountryDemonym;
+}
+
+export interface ICountryNameTranslation {
+  official: string;
+  common: string;
+}
+
+export interface ICountryNativeName {
+  [key: string]: ICountryNameTranslation | undefined;
+}
+
+export interface ICountryName {
+  common: string;
+  official: string;
+  native: ICountryNativeName;
+}
+
+// Country name translation interface
+export interface ICountryTranslations {
+  ara?: ICountryNameTranslation; // Arabic
+  bel?: ICountryNameTranslation; // Belarusian
+  bre?: ICountryNameTranslation; // Breton
+  bul?: ICountryNameTranslation; // Bulgarian
+  ces?: ICountryNameTranslation; // Czech
+  deu?: ICountryNameTranslation; // German
+  ell?: ICountryNameTranslation; // Greek
+  eng?: ICountryNameTranslation; // English
+  est?: ICountryNameTranslation; // Estonian
+  fin?: ICountryNameTranslation; // Finnish
+  fra?: ICountryNameTranslation; // French
+  heb?: ICountryNameTranslation; // Hebrew
+  hrv?: ICountryNameTranslation; // Croatian
+  hun?: ICountryNameTranslation; // Hungarian
+  ita?: ICountryNameTranslation; // Italian
+  jpn?: ICountryNameTranslation; // Japanese
+  kor?: ICountryNameTranslation; // Korean
+  nld?: ICountryNameTranslation; // Dutch
+  per?: ICountryNameTranslation; // Persian
+  pol?: ICountryNameTranslation; // Polish
+  por?: ICountryNameTranslation; // Portuguese
+  ron?: ICountryNameTranslation; // Romanian
+  rus?: ICountryNameTranslation; // Russian
+  slk?: ICountryNameTranslation; // Slovak
+  spa?: ICountryNameTranslation; // Spanish
+  srp?: ICountryNameTranslation; // Serbian
+  swe?: ICountryNameTranslation; // Swedish
+  tur?: ICountryNameTranslation; // Turkish
+  ukr?: ICountryNameTranslation; // Ukrainian
+  urd?: ICountryNameTranslation; // Urdu
+  zho?: ICountryNameTranslation; // Chinese
+  'zho-Hans'?: ICountryNameTranslation; // Simplified Chinese
+  'zho-Hant'?: ICountryNameTranslation; // Traditional Chinese
+}
+
+// Languages object interface
+export interface ICountryLanguages {
+  [key: string]: string;
+}
+
+// Complete Country interface matching countries.json structure
+export interface ICountry {
+  name: ICountryName;
+  tld: string[];
+  cca2: ICountryCca2;
+  ccn3: string;
+  cca3: string;
+  cioc: string;
+  independent: boolean;
+  status: string;
+  unMember: boolean;
+  unRegionalGroup: string;
+  currencies: ICountryCurrencies;
+  idd: {
+    root: string;
+    suffixes: string[];
+  };
+  capital: string[];
+  altSpellings: string[];
+  region: string;
+  subregion: string;
+  languages: ICountryLanguages;
+  translations: ICountryTranslations;
+  latlng: [number, number];
+  landlocked: boolean;
+  borders: string[];
+  area: number;
+  flag: string;
+  demonyms: ICountryDemonyms;
+}