https://github.com/trigensoftware/i18n-for-react
Modern translation module for React.
https://github.com/trigensoftware/i18n-for-react
Last synced: 3 months ago
JSON representation
Modern translation module for React.
- Host: GitHub
- URL: https://github.com/trigensoftware/i18n-for-react
- Owner: TrigenSoftware
- License: mit
- Created: 2019-06-13T16:42:37.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2021-08-02T22:18:32.000Z (almost 4 years ago)
- Last Synced: 2025-02-23T21:20:35.776Z (3 months ago)
- Language: TypeScript
- Homepage:
- Size: 3.3 MB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 21
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# i18n-for-react
[![NPM version][npm]][npm-url]
[![Dependencies status][deps]][deps-url]
[![Build status][build]][build-url]
[![Coverage status][coverage]][coverage-url]
[![Dependabot badge][dependabot]][dependabot-url]
[![Documentation badge][documentation]][documentation-url]
[npm]: https://img.shields.io/npm/v/i18n-for-react.svg
[npm-url]: https://npmjs.com/package/i18n-for-react
[deps]: https://david-dm.org/TrigenSoftware/i18n-for-react.svg
[deps-url]: https://david-dm.org/TrigenSoftware/i18n-for-react
[build]: http://img.shields.io/travis/com/TrigenSoftware/i18n-for-react/master.svg
[build-url]: https://travis-ci.com/TrigenSoftware/i18n-for-react
[coverage]: https://img.shields.io/coveralls/TrigenSoftware/i18n-for-react.svg
[coverage-url]: https://coveralls.io/r/TrigenSoftware/i18n-for-react
[dependabot]: https://api.dependabot.com/badges/status?host=github&repo=TrigenSoftware/i18n-for-react
[dependabot-url]: https://dependabot.com/
[documentation]: https://img.shields.io/badge/API-Documentation-2b7489.svg
[documentation-url]: https://trigensoftware.github.io/i18n-for-react
Modern translation module for React.
## Install
```sh
npm i i18n-for-react
# or
yarn add i18n-for-react
```
## API
Module exposes next API:
```js
// all i18n-for-browser exports, plus:
export {
I18nMethods,
I18nProviderConfig,
I18nProviderProps,
I18nContextPayload,
rprintf,
createI18nProvider,
__x,
__xmf,
__xn
};
```
[Description of this methods you can find in Documentation.](https://trigensoftware.github.io/i18n-for-react/index.html)
Basic API is same as in [`i18n-for-browser` module.](https://github.com/TrigenSoftware/i18n-for-browser)
### [createI18nProvider](https://trigensoftware.github.io/i18n-for-react/modules/_src_createi18nprovider_.html#createi18nprovider)
Create `I18nContext` and `I18nProvider` with given methods.
Usage example
```js
/**
* Basic example
*/
const {
/**
* Config and methods provider.
*/
I18nProvider,
/**
* Context with config and methods.
*/
I18nContext,
/**
* Hook to recieve config and methods.
*/
useI18n
} = createI18nProvider(
/**
* Methods for binding and providing.
*/
{
__,
__x
},
/**
* Config defaults.
*/
{
/* ... */
cookieName: 'yourcookiename'
}
);
```
### [I18nProvider](https://trigensoftware.github.io/i18n-for-react/modules/_src_createi18nprovider_.html#createi18nprovider)
Configurator and provider of `i18n` instance.
Usage example
```jsx
/**
* Root context configuration
*/
{/* ... */}
/**
* Fork context
*/
{/* ... */}
{/* ... */}
```
### [useI18n](https://trigensoftware.github.io/i18n-for-react/modules/_src_createi18nprovider_.html#createi18nprovider)
Hook to recieve config and methods.
Usage example
```js
/**
* Basic example
*/
function SomeComponent() {
const {
__
} = useI18n();
return __`cat`;
}
/**
* Fork instance
*/
function SomeComponent() {
const {
__
} = useI18n({
locales: /* ... */
});
return __`cat`;
}
```
### [rprintf()](https://trigensoftware.github.io/i18n-for-react/modules/_src_rprintf_.html#rprintf)
Format string with wrappers.
Usage example
```jsx
/**
* Wrap with React-elements
*/
rprintf('Hi, <>John>!', [])
/**
* or handle with functions
*/
rprintf('Hi, <>John>!', [_ => `${_}`])
```
### [__x()](https://trigensoftware.github.io/i18n-for-react/modules/_src_index_.html#__x)
Same as `__()`, but for JSX.
Usage example
```jsx
/**
* Same as `__()`
*/
__x('Hi, %s!', 'John')
/**
* And with wrappers
*/
__x('Hi, <>%s>!', 'John', [])
```
### [__xmf()](https://trigensoftware.github.io/i18n-for-react/modules/_src_index_.html#__xmf)
Same as `__mf()`, but for JSX.
Usage example
```jsx
/**
* Same as `__mf()`
*/
__xmf('Hi, {username}!', { username: 'John' })
/**
* And with wrappers
*/
__xmf('Hi, <>{username}>!', { username: 'John' }, [])
```
### [__xn()](https://trigensoftware.github.io/i18n-for-react/modules/_src_index_.html#__xn)
Same as `__n()`, but for JSX.
Usage example
```jsx
/**
* Same as `__xn()`
*/
__xn('I have %s cats.', 2)
/**
* And with wrappers
*/
__xn('I have <>%s> cats.', 2, [])
```