Pular para o conteúdo principal

Internacionalização (i18n)

Os componentes do Lemonade usam por padrão a linguagem do browser para determinar o locale.

É possível customizar os textos usados pelos componentes usando LocaleContext.Provider e acessá-los através da hook useLocale.

A hook useLocale retorna um mapa de palavras usadas internamente por alguns componentes do Lemonade, como o Calendar, Paginator etc.

de 10
import { LocaleContext, Paginator } from '@lemonade/ui'
import ptBr from '@lemonade/ui/i18n/locales/pt-BR'
import React from 'react'

function LocaleProviderDemo() {
  // Using Paginator as example since it uses strings from locale context internally
  return (
    <LocaleContext.Provider value={ptBr}>
      <Paginator page={5} total={10} />
    </LocaleContext.Provider>
  )
}

export default LocaleProviderDemo

Locales disponíveis

Os textos de cada locale são exportados a partir de @lemonade/ui/i18n/locales, um módulo por locale:

import enUS from '@lemonade/ui/i18n/locales/en-US'
import ptBR from '@lemonade/ui/i18n/locales/pt-BR'

Sinta-se livre para abrir um pull request caso seu locale não esteja presente.