API Documentation

Title

Global

Members

# constant lookForMissingKeys

Searches for missing translations. Prints an warning if there is a translation for a language missing.
Deprecated:
  • Naming changed to reportMissing.

View Source utils/methods.ts, line 52

# constant reportMissing

Searches for missing translations. Prints an warning if there is a translation for a language missing.

View Source utils/methods.ts, line 35

# constant tryParseLocale

Tries parsing locale from a string. (eg. de-DE or de => de_DE)

View Source utils/methods.ts, line 18

Methods

# LitteraProvider(initialLocale, preset, setLocale, pattern)

Context Provider for Littera
Parameters:
Name Type Description
initialLocale Initial active locale.
preset Set of predefined translations.
setLocale Callback called when the locale changes.
pattern Locale pattern.

View Source LitteraProvider.tsx, line 27

Example
// Setting up Littera provider.

const App = () => {
   return <LitteraProvider locales={["en_US", "de_DE"]}>
     ...
   </LitteraProvider>
}

# translate(translations, locale) → {ITranslated}

Returns object with translated values based on locale.
Parameters:
Name Type Description
translations ITranslations
locale string

View Source utils/translate.ts, line 28

ITranslated
Example
// Example of using translations.

const translations = {
   example: {
     en_US: "Example",
     de_DE: "Beispiel"
   },
   hello: (name: string) => ({
     en_US: `Hello ${name}`,
     de_DE: `Hallo ${name}`
   })
}

const translated = translate(translations, "de_DE");

translated.example // => "Beispiel"
translated.hello("Mike") // => "Hallo Mike"

# translateSingle(translation, locale) → {ISingleTranslated}

Returns translated string based on locale.
Parameters:
Name Type Description
translation ITranslation
locale string

View Source utils/translate.ts, line 66

ISingleTranslated
Example
// Example of utilizing a single translation.

const translations = {
   example: {
     en_US: "Example",
     de_DE: "Beispiel"
   },
   hello: (name: string) => ({
     en_US: `Hello ${name}`,
     de_DE: `Hallo ${name}`
   })
}

const translatedExample = translateSingle(translations.example, "de_DE");
const translatedExample = translateSingle(translations.hello("Mike"), "de_DE");

translatedExample // => "Beispiel"
translatedHello("Mike") // => "Hallo Mike"

# useLittera(translations, locale) → {ITranslated}

Hook returns translations for the active locale.
Parameters:
Name Type Description
translations ITranslations Translations
locale string Locale in case you need translations for a not active locale.

View Source hooks.tsx, line 32

ITranslated
Example
// Example of using translations in a function component.

const translations = {
   example: {
     en_US: "Example",
     de_DE: "Beispiel"
   },
   hello: (name: string) => ({
     en_US: `Hello ${name}`,
     de_DE: `Hallo ${name}`
   })
}

const YourComponent = () => {
   const translated = useLittera(translations);

   return <h2>{translated.example} - {translated.hello("Mike")}</h2>
}

# useLitteraMethods() → {Object|string|Array.<string>|function|function|ITranslations|function|function}

Hook exposes an object with global translation methods and variables.

View Source hooks.tsx, line 72

methods
Object
methods.locale - active locale.
string
methods.locales - all locales.
Array.<string>
methods.setLocale - changes the active locale.
function
methods.validateLocale - method validates the locale format using a pattern.
function
methods.preset - global preset.
ITranslations
methods.translate - the core translations method.
function
methods.translateSingle - the core single translation method.
function
Example
// Example of accessing littera methods and variables in a function component.

const YourComponent = () => {
   const { setLocale, locale } = useLittera(translations);

   const handleClick = () => {
     setLocale("de_DE");
   }

   return <h2 onClick={handleClick}>Current language: {locale}</h2>
}

# withLittera(translations) → {FunctionComponent}

HOC for managing translations.
Parameters:
Name Type Description
translations ITranslations | ITranslationsFunction
Deprecated:
  • HOCs are out of support. Please consider switching to React hooks.

View Source withLittera.tsx, line 12

FunctionComponent

Type Definitions

Object

# ITranslated

Object containing already translated text. Is being flatened from ITranslations.

View Source index.ts, line 24

Example
{
   "example": "Beispiel"
}
Object

# ITranslations

Object containing all available translations.

View Source index.ts, line 2

Example
{
   "example": {
       "en_US": "Example",
       "de_DE": "Beispiel"
   }
}
Object

# ITranslationsFunction

Function returning all available translations. Preset is being passed as argument.

View Source index.ts, line 13

Example
const translations = (preset) => ({
   "example": {
       "en_US": "Example",
       "de_DE": "Beispiel"
   }
})