### Install react-native-localize Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Install the library using npm or yarn. Remember to run `pod install` after installation. ```bash $ npm install --save react-native-localize # --- or --- $ yarn add react-native-localize ``` -------------------------------- ### Basic Usage: Get Locales and Currencies Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Import and use `getLocales` and `getCurrencies` to retrieve the user's preferred locale and currency information. ```typescript import { getCurrencies, getLocales } from "react-native-localize"; console.log(getLocales()); console.log(getCurrencies()); ``` -------------------------------- ### Server-Side Rendering Setup Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Wraps the application with `ServerLanguagesProvider` on the server to provide language preferences from the `Accept-Language` header. This enables `react-native-localize` to function correctly during SSR. ```tsx import accepts from "accepts"; import { ServerLanguagesProvider } from "react-native-localize"; // parse the Accept-Language header; any approach returning string[] is fine const languages = accepts(request).languages(); const html = renderToString( , ); ``` -------------------------------- ### Get Number Format Settings Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieves the user's preferred decimal and grouping separators for number formatting. No specific setup is required. ```typescript type getNumberFormatSettings = () => { decimalSeparator: string; groupingSeparator: string; }; ``` ```typescript import { getNumberFormatSettings } from "react-native-localize"; console.log(getNumberFormatSettings()); /* -> { decimalSeparator: ".", groupingSeparator: ",", } */ ``` -------------------------------- ### Get Temperature Unit Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Returns the user's preferred temperature unit, either 'celsius' or 'fahrenheit'. ```typescript type getTemperatureUnit = () => "celsius" | "fahrenheit"; ``` ```typescript import { getTemperatureUnit } from "react-native-localize"; console.log(getTemperatureUnit()); // -> "celsius" ``` -------------------------------- ### Get User's Preferred Currencies Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Use `getCurrencies` to get an array of the user's preferred currency codes, ordered by preference. ```typescript import { getCurrencies } from "react-native-localize"; console.log(getCurrencies()); // -> ["EUR", "GBP", "USD"] ``` -------------------------------- ### Get Time Zone Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieves the user's preferred timezone based on device settings, not their current location. Returns a string representing the timezone. ```typescript type getTimeZone = () => string; ``` ```typescript import { getTimeZone } from "react-native-localize"; console.log(getTimeZone()); // -> "Europe/Paris" ``` -------------------------------- ### Get User's Preferred Calendar Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Use the `getCalendar` function to retrieve the user's preferred calendar format. The function returns a string representing the calendar type. ```typescript import { getCalendar } from "react-native-localize"; console.log(getCalendar()); // -> "gregorian" ``` -------------------------------- ### Get User's Preferred Locales Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieve an array of the user's preferred locales, in order, using `getLocales`. Each locale object contains language code, script code (optional), country code, language tag, and right-to-left (RTL) directionality. ```typescript import { getLocales } from "react-native-localize"; console.log(getLocales()); /* -> [ { countryCode: "GB", languageTag: "en-GB", languageCode: "en", isRTL: false }, { countryCode: "US", languageTag: "en-US", languageCode: "en", isRTL: false }, { countryCode: "FR", languageTag: "fr-FR", languageCode: "fr", isRTL: false }, ] */ ``` -------------------------------- ### Get User's Country Code Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieve the user's current country code using `getCountry`. This is based on the device locale, not the user's physical location. Note that Latin American regional settings may return 'UN'. ```typescript import { getCountry } from "react-native-localize"; console.log(getCountry()); // -> "FR" ``` -------------------------------- ### openAppLanguageSettings() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Opens the application's language settings screen. ```APIDOC ## openAppLanguageSettings() ### Description Opens the app language settings. This feature is available only on Android 13+ and requires configuring your app's supported locales. ### Method type ```ts type openAppLanguageSettings = () => Promise; ``` ### Usage example ```ts import { openAppLanguageSettings } from "react-native-localize"; openAppLanguageSettings("application").catch((error) => { console.warn("Cannot open app language settings", error); }); ``` ``` -------------------------------- ### getNumberFormatSettings() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Fetches the device's number formatting settings. ```APIDOC ## getNumberFormatSettings() ### Description Returns number formatting settings. ### Method type ```ts type getNumberFormatSettings = () => { currency: string; groupingSeparator: string; decimalSeparator: string; useGrouping: boolean; minimumIntegerDigits: number; minimumFractionDigits: number; maximumFractionDigits: number; currencySymbol: string; internationalCurrencySymbol: string; model: string; }; ``` ``` -------------------------------- ### usesMetricSystem() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Checks if the user prefers the metric system for measurements. ```APIDOC ## usesMetricSystem() ### Description Returns `true` if the user prefers metric measure system, `false` if they prefer imperial. ### Method type ```ts type usesMetricSystem = () => boolean; ``` ### Usage example ```ts import { usesMetricSystem } from "react-native-localize"; console.log(usesMetricSystem()); // -> true ``` ``` -------------------------------- ### Mock react-native-localize for Testing Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Import the default mock for react-native-localize in your `__mocks__` directory to test your code. This is necessary because it's a native module. ```typescript // __mocks__/react-native-localize.ts export * from "react-native-localize/mock"; // or "react-native-localize/mock/jest" ``` -------------------------------- ### getCurrencies() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Provides an ordered list of the user's preferred currency codes. ```APIDOC ## getCurrencies() ### Description Returns the user preferred currency codes, in order. ### Method type ```ts type getCurrencies = () => string[]; ``` ### Usage example ```ts import { getCurrencies } from "react-native-localize"; console.log(getCurrencies()); // -> ["EUR", "GBP", "USD"] ``` ``` -------------------------------- ### getNumberFormatSettings() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieves the user's preferred decimal and grouping separators for number formatting. ```APIDOC ## getNumberFormatSettings() ### Description Returns an object containing the user's preferred decimal and grouping separators for number formatting. ### Method type ```ts type getNumberFormatSettings = () => { decimalSeparator: string; groupingSeparator: string; }; ``` ### Usage example ```ts import { getNumberFormatSettings } from "react-native-localize"; console.log(getNumberFormatSettings()); /* -> { decimalSeparator: ".", groupingSeparator: ",", } */ ``` ``` -------------------------------- ### getTemperatureUnit() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Returns the user's preferred unit for temperature measurement. ```APIDOC ## getTemperatureUnit() ### Description Returns the user preferred temperature unit, either 'celsius' or 'fahrenheit'. ### Method type ```ts type getTemperatureUnit = () => "celsius" | "fahrenheit"; ``` ### Usage example ```ts import { getTemperatureUnit } from "react-native-localize"; console.log(getTemperatureUnit()); // -> "celsius" ``` ``` -------------------------------- ### findBestLanguageTag() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Finds the best matching language tag from a provided list based on user preferences. ```APIDOC ## findBestLanguageTag() ### Description Returns the best language tag possible and its reading direction. Useful to pick the best translation available. It respects the user preferred languages list order. ### Method type ```ts type findBestLanguageTag = ( languageTags: string[], ) => { languageTag: string; isRTL: boolean } | undefined; ``` ### Usage example ```ts import { findBestLanguageTag } from "react-native-localize"; console.log(findBestLanguageTag(["en-US", "en", "fr"])); // -> { languageTag: "en-US", isRTL: false } ``` ``` -------------------------------- ### getCalendar() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieves the user's preferred calendar format. This can be one of several predefined calendar systems. ```APIDOC ## getCalendar() ### Description Returns the user preferred calendar format. ### Method type ```ts type getCalendar = () => | "gregorian" | "buddhist" | "coptic" | "ethiopic" | "ethiopic-amete-alem" | "hebrew" | "indian" | "islamic" | "islamic-umm-al-qura" | "islamic-civil" | "islamic-tabular" | "iso8601" | "japanese" | "persian"; ``` ### Usage example ```ts import { getCalendar } from "react-native-localize"; console.log(getCalendar()); // -> "gregorian" ``` ``` -------------------------------- ### Open App Language Settings Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Opens the app's language settings screen. This feature requires Android 13+ and specific app locale configuration. ```typescript type openAppLanguageSettings = () => Promise; ``` ```typescript import { openAppLanguageSettings } from "react-native-localize"; openAppLanguageSettings("application").catch((error) => { console.warn("Cannot open app language settings", error); }); ``` -------------------------------- ### Expo Static Configuration Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Configure supported locales statically in `app.json` using the Expo plugin. This enables Android 13+ and iOS to display available locales in system settings. ```json { "expo": { "plugins": [ [ "react-native-localize", { "locales": ["en", "fr"], // or { android: ["en"], ios: ["en", "fr"] } }, ], ], }, } ``` -------------------------------- ### uses24HourClock() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Determines if the user prefers a 24-hour clock format. ```APIDOC ## uses24HourClock() ### Description Returns `true` if the user prefers 24h clock format, `false` if they prefer 12h clock format. ### Method type ```ts type uses24HourClock = () => boolean; ``` ### Usage example ```ts import { uses24HourClock } from "react-native-localize"; console.log(uses24HourClock()); // -> true ``` ``` -------------------------------- ### usesAutoDateAndTime() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Checks if automatic date and time settings are enabled on Android devices. ```APIDOC ## usesAutoDateAndTime() ### Description Tells if the automatic date & time setting is enabled on the phone. **Android only** ### Method type ```ts type usesAutoDateAndTime = () => boolean | undefined; ``` ### Usage example ```ts import { usesAutoDateAndTime } from "react-native-localize"; console.log(usesAutoDateAndTime()); // true or false ``` ``` -------------------------------- ### Expo Dynamic Configuration Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Configure supported locales dynamically in `app.config.js` or `app.config.ts` using the Expo plugin. This allows Android 13+ and iOS to display available locales in system settings. ```typescript import type { ConfigContext, ExpoConfig } from "expo/config"; import localize from "react-native-localize/expo"; // use `require` in app.config.js export default ({ config }: ConfigContext): ExpoConfig => ({ plugins: [ localize({ locales: ["en", "fr"], // or { android: ["en"], ios: ["en", "fr"] } }), ], }); ``` -------------------------------- ### Uses Metric System Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Determines if the user prefers the metric system. Returns `true` for metric and `false` for imperial. ```typescript type usesMetricSystem = () => boolean; ``` ```typescript import { usesMetricSystem } from "react-native-localize"; console.log(usesMetricSystem()); // -> true ``` -------------------------------- ### Uses Auto Date and Time (Android) Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Checks if automatic date and time settings are enabled on an Android device. Returns `true`, `false`, or `undefined` if the setting is not available. ```typescript type usesAutoDateAndTime = () => boolean | undefined; ``` ```typescript import { usesAutoDateAndTime } from "react-native-localize"; console.log(usesAutoDateAndTime()); // true or false ``` -------------------------------- ### getTimeZone() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieves the user's preferred time zone from device settings. ```APIDOC ## getTimeZone() ### Description Returns the user preferred timezone based on device settings, not the device's current geographical position. ### Method type ```ts type getTimeZone = () => string; ``` ### Usage example ```ts import { getTimeZone } from "react-native-localize"; console.log(getTimeZone()); // -> "Europe/Paris" ``` ``` -------------------------------- ### getLocales() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Retrieves an ordered list of the user's preferred locales, including language, script (optional), country codes, and RTL (Right-to-Left) directionality. ```APIDOC ## getLocales() ### Description Returns the user preferred locales, in order. ### Method type ```ts type getLocales = () => Array<{ languageCode: string; scriptCode?: string; countryCode: string; languageTag: string; isRTL: boolean; }>; ``` ### Usage example ```ts import { getLocales } from "react-native-localize"; console.log(getLocales()); /* -> [ { countryCode: "GB", languageTag: "en-GB", languageCode: "en", isRTL: false }, { countryCode: "US", languageTag: "en-US", languageCode: "en", isRTL: false }, { countryCode: "FR", languageTag: "fr-FR", languageCode: "fr", isRTL: false }, ] */ ``` ``` -------------------------------- ### Use Localize Hook in Components Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Demonstrates using the `useLocalize` hook within components to access localization methods, such as `getCountry`, instead of calling the API directly. This hook is intended for use within applications configured with `ServerLanguagesProvider`. ```tsx import { useLocalize } from "react-native-localize"; const App = () => { const { getCountry } = useLocalize(); return Country: {getCountry()}; }; ``` -------------------------------- ### Find Best Language Tag Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Finds the best matching language tag from a provided list based on user preferences and indicates if the language is right-to-left (RTL). Useful for selecting translations. ```typescript type findBestLanguageTag = ( languageTags: string[], ) => { languageTag: string; isRTL: boolean } | undefined; ``` ```typescript import { findBestLanguageTag } from "react-native-localize"; console.log(findBestLanguageTag(["en-US", "en", "fr"])); // -> { languageTag: "en-US", isRTL: false } ``` -------------------------------- ### getCountry() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Fetches the user's current country code based on their device's locale settings. Note that certain regional settings may result in a non-standard country code. ```APIDOC ## getCountry() ### Description Returns the user current country code (based on its device locale, **not** on its position). ### Method type ```ts type getCountry = () => string; ``` ### Usage example ```ts import { getCountry } from "react-native-localize"; console.log(getCountry()); // -> "FR" ``` ### Note Devices using Latin American regional settings will return "UN" instead of "419", as the latter is not a standard country code. ``` -------------------------------- ### Uses 24 Hour Clock Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Checks if the user prefers a 24-hour clock format. Returns `true` for 24h format and `false` for 12h format. ```typescript type uses24HourClock = () => boolean; ``` ```typescript import { uses24HourClock } from "react-native-localize"; console.log(uses24HourClock()); // -> true ``` -------------------------------- ### Uses Auto Time Zone (Android) Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Checks if the automatic time zone setting is enabled on an Android device. Returns `true`, `false`, or `undefined` if the setting is not available. ```typescript type usesAutoTimeZone = () => boolean | undefined; ``` ```typescript import { usesAutoTimeZone } from "react-native-localize"; console.log(usesAutoTimeZone()); ``` -------------------------------- ### usesAutoTimeZone() Source: https://github.com/zoontek/react-native-localize/blob/master/README.md Checks if automatic time zone settings are enabled on Android devices. ```APIDOC ## usesAutoTimeZone() ### Description Tells if the automatic time zone setting is enabled on the phone. **Android only** ### Method type ```ts type usesAutoTimeZone = () => boolean | undefined; ``` ### Usage example ```ts import { usesAutoTimeZone } from "react-native-localize"; console.log(usesAutoTimeZone()); ``` ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.