From dc34e6c8312a6b06d7b4e4db18e848e2704b8571 Mon Sep 17 00:00:00 2001 From: Giedrius Grabauskas Date: Mon, 17 Jul 2017 20:53:29 +0300 Subject: [PATCH] Updated react-i18next types to 4.6.1 (#17715) * Create tslint.json * Moved v1 types to specified version folder. * Created types for react-i18next. * Exported as global UMD module. * Added more tests. * Fixed dtslint errors. * Removed @KostyaEsmukov from the authors list. * Added addition data for Trans component. * Added typescript 2.3 support. * Added generic TKey for translate method. * Removed path map to i18next/v2. * Fixed dtslint error. * Fixed ts error. --- types/react-i18next/index.d.ts | 74 ++++++--------- types/react-i18next/src/I18nextProvider.d.ts | 12 +++ types/react-i18next/src/interpolate.d.ts | 23 +++++ types/react-i18next/src/loadNamespaces.d.ts | 9 ++ types/react-i18next/src/trans.d.ts | 8 ++ types/react-i18next/src/translate.d.ts | 15 +++ .../test/react-i18next-tests.tsx | 92 +++++++++++++++++++ types/react-i18next/tsconfig.json | 12 +-- types/react-i18next/tslint.json | 1 + types/react-i18next/v1/index.d.ts | 57 ++++++++++++ .../{ => v1}/react-i18next-tests.tsx | 0 types/react-i18next/v1/tsconfig.json | 33 +++++++ 12 files changed, 283 insertions(+), 53 deletions(-) create mode 100644 types/react-i18next/src/I18nextProvider.d.ts create mode 100644 types/react-i18next/src/interpolate.d.ts create mode 100644 types/react-i18next/src/loadNamespaces.d.ts create mode 100644 types/react-i18next/src/trans.d.ts create mode 100644 types/react-i18next/src/translate.d.ts create mode 100644 types/react-i18next/test/react-i18next-tests.tsx create mode 100644 types/react-i18next/tslint.json create mode 100644 types/react-i18next/v1/index.d.ts rename types/react-i18next/{ => v1}/react-i18next-tests.tsx (100%) create mode 100644 types/react-i18next/v1/tsconfig.json diff --git a/types/react-i18next/index.d.ts b/types/react-i18next/index.d.ts index cf56874445..d7bb05a30f 100644 --- a/types/react-i18next/index.d.ts +++ b/types/react-i18next/index.d.ts @@ -1,57 +1,37 @@ -// Type definitions for react-i18next 1.7.0 +// Type definitions for react-i18next 4.6 // Project: https://github.com/i18next/react-i18next -// Definitions by: Kostya Esmukov +// Definitions by: Giedrius Grabauskas // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.3 -import * as I18next from "i18next"; -import * as React from "react"; +import { TranslationFunction } from "i18next"; -export type TranslationFunction = I18next.TranslationFunction; +import I18nextProvider from "./src/I18nextProvider"; +import Interpolate from "./src/interpolate"; +import loadNamespaces from "./src/loadNamespaces"; +import Trans from "./src/trans"; +import translate from "./src/translate"; -// 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 { + I18nextProvider, + Interpolate, + loadNamespaces, + Trans, + translate, + // Exports for TypeScript only + 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?: TranslationFunction; } -interface I18nextProviderProps { - i18n: I18next.I18n; - children?: React.ReactElement; -} - -export class I18nextProvider extends React.Component { } - - -type InterpolateValue = string | JSX.Element; - -interface InterpolateProps { - i18nKey: string; - - parent?: string; - regexp?: RegExp; - options?: I18next.TranslationOptions; - - useDangerouslySetInnerHTML?: boolean; - dangerouslySetInnerHTMLPartElement?: string; - - [regexKey: string]: InterpolateValue | RegExp | I18next.TranslationOptions | boolean | undefined; -} - -export class Interpolate extends React.Component { } - -interface TranslateOptions { - withRef?: boolean; - wait?: boolean; - translateFuncName?: string; -} - -export function translate(namespaces?: string[] | string, options?: TranslateOptions): (WrappedComponent: C) => C; - -export function loadNamespaces({ components, i18n }: { components: (React.ComponentClass | React.StatelessComponent)[], i18n: I18next.I18n }): Promise; - -export as namespace ReactI18Next; +export as namespace reactI18Next; diff --git a/types/react-i18next/src/I18nextProvider.d.ts b/types/react-i18next/src/I18nextProvider.d.ts new file mode 100644 index 0000000000..2ecb87f4a1 --- /dev/null +++ b/types/react-i18next/src/I18nextProvider.d.ts @@ -0,0 +1,12 @@ +import * as React from "react"; +import { i18n } from "i18next"; + +// tslint:disable-next-line:interface-name +export interface I18nextProviderProps { + i18n: i18n; + children: React.ReactElement; + initialI18nStore?: any; + initialLanguage?: string; +} + +export default class I18nextProvider extends React.Component { } diff --git a/types/react-i18next/src/interpolate.d.ts b/types/react-i18next/src/interpolate.d.ts new file mode 100644 index 0000000000..e6f07893ed --- /dev/null +++ b/types/react-i18next/src/interpolate.d.ts @@ -0,0 +1,23 @@ +import * as React from "react"; +import { InterpolationOptions } from "i18next"; + +export type InterpolateValue = string | JSX.Element; + +export interface InterpolatePropsBase { + parent?: string; + regexp?: RegExp; + useDangerouslySetInnerHTML?: boolean; + dangerouslySetInnerHTMLPartElement?: string; + options?: InterpolationOptions; + i18nKey?: string; + className?: string; + style?: React.CSSProperties; +} + +export interface OtherInterpolateProps { + [regexKey: string]: InterpolateValue | RegExp | InterpolationOptions | boolean | undefined; +} + +export type InterpolateProps = InterpolatePropsBase & OtherInterpolateProps; + +export default class Interpolate extends React.Component { } diff --git a/types/react-i18next/src/loadNamespaces.d.ts b/types/react-i18next/src/loadNamespaces.d.ts new file mode 100644 index 0000000000..d0e0b372f5 --- /dev/null +++ b/types/react-i18next/src/loadNamespaces.d.ts @@ -0,0 +1,9 @@ +import * as React from "react"; +import { i18n } from "i18next"; + +export interface LoadNamespacesArguments { + components: Array | React.StatelessComponent>; + i18n: i18n; +} + +export default function loadNamespaces(args: LoadNamespacesArguments): Promise; diff --git a/types/react-i18next/src/trans.d.ts b/types/react-i18next/src/trans.d.ts new file mode 100644 index 0000000000..384e1605f9 --- /dev/null +++ b/types/react-i18next/src/trans.d.ts @@ -0,0 +1,8 @@ +import * as React from "react"; + +export interface TransProps { + i18nKey?: string; + [name: string]: any; +} + +export default class Trans extends React.Component { } diff --git a/types/react-i18next/src/translate.d.ts b/types/react-i18next/src/translate.d.ts new file mode 100644 index 0000000000..d41b4dc00a --- /dev/null +++ b/types/react-i18next/src/translate.d.ts @@ -0,0 +1,15 @@ +import * as React from "react"; +import { i18n } from "i18next"; + +export interface TranslateOptions { + withRef?: boolean; + bindI18n?: string; + bindStore?: string; + translateFuncName?: string; + wait?: boolean; + nsMode?: string; + i18n?: i18n; +} + +// tslint:disable-next-line:ban-types +export default function translate(namespaces?: TKey[] | TKey, options?: TranslateOptions): (WrappedComponent: C) => C; diff --git a/types/react-i18next/test/react-i18next-tests.tsx b/types/react-i18next/test/react-i18next-tests.tsx new file mode 100644 index 0000000000..6105ccf921 --- /dev/null +++ b/types/react-i18next/test/react-i18next-tests.tsx @@ -0,0 +1,92 @@ +import * as React from 'react'; +import * as i18n from 'i18next'; +import { translate, I18nextProvider, Interpolate, InjectedTranslateProps, TranslationFunction, loadNamespaces, Trans } from 'react-i18next'; + +interface InnerAnotherComponentProps { + _?: TranslationFunction; +} + +class InnerAnotherComponent extends React.Component { + render() { + const _ = this.props._!; + return

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

; + } +} + +const AnotherComponent = translate('view', { wait: true, translateFuncName: '_' })(InnerAnotherComponent); + +class InnerYetAnotherComponent extends React.Component { + render() { + const t = this.props.t!; + return

{t('usingDefaultNS', { /* options t options */ })}

; + } +} + +const YetAnotherComponent = translate()(InnerYetAnotherComponent); + +@translate(['view', 'nav'], { wait: true }) +class TranslatableView extends React.Component { + render() { + const t = this.props.t!; + const interpolateComponent = "a interpolated component"; + + return ( +
+

{t('common:appName')}

+ + + + + {t('nav:link1')} +
+ ); + } +} + +class App extends React.Component { + render() { + return ( +
+
+ +
+
+ ); + } +} + + + +; + +loadNamespaces({ components: [App], i18n }).then(() => { }).catch(error => { }); + +; +; + + +; + +type Key = "view" | "nav"; + +@translate(['view', 'nav']) +class GenericsTest extends React.Component { + render() { return null; } +} + +@translate('view') +class GenericsTest2 extends React.Component { + render() { return null; } +} diff --git a/types/react-i18next/tsconfig.json b/types/react-i18next/tsconfig.json index 4c473240eb..9228cf2075 100644 --- a/types/react-i18next/tsconfig.json +++ b/types/react-i18next/tsconfig.json @@ -13,11 +13,6 @@ "../" ], "types": [], - "paths": { - "i18next": [ - "i18next/v2" - ] - }, "noEmit": true, "forceConsistentCasingInFileNames": true, "jsx": "react", @@ -25,6 +20,11 @@ }, "files": [ "index.d.ts", - "react-i18next-tests.tsx" + "test/react-i18next-tests.tsx", + "src/I18nextProvider.d.ts", + "src/interpolate.d.ts", + "src/loadNamespaces.d.ts", + "src/trans.d.ts", + "src/translate.d.ts" ] } diff --git a/types/react-i18next/tslint.json b/types/react-i18next/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/react-i18next/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" } diff --git a/types/react-i18next/v1/index.d.ts b/types/react-i18next/v1/index.d.ts new file mode 100644 index 0000000000..cf56874445 --- /dev/null +++ b/types/react-i18next/v1/index.d.ts @@ -0,0 +1,57 @@ +// 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 +// TypeScript Version: 2.3 + +import * as I18next from "i18next"; +import * as React from "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?: TranslationFunction; +} + +interface I18nextProviderProps { + i18n: I18next.I18n; + children?: React.ReactElement; +} + +export class I18nextProvider extends React.Component { } + + +type InterpolateValue = string | JSX.Element; + +interface InterpolateProps { + i18nKey: string; + + parent?: string; + regexp?: RegExp; + options?: I18next.TranslationOptions; + + useDangerouslySetInnerHTML?: boolean; + dangerouslySetInnerHTMLPartElement?: string; + + [regexKey: string]: InterpolateValue | RegExp | I18next.TranslationOptions | boolean | undefined; +} + +export class Interpolate extends React.Component { } + +interface TranslateOptions { + withRef?: boolean; + wait?: boolean; + translateFuncName?: string; +} + +export function translate(namespaces?: string[] | string, options?: TranslateOptions): (WrappedComponent: C) => C; + +export function loadNamespaces({ components, i18n }: { components: (React.ComponentClass | React.StatelessComponent)[], i18n: I18next.I18n }): Promise; + +export as namespace ReactI18Next; diff --git a/types/react-i18next/react-i18next-tests.tsx b/types/react-i18next/v1/react-i18next-tests.tsx similarity index 100% rename from types/react-i18next/react-i18next-tests.tsx rename to types/react-i18next/v1/react-i18next-tests.tsx diff --git a/types/react-i18next/v1/tsconfig.json b/types/react-i18next/v1/tsconfig.json new file mode 100644 index 0000000000..d58a88810b --- /dev/null +++ b/types/react-i18next/v1/tsconfig.json @@ -0,0 +1,33 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "baseUrl": "../../", + "typeRoots": [ + "../../" + ], + "paths": { + "react-i18next": [ + "react-i18next/v1" + ], + "i18next": [ + "i18next/v2" + ] + }, + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true, + "jsx": "react", + "experimentalDecorators": true + }, + "files": [ + "index.d.ts", + "react-i18next-tests.tsx" + ] +}