diff --git a/src/i18n.tsx b/src/i18n.tsx index 9374efaf0..a8b842d9c 100644 --- a/src/i18n.tsx +++ b/src/i18n.tsx @@ -218,7 +218,21 @@ function stringifyChildren(children: any): string { return ss.join(""); } -i18n.Translate = class extends React.Component { + +interface TranslateProps { + /** + * Component that the translated element should be wrapped in. + * Defaults to "div". + */ + wrap?: any; + + /** + * Props to give to the wrapped component. + */ + wrapProps?: any; +} + +i18n.Translate = class extends React.Component { render(): JSX.Element { init(); if (typeof jed !== "object") { @@ -246,14 +260,17 @@ i18n.Translate = class extends React.Component { result.push(x); } } - return
{result}
; + if (!this.props.wrap) { + return
{result}
; + } + return React.createElement(this.props.wrap, this.props.wrapProps, result); } } i18n.TranslateSwitch = class extends React.Component{ render(): JSX.Element { - let singular: React.ReactElement | undefined; - let plural: React.ReactElement | undefined; + let singular: React.ReactElement | undefined; + let plural: React.ReactElement | undefined; let children = this.props.children; if (children) { React.Children.forEach(children, (child: any) => { @@ -286,11 +303,11 @@ i18n.TranslateSwitch = class extends React.Component{ } } -interface TranslationProps { +interface TranslationPluralProps { target: number; } -class TranslatePlural extends React.Component { +class TranslatePlural extends React.Component { render(): JSX.Element { init(); if (typeof jed !== "object") { @@ -324,7 +341,7 @@ class TranslatePlural extends React.Component { i18n.TranslatePlural = TranslatePlural; -class TranslateSingular extends React.Component { +class TranslateSingular extends React.Component { render(): JSX.Element { init(); if (typeof jed !== "object") {