or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

device-preferences.mddevice-settings.mdindex.mdlanguage-matching.mdnumber-currency-formatting.mdplatform-utilities.md
tile.json

tessl/npm-react-native-localize

A toolbox for your React Native app localization.

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/react-native-localize@3.5.x

To install, run

npx @tessl/cli install tessl/npm-react-native-localize@3.5.0

index.mddocs/

React Native Localize

React Native Localize is a comprehensive toolbox for React Native app localization, providing access to device-specific regional settings including preferred locales, currencies, number formatting, calendar systems, temperature units, timezones, and measurement systems. It offers cross-platform support for Android, iOS, macOS, and Web with automatic language detection, RTL text support, and intelligent language tag matching.

Package Information

  • Package Name: react-native-localize
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install react-native-localize

Core Imports

import {
  getLocales,
  getCountry,
  getCurrencies,
  findBestLanguageTag,
  getNumberFormatSettings,
  getCalendar,
  getTemperatureUnit,
  getTimeZone,
  uses24HourClock,
  usesMetricSystem,
  usesAutoDateAndTime,
  usesAutoTimeZone,
  openAppLanguageSettings,
  type Locale,
  type Calendar,
  type TemperatureUnit,
  type NumberFormatSettings
} from "react-native-localize";

For CommonJS:

const {
  getLocales,
  getCountry,
  getCurrencies,
  findBestLanguageTag
} = require("react-native-localize");

Basic Usage

import { getLocales, findBestLanguageTag, getNumberFormatSettings } from "react-native-localize";

// Get device locales
const locales = getLocales();
console.log(locales[0]); // { languageCode: "en", countryCode: "US", languageTag: "en-US", isRTL: false }

// Find best matching language
const bestLanguage = findBestLanguageTag(["en-US", "fr-FR", "es-ES"]);
console.log(bestLanguage); // { languageTag: "en-US", isRTL: false }

// Get number formatting
const numberFormat = getNumberFormatSettings();
console.log(numberFormat); // { decimalSeparator: ".", groupingSeparator: "," }

Architecture

React Native Localize is built around several key components:

  • Native Bridge: TurboModule interface connecting JavaScript to native platform APIs
  • Web Implementation: Browser-based implementation using Intl and Navigator APIs for web compatibility
  • Type System: Complete TypeScript definitions for all APIs and data structures
  • Platform Detection: Automatic platform-specific behavior for iOS, Android, macOS, and Web
  • Mock System: Testing utilities with configurable mock implementations
  • Expo Integration: Plugin for configuring supported locales in Expo managed workflow

Capabilities

Device Settings

Core functionality for accessing device regional settings including locales, country, timezone, and calendar information.

function getLocales(): Locale[];
function getCountry(): string;
function getTimeZone(): string;
function getCalendar(): Calendar;

Device Settings

Language Matching

Intelligent language tag matching to find the best supported language from your app's available translations.

function findBestLanguageTag<T extends string>(
  languageTags: ReadonlyArray<T>
): { languageTag: T; isRTL: boolean } | undefined;

Language Matching

Number and Currency Formatting

Access to device-specific number formatting preferences and regional currency information.

function getNumberFormatSettings(): NumberFormatSettings;
function getCurrencies(): string[];

interface NumberFormatSettings {
  decimalSeparator: string;
  groupingSeparator: string;
}

Number and Currency Formatting

Device Preferences

System preferences for measurement units, time format, and automatic settings.

function getTemperatureUnit(): TemperatureUnit;
function uses24HourClock(): boolean;
function usesMetricSystem(): boolean;
function usesAutoDateAndTime(): boolean | undefined;
function usesAutoTimeZone(): boolean | undefined;

Device Preferences

Platform Utilities

Platform-specific functionality including settings access and testing utilities.

function openAppLanguageSettings(): Promise<void>;

Platform Utilities

Types

interface Locale {
  languageCode: string;
  scriptCode?: string;
  countryCode: string;
  languageTag: string;
  isRTL: boolean;
}

interface NumberFormatSettings {
  decimalSeparator: string;
  groupingSeparator: string;
}

type TemperatureUnit = "celsius" | "fahrenheit";

type Calendar =
  | "gregorian"
  | "buddhist"
  | "coptic"
  | "ethiopic"
  | "ethiopic-amete-alem"
  | "hebrew"
  | "indian"
  | "islamic"
  | "islamic-umm-al-qura"
  | "islamic-civil"
  | "islamic-tabular"
  | "iso8601"
  | "japanese"
  | "persian";