Brimstone

A simple React translation library.

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>
  )
}

Demo

View a live demo here

Development

Requirements

• Node.js

NPM Scripts

Run npm install first to install package dependencies.

• npm run lint - Run the StandardJS linter to check for warnings and errors
• npm run build - Build the library to the dist folder
• npm test - Run the Jest testing suite

License

Distributed under the MIT License. See LICENSE for more information.