@brimstone/react NPM

Brimstone

A simple React translation library.

GitHub package.json version

Introduction

Brimstone is an easy-to-use translation library that uses React context to change text across your entire app when the language is changed.

Usage

Place the TranslationContext at the root of your application

import { Language, TranslationContext } from '@brimstone/react'
import { useState } from 'react'

function App() {
  const [language, setLanguage] = useState<Language>()

  return (
    <TranslationContext.Provider value={{
      language,
      setLanguage
    }}>
      ...
    </TranslationContext>
  )
}

Use the Translate component anywhere to render the current language

import { Translate } from '@brimstone/react'

function MyComponent() {
  return (
    <div>
      <h1>
        <Translate
          eng="Welcome to my website!"
          spa="¡Bienvenido a mi sito web!"
          deu="Willkommen in meiner Website!"
        />
      </h1>
    </div>
  )
}