react-native-translator

React Native Translator

Preview

Introduce

Unofficial free translate component & hook

Never need api key, This library is Unlimited free

Support translators

• Google
• Papago
• Kakao

Getting started

First, Install package

yarn add react-native-translator react-native-webview

Second, Pod intsall

cd ios && pod install

Third, Add provider

// App.js
...
import {TranslatorProvider} from 'react-native-translator' // here

const App = () => {
  return (
    <TranslatorProvider> // here
        <.../>
    </TranslatorProvider> // here
  );
};

API

Translator ( Real-time translate )

// Usage
import Translator from 'react-native-translator';

const App = () => {
  const [value, setValue] = useState('');
  const [result, setResult] = useState('');

  return (
    <View>
      <Translator
        from="en"
        to="fr"
        value={value}
        onTranslated={(t) => setResult(t)}
      />
      <TextInput value={value} onChangeText={(t) => setValue(t)} />
      <Text>{result}</Text>
    </View>
  );
};

Props	Type	Default value	Required
from	LanguageCode		✅
to	LanguageCode		✅
value	string		✅
type	TranslatorType	'google'
onTranslated	(result: string) => void		✅

useTranslator

// Usage
import {useTranslator} from 'react-native-translator';

const App = () => {
  const {translate} = useTranslator();

  const [value, setValue] = useState('');
  const [result, setResult] = useState('');

  const onTranslate = async () => {
    const _result = await translate('en', 'fr', value);
    setResult(_result);
  };

  return (
    <View>
      <TextInput value={value} onChangeText={(t) => setValue(t)} />
      <Text>{result}</Text>
      <Button title="translate" onPress={onTranslate} />
    </View>
  );
};

translate

// const {translate} = useTranslator();
type translate: <T extends TranslatorType>(/* check follow param table */) => Promise<string>;

param	Type	Default value	Required
from	LanguageCode		✅
to	LanguageCode		✅
value	string		✅
option	{type?: TranslatorType, timeout?: number}	{type: 'google', timeout: 5000}

languageCodeConverter

❗️ If conversion is not possible, return undefined.

import {languageCodeConverter} from 'react-native-translator';
// google language code convert to kakao language code
languageCodeConverter('google', 'kakao', 'ko'); // kr

TranslatorType

type TranslatorType = 'google' | 'kakao' | 'papago';

LanguageCode

type LanguageCode<T extends TranslatorType> ...
// Usage
type GoogleLanguageCode = LanguageCode<'google'>;

VALUES

import {LANGUAGE_CODES, TRANSLATOR_TYPES} from 'react-native-translator';
// translator types
TRANSLATOR_TYPES; // ["google", "papago", "kakao", ...]
// language code
LANGUAGE_CODES['google']; // ["af", "ga", "sq", ...]

Support languages

Language	Google	Papago	Kakao
Afrikaans	af
Irish	ga
Albanian	sq
Italian	it	it	it
Arabic	ar		ar
Japanese	ja	ja	jp
Azerbaijani	az
Kannada	kn
Basque	eu
Korean	ko	ko	kr
Bengali	bn		bn
Latin	la
Belarusian	be
Latvian	lv
Bulgarian	bg
Lithuanian	lt
Catalan	ca
Macedonian	mk
Chinese Simplified	zh-CN	zh-CN	cn
Malay	ms
Chinese Traditional	zh-TW	zh-TW	cn
Maltese	mt
Croatian	hr
Norwegian	no
Czech	cs
Persian	fa
Danish	da
Polish	pl
Dutch	nl		nl
Portuguese	pt		pt
English	en	en	en
Romanian	ro
Esperanto	eo
Russian	ru	ru	ru
Estonian	et
Serbian	sr
Filipino	tl
Slovak	sk
Finnish	fi
Slovenian	sl
French	fr	fr	fr
Spanish	es	es	es
Galician	gl
Swahili	sw
Georgian	ka
Swedish	sv
German	de	de	de
Tamil	ta
Greek	el
Telugu	te
Gujarati	gu
Thai	th	th	th
Haitian Creole	ht
Turkish	tr		tr
Hebrew	iw
Ukrainian	uk
Hindi	hi		hi
Urdu	ur
Hungarian	hu
Vietnamese	vi	vi	vi
Icelandic	is
Welsh	cy
Indonesian	id	id	id
Yiddish	yi