diff --git a/react-i18next/react-i18next-tests.tsx b/react-i18next/react-i18next-tests.tsx index d9faea8ac2..dd013002d4 100644 --- a/react-i18next/react-i18next-tests.tsx +++ b/react-i18next/react-i18next-tests.tsx @@ -7,7 +7,7 @@ import * as ReactDOM from 'react-dom'; import * as React from 'react'; import * as i18n from 'i18next'; -import { translate, I18nextProvider, Interpolate, InjectedTranslateProps } from 'react-i18next'; +import { translate, I18nextProvider, Interpolate, InjectedTranslateProps, TranslationFunction } from 'react-i18next'; i18n @@ -26,18 +26,19 @@ i18n }); -interface InnerAnotherComponentProps extends InjectedTranslateProps { +interface InnerAnotherComponentProps { + _?: TranslationFunction; } class InnerAnotherComponent extends React.Component { render() { - const { t } = this.props; + const { _ } = this.props; - return

{t('content.text', { /* options t options */ })}

; + return

{_('content.text', { /* options t options */ })}

; } } -const AnotherComponent = translate('view', { wait: true })(InnerAnotherComponent); +const AnotherComponent = translate('view', { wait: true, translateFuncName: '_' })(InnerAnotherComponent); @@ -69,7 +70,20 @@ class TranslatableView extends React.Component {

{t('common:appName')}

- + + {t('nav:link1')} ) diff --git a/react-i18next/react-i18next.d.ts b/react-i18next/react-i18next.d.ts index 0720e6e4ed..8993ab61cb 100644 --- a/react-i18next/react-i18next.d.ts +++ b/react-i18next/react-i18next.d.ts @@ -1,4 +1,4 @@ -// Type definitions for react-i18next 1.6.3 +// Type definitions for react-i18next 1.7.0 // Project: https://github.com/i18next/react-i18next // Definitions by: Kostya Esmukov // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped @@ -11,11 +11,16 @@ declare namespace ReactI18next { import React = __React; + export type TranslationFunction = I18next.TranslationFunction; + // Extend your component's Prop interface with this one to get access to `this.props.t` // + // Please note that if you use the `translateFuncName` option, you should create + // your own interface just like this one, but with your name of the translation function. + // // interface MyComponentProps extends ReactI18next.InjectedTranslateProps {} export interface InjectedTranslateProps { - t?: I18next.TranslationFunction; + t?: TranslationFunction; } interface I18nextProviderProps { @@ -35,7 +40,10 @@ declare namespace ReactI18next { regexp?: RegExp; options?: I18next.TranslationOptions; - [regexKey: string]: InterpolateValue | RegExp | I18next.TranslationOptions; + useDangerouslySetInnerHTML?: boolean; + dangerouslySetInnerHTMLPartElement?: string; + + [regexKey: string]: InterpolateValue | RegExp | I18next.TranslationOptions | boolean; } export class Interpolate extends React.Component { } @@ -43,6 +51,7 @@ declare namespace ReactI18next { interface TranslateOptions { withRef?: boolean; wait?: boolean; + translateFuncName?: string; } export function translate(namespaces?: string[] | string, options?: TranslateOptions): (WrappedComponent: C) => C;